maj template page and pages

frontend/src/components/Testi.jsx

@@ -11,75 +11,81 @@ const TestimonialSection = () => {
         padding: "50px 20px",
       }}
     >
-
-        {/* Image à gauche */}
-        <Grid item xs={12} md={6}>
-          <Box
-            component="img"
-            src="https://picsum.photos/600/600.webp"
-            alt="Illustration"
-            sx={{
-              width: "100%",
-              height: "100%",
-              objectFit: "cover",
-              borderRadius: { xs: "15px 15px 0 0", md: "15px 0 0 15px" },
-            }}
-          />
-        </Grid>
-
-        {/* Contenu Témoignage */}
-        <Grid
-          item
-          xs={12}
-          md={6}
+      {/* Image à gauche */}
+      <Grid item xs={12} md={6}>
+        <Box
+          component="img"
+          src="https://picsum.photos/600/600.webp"
+          alt="Illustration"
           sx={{
-            background: "linear-gradient(to right, #002F6C, #0E467F)",
-            color: "white",
-            padding: "40px",
-            display: "flex",
-            flexDirection: "column",
-            justifyContent: "center",
+            width: "100%",
+            height: "100%",
+            objectFit: "cover",
+            borderRadius: { xs: "15px 15px 0 0", md: "15px 0 0 15px" },
+          }}
+        />
+      </Grid>
+
+      {/* Contenu Témoignage */}
+      <Grid
+        item
+        xs={12}
+        md={6}
+        sx={{
+          background: "linear-gradient(to right, #002F6C, #0E467F)",
+          color: "white",
+          padding: "40px",
+          display: "flex",
+          flexDirection: "column",
+          justifyContent: "center",
+        }}
+      >
+        <Typography
+          variant="h3"
+          sx={{
+            fontSize: { xs: "2rem", md: "2rem", lg: "2rem" }, // Responsive
+            fontWeight: "bold",
+            mb: 2,
+            fontStyle: "italic",
+            position: "relative",
+            "&::before": {
+              content: '"“"',
+              fontSize: "50px",
+              position: "absolute",
+              top: "-10px",
+              left: "-5px",
+              opacity: 0.3,
+            },
           }}
         >
-          <Typography
-            variant="h4"
-            sx={{
-              fontWeight: "bold",
-              mb: 2,
-              fontStyle: "italic",
-              position: "relative",
-              "&::before": {
-                content: '"“"',
-                fontSize: "50px",
-                position: "absolute",
-                top: "-10px",
-                left: "-5px",
-                opacity: 0.3,
-              },
-            }}
-          >
-            In3 a transformé notre vision en réalité avec une approche
-            passionnée et professionnelle.
-          </Typography>
+          In3 a transformé notre vision en réalité avec une approche passionnée
+          et professionnelle.
+        </Typography>
 
-          <Box sx={{ display: "flex", alignItems: "center", mt: 3 }}>
-            <Avatar
-              alt="Marie Dupont"
-              src="https://picsum.photos/100.webp"
-              sx={{ width: 56, height: 56, marginRight: 2 }}
-            />
-            <Box>
-              <Typography variant="h6" sx={{ fontWeight: "bold" }}>
-                Marie Dupont
-              </Typography>
-              <Typography variant="body2">
-                Directrice Créative chez TechVision
-              </Typography>
-            </Box>
+        <Box sx={{ display: "flex", alignItems: "center", mt: 3 }}>
+          <Avatar
+            alt="Marie Dupont"
+            src="https://picsum.photos/100.webp"
+            sx={{ width: 56, height: 56, marginRight: 2 }}
+          />
+          <Box>
+            <Typography
+              variant="span"
+              sx={{
+                fontWeight: "bold",
+                
+              }}
+            >
+              Marie Dupont
+            </Typography>
+            <Typography variant="body2">
+              Directrice Créative chez TechVision
+            </Typography>
           </Box>
-        </Grid>
+        </Box>
+      </Grid>
     </Box>
   );
 };
 
-export default TestimonialSection;
+export default TestimonialSection;