From 1cebde3d5d28917c15c58ac2711822f972ef02cf Mon Sep 17 00:00:00 2001
From: MacRimi <123239993+MacRimi@users.noreply.github.com>
Date: Mon, 17 Feb 2025 22:32:35 +0100
Subject: [PATCH] Update DocSidebar.tsx

---
 web/components/DocSidebar.tsx | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/web/components/DocSidebar.tsx b/web/components/DocSidebar.tsx
index 3348e7a..9fa5e2a 100644
--- a/web/components/DocSidebar.tsx
+++ b/web/components/DocSidebar.tsx
@@ -128,9 +128,9 @@ export default function DocSidebar() {
 
   return (
     <>
-      <div className="md:hidden fixed top-16 left-0 right-0 z-40 bg-gray-100 border-b border-gray-200 h-12">
+      <div className="md:hidden fixed top-16 left-0 right-0 z-40 bg-gray-100 border-b border-gray-200">
         <button
-          className="w-full h-full px-4 text-left flex items-center justify-between"
+          className="w-full p-4 text-left flex items-center justify-between"
           onClick={toggleMobileMenu}
           aria-label="Toggle menu"
         >
@@ -139,14 +139,15 @@ export default function DocSidebar() {
         </button>
       </div>
       <nav
-        className={`fixed md:static top-28 left-0 w-full h-[calc(100vh-7rem)] md:h-auto md:w-64 bg-gray-100 p-4 md:p-6 transform ${
-          isMobileMenuOpen ? "translate-x-0" : "-translate-x-full"
-        } md:translate-x-0 transition-transform duration-300 ease-in-out overflow-y-auto z-30`}
+        className={`fixed md:static top-[104px] left-0 w-full h-[calc(100vh-104px)] md:h-auto md:w-64 bg-gray-100 p-4 md:p-6 transform ${
+          isMobileMenuOpen ? "translate-y-0" : "-translate-y-full"
+        } md:translate-y-0 transition-transform duration-300 ease-in-out overflow-y-auto z-30`}
       >
-        <h2 className="text-lg font-semibold mb-4 text-gray-900 md:block hidden">Documentation</h2>
+        <h2 className="text-lg font-semibold mb-4 text-gray-900 md:mt-0 sr-only md:not-sr-only">Documentation</h2>
         <ul className="space-y-2">{sidebarItems.map(renderMenuItem)}</ul>
       </nav>
     </>
   )
 }
 
+