fix(docs-infra): improve version picker dropdown positioning

erkamyaman · erkamyaman · commit 6bb344f48882 · 2026-05-07T23:59:40.000+03:00
Drops `position: absolute` from the version picker `&lt;ul&gt;` and tightens `max-height` to `70dvh` so the cdk-overlay-pane fits the viewport and the inner scroll reaches the last versions on mobile and desktop.
diff --git a/adev/src/app/core/layout/navigation/mini-menu.scss b/adev/src/app/core/layout/navigation/mini-menu.scss
@@ -4,6 +4,7 @@
 // ul
 .adev-mini-menu {
   padding: 0;
+  margin-block: 0;
   color: var(--primary-contrast);
   background-color: var(--page-background);
   border: 1px solid var(--senary-contrast);
@@ -86,11 +87,8 @@
 
 .adev-version-picker {
   overflow-y: auto;
-  max-height: 90vh;
-  top: 30px;
-  left: 10px;
-  position: absolute;
-  bottom: auto;
+  max-height: 70dvh;
+  margin-inline-start: 10px;
 
   li {
     padding-inline: 0;
@@ -101,9 +99,11 @@
   }
 
   @include mq.for-tablet {
-    top: 30px;
-    left: auto;
-    bottom: auto;
+    position: fixed;
+    position-anchor: --version-trigger;
+    inset-block-start: calc(anchor(bottom) + 8px);
+    justify-self: anchor-center;
+    margin-inline-start: 0;
   }
 }
 
diff --git a/adev/src/app/core/layout/navigation/navigation.component.scss b/adev/src/app/core/layout/navigation/navigation.component.scss
@@ -175,6 +175,7 @@
 
     // version dropdown button
     .adev-version-button {
+      anchor-name: --version-trigger;
       border: 1px solid var(--senary-contrast);
       border-radius: 0.25rem;
       width: fit-content;
