[UX] Scrolling area optimization.

hackademix · hackademix · commit 86ce5c918192 · 2026-01-17T11:43:54.000+01:00
diff --git a/src/ui/popup.css b/src/ui/popup.css
@@ -21,7 +21,7 @@ html:not(.mobile) > body {
 html:not(.mobile) #scrollable {
   overflow: auto;
   max-height: 550px;
-  min-height: 200px;
+  min-height: 2em;
 }
 
 #top {
diff --git a/src/ui/ui.css b/src/ui/ui.css
@@ -43,6 +43,7 @@ fieldset > .opt-group ~ .opt-group {
   opacity: 0;
   transition: opacity .5s, max-height .5s;
   pointer-events: none;
+  overflow: hidden;
 }
 
 @media (max-width: 550px) {
diff --git a/src/ui/ui.js b/src/ui/ui.js
@@ -855,6 +855,13 @@ var UI = (() => {
             if (temp) temp.checked = !temp.checked || UI.forceIncognito;
         }
       };
+      if (!UA.mobile) {
+        const scrollable = document.querySelector("#scrollable");
+        if (scrollable) {
+          scrollable.style = "min-height: 0";
+          scrollable.style.height = (scrollable.offsetHeight + customizer.querySelector("fieldset").offsetHeight + 8) + "px";
+        }
+      }
       window.setTimeout(
         () => {
           row.classList.toggle("customizing", true);

Original file line number	Diff line number	Diff line change
`@@ -43,6 +43,7 @@ fieldset > .opt-group ~ .opt-group {`
`43`	`43`	`opacity: 0;`
`44`	`44`	`transition: opacity .5s, max-height .5s;`
`45`	`45`	`pointer-events: none;`
	`46`	`+ overflow: hidden;`
`46`	`47`	`}`
`47`	`48`
`48`	`49`	`@media (max-width: 550px) {`