Merge version_1 into main #2
402
src/app/page.tsx
402
src/app/page.tsx
@@ -28,285 +28,147 @@ export default function LandingPage() {
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Team",
|
||||
id: "team",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Lumina Salon"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Team", id: "team" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Lumina Salon"
|
||||
button={{ text: "Book Appointment", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
logoText="Lumina Salon"
|
||||
description="Experience premium hair care tailored for you. Professional styling and wellness in a calm, modern environment."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "View Services",
|
||||
href: "#services",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/vintage-sink-decoration-with-vintage-style_1150-10826.jpg?_wi=1"
|
||||
imageAlt="Luxurious hair salon interior"
|
||||
mediaAnimation="opacity"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{ variant: "plain" }}
|
||||
logoText="Lumina Salon"
|
||||
description="Experience premium hair care tailored for you. Professional styling and wellness in a calm, modern environment."
|
||||
buttons={[
|
||||
{ text: "Book Appointment", href: "#contact" },
|
||||
{ text: "View Services", href: "#services" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/vintage-sink-decoration-with-vintage-style_1150-10826.jpg"
|
||||
imageAlt="Luxurious hair salon interior"
|
||||
mediaAnimation="opacity"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={true}
|
||||
heading={[
|
||||
{
|
||||
type: "text",
|
||||
content: "Our Passion for Beauty",
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/round-hair-brushes_23-2147711530.jpg",
|
||||
alt: "Stylist at work",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={true}
|
||||
heading={[
|
||||
{ type: "text", content: "Our Passion for Beauty" },
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/round-hair-brushes_23-2147711530.jpg", alt: "Stylist at work" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Expert Stylists",
|
||||
tags: [
|
||||
"certified",
|
||||
],
|
||||
description: "Highly trained team",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/winter-season-lodging-entrance_482257-103218.jpg",
|
||||
imageAlt: "Winter season lodging entrance",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Organic Products",
|
||||
tags: [
|
||||
"premium",
|
||||
],
|
||||
description: "Safe, gentle care",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vintage-sink-decoration-with-vintage-style_1150-10826.jpg?_wi=2",
|
||||
imageAlt: "Winter season lodging entrance",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Modern Studio",
|
||||
tags: [
|
||||
"relaxed",
|
||||
],
|
||||
description: "Calming ambiance",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/round-hair-brushes_23-2147711530.jpg",
|
||||
imageAlt: "Winter season lodging entrance",
|
||||
},
|
||||
]}
|
||||
title="Why Choose Us"
|
||||
description="We blend professional expertise with a welcoming atmosphere to provide an exceptional salon experience."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "f1", title: "Expert Stylists", tags: ["certified"], imageSrc: "http://img.b2bpic.net/free-photo/winter-season-lodging-entrance_482257-103218.jpg", imageAlt: "Winter season lodging entrance" },
|
||||
{ id: "f2", title: "Organic Products", tags: ["premium"], imageSrc: "http://img.b2bpic.net/free-photo/vintage-sink-decoration-with-vintage-style_1150-10826.jpg", imageAlt: "Winter season lodging entrance" },
|
||||
{ id: "f3", title: "Modern Studio", tags: ["relaxed"], imageSrc: "http://img.b2bpic.net/free-photo/round-hair-brushes_23-2147711530.jpg", imageAlt: "Winter season lodging entrance" },
|
||||
]}
|
||||
title="Why Choose Us"
|
||||
description="We blend professional expertise with a welcoming atmosphere to provide an exceptional salon experience."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<PricingCardFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "basic",
|
||||
tag: "Popular",
|
||||
price: "$65",
|
||||
period: "/ session",
|
||||
description: "Professional haircut & wash",
|
||||
button: {
|
||||
text: "Book Now",
|
||||
},
|
||||
featuresTitle: "Includes:",
|
||||
features: [
|
||||
"Consultation",
|
||||
"Precision Cut",
|
||||
"Style Blow-dry",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "pro",
|
||||
tag: "Premium",
|
||||
price: "$120",
|
||||
period: "/ session",
|
||||
description: "Color, cut & treatment",
|
||||
button: {
|
||||
text: "Book Now",
|
||||
},
|
||||
featuresTitle: "Includes:",
|
||||
features: [
|
||||
"Color Treatment",
|
||||
"Deep Conditioning",
|
||||
"Precision Cut",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Our Services"
|
||||
description="Premium hair care offerings to help you look your best."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<PricingCardFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "basic", tag: "Popular", price: "$65", period: "/ session", description: "Professional haircut & wash", button: { text: "Book Now" },
|
||||
featuresTitle: "Includes:", features: ["Consultation", "Precision Cut", "Style Blow-dry"],
|
||||
},
|
||||
{
|
||||
id: "pro", tag: "Premium", price: "$120", period: "/ session", description: "Color, cut & treatment", button: { text: "Book Now" },
|
||||
featuresTitle: "Includes:", features: ["Color Treatment", "Deep Conditioning", "Precision Cut"],
|
||||
},
|
||||
]}
|
||||
title="Our Services"
|
||||
description="Premium hair care offerings to help you look your best."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah Miller",
|
||||
role: "Senior Stylist",
|
||||
description: "10 years experience",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/redhead-female-supervisor-dressed-elegant-suit-grey-background_613910-10390.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "David Chen",
|
||||
role: "Colorist",
|
||||
description: "Creative expert",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-s-with-blue-eyes-portrait_633478-325.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Elena Ross",
|
||||
role: "Studio Director",
|
||||
description: "Luxury hair specialist",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pleased-looking-down-young-beautiful-female-barber-uniform-wearing-glasses-combing-hair-isolated-blue-wall_141793-106074.jpg",
|
||||
},
|
||||
]}
|
||||
title="Meet Our Stylists"
|
||||
description="Our team of skilled professionals is here to bring your vision to life."
|
||||
/>
|
||||
</div>
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{ id: "t1", name: "Sarah Miller", role: "Senior Stylist", description: "10 years experience", imageSrc: "http://img.b2bpic.net/free-photo/redhead-female-supervisor-dressed-elegant-suit-grey-background_613910-10390.jpg" },
|
||||
{ id: "t2", name: "David Chen", role: "Colorist", description: "Creative expert", imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-s-with-blue-eyes-portrait_633478-325.jpg" },
|
||||
{ id: "t3", name: "Elena Ross", role: "Studio Director", description: "Luxury hair specialist", imageSrc: "http://img.b2bpic.net/free-photo/pleased-looking-down-young-beautiful-female-barber-uniform-wearing-glasses-combing-hair-isolated-blue-wall_141793-106074.jpg" },
|
||||
]}
|
||||
title="Meet Our Stylists"
|
||||
description="Our team of skilled professionals is here to bring your vision to life."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardFifteen
|
||||
useInvertedBackground={true}
|
||||
testimonial="Lumina Salon provides the most relaxing service I've ever had. Highly recommend!"
|
||||
rating={5}
|
||||
author="Jessica Reed"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/hairdresser-taking-care-her-client_23-2149319771.jpg",
|
||||
alt: "Client 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-portrait-blue-eyed-romantic-girl-playing-with-wavy-hair-winsome-tanned-female-model_197531-9118.jpg",
|
||||
alt: "Client 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/master-white-gloves-doing-professional-make-up-young-woman_231208-3526.jpg",
|
||||
alt: "Client 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-businesswoman-black-suit-playing-with-her-hair-while-talking-phone_114579-14175.jpg",
|
||||
alt: "Client 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/friendly-young-interracial-girls-good-mood-wear-nightgowns-pajama-party-leisure-lifestyle-beauty-concept_197531-31732.jpg",
|
||||
alt: "Client 5",
|
||||
},
|
||||
]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardFifteen
|
||||
useInvertedBackground={true}
|
||||
testimonial="Lumina Salon provides the most relaxing service I've ever had. Highly recommend!"
|
||||
rating={5}
|
||||
author="Jessica Reed"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/hairdresser-taking-care-her-client_23-2149319771.jpg", alt: "Client 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-portrait-blue-eyed-romantic-girl-playing-with-wavy-hair-winsome-tanned-female-model_197531-9118.jpg", alt: "Client 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/master-white-gloves-doing-professional-make-up-young-woman_231208-3526.jpg", alt: "Client 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-businesswoman-black-suit-playing-with-her-hair-while-talking-phone_114579-14175.jpg", alt: "Client 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/friendly-young-interracial-girls-good-mood-wear-nightgowns-pajama-party-leisure-lifestyle-beauty-concept_197531-31732.jpg", alt: "Client 5" },
|
||||
]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Do I need to book in advance?",
|
||||
content: "Yes, we recommend booking 1 week prior.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Are products organic?",
|
||||
content: "We use 100% natural and organic products.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Is parking available?",
|
||||
content: "Yes, free parking is available nearby.",
|
||||
},
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Get quick answers to questions you might have about our services."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "q1", title: "Do I need to book in advance?", content: "Yes, we recommend booking 1 week prior." },
|
||||
{ id: "q2", title: "Are products organic?", content: "We use 100% natural and organic products." },
|
||||
{ id: "q3", title: "Is parking available?", content: "Yes, free parking is available nearby." },
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Get quick answers to questions you might have about our services."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Let's Connect"
|
||||
title="Ready for a new look?"
|
||||
description="Book your appointment today at our beautiful studio in downtown."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "tel:55501020",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Let's Connect"
|
||||
title="Ready for a new look?"
|
||||
description="Book your appointment today at our beautiful studio in downtown."
|
||||
buttons={[{ text: "Book Now", href: "tel:55501020" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Lumina Salon"
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Lumina Salon"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Terms of Service", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user