| Warning | ||||||||
|---|---|---|---|---|---|---|---|---|
|
Overview
Principles
Grids and columns
Anatomy
...
Devices
Web (mobile, tablet and desktop)
POS
ePOS
Native Mobile (iOS and Andriod)
...
Concepts
Cards and surfaces
Using divider
Tables
Actions
Density
...
Tokens
Anatomy
The anatomy of a grid is made up of several elements:
The format is the entire area where the layout will be displayed.
Flowlines are horizontal lines that divide the various sections of a grid into parallel bands.
Columns are vertical divisions or sections that contain the content (12-column grid for desktop, 8-column grid for tablet, 4-column grid for mobile).
Rows are horizontal divisions or sections of a grid.
Modules represent spatial units formed by the intersection of rows and columns.
Group of nearby modules, both vertically and horizontally, form zones or regions in the layout.
The gutter is the distance between each column or row.
Margins are the space between the content and the edges of the screen.
...
Devices
Web (mobile, tablet and desktop)
[add research + add link to zeroheight]
...
POS
[add research + add link to zeroheight]
...
ePOS
[add research + add link to zeroheight]
...
Native Mobile (iOS and Andriod)
[add research + add link to zeroheight]