FlowFuse / FlowFuse/node-red-dashboard
Grid layout - more steps for media query to support bigger screens
- Dominant language
- HTML
- Stars
- 355
- Forks
- 82
- Avg merge
- 4d 23h
- Merged PRs (30d)
- 24
Description
### Description
Currently with the media query there is 3 steps for different screen sizes.
Max column count affects screens over 1024px width which then results in 12 columns.
This may be kind of OK for laptop but for modern desktop the zoom factor is way too high.
It is hard for me to advise the strategy of breakpoints to choose.
But if to continue gow by 3 columns in every reasonable amount of px may do the thing. For sure there is users with ultra wide screens, but somewhere of course the limit is reasonable. Just the current solution is a bit poor.
.nrdb-layout--grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
flex-wrap: wrap;
padding: var(--page-padding);
gap: var(--group-gap);
}
@media only screen and (max-width: 1024px) {
.nrdb-layout--grid {
grid-template-columns: repeat(9, 1fr);
}
}
@media only screen and (max-width: 768px) {
.nrdb-layout--grid {
grid-template-columns: repeat(6, 1fr);
}
}
### Epic/Story
_No response_
### Have you provided an initial effort estimate for this issue?
I can not provide an initial effort estimate
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.