Basics
The basic framework of the dashboard consists of a header and the content area. Within the content area are the boardlets. All content is based on the 24 Colum-Grid.
The 24 Colum-Grid
The foundation of the design system is the modified bootstrap frontend grid. this grid has 24 columns within the dashboard and 12 columns within the boardlets. The dashboard is divided into two parts, header and content area. The 24 Columns Grid only applies within the content area. The grid has no column space, all distances are solved via the margin.
Dashboard Spacing
| Base | 1920 px | 1920 rem |
|---|---|---|
| Breakpoint | ≥1800px | n.n |
| Width | 1920 | 120 |
| Height | 1080 | 67.5 |
| Content Area | ||
| Columns | 24 | - |
| Column Width | 78 | 4.875 |
| Gutter | 26 | 1.625 |
| Margin | 24 | 1,5 |
| Header Area | ||
| Header | 24 | 1,5 |
| Icon max | 24 | 1,5 |
Basic Components of the Dashboard
1920 Dashboard definition
EdgeOne Dashboard
1920 EdgeOne-Astronaut Dashboard
1920 EdgeOne-Tokyo at Night Dashboard
X-Series Dashboard
1920 X-Series-Astronaut Dashboard
1920 X-Series-Tokyo at Night Dashboard
