Files
5efed8d6-3a5e-43a3-8d3e-6d1…/src/app/page.tsx
2026-04-09 16:50:52 +00:00

163 lines
8.2 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-shift"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="small"
sizing="medium"
background="aurora"
cardStyle="layered-gradient"
primaryButtonStyle="double-inset"
secondaryButtonStyle="layered"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "hero" },
{ name: "Services", id: "services" },
{ name: "Pricing", id: "pricing" },
{ name: "Team", id: "team" },
{ name: "Contact", id: "contact" },
]}
brandName="Lumina Salon"
/>
</div>
<div id="hero" data-section="hero">
<HeroOverlay
title="Experience Professional Hair Artistry"
description="Transform your look at Lumina Salon. Expert cuts, vibrant colors, and rejuvenating treatments for every hair type."
buttons={[
{
text: "Book Appointment", href: "#contact"},
]}
imageSrc="http://img.b2bpic.net/free-photo/beautician-styling-clients-hair_107420-94677.jpg"
showBlur={true}
avatars={[
{ src: "http://img.b2bpic.net/free-photo/portrait-waitress-standing-with-disposable-coffee-cup_107420-12313.jpg", alt: "Stylist Elena" },
{ src: "http://img.b2bpic.net/free-photo/woman-having-hair-treatment-latino-hair-salon_23-2150555156.jpg", alt: "Stylist Marco" },
{ src: "http://img.b2bpic.net/free-photo/young-woman-model-holding-book-red-wall_114579-56021.jpg", alt: "Stylist Sarah" },
{ src: "http://img.b2bpic.net/free-photo/surprised-young-beautiful-female-barber-uniform-holding-barber-tools-isolated-pink-background_141793-119285.jpg", alt: "Stylist Julian" },
{ src: "http://img.b2bpic.net/free-photo/young-woman-showing-her-fist-looking-front_114579-58458.jpg", alt: "Client Amanda" },
]}
avatarText="Trusted by 500+ happy clients"
/>
</div>
<div id="services" data-section="services">
<FeatureCardSix
textboxLayout="split"
useInvertedBackground={false}
features={[
{
title: "Precision Cuts", description: "Tailored cuts that complement your face shape and personal style.", imageSrc: "http://img.b2bpic.net/free-photo/scissors-towel-beauty-salon_23-2148181999.jpg"},
{
title: "Custom Coloring", description: "Vibrant, lasting colors from natural tones to bold fashion statements.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-hair-salon_23-2150668427.jpg"},
{
title: "Hair Spa & Repair", description: "Deep conditioning treatments to restore shine, moisture, and strength.", imageSrc: "http://img.b2bpic.net/free-photo/happy-woman-with-protective-face-mask-enjoying-hairdresser-s-coronavirus-epidemic_637285-9010.jpg"},
]}
title="Our Signature Services"
description="We offer a wide range of hair services using premium products to ensure your hair stays healthy and beautiful."
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardEight
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
plans={[
{
id: "p1", badge: "Essential", price: "$60", subtitle: "Includes consultation, wash, and cut.", features: ["Consultation", "Hair Wash", "Precision Cut", "Styling"],
buttons: [{ text: "Select", href: "#contact" }],
},
{
id: "p2", badge: "Premium", price: "$120", subtitle: "Includes cut, color, and deep treatment.", features: ["Full Consultation", "Color Customization", "Deep Repair Mask", "Style Finish"],
buttons: [{ text: "Select", href: "#contact" }],
},
{
id: "p3", badge: "VIP", price: "$180", subtitle: "The complete Lumina transformation.", features: ["VIP Consultation", "Full Color & Highlights", "Olaplex Treatment", "Signature Blow-out"],
buttons: [{ text: "Select", href: "#contact" }],
},
]}
title="Simple Pricing"
description="Professional services at accessible prices. Choose the experience you deserve."
/>
</div>
<div id="team" data-section="team">
<TeamCardEleven
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
groups={[
{
id: "g1", groupTitle: "Meet the Stylists", members: [
{ id: "t1", title: "Elena Rose", subtitle: "Senior Stylist", detail: "10+ years experience in precision cutting.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-waitress-standing-with-disposable-coffee-cup_107420-12313.jpg" },
{ id: "t2", title: "Marco S.", subtitle: "Color Expert", detail: "Master of balayage and creative coloring.", imageSrc: "http://img.b2bpic.net/free-photo/woman-having-hair-treatment-latino-hair-salon_23-2150555156.jpg" },
{ id: "t3", title: "Sarah Kim", subtitle: "Hair Specialist", detail: "Passionate about hair health and repair.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-model-holding-book-red-wall_114579-56021.jpg" },
{ id: "t4", title: "Julian V.", subtitle: "Junior Stylist", detail: "Up-and-coming talent with an eye for trends.", imageSrc: "http://img.b2bpic.net/free-photo/surprised-young-beautiful-female-barber-uniform-holding-barber-tools-isolated-pink-background_141793-119285.jpg" },
]
},
]}
title="Our Stylists"
description="Meet our team of experienced hair experts dedicated to bringing your beauty goals to life."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwelve
useInvertedBackground={true}
testimonials={[
{ id: "1", name: "Amanda P.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-showing-her-fist-looking-front_114579-58458.jpg" },
{ id: "2", name: "Jessica W.", imageSrc: "http://img.b2bpic.net/free-photo/latin-young-woman-portrait-outdoor_624325-3345.jpg" },
{ id: "3", name: "Robert B.", imageSrc: "http://img.b2bpic.net/free-photo/business-executive-taking-break-from-work-texting-message-smartphone_1098-20733.jpg" },
{ id: "4", name: "Sofia G.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-hairdresser-with-hair-dryer-his-hands-hairstyle-woman-beauty-hair-professional-beauty-salon_231208-10937.jpg" },
{ id: "5", name: "Chloe M.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-pink-sweater-looking-camera-posing-high-quality-photo_114579-31514.jpg" },
]}
cardTitle="Client Stories"
cardTag="Reviews"
cardAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={false}
background={{ variant: "plain" }}
tag="Booking"
title="Ready for your new look?"
description="Schedule your appointment today to ensure you get your preferred slot at our salon."
buttons={[
{ text: "Contact Us Now", href: "mailto:hello@luminasalon.com" },
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Lumina"
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Terms of Service", href: "#" }}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}