Merge version_1 into main #2
329
src/app/page.tsx
329
src/app/page.tsx
@@ -31,22 +31,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "home",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Team",
|
||||
id: "team",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "home" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Team", id: "team" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="ELITE BARBER"
|
||||
/>
|
||||
@@ -54,63 +42,24 @@ export default function LandingPage() {
|
||||
|
||||
<div id="home" data-section="home">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Timeless Precision, Modern Luxury."
|
||||
description="Experience the pinnacle of grooming. Our master barbers blend tradition with contemporary style in a refined, minimalist atmosphere designed exclusively for you."
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/spotlight-portrait-golden-hour_23-2151915127.jpg",
|
||||
alt: "Barber 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-plus-size-man-working-as-hairstylist_23-2150754690.jpg",
|
||||
alt: "Barber 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021799.jpg",
|
||||
alt: "Barber 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/indian-stylish-man-black-traditional-clothes-with-white-scarf-posed-outdoor-against-old-gates_627829-2537.jpg",
|
||||
alt: "Barber 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/man-white-outfits-acting-scene_114579-7647.jpg",
|
||||
alt: "Barber 5",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/spotlight-portrait-golden-hour_23-2151915127.jpg", alt: "Barber 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/medium-shot-plus-size-man-working-as-hairstylist_23-2150754690.jpg", alt: "Barber 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021799.jpg", alt: "Barber 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/indian-stylish-man-black-traditional-clothes-with-white-scarf-posed-outdoor-against-old-gates_627829-2537.jpg", alt: "Barber 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/man-white-outfits-acting-scene_114579-7647.jpg", alt: "Barber 5" },
|
||||
]}
|
||||
avatarText="Our Master Team"
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Book Appointment", href: "#contact" }]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Precision",
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Modern Luxury",
|
||||
icon: Star,
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Handcrafted",
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Master Barbers",
|
||||
icon: Scissors,
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Experience",
|
||||
},
|
||||
{ type: "text", text: "Precision" },
|
||||
{ type: "text-icon", text: "Modern Luxury", icon: Star },
|
||||
{ type: "text", text: "Handcrafted" },
|
||||
{ type: "text-icon", text: "Master Barbers", icon: Scissors },
|
||||
{ type: "text", text: "Experience" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -121,31 +70,11 @@ export default function LandingPage() {
|
||||
title="A Legacy of Grooming"
|
||||
tag="Excellence"
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "15+",
|
||||
description: "Years of Mastery",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "10k+",
|
||||
description: "Satisfied Clients",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "5",
|
||||
description: "Global Awards",
|
||||
},
|
||||
{
|
||||
id: "m4",
|
||||
value: "24/7",
|
||||
description: "Online Booking",
|
||||
},
|
||||
{
|
||||
id: "m5",
|
||||
value: "100%",
|
||||
description: "Client Satisfaction",
|
||||
},
|
||||
{ id: "m1", value: "15+", description: "Years of Mastery" },
|
||||
{ id: "m2", value: "10k+", description: "Satisfied Clients" },
|
||||
{ id: "m3", value: "5", description: "Global Awards" },
|
||||
{ id: "m4", value: "24/7", description: "Online Booking" },
|
||||
{ id: "m5", value: "100%", description: "Client Satisfaction" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -157,46 +86,11 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Signature Haircut",
|
||||
description: "A meticulous cut tailored to your hair texture and face shape.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Scissors,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-getting-haircut-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6388.jpg?_wi=1",
|
||||
imageAlt: "luxury barbershop interior minimalist",
|
||||
},
|
||||
{
|
||||
title: "Hot Towel Shave",
|
||||
description: "A traditional luxury experience that calms the senses.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Sparkles,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/unrecognizable-hairdresser-shaving-hair-customer_23-2147778754.jpg",
|
||||
imageAlt: "luxury barbershop interior minimalist",
|
||||
},
|
||||
{
|
||||
title: "Beard Sculpting",
|
||||
description: "Expert grooming and detailing to maintain a sharp, clean beard line.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Star,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-bathroom_23-2150323115.jpg",
|
||||
imageAlt: "luxury barbershop interior minimalist",
|
||||
},
|
||||
{
|
||||
title: "Scalp Massage",
|
||||
description: "Revitalizing scalp treatment to promote health and relaxation.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Sparkles,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/implements-hairdresser-towel_23-2148181921.jpg",
|
||||
imageAlt: "luxury barbershop interior minimalist",
|
||||
},
|
||||
{
|
||||
title: "Luxury Facial",
|
||||
description: "Refreshing skin treatment using premium men's skincare products.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: User,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/spotlight-portrait-golden-hour_23-2151915127.jpg",
|
||||
imageAlt: "luxury barbershop interior minimalist",
|
||||
},
|
||||
{ title: "Signature Haircut", description: "A meticulous cut tailored to your hair texture and face shape.", bentoComponent: "reveal-icon", icon: Scissors },
|
||||
{ title: "Hot Towel Shave", description: "A traditional luxury experience that calms the senses.", bentoComponent: "reveal-icon", icon: Sparkles },
|
||||
{ title: "Beard Sculpting", description: "Expert grooming and detailing to maintain a sharp, clean beard line.", bentoComponent: "reveal-icon", icon: Star },
|
||||
{ title: "Scalp Massage", description: "Revitalizing scalp treatment to promote health and relaxation.", bentoComponent: "reveal-icon", icon: Sparkles },
|
||||
{ title: "Luxury Facial", description: "Refreshing skin treatment using premium men's skincare products.", bentoComponent: "reveal-icon", icon: User },
|
||||
]}
|
||||
title="Curated Services"
|
||||
description="Indulge in a premium menu of grooming services tailored to your individual style and personality."
|
||||
@@ -209,49 +103,16 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
groups={[
|
||||
{
|
||||
id: "g1",
|
||||
groupTitle: "Leadership",
|
||||
members: [
|
||||
{
|
||||
id: "t1",
|
||||
title: "Marcus Thorne",
|
||||
subtitle: "Lead Barber",
|
||||
detail: "15 years of precision craft.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-with-tattoo-his-face-with-crossed-arms-dressed-white-shirt-grey-background_613910-1374.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
title: "James Sterling",
|
||||
subtitle: "Senior Stylist",
|
||||
detail: "Expert in modern fades.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-man-apron-holding-hair-brushes-spray-scissors-smiling-confused-standing-orange-wall_141793-61261.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
title: "Julian Vane",
|
||||
subtitle: "Master Groomer",
|
||||
detail: "Straight razor specialist.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-male-who-himself-shaving-while-sitting-barber-chair-hairdressing-salon_613910-18649.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
title: "Elena Rossi",
|
||||
subtitle: "Stylist",
|
||||
detail: "Contemporary beard design.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/spotlight-portrait-golden-hour_23-2151915116.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
title: "David Lee",
|
||||
subtitle: "Senior Barber",
|
||||
detail: "Traditional grooming expert.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/spotlight-portrait-golden-hour_23-2151915123.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-getting-haircut-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6388.jpg?_wi=2",
|
||||
imageAlt: "professional master barber portrait",
|
||||
id: "g1", groupTitle: "Leadership", members: [
|
||||
{ id: "t1", title: "Marcus Thorne", subtitle: "Lead Barber", detail: "15 years of precision craft.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-with-tattoo-his-face-with-crossed-arms-dressed-white-shirt-grey-background_613910-1374.jpg" },
|
||||
{ id: "t2", title: "James Sterling", subtitle: "Senior Stylist", detail: "Expert in modern fades.", imageSrc: "http://img.b2bpic.net/free-photo/barber-man-apron-holding-hair-brushes-spray-scissors-smiling-confused-standing-orange-wall_141793-61261.jpg" },
|
||||
{ id: "t3", title: "Julian Vane", subtitle: "Master Groomer", detail: "Straight razor specialist.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-male-who-himself-shaving-while-sitting-barber-chair-hairdressing-salon_613910-18649.jpg" },
|
||||
{ id: "t4", title: "Elena Rossi", subtitle: "Stylist", detail: "Contemporary beard design.", imageSrc: "http://img.b2bpic.net/free-photo/spotlight-portrait-golden-hour_23-2151915116.jpg" },
|
||||
{ id: "t5", title: "David Lee", subtitle: "Senior Barber", detail: "Traditional grooming expert.", imageSrc: "http://img.b2bpic.net/free-photo/spotlight-portrait-golden-hour_23-2151915123.jpg" },
|
||||
]
|
||||
},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
title="The Master Barbers"
|
||||
description="Our team of seasoned professionals dedicated to your impeccable presentation."
|
||||
/>
|
||||
@@ -263,41 +124,11 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Arthur J.",
|
||||
handle: "@arthurj",
|
||||
testimonial: "The best grooming experience I have ever had.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-bearded-male-dressed-suit-holds-vintage-8mm-video-camera_613910-1120.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael S.",
|
||||
handle: "@michaels",
|
||||
testimonial: "Sophisticated, clean, and masterfully executed.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/shaving-concept-with-attractive-young-man_23-2148121910.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "David W.",
|
||||
handle: "@davidw",
|
||||
testimonial: "An incredible atmosphere. Unmatched detail.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-young-man-posing-indoors_23-2149518285.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Richard P.",
|
||||
handle: "@richp",
|
||||
testimonial: "Luxury redefined. I never go anywhere else.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-charismatic-sensual-male-black-sweater-with-wet_613910-11146.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Thomas E.",
|
||||
handle: "@thome",
|
||||
testimonial: "Exceptional service every time I visit.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-black-studio-lights-background_158538-9662.jpg",
|
||||
},
|
||||
{ id: "1", name: "Arthur J.", handle: "@arthurj", testimonial: "The best grooming experience I have ever had.", imageSrc: "http://img.b2bpic.net/free-photo/stylish-bearded-male-dressed-suit-holds-vintage-8mm-video-camera_613910-1120.jpg" },
|
||||
{ id: "2", name: "Michael S.", handle: "@michaels", testimonial: "Sophisticated, clean, and masterfully executed.", imageSrc: "http://img.b2bpic.net/free-photo/shaving-concept-with-attractive-young-man_23-2148121910.jpg" },
|
||||
{ id: "3", name: "David W.", handle: "@davidw", testimonial: "An incredible atmosphere. Unmatched detail.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-young-man-posing-indoors_23-2149518285.jpg" },
|
||||
{ id: "4", name: "Richard P.", handle: "@richp", testimonial: "Luxury redefined. I never go anywhere else.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-charismatic-sensual-male-black-sweater-with-wet_613910-11146.jpg" },
|
||||
{ id: "5", name: "Thomas E.", handle: "@thome", testimonial: "Exceptional service every time I visit.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-black-studio-lights-background_158538-9662.jpg" },
|
||||
]}
|
||||
title="Client Reflections"
|
||||
description="Hear what our distinguished patrons have to say about their experience with us."
|
||||
@@ -308,31 +139,11 @@ export default function LandingPage() {
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Do I need to book in advance?",
|
||||
content: "We highly recommend booking in advance.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "What payment methods do you accept?",
|
||||
content: "All major credit cards accepted.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Is parking available?",
|
||||
content: "Yes, complimentary valet parking.",
|
||||
},
|
||||
{
|
||||
id: "f4",
|
||||
title: "Do you offer memberships?",
|
||||
content: "Yes, inquire about our VIP membership.",
|
||||
},
|
||||
{
|
||||
id: "f5",
|
||||
title: "Can I request a specific barber?",
|
||||
content: "Yes, bookings can be made by barber.",
|
||||
},
|
||||
{ id: "f1", title: "Do I need to book in advance?", content: "We highly recommend booking in advance." },
|
||||
{ id: "f2", title: "What payment methods do you accept?", content: "All major credit cards accepted." },
|
||||
{ id: "f3", title: "Is parking available?", content: "Yes, complimentary valet parking." },
|
||||
{ id: "f4", title: "Do you offer memberships?", content: "Yes, inquire about our VIP membership." },
|
||||
{ id: "f5", title: "Can I request a specific barber?", content: "Yes, bookings can be made by barber." },
|
||||
]}
|
||||
sideTitle="Expert Insights"
|
||||
sideDescription="Frequently asked questions to ensure a seamless experience."
|
||||
@@ -343,9 +154,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
title="Schedule Your Visit"
|
||||
description="Step into sophistication. Reach out to book your next session today."
|
||||
tag="Booking"
|
||||
@@ -356,46 +165,20 @@ export default function LandingPage() {
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Visit Us",
|
||||
items: [
|
||||
{
|
||||
label: "123 Grooming Lane, City",
|
||||
href: "#",
|
||||
},
|
||||
title: "Visit Us", items: [{ label: "123 Grooming Lane, City", href: "#" }],
|
||||
},
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "Haircuts", href: "#services" },
|
||||
{ label: "Shaving", href: "#services" },
|
||||
{ label: "Beard Grooming", href: "#services" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
{
|
||||
label: "Haircuts",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Shaving",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Beard Grooming",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "Team",
|
||||
href: "#team",
|
||||
},
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
title: "Company", items: [
|
||||
{ label: "Contact", href: "#contact" },
|
||||
{ label: "Team", href: "#team" },
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user