Merge branch 'issue-27' into 'develop'

style: 💄 change commitments section on homepage

See merge request ldc-web/projets/ovoteam!30

lang/fr/front.php

@@ -13,7 +13,7 @@ return [
         "all_recipes"  => "voir toutes nos recettes"
     ],
     "know_more"  => "en savoir plus",
-    "ovoteam_commit" => "ovoteam s'engage",
+    "ovoteam_commit" => "nos engagements",
     "discover_our_commit" => "découvrez nos engagements",
     "ovoteam_recipe" => "recettes ovoteam",
     "image"                       => [

resources/ts/front/Components/Theme/Sections/TripleColSection.tsx

@@ -2,7 +2,7 @@
 import { CustomButtonVariant, TextProps } from "@/types/front";
 import TripleCol, { TripleColType } from "$/uwil/TripleCol";
 import { ButtonProps } from "@/components/ui/button";
-import { BgColorName, bgColors } from "@/front/lib/constants";
+import { BgColorName, bgColors, ImageShapeName, imageShapes } from "@/front/lib/constants";
 import Section from "$/uwil/Section";
 import { cn } from "@/lib/utils";
 
@@ -17,6 +17,7 @@ type TripleColSectionProps = {
   };
   variant?: BgColorName;
   className?: string;
+  shape?: ImageShapeName;
 };
 
 /**
@@ -45,6 +46,7 @@ type TripleColSectionProps = {
  * @property {Object} button - Optional CTA button
  * @property {string} button.label - Button text
  * @property {string} button.href - Link target
+ * @property {ImageShapeName} shape - Optional, shape of the image
  * @property {string} button.variant - Button style variant
  * @property {BgColorName} variant - Section background theme (default: BACKGROUND)
  *
@@ -67,6 +69,7 @@ export default function TripleColSection(props: TripleColSectionProps) {
     button,
     variant = bgColors.BACKGROUND,
     className,
+    shape = imageShapes.ROUNDED
   } = props;
 
   return (
@@ -101,7 +104,7 @@ export default function TripleColSection(props: TripleColSectionProps) {
         },
       })}
     >
-      <TripleCol cols={cols} variant={variant} />
+      <TripleCol shape={shape} cols={cols} variant={variant} />
     </Section>
   );
 }

resources/ts/front/Components/Theme/TripleCol.tsx

@@ -2,7 +2,7 @@ import { ImageProps, TextProps } from "@/types/front";
 import Image from "$/uwil/Image";
 import { cn } from "@/lib/utils";
 import { Separator } from "@/components/ui/separator";
-import { BgColorName, bgColors, fonts } from "@/front/lib/constants";
+import { BgColorName, bgColors, fonts, ImageShapeName, imageShapes } from "@/front/lib/constants";
 
 export type TripleColType = {
   image: ImageProps;
@@ -14,10 +14,11 @@ export type TripleColType = {
 type Props = {
   cols: TripleColType[];
   variant?: BgColorName;
+  shape?: ImageShapeName;
 };
 
 export default function TripleCol(props: Props) {
-  const { cols, variant } = props;
+  const { cols, variant, shape = imageShapes.ROUNDED } = props;
 
   const width = "w-72 lg:w-56";
   const height = "aspect-square lg:h-56";
@@ -33,7 +34,7 @@ export default function TripleCol(props: Props) {
             <Image
               size={`${width} ${height}`}
               image={col.image}
-              shape="rounded"
+              shape={shape}
             />
             <div>
               <h4

resources/ts/front/Pages/Home.tsx

@@ -3,7 +3,7 @@ import Head from "@/front/Components/Base/Head";
 import { route } from "ziggy-js";
 // * Other
 import AppLayout from "@/front/Layouts/AppLayout";
-import { bgColors, verticalPlacements } from "../lib/constants";
+import { bgColors, imageShapes, verticalPlacements } from "../lib/constants";
 import { GetTranslation } from "@/lib/utils";
 import str from "@/hooks/use-string";
 import TripleColSection from "$/uwil/Sections/TripleColSection";
@@ -127,48 +127,49 @@ export default function Home() {
       />
 
       <TripleColSection
+        shape={imageShapes.SQUARE}
         title={{
           text: GetTranslation("front.ovoteam_commit"),
         }}
         cols={[
           {
             title: {
-              text: "Plaintel (22 - Côtes d'Armor)",
+              text: "Fabriqué en France",
             },
             description: {
-              text: "Notre site multi-spécialiste : Œufs Durs, Œufs Pochés, Liquides petits conditionnements et Préparations traiteur.",
+              text: "Nos produits sont fabriqués dans nos 3 sites de production Français certifiés Œufs de France, BRC, FSSC22000 et Bio.",
             },
             image: {
-              alt: "Vue aérienne du site de production d'Ovoteam à Plaintel, en France",
-              title: "Notre site de Plaintel : Multi-spécialiste.",
-              src: "/assets/img/france/sites/plaintel.png",
+              alt: 'Engagement "Fabriqué en France" Ovoteam.',
+              title: "Nos produits sont fabriqués en France.",
+              src: "/assets/img/commitments/1fabrique-en-france.png",
             },
           },
           {
             title: {
-              text: "Auneau (28 - Eure-et-Loir)",
+              text: "Large gamme issue d'élevage plein air",
             },
             description: {
-              text: "Notre site expert des Omelettes et des Œufs Brouillés, en frais et surgelé.",
+              text: "Large gamme de produits issus de poules Sol, Plein Air & Bio ; ainsi qu’une large offre Egalim.",
             },
             image: {
-              alt: "Vue aérienne du site de production d'Ovoteam à Auneau, en France.",
+              alt: 'Engagement "Large gamme issue d\'élevage plein air" Ovoteam.',
               title:
-                "Notre site d'Auneau : Expert des Omelettes et Œufs Brouillés.",
-              src: "/assets/img/france/sites/auneau.jpg",
+                "Produits issus de poules Sol, Plein Air & Bio.",
+              src: "/assets/img/commitments/2large-gamme-issue-d-039-elevages-plein-air.png",
             },
           },
           {
             title: {
-              text: "Ambrières-Les-Vallées (53 - Mayenne)",
+              text: "A vos côtés depuis 1963",
             },
             description: {
-              text: "Notre site spécialisé dans les liquides gros conditionnements à destination de l'industrie agro-alimentaire.",
+              text: "Véritable partenaire de la restauration, de l'industrie agro-alimentaire et de la GMS, nous développons des solutions à base d'œuf depuis plus de 60 ans.",
             },
             image: {
-              alt: "Vue aérienne du site de production d'Ovoteam à Ambrières-Les-Vallées, en France.",
-              title: "Notre site d'Ambrières : Spécialisé pour l'Industrie.",
-              src: "/assets/img/france/sites/ambrieres.jpg",
+              alt: 'Engagement "A vos côtés depuis 1963" Ovoteam.',
+              title: "Partenaire de la RHD, IAA et GMS avec des solutions à base d'œuf depuis 60 ans.",
+              src: "/assets/img/commitments/3a-vos-cotes-depuis-1963.png",
             },
           },
         ]}