Merge version_1 into main #1
578
src/app/page.tsx
578
src/app/page.tsx
@@ -30,456 +30,154 @@ 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: "Barbers",
|
||||
id: "#team",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "#pricing",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="Trnd Setters"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Barbers", id: "team" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Trnd Setters"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDoubleCarousel
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
title="Where Style Meets Confidence—Elevated"
|
||||
description="Mesa's most trusted barbershop for precision cuts and premium vibes. Every appointment is a transformation, not just a trim."
|
||||
leftCarouselItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-stylish-bearded-male-with-tattoo-arm-dressed-flannel-shirt-holding-juice-while-getting-haircut_613910-5727.jpg",
|
||||
imageAlt: "barbershop interior professional",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/tools-shaving-beard-desk_23-2148181852.jpg",
|
||||
imageAlt: "barber tools close up",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/washing-pet-dog-home_23-2149627216.jpg",
|
||||
imageAlt: "hot towel barber service",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-holding-face-oil-bottle_23-2148696678.jpg",
|
||||
imageAlt: "beard grooming professional",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-posing-black_176420-14764.jpg",
|
||||
imageAlt: "professional barber portrait",
|
||||
},
|
||||
]}
|
||||
rightCarouselItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-tattoo-artist-indoors_23-2149445991.jpg",
|
||||
imageAlt: "barber expert headshot",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/haircuting-process-small-dog-sits-table-dog-with-professional_1157-48813.jpg",
|
||||
imageAlt: "barber looking at camera",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-man-apron-holding-scissors-comb-making-stop-gesture-with-hands-standing-orange-background_141793-67572.jpg",
|
||||
imageAlt: "client haircut satisfied",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/elegant-young-handsome-man-studio-fashion-portrait_1301-3980.jpg",
|
||||
imageAlt: "man with fresh haircut",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-getting-his-hair-cut_23-2148256900.jpg",
|
||||
imageAlt: "barbershop interior professional",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Your Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-20134.jpg",
|
||||
alt: "Stylish man sitting in a barbershop",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/barber-using-blowdrier-style-his-client-s-hair_23-2149186485.jpg",
|
||||
alt: "Barber using a blowdrier to style his client's hair",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/side-view-customer-getting-haircut_23-2148256905.jpg",
|
||||
alt: "Side view customer getting a haircut",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-man-getting-haircut_23-2150665414.jpg",
|
||||
alt: "Medium shot man getting a haircut",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/bearded-man-getting-his-haircut-barber-s-shop_23-2149186488.jpg",
|
||||
alt: "Bearded man getting his haircut at the barber's shop",
|
||||
},
|
||||
]}
|
||||
avatarText="Join 500+ satisfied clients"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Precision Cuts",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Hot Towel Shaves",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Beard Sculpting",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Modern Grooming",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Luxury Experience",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDoubleCarousel
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Where Style Meets Confidence—Elevated"
|
||||
description="Mesa's most trusted barbershop for precision cuts and premium vibes. Every appointment is a transformation, not just a trim."
|
||||
leftCarouselItems={[{imageSrc:"http://img.b2bpic.net/free-photo/handsome-stylish-bearded-male-with-tattoo-arm-dressed-flannel-shirt-holding-juice-while-getting-haircut_613910-5727.jpg"}, {imageSrc:"http://img.b2bpic.net/free-photo/tools-shaving-beard-desk_23-2148181852.jpg"}, {imageSrc:"http://img.b2bpic.net/free-photo/washing-pet-dog-home_23-2149627216.jpg"}, {imageSrc:"http://img.b2bpic.net/free-photo/man-holding-face-oil-bottle_23-2148696678.jpg"}, {imageSrc:"http://img.b2bpic.net/free-photo/young-handsome-man-posing-black_176420-14764.jpg"}]}
|
||||
rightCarouselItems={[{imageSrc:"http://img.b2bpic.net/free-photo/medium-shot-smiley-tattoo-artist-indoors_23-2149445991.jpg"}, {imageSrc:"http://img.b2bpic.net/free-photo/haircuting-process-small-dog-sits-table-dog-with-professional_1157-48813.jpg"}, {imageSrc:"http://img.b2bpic.net/free-photo/barber-man-apron-holding-scissors-comb-making-stop-gesture-with-hands-standing-orange-background_141793-67572.jpg"}, {imageSrc:"http://img.b2bpic.net/free-photo/elegant-young-handsome-man-studio-fashion-portrait_1301-3980.jpg"}, {imageSrc:"http://img.b2bpic.net/free-photo/close-up-man-getting-his-hair-cut_23-2148256900.jpg"}]}
|
||||
buttons={[{ text: "Book Your Appointment", href: "#contact" }]}
|
||||
marqueeItems={[{type: "text", text: "Precision Cuts"}, {type: "text", text: "Hot Towel Shaves"}, {type: "text", text: "Beard Sculpting"}, {type: "text", text: "Modern Grooming"}, {type: "text", text: "Luxury Experience"}]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Elite Grooming by the Numbers"
|
||||
metrics={[
|
||||
{
|
||||
icon: Star,
|
||||
label: "Google Rating",
|
||||
value: "4.9",
|
||||
},
|
||||
{
|
||||
icon: MessageSquare,
|
||||
label: "Client Reviews",
|
||||
value: "450+",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
label: "Years in Business",
|
||||
value: "10+",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
title="Elite Grooming by the Numbers"
|
||||
metrics={[{ icon: Star, label: "Google Rating", value: "4.9" }, { icon: MessageSquare, label: "Client Reviews", value: "450+" }, { icon: Award, label: "Years in Business", value: "10+" }]}
|
||||
metricsAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Signature Fade",
|
||||
description: "Crisp, clean lines tailored to your face structure.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-hair-scissors-copy-space_23-2148352934.jpg",
|
||||
},
|
||||
{
|
||||
title: "Hot Towel Shave",
|
||||
description: "Relax with a traditional straight razor shave and hot towel.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/washing-pet-dog-home_23-2149627243.jpg",
|
||||
},
|
||||
{
|
||||
title: "Beard Sculpting",
|
||||
description: "Precision beard shaping and conditioning for a sharp look.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-priest-his-lunch-time_23-2149284677.jpg",
|
||||
},
|
||||
]}
|
||||
title="Precision Craftsmanship"
|
||||
description="Experience our signature services designed for the modern professional."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardThree
|
||||
animationType="slide-up"
|
||||
gridVariant="bento-grid"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Signature Fade", description: "Crisp, clean lines tailored to your face structure.", imageSrc: "http://img.b2bpic.net/free-photo/professional-hair-scissors-copy-space_23-2148352934.jpg" },
|
||||
{ title: "Hot Towel Shave", description: "Relax with a traditional straight razor shave and hot towel.", imageSrc: "http://img.b2bpic.net/free-photo/washing-pet-dog-home_23-2149627243.jpg" },
|
||||
{ title: "Beard Sculpting", description: "Precision beard shaping and conditioning for a sharp look.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-priest-his-lunch-time_23-2149284677.jpg" }
|
||||
]}
|
||||
title="Precision Craftsmanship"
|
||||
description="Experience our signature services designed for the modern professional."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{
|
||||
id: "m1",
|
||||
name: "Marcus",
|
||||
role: "Master Barber",
|
||||
description: "Specializing in classic fades and modern styling.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/brutal-bearded-male-with-crossed-arms-dressed-yellow-plaid-shirt_613910-1818.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
name: "Elena",
|
||||
role: "Style Consultant",
|
||||
description: "Expert in precision cuts and grooming advice.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-washing-dog_23-2149652688.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
name: "Julian",
|
||||
role: "Senior Barber",
|
||||
description: "Focusing on beard sculpting and sharp beard lines.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-artist-woman-holding-art-supplies-red-wall_114579-55994.jpg",
|
||||
},
|
||||
]}
|
||||
title="Meet Our Expert Barbers"
|
||||
description="Our team of master barbers is dedicated to your transformation."
|
||||
/>
|
||||
</div>
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardTwo
|
||||
animationType="slide-up"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{ id: "m1", name: "Marcus", role: "Master Barber", description: "Specializing in classic fades and modern styling.", imageSrc: "http://img.b2bpic.net/free-photo/brutal-bearded-male-with-crossed-arms-dressed-yellow-plaid-shirt_613910-1818.jpg" },
|
||||
{ id: "m2", name: "Elena", role: "Style Consultant", description: "Expert in precision cuts and grooming advice.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-washing-dog_23-2149652688.jpg" },
|
||||
{ id: "m3", name: "Julian", role: "Senior Barber", description: "Focusing on beard sculpting and sharp beard lines.", imageSrc: "http://img.b2bpic.net/free-photo/young-artist-woman-holding-art-supplies-red-wall_114579-55994.jpg" }
|
||||
]}
|
||||
title="Meet Our Expert Barbers"
|
||||
description="Our team of master barbers is dedicated to your transformation."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "James R.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205870.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "David K.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-blond-bearded-male-dressed-suit-sunglasses_613910-11921.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Michael S.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/sensitive-man-posing-studio-side-view_23-2149518229.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Brian L.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/funny-father-son-cooking_23-2148351749.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Aaron P.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work-close-up-nape_627829-7374.jpg",
|
||||
},
|
||||
]}
|
||||
cardTitle="What Our Clients Say"
|
||||
cardTag="4.9/5 Rating"
|
||||
cardAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={false}
|
||||
cardTitle="What Our Clients Say"
|
||||
cardTag="4.9/5 Rating"
|
||||
cardAnimation="blur-reveal"
|
||||
testimonials={[
|
||||
{ id: "t1", name: "James R.", imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205870.jpg" },
|
||||
{ id: "t2", name: "David K.", imageSrc: "http://img.b2bpic.net/free-photo/stylish-blond-bearded-male-dressed-suit-sunglasses_613910-11921.jpg" },
|
||||
{ id: "t3", name: "Michael S.", imageSrc: "http://img.b2bpic.net/free-photo/sensitive-man-posing-studio-side-view_23-2149518229.jpg" },
|
||||
{ id: "t4", name: "Brian L.", imageSrc: "http://img.b2bpic.net/free-photo/funny-father-son-cooking_23-2148351749.jpg" },
|
||||
{ id: "t5", name: "Aaron P.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work-close-up-nape_627829-7374.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "p1",
|
||||
badge: "Essential",
|
||||
price: "$35",
|
||||
subtitle: "Precision Cut",
|
||||
features: [
|
||||
"Consultation",
|
||||
"Expert Cut",
|
||||
"Hot Towel",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
badge: "Premium",
|
||||
price: "$55",
|
||||
subtitle: "Cut & Beard",
|
||||
features: [
|
||||
"Everything in Essential",
|
||||
"Beard Sculpting",
|
||||
"Style Refresh",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
badge: "Elite",
|
||||
price: "$80",
|
||||
subtitle: "Full Experience",
|
||||
features: [
|
||||
"Everything in Premium",
|
||||
"Straight Razor Shave",
|
||||
"Facial Treatment",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Grooming Investment"
|
||||
description="Choose the level of service that fits your style goals."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Grooming Investment"
|
||||
description="Choose the level of service that fits your style goals."
|
||||
plans={[
|
||||
{ id: "p1", badge: "Essential", price: "$35", subtitle: "Precision Cut", features: ["Consultation", "Expert Cut", "Hot Towel"], buttons: [{ text: "Book Now", href: "#contact" }] },
|
||||
{ id: "p2", badge: "Premium", price: "$55", subtitle: "Cut & Beard", features: ["Everything in Essential", "Beard Sculpting", "Style Refresh"], buttons: [{ text: "Book Now", href: "#contact" }] },
|
||||
{ id: "p3", badge: "Elite", price: "$80", subtitle: "Full Experience", features: ["Everything in Premium", "Straight Razor Shave", "Facial Treatment"], buttons: [{ text: "Book Now", href: "#contact" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="blog" data-section="blog">
|
||||
<BlogCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Shop Insights"
|
||||
description="Tips, trends, and grooming advice from our experts."
|
||||
blogs={[
|
||||
{
|
||||
id: "b1",
|
||||
category: "Trends",
|
||||
title: "2024 Hair Trends",
|
||||
excerpt: "The latest styles we're seeing in the shop this year.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-doing-beauty-vlog-home_23-2148916284.jpg",
|
||||
authorName: "Marcus",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/people-lifestyle-concept-handsome-confident-young-bearded-european-man-having-sly-smile-crossing-arms-his-chest-standing-wall-with-copyspace-your-promotional-content_343059-1693.jpg",
|
||||
date: "Oct 12",
|
||||
},
|
||||
{
|
||||
id: "b2",
|
||||
category: "Care",
|
||||
title: "Beard Maintenance",
|
||||
excerpt: "Keep your beard looking sharp with these daily tips.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hipster-style-bearded-man-black-shirt-studio-white-background_158595-1853.jpg",
|
||||
authorName: "Elena",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/confident-slavic-middle-aged-male-barber-uniform-grabbed-chin-isolated-purple-wall_141793-83564.jpg",
|
||||
date: "Oct 05",
|
||||
},
|
||||
{
|
||||
id: "b3",
|
||||
category: "Guide",
|
||||
title: "Choosing Your Cut",
|
||||
excerpt: "How to talk to your barber about the perfect style.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-hair-salon_23-2150665449.jpg",
|
||||
authorName: "Julian",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/young-gardener-woman-with-short-hair-apron-hat-holding-hedge-clippers-with-serious-face_141793-102431.jpg",
|
||||
date: "Sep 28",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="blog" data-section="blog">
|
||||
<BlogCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Shop Insights"
|
||||
description="Tips, trends, and grooming advice from our experts."
|
||||
blogs={[
|
||||
{ id: "b1", category: "Trends", title: "2024 Hair Trends", excerpt: "The latest styles we're seeing in the shop this year.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-doing-beauty-vlog-home_23-2148916284.jpg", authorName: "Marcus", authorAvatar: "http://img.b2bpic.net/free-photo/people-lifestyle-concept-handsome-confident-young-bearded-european-man-having-sly-smile-crossing-arms-his-chest-standing-wall-with-copyspace-your-promotional-content_343059-1693.jpg", date: "Oct 12" },
|
||||
{ id: "b2", category: "Care", title: "Beard Maintenance", excerpt: "Keep your beard looking sharp with these daily tips.", imageSrc: "http://img.b2bpic.net/free-photo/hipster-style-bearded-man-black-shirt-studio-white-background_158595-1853.jpg", authorName: "Elena", authorAvatar: "http://img.b2bpic.net/free-photo/confident-slavic-middle-aged-male-barber-uniform-grabbed-chin-isolated-purple-wall_141793-83564.jpg", date: "Oct 05" },
|
||||
{ id: "b3", category: "Guide", title: "Choosing Your Cut", excerpt: "How to talk to your barber about the perfect style.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-hair-salon_23-2150665449.jpg", authorName: "Julian", authorAvatar: "http://img.b2bpic.net/free-photo/young-gardener-woman-with-short-hair-apron-hat-holding-hedge-clippers-with-serious-face_141793-102431.jpg", date: "Sep 28" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Do I need an appointment?",
|
||||
content: "Yes, we prioritize appointments to ensure consistent quality and wait times.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "What's included in my haircut?",
|
||||
content: "A full consultation, wash, professional cut, and style.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "How often should I visit?",
|
||||
content: "Most clients find 2-4 weeks to be optimal to maintain a fresh look.",
|
||||
},
|
||||
]}
|
||||
sideTitle="Frequently Asked Questions"
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
sideTitle="Frequently Asked Questions"
|
||||
faqsAnimation="slide-up"
|
||||
faqs={[
|
||||
{ id: "f1", title: "Do I need an appointment?", content: "Yes, we prioritize appointments to ensure consistent quality and wait times." },
|
||||
{ id: "f2", title: "What's included in my haircut?", content: "A full consultation, wash, professional cut, and style." },
|
||||
{ id: "f3", title: "How often should I visit?", content: "Most clients find 2-4 weeks to be optimal to maintain a fresh look." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
tag="Book Now"
|
||||
title="Ready to Transform?"
|
||||
description="Secure your spot at Mesa's premier barbershop today."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "https://booking.example.com",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
tag="Book Now"
|
||||
title="Ready to Transform?"
|
||||
description="Secure your spot at Mesa's premier barbershop today."
|
||||
buttons={[{ text: "Book Appointment", href: "https://booking.example.com" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="Trnd Setters"
|
||||
columns={[
|
||||
{
|
||||
title: "Visit Us",
|
||||
items: [
|
||||
{
|
||||
label: "123 Main St, Mesa, AZ",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
{
|
||||
label: "Book Appointment",
|
||||
href: "https://booking.example.com",
|
||||
},
|
||||
{
|
||||
label: "Our Cuts",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Social",
|
||||
items: [
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Facebook",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="Trnd Setters"
|
||||
columns={[
|
||||
{ title: "Visit Us", items: [{ label: "123 Main St, Mesa, AZ", href: "#" }] },
|
||||
{ title: "Services", items: [{ label: "Book Appointment", href: "https://booking.example.com" }, { label: "Our Cuts", href: "#services" }] },
|
||||
{ title: "Social", items: [{ label: "Instagram", href: "#" }, { label: "Facebook", href: "#" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user