Dashboard Grid Breakpoint Config: Reference Docs?

Dashboard
1

I am transitioning to Dashboard One to Two and leaning about configuring breakpoints for the grid dashboard layout.

Through trial and error, I have been able to get the desired result, but…..I still do not understand the underlying principles or math. Below are my settings.

Question, please direct me to a more in-depth explanation how to set up multiple devices. I am hoping to read references, but if none, any explanations here are appreciated.

One burning question is, how does Dashboard Two use the configurations on the selected devices shown on the config page? Next, what is the math underlying the size of my display, the number of columns and the breakpoint in pixels?

Alan

Settings
Settings1396×940 25.8 KB

2

No responses yet……I was hoping for something…..FlowFuse, are you out there?

Alan

3

Hi @n61ab

The relevant docs are here:

The dashboard layout is based on a grid of columns. To make the layout responsive, the number of columns used can vary based on how wide the whole page is.

Given the config you've shared, if the screen with less than 375 pixels wide, then it will get split into 3 columns, between 375 and 1117 pixels wide, the available space will be split into 6 columns - and so on.

1 Like
4

Nick

Thanks. That helps me to understand the breakpoint configuration.

Alan