|
|
|
|
@@ -6,14 +6,21 @@ import AboutMetric from '@/components/sections/about/AboutMetric';
|
|
|
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
|
|
|
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
|
|
|
|
|
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
|
|
|
|
import HeroSplit from '@/components/sections/hero/HeroSplit';
|
|
|
|
|
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
|
|
|
|
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
|
|
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
|
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
|
|
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
|
|
|
|
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
|
|
|
|
import { Award, ShieldCheck, Users } from "lucide-react";
|
|
|
|
|
import { Award, ShieldCheck, Users, Search, ShoppingCart } from "lucide-react";
|
|
|
|
|
|
|
|
|
|
export default function LandingPage() {
|
|
|
|
|
const handleProductClick = () => {
|
|
|
|
|
const contactSection = document.getElementById('contact');
|
|
|
|
|
if (contactSection) {
|
|
|
|
|
contactSection.scrollIntoView({ behavior: 'smooth' });
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<ThemeProvider
|
|
|
|
|
defaultButtonVariant="hover-bubble"
|
|
|
|
|
@@ -29,23 +36,26 @@ export default function LandingPage() {
|
|
|
|
|
>
|
|
|
|
|
<ReactLenis root>
|
|
|
|
|
<div id="nav" data-section="nav">
|
|
|
|
|
<NavbarStyleCentered
|
|
|
|
|
<NavbarStyleFullscreen
|
|
|
|
|
navItems={[
|
|
|
|
|
{ name: "Accueil", id: "#hero" },
|
|
|
|
|
{ name: "Produits", id: "#products" },
|
|
|
|
|
{ name: "À Propos", id: "#about" },
|
|
|
|
|
{ name: "Contact", id: "#contact" },
|
|
|
|
|
{ name: "Mon Panier", id: "#cart" },
|
|
|
|
|
]}
|
|
|
|
|
brandName="SAE Réunion"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="hero" data-section="hero">
|
|
|
|
|
<HeroSplit
|
|
|
|
|
title="#BIENÉQUIPÉ"
|
|
|
|
|
description="Assurez une sécurité immédiate pour les professionnels de l'île de La Réunion. Nos solutions d'EPI certifiées protègent vos collaborateurs et assurent la conformité totale de vos chantiers."
|
|
|
|
|
buttons={[{ text: "Obtenir un devis rapide", href: "#contact" }]}
|
|
|
|
|
imageSrc="https://img.b2bpic.net/free-photo/construction-site-worker-with-safety-gear_1150-18457.jpg"
|
|
|
|
|
<HeroBillboard
|
|
|
|
|
title="Expertise en EPI pour les Professionnels de la Réunion"
|
|
|
|
|
description="Assurez une sécurité immédiate pour les professionnels de l'île de La Réunion.
|
|
|
|
|
Nos solutions d'EPI certifiées protègent vos collaborateurs et assurent la conformité totale de vos chantiers."
|
|
|
|
|
buttons={[{ text: "Obtenir un devis rapide", href: "#contact" }]
|
|
|
|
|
}
|
|
|
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Df1ETXUvuyYPxkhnyZJKVSXGQj/chantier-1778660616866-4fd2157e.png"
|
|
|
|
|
imageAlt="Chantier de construction avec un professionnel en équipement de sécurité"
|
|
|
|
|
background={{ variant: "plain" }}
|
|
|
|
|
/>
|
|
|
|
|
@@ -54,11 +64,11 @@ export default function LandingPage() {
|
|
|
|
|
<div id="about" data-section="about">
|
|
|
|
|
<AboutMetric
|
|
|
|
|
useInvertedBackground={true}
|
|
|
|
|
title="Le spécialiste de l'EPI depuis 1996"
|
|
|
|
|
title="30 ans au service de votre sécurité à La Réunion"
|
|
|
|
|
metrics={[
|
|
|
|
|
{ icon: Award, label: "Années d'expertise", value: "28+" },
|
|
|
|
|
{ icon: Award, label: "Années d'expertise", value: "30+" },
|
|
|
|
|
{ icon: ShieldCheck, label: "Produits certifiés", value: "1000+" },
|
|
|
|
|
{ icon: Users, label: "Clients satisfaits", value: "5000+" },
|
|
|
|
|
{ icon: Users, label: "Clients satisfaits", value: "10000+" },
|
|
|
|
|
]}
|
|
|
|
|
metricsAnimation="slide-up"
|
|
|
|
|
/>
|
|
|
|
|
@@ -72,16 +82,16 @@ export default function LandingPage() {
|
|
|
|
|
useInvertedBackground={false}
|
|
|
|
|
tag="Certifié & Conforme"
|
|
|
|
|
products={[
|
|
|
|
|
{ id: "p1", name: "Gants de Manutention", price: "12€", imageSrc: "http://img.b2bpic.net/free-photo/top-view-safety-gloves-vest_23-2148784084.jpg", onProductClick: () => window.location.href = '#contact' },
|
|
|
|
|
{ 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", onProductClick: () => window.location.href = '#contact' },
|
|
|
|
|
{ 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" },
|
|
|
|
|
{ id: "p1", name: "Gants de Manutention", price: "12€", imageSrc: "http://img.b2bpic.net/free-photo/top-view-safety-gloves-vest_23-2148784084.jpg", onProductClick: handleProductClick },
|
|
|
|
|
{ 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", onProductClick: handleProductClick },
|
|
|
|
|
{ id: "p3", name: "Lunettes de Protection", price: "15€", imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-protection-equipment-close-up_23-2148921397.jpg", onProductClick: handleProductClick },
|
|
|
|
|
{ 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", onProductClick: handleProductClick },
|
|
|
|
|
{ id: "p5", name: "Protection Respiratoire", price: "29€", imageSrc: "http://img.b2bpic.net/free-photo/man-with-gas-mask_1122-1288.jpg", onProductClick: handleProductClick },
|
|
|
|
|
{ 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", onProductClick: handleProductClick },
|
|
|
|
|
]}
|
|
|
|
|
title="Gamme complète d'EPI"
|
|
|
|
|
description="Une sélection rigoureuse auprès des plus grands fabricants mondiaux."
|
|
|
|
|
buttons={[{ text: "Demander le catalogue complet", href: "#catalog" }]}
|
|
|
|
|
description="Nos équipements sont rigoureusement sélectionnés pour offrir une protection maximale aux professionnels du bâtiment, résistant aux conditions les plus exigeantes sur le terrain pour garantir une sécurité sans compromis."
|
|
|
|
|
buttons={[{ text: "Demander un devis personnalisé", href: "#contact" }]}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
@@ -113,7 +123,7 @@ export default function LandingPage() {
|
|
|
|
|
{ id: "m3", value: "98%", description: "Taux de disponibilité" },
|
|
|
|
|
]}
|
|
|
|
|
title="Impact & Sécurité"
|
|
|
|
|
description="Des chiffres qui témoignent de notre engagement quotidien."
|
|
|
|
|
description="Fiabilité et réactivité : nos indicateurs clés de performance garantissent votre sérénité au quotidien"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
@@ -136,8 +146,8 @@ export default function LandingPage() {
|
|
|
|
|
<div id="contact" data-section="contact">
|
|
|
|
|
<ContactCenter
|
|
|
|
|
tag="Contact"
|
|
|
|
|
title="Besoin d'un devis ?"
|
|
|
|
|
description="Obtenez une réponse sous 24h pour vos besoins en sécurité."
|
|
|
|
|
title="Obtenez votre devis personnalisé en 24h"
|
|
|
|
|
description="Nous nous engageons à traiter vos demandes rapidement pour assurer votre sécurité."
|
|
|
|
|
background={{ variant: "gradient-bars" }}
|
|
|
|
|
useInvertedBackground={true}
|
|
|
|
|
/>
|
|
|
|
|
|
