187 lines
11 KiB
TypeScript
187 lines
11 KiB
TypeScript
"use client";
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import ReactLenis from "lenis/react";
|
||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
|
||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
||
import HeroSplit from '@/components/sections/hero/HeroSplit';
|
||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
|
||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||
import TextAbout from '@/components/sections/about/TextAbout';
|
||
import { Crown, Sparkles } from "lucide-react";
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="bounce-effect"
|
||
defaultTextAnimation="entrance-slide"
|
||
borderRadius="rounded"
|
||
contentWidth="small"
|
||
sizing="medium"
|
||
background="noiseDiagonalGradient"
|
||
cardStyle="gradient-bordered"
|
||
primaryButtonStyle="double-inset"
|
||
secondaryButtonStyle="solid"
|
||
headingFontWeight="normal"
|
||
>
|
||
<ReactLenis root>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarLayoutFloatingOverlay
|
||
navItems={[
|
||
{ name: "Home", id: "hero" },
|
||
{ name: "About", id: "about" },
|
||
{ name: "Services", id: "services" },
|
||
{ name: "Gallery", id: "gallery" },
|
||
{ name: "Contact", id: "contact" },
|
||
]}
|
||
brandName="Jean’s Hair Team"
|
||
/>
|
||
</div>
|
||
|
||
<div id="hero" data-section="hero">
|
||
<HeroSplit
|
||
background={{ variant: "radial-gradient" }}
|
||
title="Luxury Hair. Bold Beauty. Timeless Confidence."
|
||
description="Experience premium hairstyling, flawless installs, and expert beauty care with Jean’s Hair Team."
|
||
buttons={[{ text: "Book Appointment", href: "#contact" }, { text: "View Services", href: "#services" }]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/young-woman-posing-with-photo-tape-red-background_114579-60923.jpg?_wi=1"
|
||
imageAlt="Glmorous salon hair model"
|
||
mediaAnimation="slide-up"
|
||
avatars={[
|
||
{ src: "http://img.b2bpic.net/free-photo/close-up-ferromagnetic-metal-with-blurred-background_23-2148253621.jpg", alt: "Close-up ferromagnetic metal" },
|
||
{ src: "http://img.b2bpic.net/free-photo/woman-styling-her-hair-saloon_107420-12143.jpg", alt: "Woman styling her hair at saloon" },
|
||
{ src: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149230936.jpg", alt: "Woman getting treatment" },
|
||
{ src: "http://img.b2bpic.net/free-photo/lovely-sexy-woman-with-perfect-makeup-nice-hairdo-posing-studio-fashionable-girl-looking-away-holding-beautiful-long-hair-by-hand-isolated-dark-background_132075-11897.jpg", alt: "Fashionable girl looking away" },
|
||
{ src: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman_23-2148661329.jpg", alt: "Beautiful woman portrait" },
|
||
]}
|
||
avatarText="Trusted by 500+ happy clients"
|
||
marqueeItems={[
|
||
{ type: "text", text: "Expert Stylists" },
|
||
{ type: "text-icon", text: "Premium Products", icon: Sparkles },
|
||
{ type: "text", text: "Luxury Experience" },
|
||
{ type: "text-icon", text: "Signature Installs", icon: Crown },
|
||
{ type: "text", text: "Bespoke Care" },
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about">
|
||
<TextAbout
|
||
useInvertedBackground={false}
|
||
title="Where Beauty Meets Excellence"
|
||
buttons={[{ text: "Learn More", href: "#services" }]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="services" data-section="services">
|
||
<FeatureCardOne
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
gridVariant="three-columns-all-equal-width"
|
||
useInvertedBackground={false}
|
||
features={[
|
||
{ title: "Wig Installations", description: "Flawless, natural-looking wig installs designed to elevate your style.", imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-drying-woman39s-hair_657883-585.jpg?_wi=1", imageAlt: "Wig install" },
|
||
{ title: "Signature Braids", description: "Expertly crafted protective braid styles for modern sophistication.", imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-her-hair-done-salon_23-2148976115.jpg", imageAlt: "Braids" },
|
||
{ title: "Luxury Treatments", description: "Deep conditioning and restorative treatments to maintain your hair health.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-with-flowing-shiny-long-brown-hair_23-2151989128.jpg", imageAlt: "Treatment" },
|
||
]}
|
||
title="Premium Hair & Beauty Services"
|
||
description="Our stylists are dedicated to crafting personalized experiences for every client."
|
||
/>
|
||
</div>
|
||
|
||
<div id="gallery" data-section="gallery">
|
||
<ProductCardTwo
|
||
animationType="slide-up"
|
||
textboxLayout="split-actions"
|
||
gridVariant="four-items-2x2-equal-grid"
|
||
useInvertedBackground={false}
|
||
buttons={[{ text: "Book Your Session", href: "#contact" }]}
|
||
products={[
|
||
{ id: "1", brand: "Style", name: "Bridal Updo", price: "From $150", rating: 5, reviewCount: "50+", imageSrc: "http://img.b2bpic.net/free-photo/bride-with-wedding-dress_23-2148106130.jpg" },
|
||
{ id: "2", brand: "Style", name: "Luxury Weave", price: "From $200", rating: 5, reviewCount: "80+", imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-her-hair-dyed-beauty-salon_23-2149167370.jpg" },
|
||
{ id: "3", brand: "Style", name: "Defined Braids", price: "From $120", rating: 5, reviewCount: "120+", imageSrc: "http://img.b2bpic.net/free-photo/mixed-race-woman-with-hand-dark-skinned-man-around-neck_8353-12401.jpg" },
|
||
{ id: "4", brand: "Style", name: "Sleek Install", price: "From $180", rating: 5, reviewCount: "200+", imageSrc: "http://img.b2bpic.net/free-photo/serious-women-shake-fingers-say-no-look-attentively-camera_273609-52222.jpg" },
|
||
{ id: "5", brand: "Studio", name: "Salon Ambiance", price: "Visit", rating: 5, reviewCount: "500+", imageSrc: "http://img.b2bpic.net/free-photo/alpine-hotel-hosting-winter-sports_482257-102253.jpg" },
|
||
{ id: "6", brand: "Transform", name: "Before & After", price: "View", rating: 5, reviewCount: "300+", imageSrc: "http://img.b2bpic.net/free-photo/blonde-female-friends-dressed-white_273609-6109.jpg" },
|
||
]}
|
||
title="Our Signature Transformations"
|
||
description="A curated glimpse into the styles and transformations that define Jean’s Hair Team."
|
||
/>
|
||
</div>
|
||
|
||
<div id="testimonials" data-section="testimonials">
|
||
<TestimonialCardTwo
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
testimonials={[
|
||
{ id: "1", name: "Sarah J.", role: "Corporate Professional", testimonial: "Jean’s Hair Team gave me the best install I’ve ever had!", imageSrc: "http://img.b2bpic.net/free-photo/female-hairdresser-styling-clients-hair_107420-94690.jpg" },
|
||
{ id: "2", name: "Michelle K.", role: "Client", testimonial: "Professional, elegant, and worth every cent.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-with-african-braids_633478-1408.jpg" },
|
||
{ id: "3", name: "Tanya L.", role: "Bride", testimonial: "The salon experience is pure luxury.", imageSrc: "http://img.b2bpic.net/free-photo/master-applying-makeup-smiling-blond-woman_23-2148113227.jpg" },
|
||
{ id: "4", name: "Chloe M.", role: "Influencer", testimonial: "Obsessed with my new style. Quality at its finest.", imageSrc: "http://img.b2bpic.net/free-photo/excited-lady-holding-blue-idea-board-looking-camera-restaurant_114579-92458.jpg" },
|
||
{ id: "5", name: "Grace P.", role: "Business Owner", testimonial: "The most comfortable and premium environment.", imageSrc: "http://img.b2bpic.net/free-photo/team-bride-celebrating-before-wedding_23-2149329119.jpg" },
|
||
]}
|
||
title="Client Love"
|
||
description="See why clients choose us for their beauty transformations."
|
||
/>
|
||
</div>
|
||
|
||
<div id="booking" data-section="booking">
|
||
<PricingCardNine
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
plans={[
|
||
{ id: "b-1", title: "Installments", price: "$150+", period: "Session", features: ["Consultation", "Install", "Style", "Care Kit"], button: { text: "Book Now" }, imageSrc: "http://img.b2bpic.net/free-photo/beauty-salon-with-cosmetology-equipment-anime-style_23-2151501044.jpg", imageAlt: "luxury hair salon interior" },
|
||
{ id: "b-2", title: "Protective Styles", price: "$100+", period: "Session", features: ["Deep Clean", "Braiding", "Style", "Edge Control"], button: { text: "Book Now" }, imageSrc: "http://img.b2bpic.net/free-photo/young-woman-posing-with-photo-tape-red-background_114579-60923.jpg?_wi=2", imageAlt: "luxury hair salon interior" },
|
||
{ id: "b-3", title: "Beauty Care", price: "$50+", period: "Session", features: ["Conditioning", "Trim", "Treatment", "Finish"], button: { text: "Book Now" }, imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-drying-woman39s-hair_657883-585.jpg?_wi=2", imageAlt: "luxury hair salon interior" },
|
||
]}
|
||
title="Ready for Your Transformation?"
|
||
description="Transparent pricing for our most popular services."
|
||
/>
|
||
</div>
|
||
|
||
<div id="proof" data-section="proof">
|
||
<SocialProofOne
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
names={["Luxe Magazine", "Style Africa", "Glamour SA", "Beauty Weekly", "Hair Hub", "Top Stylist Magazine", "Urban Elegance"]}
|
||
title="Trusted by Beautiful Women"
|
||
description="Jean’s Hair Team is proud to be the trusted destination for premium beauty care in South Africa."
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactSplit
|
||
useInvertedBackground={false}
|
||
background={{ variant: "plain" }}
|
||
tag="Booking Inquiries"
|
||
title="Contact Us Today"
|
||
description="Ready to look extraordinary? Reach out via WhatsApp or visit our salon."
|
||
mediaAnimation="slide-up"
|
||
buttonText="Request Callback"
|
||
inputPlaceholder="Enter your phone number for WhatsApp callback"
|
||
imageSrc="http://img.b2bpic.net/free-photo/woman-styling-her-hair-saloon_107420-12143.jpg"
|
||
imageAlt="Professional stylist working"
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterBaseReveal
|
||
logoText="Jean’s Hair Team"
|
||
columns={[
|
||
{ title: "Quick Links", items: [{ label: "About", href: "#about" }, { label: "Services", href: "#services" }, { label: "Gallery", href: "#gallery" }] },
|
||
{ title: "Booking", items: [{ label: "WhatsApp", href: "#" }, { label: "Book Now", href: "#contact" }] },
|
||
{ title: "Social", items: [{ label: "Instagram", href: "#" }, { label: "Facebook", href: "#" }] },
|
||
]}
|
||
copyrightText="© 2024 Jean’s Hair Team. All rights reserved."
|
||
/>
|
||
</div>
|
||
</ReactLenis>
|
||
</ThemeProvider>
|
||
);
|
||
} |