View Source

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.

here you will find the handover and the Styleguide of this componente:
zpl.io/2ZNyJZE

coming soon

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

Inspire Design Guidelines > ID2 - Dashboard Overview > 300320_dSFM_klickdummy_News_Astronaut.png
Basic Components of the Dashboard

Inspire Design Guidelines > ID2 - Dashboard Overview > Basic-1920_Dashboard_Definition.png
1920 Dashboard definition

Inspire Design Guidelines > ID2 - Dashboard Overview > Basic-1920_Dashboard.png 1920 EdgeOne-Astronaut Dashboard

here you will find the handover and the Styleguide of this componente:
zpl.io/bzZlmM7

Inspire Design Guidelines > ID2 - Dashboard Overview > Platzhalter.png 1920 EdgeOne-Tokyo at Night Dashboard

here you will find the handover and the Styleguide of this componente:
zpl.io/bzZlmM7