Merge version_1 into main #2
245
src/app/page.tsx
245
src/app/page.tsx
@@ -31,22 +31,14 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Team",
|
||||
id: "team",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Team", id: "team" },
|
||||
{ name: "Testimonials", id: "testimonial" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="Exclusive Barbers"
|
||||
/>
|
||||
@@ -54,18 +46,11 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
title="Mastering the Art of Grooming"
|
||||
description="Experience the pinnacle of precision and style. Exclusive Barbers delivers professional grooming tailored to your unique identity."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-21713.jpg?_wi=1"
|
||||
buttons={[{ text: "Book Appointment", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-21713.jpg"
|
||||
imageAlt="Luxurious barbershop interior with barber station"
|
||||
/>
|
||||
</div>
|
||||
@@ -77,18 +62,9 @@ export default function LandingPage() {
|
||||
title="A Legacy of Refinement"
|
||||
description="Founded on the principles of classic tradition and modern technique, Exclusive Barbers is more than a shop—it is a space for the modern gentleman."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Precision Cuts",
|
||||
description: "Expertly executed styles with attention to detail.",
|
||||
},
|
||||
{
|
||||
title: "Traditional Hot Towel",
|
||||
description: "Revitalizing experience with classic techniques.",
|
||||
},
|
||||
{
|
||||
title: "Premium Products",
|
||||
description: "High-quality formulations for your hair and skin.",
|
||||
},
|
||||
{ title: "Precision Cuts", description: "Expertly executed styles with attention to detail." },
|
||||
{ title: "Traditional Hot Towel", description: "Revitalizing experience with classic techniques." },
|
||||
{ title: "Premium Products", description: "High-quality formulations for your hair and skin." }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/hair-salon-chair-with-towel-armchair_23-2148242777.jpg"
|
||||
imageAlt="Traditional shaving tools on wood table"
|
||||
@@ -101,20 +77,8 @@ export default function LandingPage() {
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
negativeCard={{
|
||||
items: [
|
||||
"Generic chain shop quality",
|
||||
"Rush service appointments",
|
||||
"Standard mass-market products",
|
||||
],
|
||||
}}
|
||||
positiveCard={{
|
||||
items: [
|
||||
"Artisanal barber craft",
|
||||
"Uninterrupted personal attention",
|
||||
"Custom premium hair solutions",
|
||||
],
|
||||
}}
|
||||
negativeCard={{ items: ["Generic chain shop quality", "Rush service appointments", "Standard mass-market products"] }}
|
||||
positiveCard={{ items: ["Artisanal barber craft", "Uninterrupted personal attention", "Custom premium hair solutions"] }}
|
||||
title="Beyond the Trim"
|
||||
description="Why choose Exclusive Barbers for your grooming needs."
|
||||
/>
|
||||
@@ -126,54 +90,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "s1",
|
||||
name: "Signature Cut",
|
||||
price: "$45",
|
||||
features: [
|
||||
"Consultation",
|
||||
"Haircut",
|
||||
"Style",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
name: "The Executive Shave",
|
||||
price: "$55",
|
||||
features: [
|
||||
"Hot Towel",
|
||||
"Straight Razor",
|
||||
"Skincare",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
name: "The Full Experience",
|
||||
price: "$90",
|
||||
features: [
|
||||
"Signature Cut",
|
||||
"Executive Shave",
|
||||
"Scalp Massage",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ id: "s1", name: "Signature Cut", price: "$45", features: ["Consultation", "Haircut", "Style"], buttons: [{ text: "Book", href: "#contact" }] },
|
||||
{ id: "s2", name: "The Executive Shave", price: "$55", features: ["Hot Towel", "Straight Razor", "Skincare"], buttons: [{ text: "Book", href: "#contact" }] },
|
||||
{ id: "s3", name: "The Full Experience", price: "$90", features: ["Signature Cut", "Executive Shave", "Scalp Massage"], buttons: [{ text: "Book", href: "#contact" }] }
|
||||
]}
|
||||
title="Services & Pricing"
|
||||
description="Invest in your presentation."
|
||||
@@ -187,34 +106,12 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
groups={[
|
||||
{
|
||||
id: "g1",
|
||||
groupTitle: "Lead Barbers",
|
||||
members: [
|
||||
{
|
||||
id: "m1",
|
||||
title: "Marcus V.",
|
||||
subtitle: "Master Barber",
|
||||
detail: "15 years of precision experience.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-getting-his-beard-shaved-with-razor_107420-94799.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
title: "James C.",
|
||||
subtitle: "Senior Stylist",
|
||||
detail: "Specialist in modern fades.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-posing-with-crossed-arms-brick-wall_176420-14690.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
title: "Lucas R.",
|
||||
subtitle: "Grooming Specialist",
|
||||
detail: "Expert in traditional straight razor shaves.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/groomed-bearded-man-with-tattooes-is-posing-dark-photo-studio_613910-15016.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-21713.jpg?_wi=2",
|
||||
imageAlt: "professional male barber portrait",
|
||||
},
|
||||
id: "g1", groupTitle: "Lead Barbers", members: [
|
||||
{ id: "m1", title: "Marcus V.", subtitle: "Master Barber", detail: "15 years of precision experience.", imageSrc: "http://img.b2bpic.net/free-photo/man-getting-his-beard-shaved-with-razor_107420-94799.jpg" },
|
||||
{ id: "m2", title: "James C.", subtitle: "Senior Stylist", detail: "Specialist in modern fades.", imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-posing-with-crossed-arms-brick-wall_176420-14690.jpg" },
|
||||
{ id: "m3", title: "Lucas R.", subtitle: "Grooming Specialist", detail: "Expert in traditional straight razor shaves.", imageSrc: "http://img.b2bpic.net/free-photo/groomed-bearded-man-with-tattooes-is-posing-dark-photo-studio_613910-15016.jpg" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
title="Meet Your Barbers"
|
||||
description="Artisans dedicated to the craft of grooming."
|
||||
@@ -227,60 +124,16 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Robert B.",
|
||||
role: "CEO",
|
||||
company: "Global Corp",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/successful-young-man-stylish-hat-relaxing-alone-cozy-cafeteria-lunch-break-looking-with-happy-expression_273609-1935.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "David W.",
|
||||
role: "Architect",
|
||||
company: "BuildStudio",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-stylish-woman-talking-phone-outdoors_23-2148777577.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Thomas L.",
|
||||
role: "Consultant",
|
||||
company: "Strategy Inc",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-elegant-bearded-man-dressed-wool-jacket-bow-tie_613910-3110.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Alex K.",
|
||||
role: "Entrepreneur",
|
||||
company: "StartUp",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/positive-blond-bearded-male-dressed-plaid-shirt-denim-jacket-posing-grey-vignette-background_613910-11770.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "John D.",
|
||||
role: "Finance",
|
||||
company: "Bankers Group",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-attractive-man-posing-tropical-location-background-palm-trees-greenery_1321-1421.jpg",
|
||||
},
|
||||
{ id: "1", name: "Robert B.", role: "CEO", company: "Global Corp", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/successful-young-man-stylish-hat-relaxing-alone-cozy-cafeteria-lunch-break-looking-with-happy-expression_273609-1935.jpg" },
|
||||
{ id: "2", name: "David W.", role: "Architect", company: "BuildStudio", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiley-stylish-woman-talking-phone-outdoors_23-2148777577.jpg" },
|
||||
{ id: "3", name: "Thomas L.", role: "Consultant", company: "Strategy Inc", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-elegant-bearded-man-dressed-wool-jacket-bow-tie_613910-3110.jpg" },
|
||||
{ id: "4", name: "Alex K.", role: "Entrepreneur", company: "StartUp", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/positive-blond-bearded-male-dressed-plaid-shirt-denim-jacket-posing-grey-vignette-background_613910-11770.jpg" },
|
||||
{ id: "5", name: "John D.", role: "Finance", company: "Bankers Group", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-attractive-man-posing-tropical-location-background-palm-trees-greenery_1321-1421.jpg" }
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "100%",
|
||||
label: "Client Satisfaction",
|
||||
},
|
||||
{
|
||||
value: "500+",
|
||||
label: "Five-Star Reviews",
|
||||
},
|
||||
{
|
||||
value: "10y",
|
||||
label: "Experience",
|
||||
},
|
||||
{ value: "100%", label: "Client Satisfaction" },
|
||||
{ value: "500+", label: "Five-Star Reviews" },
|
||||
{ value: "10y", label: "Experience" }
|
||||
]}
|
||||
title="Client Experience"
|
||||
description="What our guests say."
|
||||
@@ -292,21 +145,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Do I need an appointment?",
|
||||
content: "Yes, we prioritize scheduled visits to ensure quality time.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Do you accept walk-ins?",
|
||||
content: "We occasionally accommodate walk-ins depending on availability.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "What products do you use?",
|
||||
content: "We use only premium, all-natural barbering products.",
|
||||
},
|
||||
{ id: "f1", title: "Do I need an appointment?", content: "Yes, we prioritize scheduled visits to ensure quality time." },
|
||||
{ id: "f2", title: "Do you accept walk-ins?", content: "We occasionally accommodate walk-ins depending on availability." },
|
||||
{ id: "f3", title: "What products do you use?", content: "We use only premium, all-natural barbering products." }
|
||||
]}
|
||||
title="Frequently Asked"
|
||||
description="Common questions about your visit."
|
||||
@@ -317,9 +158,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Appointments"
|
||||
title="Secure Your Slot"
|
||||
description="Book your premium experience today."
|
||||
@@ -329,14 +168,8 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Exclusive Barbers"
|
||||
leftLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
leftLink={{ text: "Terms of Service", href: "#" }}
|
||||
rightLink={{ text: "Privacy Policy", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
Reference in New Issue
Block a user