Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| e8e6a99427 | |||
| 91531eaa95 |
@@ -3,6 +3,7 @@
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { useState } from "react";
|
||||
import { X, Phone, MessageSquare } from "lucide-react";
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
|
||||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
||||
@@ -16,13 +17,10 @@ import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCar
|
||||
export default function LandingPage() {
|
||||
const [submitted, setSubmitted] = useState(false);
|
||||
const [selectedService, setSelectedService] = useState<string | null>(null);
|
||||
const [isModalOpen, setIsModalOpen] = useState(false);
|
||||
|
||||
const handleServiceSelect = (serviceName: string) => {
|
||||
setSelectedService(serviceName);
|
||||
const contactSection = document.getElementById('contact');
|
||||
if (contactSection) {
|
||||
contactSection.scrollIntoView({ behavior: 'smooth' });
|
||||
}
|
||||
const handleBookingClick = () => {
|
||||
setIsModalOpen(true);
|
||||
};
|
||||
|
||||
return (
|
||||
@@ -39,6 +37,23 @@ export default function LandingPage() {
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
{isModalOpen && (
|
||||
<div className="fixed inset-0 z-[100] flex items-center justify-center p-4 bg-black/60 backdrop-blur-sm" onClick={() => setIsModalOpen(false)}>
|
||||
<div className="bg-white w-full max-w-sm p-6 rounded-3xl shadow-2xl relative flex flex-col gap-6 animate-in zoom-in-95 duration-300" onClick={(e) => e.stopPropagation()}>
|
||||
<button className="absolute top-4 right-4 text-gray-400 hover:text-black" onClick={() => setIsModalOpen(false)}><X /></button>
|
||||
<h3 className="text-xl font-semibold text-center">Réservez votre moment</h3>
|
||||
<div className="flex flex-col gap-3">
|
||||
<a href="tel:0483890867" className="flex items-center justify-center gap-3 w-full py-3 bg-[#15479c] text-white rounded-full font-medium hover:opacity-90">
|
||||
<Phone size={18} /> 0483 89 08 67
|
||||
</a>
|
||||
<a href="https://wa.me/32483890867?text=Bonjour,%20je%20souhaite%20prendre%20rendez-vous%20chez%20Mondial%20Coiffure." target="_blank" rel="noopener noreferrer" className="flex items-center justify-center gap-3 w-full py-3 bg-[#25d366] text-white rounded-full font-medium hover:opacity-90">
|
||||
<MessageSquare size={18} /> WhatsApp
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
@@ -64,7 +79,7 @@ export default function LandingPage() {
|
||||
{ name: "Jean-Pierre D.", handle: "@jp_d", testimonial: "Un savoir-faire exceptionnel et un accueil vraiment chaleureux.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-bearded-man-suit_23-2149705920.jpg" },
|
||||
{ name: "Marc B.", handle: "@marcb", testimonial: "Le service est impeccable, je ne vais nulle part ailleurs.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-glad-pretty-woman-dark-sweater-standing-near-lamps_114579-81865.jpg" }
|
||||
]}
|
||||
buttons={[{ text: "Réserver un Créneau", href: "#contact" }, { text: "Découvrir nos Services", href: "#services" }]}
|
||||
buttons={[{ text: "Réserver un Créneau", onClick: handleBookingClick }, { text: "Découvrir nos Services", href: "#services" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-from-man-barber-shop_23-2148257045.jpg?_wi=1"
|
||||
imageAlt="Professional haircut in progress"
|
||||
mediaAnimation="opacity"
|
||||
@@ -98,15 +113,15 @@ export default function LandingPage() {
|
||||
plans={[
|
||||
{
|
||||
id: "p1", title: "Coupe & Coiffage", price: "35€", period: "service", features: ["Shampooing traitant", "Massage crânien", "Coupe personnalisée", "Coiffage professionnel"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/back-view-man-getting-haircut_23-2148242819.jpg", imageAlt: "Back view of man getting a haircut", button: { text: "Réserver", onClick: () => handleServiceSelect("Coupe & Coiffage") }
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/back-view-man-getting-haircut_23-2148242819.jpg", imageAlt: "Back view of man getting a haircut", button: { text: "Réserver", onClick: handleBookingClick }
|
||||
},
|
||||
{
|
||||
id: "p2", title: "La Barbe Traditionnelle", price: "25€", period: "service", features: ["Taille aux ciseaux", "Rasoir de précision", "Rituel serviette chaude", "Huiles de soin"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-from-man-barber-shop_23-2148257045.jpg?_wi=2", imageAlt: "Back view of man getting a haircut", button: { text: "Réserver", onClick: () => handleServiceSelect("La Barbe Traditionnelle") }
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-from-man-barber-shop_23-2148257045.jpg?_wi=2", imageAlt: "Back view of man getting a haircut", button: { text: "Réserver", onClick: handleBookingClick }
|
||||
},
|
||||
{
|
||||
id: "p3", title: "Le Rituel Mondial", price: "55€", period: "service", features: ["Coupe premium", "Soin de la barbe", "Massage signature", "Finitions irréprochables"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-shop-tools-arrangement_23-2149167448.jpg", imageAlt: "Back view of man getting a haircut", button: { text: "Réserver", onClick: () => handleServiceSelect("Le Rituel Mondial") }
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-shop-tools-arrangement_23-2149167448.jpg", imageAlt: "Back view of man getting a haircut", button: { text: "Réserver", onClick: handleBookingClick }
|
||||
}
|
||||
]}
|
||||
title="Nos Services Signature"
|
||||
@@ -135,7 +150,7 @@ export default function LandingPage() {
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={false}
|
||||
heading={[{ type: "text", content: "Une Approche " }, { type: "image", src: "http://img.b2bpic.net/free-photo/barber-shop-tools-arrangement_23-2149167448.jpg", alt: "Salon interior" }, { type: "text", content: " Exclusive" }]}
|
||||
buttons={[{ text: "Réserver Maintenant", href: "#contact" }]}
|
||||
buttons={[{ text: "Réserver Maintenant", onClick: handleBookingClick }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -172,7 +187,7 @@ export default function LandingPage() {
|
||||
logoText="MONDIAL COIFFURE"
|
||||
columns={[
|
||||
{ title: "Navigation", items: [{ label: "L’Expérience", href: "#hero" }, { label: "Services", href: "#services" }, { label: "Reviews", href: "#reviews" }] },
|
||||
{ title: "Contact", items: [{ label: "Adresse: Bruxelles, Belgique", href: "#" }, { label: "Tél: +32 X XX XX XX", href: "tel:+32XXXXXXXX" }] }
|
||||
{ title: "Contact", items: [{ label: "Adresse: Bruxelles, Belgique", href: "#" }, { label: "Tél: +32 483 89 08 67", onClick: handleBookingClick }] }
|
||||
]}
|
||||
copyrightText="© 2024 Mondial Coiffure. Tous droits réservés."
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user