Merge branch 'main' of github.com:erikfig/my-dashboard

erikfig · Sep 12, 2024 · f1c0aec · f1c0aec
2 parents 63d06c9 + c00c7de
commit f1c0aec
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 4 deletions.
diff --git a/src/components/img/index.tsx b/src/components/img/index.tsx
@@ -6,7 +6,7 @@ export const Img = ({ src, ...props }: ImgProps) => {
   const [localSrc, setLocalSrc] = useState<string>('')
 
   useEffect(() => {
-    setLocalSrc(`${import.meta.env.VITE_BASE_APP ? import.meta.env.VITE_BASE_APP : '/'}${src}`)
+    setLocalSrc(`${import.meta.env.VITE_BASE_APP ? import.meta.env.VITE_BASE_APP : '/'}${src}`.replace('//', '/'))
   }, [src])
 
   return <img src={localSrc} {...props} />

diff --git a/src/layouts/default/components/menu/index.tsx b/src/layouts/default/components/menu/index.tsx
@@ -39,7 +39,7 @@ export const Menu = ({ menus }: MenuProps) => {
   return (
     <>
       {menus.map((menu) => (
-        <Card type="ul" className="list-none !p-0">
+        <Card type="ul" className="list-none !p-0 my-3">
           {menu.items.map((item) => (
             <li>
               {item.isTitle ?

diff --git a/src/layouts/default/default.layout.tsx b/src/layouts/default/default.layout.tsx
@@ -39,14 +39,19 @@ export const DefaultLayout = ({ title }: DefaultLayoutProps) => {
 
   const darkModeHandler = useCallback(() => {
     toggleDarkMode()
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isDarkMode])
 
   return (
     <div className={isDarkMode ? 'dark' : ''}>
       <div className='grid h-screen w-screen grid-cols-wrapper bg-grey dark:bg-dark dark:text-light'>
-        <section className='grid grid-rows-nav h-screen'>
+        <section className='bg-grey dark:bg-dark fixed z-10 w-screen sm:w-auto sm:relative grid grid-rows-nav h-screen overflow-y-auto'>
           <div className='m-6'>
 
+            <div className='absolute top-6 right-6'>
+              <span className="material-symbols-outlined">close</span>
+            </div>
+
             <a href="" className="flex items-center gap-3">
               <Rounded><Img src="/logo.png" width={50} height={50} /></Rounded>
               {' '}
@@ -83,7 +88,7 @@ export const DefaultLayout = ({ title }: DefaultLayoutProps) => {
             ]} />
           </nav>
         </section>
-        <main className="overflow-x-hidden">
+        <main className="relative z-0 overflow-x-hidden">
 
           <header className='flex justify-between items-center h-12 mt-6 ml-6 mr-6 mb-2'>
             <Typography type="h1" className='!text-2xl'>