gestion accueil MAJ

frontend/src/components/Pages/Dashboard.jsx

@@ -13,6 +13,7 @@ import {
 import LogoutIcon from "@mui/icons-material/Logout"; // Icône de déconnexion
 import ArticleIcon from "@mui/icons-material/Article";
 import DashboardIcon from "@mui/icons-material/Dashboard";
+import HomeIcon from "@mui/icons-material/Home"; // Icône pour la gestion page d'accueil
 
 function Dashboard() {
   const navigate = useNavigate();
@@ -51,10 +52,10 @@ function Dashboard() {
           borderRadius: 3,
           boxShadow: 6,
           textAlign: "center",
-          position: "relative", // Permet de positionner des éléments enfants
+          position: "relative",
         }}
       >
-        {/* Bouton de déconnexion placé en haut à gauche de la boîte blanche */}
+        {/* Bouton de déconnexion placé en haut à gauche */}
         <Button
           variant="contained"
           color="error"
@@ -69,9 +70,7 @@ function Dashboard() {
             fontSize: "0.875rem",
             padding: "6px 12px",
           }}
-        >
-          
-        </Button>
+        />
 
         {/* En-tête */}
         <Typography variant="h4" sx={{ fontWeight: "bold", mb: 4, mt: 4 }}>
@@ -81,7 +80,39 @@ function Dashboard() {
 
         {/* Cartes du Dashboard */}
         <Grid container spacing={3} justifyContent="center">
-          <Grid item xs={12} sm={6} md={4}>
+          {/* ✅ Gestion Page d'Accueil - Première carte */}
+          <Grid item xs={12} sm={6}>
+            <Card
+              onClick={() => navigate("/admin/Gestion-Page-Accueil")}
+              sx={{
+                cursor: "pointer",
+                textAlign: "center",
+                padding: 2,
+                transition: "0.3s",
+                "&:hover": {
+                  backgroundColor: "#0e467f",
+                  color: "#ffffff",
+                  transform: "scale(1.05)",
+                  boxShadow: 8,
+                },
+                "&:hover svg": {
+                  fill: "#ffffff",
+                },
+              }}
+            >
+              <CardContent>
+                <IconButton sx={{ fontSize: 40, color: "#0e467f" }}>
+                  <HomeIcon fontSize="inherit" />
+                </IconButton>
+                <Typography variant="h6" sx={{ fontWeight: "bold" }}>
+                  Gestion Page d'Accueil
+                </Typography>
+              </CardContent>
+            </Card>
+          </Grid>
+
+          {/* ✅ Gérer les Articles - Deuxième carte */}
+          <Grid item xs={12} sm={6}>
             <Card
               onClick={() => navigate("/admin/gestion-articles")}
               sx={{
@@ -109,35 +140,6 @@ function Dashboard() {
                 </Typography>
               </CardContent>
             </Card>
-
-            <Card
-              onClick={() => navigate("/admin/Gestion-Page-Accueil")}
-              sx={{
-                cursor: "pointer",
-                textAlign: "center",
-                padding: 2,
-                transition: "0.3s",
-                "&:hover": {
-                  backgroundColor: "#0e467f",
-                  color: "#ffffff",
-                  transform: "scale(1.05)",
-                  boxShadow: 8,
-                },
-                "&:hover svg": {
-                  fill: "#ffffff",
-                },
-              }}
-            >
-              <CardContent>
-                <IconButton sx={{ fontSize: 40, color: "#0e467f" }}>
-                  <ArticleIcon fontSize="inherit" />
-                </IconButton>
-                <Typography variant="h6" sx={{ fontWeight: "bold" }}>
-                  Gestion Page d'Accueil
-                </Typography>
-              </CardContent>
-            </Card>
-            
           </Grid>
         </Grid>
       </Box>