Update src/app/page.tsx

Merge version_2 into main

src/app/page.tsx

@@ -91,16 +91,59 @@ export default function LandingPage() {
       </div>
 
       <div id="hours" data-section="hours">
-        <AboutMetric
+        <FeatureCardSeven
           title="Nos horaires d'ouverture"
-          metrics={[
-            { icon: XCircle, label: "Lundi", value: "Fermé" },
-            { icon: Clock, label: "Mardi - Vendredi", value: "07:15–12:15 / 15:00–19:30" },
-            { icon: Clock, label: "Samedi", value: "08:00–12:15 / 15:00–18:30" },
-            { icon: XCircle, label: "Dimanche", value: "Fermé" }
+          description="Découvrez nos horaires pour planifier votre visite et profitez de nos services de pressing."
+          features={[
+            {
+              title: "Dimanche",              description: `<div class="flex flex-col items-start gap-1 py-1">
+                              <span class="text-gray-500 font-medium">Fermé</span>
+                              <span class="inline-flex items-center rounded-full bg-gray-100 px-2 py-0.5 text-xs font-medium text-gray-600 ring-1 ring-inset ring-gray-200">Fermé</span>
+                            </div>`,
+            },
+            {
+              title: "Lundi",              description: `<div class="flex flex-col items-start gap-1 py-1">
+                              <span class="text-gray-500 font-medium">Fermé</span>
+                              <span class="inline-flex items-center rounded-full bg-gray-100 px-2 py-0.5 text-xs font-medium text-gray-600 ring-1 ring-inset ring-gray-200">Fermé</span>
+                            </div>`,
+            },
+            {
+              title: "Mardi",              description: `<div class="flex flex-col items-start gap-1 py-1">
+                              <span>07:15–12:15</span>
+                              <span>15:00–19:30</span>
+                            </div>`,
+            },
+            {
+              title: "Mercredi",              description: `<div class="flex flex-col items-start gap-1 py-1">
+                              <span>07:15–12:15</span>
+                              <span>15:00–19:30</span>
+                            </div>`,
+            },
+            {
+              title: "Jeudi",              description: `<div class="flex flex-col items-start gap-1 py-1">
+                              <span>07:15–12:15</span>
+                              <span>15:00–19:30</span>
+                            </div>`,
+            },
+            {
+              title: "Vendredi",              description: `<div class="flex flex-col items-start gap-1 py-1">
+                              <span>07:15–12:15</span>
+                              <span>15:00–19:30</span>
+                            </div>`,
+            },
+            {
+              title: "Samedi",              description: `<div class="flex flex-col items-start gap-1 py-1">
+                              <span>08:00–12:15</span>
+                              <span>15:00–18:30</span>
+                            </div>`,
+            },
           ]}
-          metricsAnimation="slide-up"
+          animationType="slide-up"
+          textboxLayout="default"
           useInvertedBackground={false}
+          cardClassName="p-4 sm:p-6 lg:p-8 border border-gray-200 rounded-lg text-left"
+          cardTitleClassName="text-lg font-semibold mb-2"
+          cardDescriptionClassName="text-base"
         />
       </div>
 
@@ -139,7 +182,8 @@ export default function LandingPage() {
       <div id="location" data-section="location">
         <ContactSplitForm
           title="Nous trouver à Clamart"
-          description="Venez nous rendre visite à Pressing de la Gare, idéalement situé à côté de la gare de Clamart. Facilement accessible pour tous vos besoins.<br/><br/>**Adresse :** Place de la Gare, 92140 Clamart"
+          description="Venez nous rendre visite Place de la Gare, à deux pas du centre de Clamart. Facilement accessible en train, en bus ou à pied. 
+Place de la Gare, 92140 Clamart"
           inputs={[
             { name: "name", type: "text", placeholder: "Votre nom", required: true },
             { name: "email", type: "email", placeholder: "Votre email", required: true }
@@ -162,4 +206,4 @@ export default function LandingPage() {
       </div>
     </ThemeProvider>
   );
-}
+}