fix: mobile sidebar layout and spacing

acid-info · Jun 7, 2023 · f8d720a · f8d720a
1 parent 72664b1
commit f8d720a
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 4 deletions.
diff --git a/packages/logos-docusaurus-theme/src/client/css/custom.scss b/packages/logos-docusaurus-theme/src/client/css/custom.scss
@@ -953,8 +953,11 @@ a[class^='sidebarLogo_'] {
   }
 
   .navbar-sidebar:not(:has(.navbar-sidebar__items--show-secondary)) {
+    .menu {
+      padding-inline: 0;
+    }
+
     .navbar-sidebar__items {
-      height: 180px;
     }
 
     .navbar-sidebar__item {
@@ -965,17 +968,24 @@ a[class^='sidebarLogo_'] {
       display: flex;
       flex-direction: column;
       gap: 8px;
+      padding-inline: var(--content-padding);
     }
 
     .menu__link {
       padding-left: 0;
       border-left: none;
 
       > div {
-        font-size: var(--lsd-body1-fontSize) !important;
+        @include lsd.typography('subtitle2');
+        text-decoration: none;
       }
     }
 
+    .footer {
+      margin-top: 3rem;
+      padding: 0 !important;
+    }
+
     .footer > div {
       display: flex !important;
       flex-direction: column !important;

diff --git a/packages/logos-docusaurus-theme/src/client/theme/Navbar/MobileSidebar/Layout/index.tsx b/packages/logos-docusaurus-theme/src/client/theme/Navbar/MobileSidebar/Layout/index.tsx
@@ -18,10 +18,12 @@ export default function NavbarMobileSidebarLayout({
           'navbar-sidebar__items--show-secondary': secondaryMenuShown,
         })}
       >
-        <div className="navbar-sidebar__item menu">{primaryMenu}</div>
+        <div className="navbar-sidebar__item menu">
+          {primaryMenu}
+          {!secondaryMenuShown && <Footer />}
+        </div>
         <div className="navbar-sidebar__item menu">{secondaryMenu}</div>
       </div>
-      {!secondaryMenuShown && <Footer />}
     </div>
   )
 }