fix: layouts

src/components/wrapper/ClientMenuRouteWrapper.tsx.tsx

@@ -36,28 +36,42 @@ function ClientMenuRouteWrapper({ children }: Props) {
   // }, [location])
 
   return (
-    <div className='h-full overflow-hidden py-10 '>
-      <header className='px-4'>
+    <div className="h-svh overflow-hidden pt-16 flex flex-col pb-8 ">
+
+      <div className="fixed top-0 left-0 right-0 z-50 px-4">
         <TopBar
-          profileDropState={profileDrop} toggleProfileDropState={toggleProfileDrop}
-          menuState={menuState} toggleMenuState={toggleMenuState}
-          searchModalState={searchModal} toggleSearchModalState={toggleSearchModal}
-          nightModeState={nightMode} toggleNightModeState={toggleNightMode} />
-      </header>
-      <main className="h-full px-4 pt-14 pb-14 lg:pt-28 overflow-y-auto noscrollbar">
+          profileDropState={profileDrop}
+          toggleProfileDropState={toggleProfileDrop}
+          menuState={menuState}
+          toggleMenuState={toggleMenuState}
+          searchModalState={searchModal}
+          toggleSearchModalState={toggleSearchModal}
+          nightModeState={nightMode}
+          toggleNightModeState={toggleNightMode}
+        />
+      </div>
+
+
+      <div className="fixed bottom-0 left-0 right-0 z-50 px-4">
+        <BottomNavBar />
+      </div>
+
+
+      <SideMenu
+        nightModeState={nightMode}
+        togglenightModeState={toggleNightMode}
+        menuState={menuState}
+        toggleMenuState={toggleMenuState}
+      />
+
+
+      <main
+        className="noscrollbar overflow-y-auto h-svh pt-0 pb-12 outline mx-2 outline-blue-500 px-4"
+      >
         {children}
       </main>
-      <aside>
-
-        <SideMenu 
-          nightModeState={nightMode} togglenightModeState={toggleNightMode}
-          menuState={menuState} toggleMenuState={toggleMenuState} />
-      </aside>
-      <footer className='px-4'>
-        <BottomNavBar />
-
-      </footer>
     </div>
+
   )
 }