Merge version_1 into main #2
339
src/app/page.tsx
339
src/app/page.tsx
@@ -26,262 +26,101 @@ export default function LandingPage() {
|
||||
headingFontWeight="light"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "#hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "#services",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "#reviews",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="Wild Hair"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "#hero" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Services", id: "#services" },
|
||||
{ name: "Reviews", id: "#reviews" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="Wild Hair"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardTestimonial
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Transform Your Hair. Transform Yourself."
|
||||
description="Award-winning stylists. Bespoke care. Wildly unforgettable results."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Elena R.",
|
||||
handle: "@elena_styl",
|
||||
testimonial: "The best transformation I've ever had. Truly luxurious experience.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg?_wi=1",
|
||||
imageAlt: "luxury hair salon interior gold theme",
|
||||
},
|
||||
{
|
||||
name: "Marcus D.",
|
||||
handle: "@m.d_style",
|
||||
testimonial: "Wild Hair turned my style around completely. Edgy and professional.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/surprised-woman-with-messy-bun-holding-brushes_114579-31213.jpg?_wi=1",
|
||||
imageAlt: "professional hairdresser smiling portrait",
|
||||
},
|
||||
{
|
||||
name: "Sarah J.",
|
||||
handle: "@sarah_j",
|
||||
testimonial: "Bespoke care and the artistry here is just unmatched.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-getting-her-hair-dyed-by-hairdresser-home_23-2148817230.jpg",
|
||||
imageAlt: "luxury haircut styling professional",
|
||||
},
|
||||
{
|
||||
name: "Chloe L.",
|
||||
handle: "@chloel",
|
||||
testimonial: "Professional, clean, and so creative. I feel like a model!",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg?_wi=2",
|
||||
imageAlt: "luxury hair salon interior gold theme",
|
||||
},
|
||||
{
|
||||
name: "David K.",
|
||||
handle: "@d_king",
|
||||
testimonial: "A touch of bold creativity in every cut. Highly recommended.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/surprised-woman-with-messy-bun-holding-brushes_114579-31213.jpg?_wi=2",
|
||||
imageAlt: "professional hairdresser smiling portrait",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "See Our Services",
|
||||
href: "#services",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg?_wi=3"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg",
|
||||
alt: "Client 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg",
|
||||
alt: "Client 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg",
|
||||
alt: "Client 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg",
|
||||
alt: "Client 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg",
|
||||
alt: "Client 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Join 500+ satisfied clients"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Voted #1 Luxury Salon",
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Sustainable Products",
|
||||
icon: Leaf,
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Master Stylists",
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Bespoke Coloring",
|
||||
icon: Sparkles,
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Unforgettable Results",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardTestimonial
|
||||
useInvertedBackground={true}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Transform Your Hair. Transform Yourself."
|
||||
description="Award-winning stylists. Bespoke care. Wildly unforgettable results."
|
||||
testimonials={[
|
||||
{ name: "Elena R.", handle: "@elena_styl", testimonial: "The best transformation I've ever had. Truly luxurious experience.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg", imageAlt: "luxury hair salon interior gold theme" },
|
||||
{ name: "Marcus D.", handle: "@m.d_style", testimonial: "Wild Hair turned my style around completely. Edgy and professional.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/surprised-woman-with-messy-bun-holding-brushes_114579-31213.jpg", imageAlt: "professional hairdresser smiling portrait" },
|
||||
{ name: "Sarah J.", handle: "@sarah_j", testimonial: "Bespoke care and the artistry here is just unmatched.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-getting-her-hair-dyed-by-hairdresser-home_23-2148817230.jpg", imageAlt: "luxury haircut styling professional" },
|
||||
{ name: "Chloe L.", handle: "@chloel", testimonial: "Professional, clean, and so creative. I feel like a model!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg", imageAlt: "luxury hair salon interior gold theme" },
|
||||
{ name: "David K.", handle: "@d_king", testimonial: "A touch of bold creativity in every cut. Highly recommended.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/surprised-woman-with-messy-bun-holding-brushes_114579-31213.jpg", imageAlt: "professional hairdresser smiling portrait" },
|
||||
]}
|
||||
buttons={[
|
||||
{ text: "Book Now", href: "#contact" },
|
||||
{ text: "See Our Services", href: "#services" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg"
|
||||
avatars={Array(5).fill({ src: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg", alt: "Client" })}
|
||||
avatarText="Join 500+ satisfied clients"
|
||||
marqueeItems={[
|
||||
{ type: "text", text: "Voted #1 Luxury Salon" },
|
||||
{ type: "text-icon", text: "Sustainable Products", icon: Leaf },
|
||||
{ type: "text", text: "Master Stylists" },
|
||||
{ type: "text-icon", text: "Bespoke Coloring", icon: Sparkles },
|
||||
{ type: "text", text: "Unforgettable Results" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Luxury Meets Artistry"
|
||||
description="At Wild Hair, we believe hair is more than style – it’s expression. Our expert team crafts individualized transformations with premium products and precision artistry."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/surprised-woman-with-messy-bun-holding-brushes_114579-31213.jpg?_wi=3"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Luxury Meets Artistry"
|
||||
description="At Wild Hair, we believe hair is more than style – it’s expression. Our expert team crafts individualized transformations with premium products and precision artistry."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/surprised-woman-with-messy-bun-holding-brushes_114579-31213.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentyEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "s1",
|
||||
title: "Haircuts & Styling",
|
||||
subtitle: "From $120",
|
||||
category: "Styling",
|
||||
value: "Precision cuts and modern finishing.",
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
title: "Coloring & Highlights",
|
||||
subtitle: "From $250",
|
||||
category: "Color",
|
||||
value: "Bespoke color artistry and balayage.",
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
title: "Treatments & Extensions",
|
||||
subtitle: "From $300",
|
||||
category: "Care",
|
||||
value: "Luxury extensions and restorative care.",
|
||||
},
|
||||
]}
|
||||
title="Our Signature Services"
|
||||
description="Expertly curated salon experiences for your unique self."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentyEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ id: "s1", title: "Haircuts & Styling", subtitle: "From $120", category: "Styling", value: "Precision cuts and modern finishing." },
|
||||
{ id: "s2", title: "Coloring & Highlights", subtitle: "From $250", category: "Color", value: "Bespoke color artistry and balayage." },
|
||||
{ id: "s3", title: "Treatments & Extensions", subtitle: "From $300", category: "Care", value: "Luxury extensions and restorative care." },
|
||||
]}
|
||||
title="Our Signature Services"
|
||||
description="Expertly curated salon experiences for your unique self."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="reviews" data-section="reviews">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah Johnson",
|
||||
role: "Client",
|
||||
company: "Local Leader",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg?_wi=4",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Michael Chen",
|
||||
role: "Client",
|
||||
company: "Tech Professional",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg?_wi=5",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Emily Rodriguez",
|
||||
role: "Client",
|
||||
company: "Creative Director",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg?_wi=6",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David Kim",
|
||||
role: "Client",
|
||||
company: "Entrepreneur",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg?_wi=7",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Jessica Lee",
|
||||
role: "Client",
|
||||
company: "Influencer",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg?_wi=8",
|
||||
},
|
||||
]}
|
||||
title="Loved by Our Clients"
|
||||
description="Rated 4.9 across over 70 reviews."
|
||||
/>
|
||||
</div>
|
||||
<div id="reviews" data-section="reviews">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
testimonials={Array(5).fill({ id: "t", name: "Client", role: "Client", company: "Wild Hair", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg" })}
|
||||
title="Loved by Our Clients"
|
||||
description="Rated 4.9 across over 70 reviews."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
text="Ready for your transformation? Book your luxury experience with Wild Hair today."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Consultation",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={true}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
text="Ready for your transformation? Book your luxury experience with Wild Hair today."
|
||||
buttons={[{ text: "Book Consultation", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Wild Hair"
|
||||
copyrightText="© 2025 Wild Hair Salon. All Rights Reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Wild Hair"
|
||||
copyrightText="© 2025 Wild Hair Salon. All Rights Reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user