From e9833fdb5526fa34829c243be6047d8b57b0ad59 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=81lvaro=20Tejero=20Cantero?= <alvorithm@teje.ro>
Date: Fri, 14 Aug 2026 09:34:21 +0200
Subject: [PATCH] :lipstick: Clip the limits dialog to its panel and scroll the
 sections

---
 .../app/main/ui/workspace/sidebar/branches.cljs  |  2 +-
 .../app/main/ui/workspace/sidebar/branches.scss  | 16 +++++++++++-----
 2 files changed, 12 insertions(+), 6 deletions(-)

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;