Merge version_1 into main #1
401
src/app/page.tsx
401
src/app/page.tsx
@@ -19,280 +19,153 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="hover-bubble"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Accueil",
|
||||
id: "#hero",
|
||||
},
|
||||
{
|
||||
name: "Produits",
|
||||
id: "#products",
|
||||
},
|
||||
{
|
||||
name: "À Propos",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="SAE Réunion"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Accueil", id: "#hero" },
|
||||
{ name: "Produits", id: "#products" },
|
||||
{ name: "À Propos", id: "#about" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="SAE Réunion"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogo
|
||||
logoText="#BIENÉQUIPÉ"
|
||||
description="Un chantier sécurisé commence par un bon casque. Leader de l’équipement de protection individuelle à La Réunion depuis 1996."
|
||||
buttons={[
|
||||
{
|
||||
text: "Découvrir la gamme",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/front-view-hard-hat-headphones-hanging-closet_23-2148773503.jpg"
|
||||
imageAlt="Casque de chantier SAE"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogo
|
||||
logoText="#BIENÉQUIPÉ"
|
||||
description="Un chantier sécurisé commence par un bon casque. Leader de l’équipement de protection individuelle à La Réunion depuis 1996."
|
||||
buttons={[{ text: "Découvrir la gamme", href: "#products" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/front-view-hard-hat-headphones-hanging-closet_23-2148773503.jpg"
|
||||
imageAlt="Casque de chantier SAE"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={true}
|
||||
title="Le spécialiste de l'EPI depuis 1996"
|
||||
metrics={[
|
||||
{
|
||||
icon: Award,
|
||||
label: "Années d'expertise",
|
||||
value: "28+",
|
||||
},
|
||||
{
|
||||
icon: ShieldCheck,
|
||||
label: "Produits certifiés",
|
||||
value: "1000+",
|
||||
},
|
||||
{
|
||||
icon: Users,
|
||||
label: "Clients satisfaits",
|
||||
value: "5000+",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={true}
|
||||
title="Le spécialiste de l'EPI depuis 1996"
|
||||
metrics={[
|
||||
{ icon: Award, label: "Années d'expertise", value: "28+" },
|
||||
{ icon: ShieldCheck, label: "Produits certifiés", value: "1000+" },
|
||||
{ icon: Users, label: "Clients satisfaits", value: "5000+" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="one-large-left-three-stacked-right"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Gants de Manutention",
|
||||
price: "12€",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-safety-gloves-vest_23-2148784084.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Chaussures de Sécurité",
|
||||
price: "89€",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/unrecognizable-manual-worker-typing-shoelace-construction-site_637285-8190.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Lunettes de Protection",
|
||||
price: "15€",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-protection-equipment-close-up_23-2148921397.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Vêtements Haute Visibilité",
|
||||
price: "45€",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/engineer-oversees-assembly-tools-tablet-industry-plant-surrounded-by-metal-steel-machinery_482257-135546.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Protection Respiratoire",
|
||||
price: "29€",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-with-gas-mask_1122-1288.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Casque Anti-bruit",
|
||||
price: "35€",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-builder-carpenter-polishes-wooden-board-with-random-orbit-sander_23-2147944854.jpg",
|
||||
},
|
||||
]}
|
||||
title="Gamme complète d'EPI"
|
||||
description="Une sélection rigoureuse auprès des plus grands fabricants mondiaux."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="one-large-left-three-stacked-right"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "Gants de Manutention", price: "12€", imageSrc: "http://img.b2bpic.net/free-photo/top-view-safety-gloves-vest_23-2148784084.jpg" },
|
||||
{ id: "p2", name: "Chaussures de Sécurité", price: "89€", imageSrc: "http://img.b2bpic.net/free-photo/unrecognizable-manual-worker-typing-shoelace-construction-site_637285-8190.jpg" },
|
||||
{ id: "p3", name: "Lunettes de Protection", price: "15€", imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-protection-equipment-close-up_23-2148921397.jpg" },
|
||||
{ id: "p4", name: "Vêtements Haute Visibilité", price: "45€", imageSrc: "http://img.b2bpic.net/free-photo/engineer-oversees-assembly-tools-tablet-industry-plant-surrounded-by-metal-steel-machinery_482257-135546.jpg" },
|
||||
{ id: "p5", name: "Protection Respiratoire", price: "29€", imageSrc: "http://img.b2bpic.net/free-photo/man-with-gas-mask_1122-1288.jpg" },
|
||||
{ id: "p6", name: "Casque Anti-bruit", price: "35€", imageSrc: "http://img.b2bpic.net/free-photo/man-builder-carpenter-polishes-wooden-board-with-random-orbit-sander_23-2147944854.jpg" },
|
||||
]}
|
||||
title="Gamme complète d'EPI"
|
||||
description="Une sélection rigoureuse auprès des plus grands fabricants mondiaux."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardOne
|
||||
animationType="depth-3d"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Expertise Locale",
|
||||
description: "Connaissance approfondie des contraintes du marché local réunionnais.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/warehouse-worker-checking-inventory_23-2152001550.jpg",
|
||||
},
|
||||
{
|
||||
title: "Normes Strictes",
|
||||
description: "Tous nos EPI répondent aux dernières normes européennes de sécurité.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/manual-worker-with-face-mask-working-carpentry-warehouse-coronavirus-pandemic_637285-11777.jpg",
|
||||
},
|
||||
{
|
||||
title: "Stock Permanent",
|
||||
description: "Un large choix disponible immédiatement pour vos chantiers.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/engineers-industry-40-industrial-plant-controlling-automated-machinery_482257-120564.jpg",
|
||||
},
|
||||
]}
|
||||
title="Pourquoi choisir SAE Réunion ?"
|
||||
description="Nous accompagnons les professionnels avec des solutions adaptées et certifiées."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardOne
|
||||
animationType="depth-3d"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ title: "Expertise Locale", description: "Connaissance approfondie des contraintes du marché local réunionnais.", imageSrc: "http://img.b2bpic.net/free-photo/warehouse-worker-checking-inventory_23-2152001550.jpg" },
|
||||
{ title: "Normes Strictes", description: "Tous nos EPI répondent aux dernières normes européennes de sécurité.", imageSrc: "http://img.b2bpic.net/free-photo/manual-worker-with-face-mask-working-carpentry-warehouse-coronavirus-pandemic_637285-11777.jpg" },
|
||||
{ title: "Stock Permanent", description: "Un large choix disponible immédiatement pour vos chantiers.", imageSrc: "http://img.b2bpic.net/free-photo/engineers-industry-40-industrial-plant-controlling-automated-machinery_482257-120564.jpg" },
|
||||
]}
|
||||
title="Pourquoi choisir SAE Réunion ?"
|
||||
description="Nous accompagnons les professionnels avec des solutions adaptées et certifiées."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardTwo
|
||||
animationType="depth-3d"
|
||||
textboxLayout="split"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "24h",
|
||||
description: "Temps moyen de réponse",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "100%",
|
||||
description: "Conformité produits",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "98%",
|
||||
description: "Taux de disponibilité",
|
||||
},
|
||||
]}
|
||||
title="Impact & Sécurité"
|
||||
description="Des chiffres qui témoignent de notre engagement quotidien."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardTwo
|
||||
animationType="depth-3d"
|
||||
textboxLayout="split"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", value: "24h", description: "Temps moyen de réponse" },
|
||||
{ id: "m2", value: "100%", description: "Conformité produits" },
|
||||
{ id: "m3", value: "98%", description: "Taux de disponibilité" },
|
||||
]}
|
||||
title="Impact & Sécurité"
|
||||
description="Des chiffres qui témoignent de notre engagement quotidien."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Jean Dupont",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-plus-size-man-working-construction_23-2150772851.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Marc Martin",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-wearing-special-industrial-protective-equipment_23-2148991969.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Sophie Leroy",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-engineer-talking-phone_23-2148233674.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Lucie Bernard",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-worker-with-arms-crossed-standing-factory_107420-96042.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Pierre Vidal",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-young-man-with-helmet_23-2148269289.jpg",
|
||||
},
|
||||
]}
|
||||
cardTitle="Ce que nos partenaires disent"
|
||||
cardTag="Témoignages"
|
||||
cardAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Jean Dupont", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-plus-size-man-working-construction_23-2150772851.jpg" },
|
||||
{ id: "t2", name: "Marc Martin", imageSrc: "http://img.b2bpic.net/free-photo/woman-wearing-special-industrial-protective-equipment_23-2148991969.jpg" },
|
||||
{ id: "t3", name: "Sophie Leroy", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-engineer-talking-phone_23-2148233674.jpg" },
|
||||
{ id: "t4", name: "Lucie Bernard", imageSrc: "http://img.b2bpic.net/free-photo/male-worker-with-arms-crossed-standing-factory_107420-96042.jpg" },
|
||||
{ id: "t5", name: "Pierre Vidal", imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-young-man-with-helmet_23-2148269289.jpg" },
|
||||
]}
|
||||
cardTitle="Ce que nos partenaires disent"
|
||||
cardTag="Témoignages"
|
||||
cardAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Contactez-nous"
|
||||
description="Besoin d'un conseil ou d'un devis ? Notre équipe est à votre écoute."
|
||||
inputs={[
|
||||
{
|
||||
name: "nom",
|
||||
type: "text",
|
||||
placeholder: "Nom complet",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email professionnel",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Votre demande",
|
||||
rows: 4,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/high-rise-construction-with-cantilever-decks-floor-rhythm-yellow-platforms_169016-69965.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Contactez-nous"
|
||||
description="Besoin d'un conseil ou d'un devis ? Notre équipe est à votre écoute."
|
||||
inputs={[
|
||||
{ name: "nom", type: "text", placeholder: "Nom complet", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Email professionnel", required: true },
|
||||
]}
|
||||
textarea={{ name: "message", placeholder: "Votre demande", rows: 4 }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/high-rise-construction-with-cantilever-decks-floor-rhythm-yellow-platforms_169016-69965.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="SAE Réunion"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Accueil",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
label: "Produits",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Informations",
|
||||
items: [
|
||||
{
|
||||
label: "Mentions Légales",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Politique Confidentialité",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2024 SAE Réunion - Leader EPI"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="SAE Réunion"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation", items: [
|
||||
{ label: "Accueil", href: "#hero" },
|
||||
{ label: "Produits", href: "#products" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Informations", items: [
|
||||
{ label: "Mentions Légales", href: "#" },
|
||||
{ label: "Politique Confidentialité", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2024 SAE Réunion - Leader EPI"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user