-
Notifications
You must be signed in to change notification settings - Fork 129
Lists
#Dividers As described by Google Material Design Specification
Dividers group and separate content within lists and page layouts. The divider is a thin rule, lightweight yet sufficient to distinguish content visually and spatially.
Dividers consist of 2 types: Full-Bleed and Inset.
Full-Bleed extends across the width of the screen and is used to separate distinct content sections such as contact information.
Inset dividers separate related content, such as sections in a list of emails or contacts within an address book.
Ionic doesn't provide these types of divider, except within lists but only as subheadings.
Ionic Material Design accomplishes the 2 types of dividers with the following classes:
.item-divider__full
and .item-divider__inset
An example of how you would mark this up within your view is as follows:
<ion-item class="item-divider item-divider__full">All mail</ion-item>
<ion-item class="item-divider item-divider__inset">Brunch this weekend?</ion-item>