💄 Clip the limits dialog to its panel and scroll the sections

This commit is contained in:
Álvaro Tejero Cantero 2026-08-14 09:34:21 +02:00
parent d4b0944589
commit e9833fdb55
No known key found for this signature in database
2 changed files with 12 additions and 6 deletions

View File

@ -349,7 +349,7 @@
(st/emit! (dwb/fetch-branching-limits)))
[:div {:class (stl/css :modal-overlay)}
[:div {:class (stl/css :modal-container)}
[:div {:class (stl/css :modal-container :limits-container)}
[:div {:class (stl/css :modal-header)}
[:div {:class (stl/css :modal-header-icon)}
[:> i/icon* {:icon-id i/git-branch}]]

View File

@ -1529,12 +1529,18 @@
border-block-start: 1px solid var(--color-background-quaternary);
}
// The limits dialog is the only long modal here. `%modal-container-base` is
// a flex column that does not clip, so the content div has to own the
// scrolling: cap it against the viewport and let it shrink inside the flex
// parent (`min-height: 0`), otherwise the sections spill past the container.
// The limits dialog is the only long modal here, and `%modal-container-base`
// caps its height without clipping, so a long list spills past the panel.
// Make this one container a bounded flex column and give the scrolling to
// the content, which needs `min-height: 0` to be allowed to shrink.
.limits-container {
display: flex;
flex-direction: column;
max-height: min(80vh, 42rem);
overflow: hidden;
}
.limits-content {
max-height: min(60vh, 32rem);
min-height: 0;
flex: 1 1 auto;
overflow-y: auto;