Merge pull request #474 from ivinayakg/fix/sidebar-mobile-ux

fix: sidebar update for mobile ux
code100x · Apr 21, 2024 · 1663101 · 1663101
2 parents d1f49fb + d7a6952
commit 1663101
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
@@ -160,7 +160,7 @@ export function Sidebar({
   }
 
   return (
-    <div className="overflow-y-scroll h-sidebar w-[300px] min-w-[300px] bg-gray-50 dark:bg-gray-800 cursor-pointer sticky top-[64px] self-start w-84">
+    <div className="overflow-y-scroll h-sidebar bg-gray-50 dark:bg-gray-800 cursor-pointer absolute top-[64px] self-start w-full z-20 xs:min-w-[133px] xs:w-[300px] xs:w-84 xs:sticky">
       <div className="flex">
         {/* <ToggleButton
             onClick={() => {

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -9,6 +9,9 @@ module.exports = {
   ],
   prefix: '',
   theme: {
+    screens: {
+      xs: '540px',
+    },
     container: {
       center: true,
       padding: '2rem',
@@ -77,4 +80,4 @@ module.exports = {
     },
   },
   plugins: [require('tailwindcss-animate')],
-};
+};