fix: replace hardcoded sidebar width (342px) with responsive Tailwind class

Author: DeveloperViraj

src/components/Layout/SidebarNav/SidebarNav.tsx

@@ -41,7 +41,7 @@ export default function SidebarNav({
         'sticky top-0 lg:bottom-0 lg:h-[calc(100vh-4rem)] flex flex-col'
       )}>
       <div
-        className="overflow-y-scroll no-bg-scrollbar lg:w-[342px] grow bg-wash dark:bg-wash-dark"
+        className="overflow-y-scroll no-bg-scrollbar lg:w-80 grow bg-wash dark:bg-wash-dark"
         style={{
           overscrollBehavior: 'contain',
         }}>

src/components/Layout/TopNav/TopNav.tsx

@@ -403,7 +403,7 @@ export default function TopNav({
         {isMenuOpen && (
           <div
             ref={scrollParentRef}
-            className="overflow-y-scroll isolate no-bg-scrollbar lg:w-[342px] grow bg-wash dark:bg-wash-dark">
+            className="overflow-y-scroll isolate no-bg-scrollbar lg:w-80 grow bg-wash dark:bg-wash-dark">
             <aside
               className={cn(
                 `lg:grow lg:flex flex-col w-full pb-8 lg:pb-0 lg:max-w-custom-xs z-40`,