feat: improve the gridview presentation

src/components/AppHeader.jsx

@@ -2,14 +2,14 @@ import { useState } from 'react';
 import fendiLogo from '/favicon.png'
 import { AppBar, Toolbar, Typography, InputBase, IconButton, Box } from '@mui/material';
 import SearchIcon from '@mui/icons-material/Search';
-import MenuDrawer from './MenuDrawer'; 
+import MenuDrawer from './MenuDrawer';
 
 export default function AppHeader({ zone = 'public' }) {
 
   const bgColor = {
-      public: '#40120EFF',
-      restricted: '#e0e0ff',
-      private: '#d0f0e0',
+    public: '#40120EFF',
+    restricted: '#e0e0ff',
+    private: '#d0f0e0',
   };
 
   const [menuOpen, setMenuOpen] = useState(false);
@@ -20,12 +20,12 @@ export default function AppHeader({ zone = 'public' }) {
 
   return (
     <AppBar position="static"
-       sx={{
-          textAlign: 'center',
-          bgcolor: bgColor[zone],
-          mt: 'auto',
-          fontSize: { xs: '0.75rem', md: '1rem' },
-        }} >
+      sx={{
+        textAlign: 'center',
+        bgcolor: bgColor[zone],
+        mt: 'auto',
+        fontSize: { xs: '0.75rem', md: '1rem' },
+      }} >
       <Toolbar sx={{ justifyContent: 'space-between', flexWrap: 'wrap' }}>
         <Box display="flex" alignItems="center">
           <IconButton edge="start" color="inherit" onClick={() => setMenuOpen(true)}>
@@ -64,7 +64,7 @@ export default function AppHeader({ zone = 'public' }) {
         )}
 
         {/* Rendering the Drawer */}
-       <MenuDrawer zone='private' open={menuOpen} onClose={() => setMenuOpen(false)} />
+        <MenuDrawer zone='private' open={menuOpen} onClose={() => setMenuOpen(false)} />
 
       </Toolbar>
     </AppBar>

src/components/Footer.jsx

@@ -22,7 +22,7 @@ export default function Footer({ zone = 'public' }) {
             }}
         >
             <Typography variant="body2">
-                 <img src={fendiLogo} alt="Fendi logo" style={{ height: 10, marginRight:10 }} />
+                <img src={fendiLogo} alt="Fendi logo" style={{ height: 10, marginRight: 10 }} />
                 {zone === 'private'
                     ? `Admin Panel - Fendi ${year}`
                     : `© ${year} Fendi. All rights reserved.`}

src/components/MenuDrawer.jsx

@@ -12,17 +12,17 @@ export default function MenuDrawer({ zone = 'public', open, onClose }) {
 
   return (
     <Drawer anchor="left" open={open} onClose={onClose} slotProps={{
-        paper: {
-          sx: {
-            backgroundColor: '#000000a0',
-            width: isMobile ? '100vw' : 250,
-          },
+      paper: {
+        sx: {
+          backgroundColor: '#000000a0',
+          width: isMobile ? '100vw' : 250,
         },
-      }}>
-     <List sx={{ width: isMobile ? '100vw' : 250, marginTop: 14 }}>
+      },
+    }}>
+      <List sx={{ width: isMobile ? '100vw' : 250, marginTop: 14 }}>
         {items.map((text, index) => (
           <ListItem key={index} onClick={onClose}>
-             <ListItemText
+            <ListItemText
               primary={text}
               slotProps={{
                 primary: {