Fix mobile sidebar height and layout

Author: 54895y

src/css/custom.css

@@ -324,8 +324,14 @@ html[data-theme='dark'] .markdown table tr:nth-child(even) {
 
 @media screen and (max-width: 996px) {
   .navbar-sidebar {
+    position: fixed;
+    inset: 0 auto 0 0;
+    display: flex;
+    flex-direction: column;
     width: min(83vw, 26rem);
     max-width: 26rem;
+    height: 100dvh;
+    max-height: 100dvh;
     background: rgba(238, 246, 255, 0.92);
     backdrop-filter: blur(18px);
   }
@@ -356,6 +362,8 @@ html[data-theme='dark'] .markdown table tr:nth-child(even) {
   }
 
   .navbar-sidebar__items {
+    flex: 1 1 auto;
+    min-height: 0;
     height: calc(100vh - var(--ifm-navbar-height));
     padding: 0;
     background: transparent;