From c00c7deff926b6093160a25c5a6e7f3ba24a0712 Mon Sep 17 00:00:00 2001
From: Erik Figueiredo <erik.figueiredo@gmail.com>
Date: Wed, 4 Sep 2024 08:59:20 -0300
Subject: [PATCH] =?UTF-8?q?feat:=20in=C3=ADcio=20suporte=20mobile?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/img/index.tsx           | 2 +-
 src/components/menu/index.tsx          | 2 +-
 src/layouts/default/default.layout.tsx | 9 +++++++--
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/components/img/index.tsx b/src/components/img/index.tsx
index 428e02d..04c7cf5 100644
--- 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/components/menu/index.tsx b/src/components/menu/index.tsx
index e8897c7..2427412 100644
--- a/src/components/menu/index.tsx
+++ b/src/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
index a9ae68c..5b7cf41 100644
--- 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'>