Skip to content

bootgrid: automatic grid height calculation#10011

Merged
swhite2 merged 1 commit into
masterfrom
grid-dynamic-height
Mar 20, 2026
Merged

bootgrid: automatic grid height calculation#10011
swhite2 merged 1 commit into
masterfrom
grid-dynamic-height

Conversation

@swhite2

@swhite2 swhite2 commented Mar 20, 2026

Copy link
Copy Markdown
Member

Grids will now fill all available screen space (if the amount of data allows), minus a margin. The margin may also include a user-supplied element or selector, of which the dimensions are used to subtract the grid height to leave space for said element. By default this element is .grid-bottom-reserve, as on most pages the base_apply_button is used below the grid.

Note that the page itself still has a scrollbar, as the base_apply_button has a larger padding that expands beyond the visible container to make room for the "Don't forget to press apply" banner. A separate PR will propose a styling change for this.

@swhite2
swhite2 requested a review from AdSchellevis March 20, 2026 09:10
@swhite2 swhite2 self-assigned this Mar 20, 2026

@AdSchellevis AdSchellevis left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@swhite2 nice!

@swhite2
swhite2 merged commit 40a6243 into master Mar 20, 2026
@swhite2
swhite2 deleted the grid-dynamic-height branch March 20, 2026 09:47
@fichtner

Copy link
Copy Markdown
Member

🌈 how magical 🌈

@Monviech

Copy link
Copy Markdown
Member

Its very good :)

fichtner pushed a commit that referenced this pull request Apr 7, 2026
(cherry picked from commit 40a6243)
(cherry picked from commit 2edab3d)
(cherry picked from commit 92fa229)
@falkenau

falkenau commented Jun 8, 2026

Copy link
Copy Markdown

Hello! We are running "OPNsense 26.1.9". For example, if we go to "-> Firewall -> Rules [new]" the grid-bottom-reserve is quite large. How can we reduce it to zero?
We need to scroll a lot within the grid. I tested three browsers: Chrome, Firefox, Edge.

@swhite2

swhite2 commented Jun 8, 2026

Copy link
Copy Markdown
Member Author

@falkenau Are you referring to:

afbeelding

Or disabling in-grid scrolling entirely?

@falkenau

falkenau commented Jun 8, 2026

Copy link
Copy Markdown

@swhite2 YES! I would love that. And there is enough room for the Apply Button at the top.

@fichtner

fichtner commented Jun 8, 2026

Copy link
Copy Markdown
Member

@swhite2 YES! I would love that. And there is enough room for the Apply Button at the top.

Wait what

@swhite2

swhite2 commented Jun 9, 2026

Copy link
Copy Markdown
Member Author

Not sure what's going on here, but I guess #10375 is related.

@falkenau

falkenau commented Jun 9, 2026

Copy link
Copy Markdown
Screenshot 2026-06-10 000524

Just look at all this wasted space. Why do we need to scroll so much in a tiny grid? :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Development

Successfully merging this pull request may close these issues.

5 participants