diff --git a/frontend/src/app/main/ui/workspace/sidebar/branches.cljs b/frontend/src/app/main/ui/workspace/sidebar/branches.cljs index 9253c5a533..5cc6d8a850 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/branches.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/branches.cljs @@ -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}]] diff --git a/frontend/src/app/main/ui/workspace/sidebar/branches.scss b/frontend/src/app/main/ui/workspace/sidebar/branches.scss index cf6deaae64..c11e539562 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/branches.scss +++ b/frontend/src/app/main/ui/workspace/sidebar/branches.scss @@ -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;