Merge version_1 into main #2
244
src/app/page.tsx
244
src/app/page.tsx
@@ -32,103 +32,64 @@ export default function LandingPage() {
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
name: "Services", id: "services"},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="Elite Barber"
|
||||
button={{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
text: "Book Now", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
variant: "gradient-bars"}}
|
||||
title="Premium Grooming Experience"
|
||||
description="Where tradition meets modern sophistication. Our master barbers provide an unparalleled grooming ritual tailored exclusively for you."
|
||||
kpis={[
|
||||
{
|
||||
value: "10+",
|
||||
label: "Years Experience",
|
||||
},
|
||||
value: "10+", label: "Years Experience"},
|
||||
{
|
||||
value: "5k+",
|
||||
label: "Happy Clients",
|
||||
},
|
||||
value: "5k+", label: "Happy Clients"},
|
||||
{
|
||||
value: "4.9",
|
||||
label: "Google Rating",
|
||||
},
|
||||
value: "4.9", label: "Google Rating"},
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Your Session",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Book Your Session", href: "#contact"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/side-view-leather-barber-shop-chair_23-2148242807.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/side-view-leather-barber-shop-chair_23-2148242807.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/barber-shop-retro-vintage-style_1150-17931.jpg",
|
||||
alt: "barber shop retro vintage style",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/barber-shop-retro-vintage-style_1150-17931.jpg", alt: "barber shop retro vintage style"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/male-hairdresser-combing-hair-senior-client_23-2148181882.jpg",
|
||||
alt: "Male hairdresser combing hair of senior client",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/male-hairdresser-combing-hair-senior-client_23-2148181882.jpg", alt: "Male hairdresser combing hair of senior client"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/high-angle-arrangement-with-scissors_23-2149007425.jpg",
|
||||
alt: "High angle arrangement with scissors",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/high-angle-arrangement-with-scissors_23-2149007425.jpg", alt: "High angle arrangement with scissors"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/luxury-coffee-shop-table-inside-barista-bar-generated-by-ai_188544-29280.jpg",
|
||||
alt: "Luxury coffee shop table inside barista bar generated by AI",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/luxury-coffee-shop-table-inside-barista-bar-generated-by-ai_188544-29280.jpg", alt: "Luxury coffee shop table inside barista bar generated by AI"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-asmr-recording_23-2149313884.jpg",
|
||||
alt: "Close up on asmr recording",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-asmr-recording_23-2149313884.jpg", alt: "Close up on asmr recording"},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Classic Cuts",
|
||||
},
|
||||
type: "text", text: "Classic Cuts"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Royal Shaving",
|
||||
},
|
||||
type: "text", text: "Royal Shaving"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Beard Styling",
|
||||
},
|
||||
type: "text", text: "Beard Styling"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Hot Towel Rituals",
|
||||
},
|
||||
type: "text", text: "Hot Towel Rituals"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Luxury Grooming",
|
||||
},
|
||||
type: "text", text: "Luxury Grooming"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -140,40 +101,22 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Precision Haircuts",
|
||||
description: "Classic and contemporary cuts tailored to your unique style and face structure.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-hairdresser-set-men_23-2148181986.jpg",
|
||||
},
|
||||
title: "Precision Haircuts", description: "Classic and contemporary cuts tailored to your unique style and face structure.", phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-hairdresser-set-men_23-2148181986.jpg"},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/tools-from-barbershop-wooden-background_1303-10375.jpg",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-leather-barber-shop-chair_23-2148242807.jpg?_wi=2",
|
||||
imageAlt: "professional haircut tool scissors",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/tools-from-barbershop-wooden-background_1303-10375.jpg"}
|
||||
},
|
||||
{
|
||||
title: "Royal Shave",
|
||||
description: "The ultimate classic ritual. Hot towel, straight razor, and expert precision for a flawless, irritation-free finish.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-20496.jpg",
|
||||
},
|
||||
title: "Royal Shave", description: "The ultimate classic ritual. Hot towel, straight razor, and expert precision for a flawless, irritation-free finish.", phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-20496.jpg"},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shaving-brush_53876-42040.jpg",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-styling-beard-man_23-2147778882.jpg",
|
||||
imageAlt: "professional haircut tool scissors",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shaving-brush_53876-42040.jpg"}
|
||||
},
|
||||
{
|
||||
title: "Beard Sculpting",
|
||||
description: "Perfectly defined lines, deep conditioning, and expert styling for the modern man's beard.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-barber-giving-his-client-nice-haircut_23-2149186489.jpg?_wi=1",
|
||||
},
|
||||
title: "Beard Sculpting", description: "Perfectly defined lines, deep conditioning, and expert styling for the modern man's beard.", phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-barber-giving-his-client-nice-haircut_23-2149186489.jpg"},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/faceless-woman-cutting-beard-man_23-2147778905.jpg",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/isolated-view-bald-caucasian-hipster-male-with-thick-bushy-beard-tattoo-raising-eyebrows-crossing-arms-chest-his-closed-posture-look-expressing-distrust-body-language_343059-1709.jpg?_wi=1",
|
||||
imageAlt: "professional haircut tool scissors",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/faceless-woman-cutting-beard-man_23-2147778905.jpg"}
|
||||
},
|
||||
]}
|
||||
showStepNumbers={true}
|
||||
@@ -189,55 +132,27 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "1",
|
||||
badge: "Essential",
|
||||
price: "€25",
|
||||
subtitle: "Expert haircut and styling.",
|
||||
features: [
|
||||
"Consultation",
|
||||
"Haircut",
|
||||
"Wash",
|
||||
"Styling",
|
||||
],
|
||||
id: "1", badge: "Essential", price: "€25", subtitle: "Expert haircut and styling.", features: [
|
||||
"Consultation", "Haircut", "Wash", "Styling"],
|
||||
buttons: [
|
||||
{
|
||||
text: "Select",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Select", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
badge: "Signature",
|
||||
price: "€35",
|
||||
subtitle: "Haircut plus royal shave.",
|
||||
features: [
|
||||
"Everything in Essential",
|
||||
"Hot Towel Shave",
|
||||
"Aftershave",
|
||||
],
|
||||
id: "2", badge: "Signature", price: "€35", subtitle: "Haircut plus royal shave.", features: [
|
||||
"Everything in Essential", "Hot Towel Shave", "Aftershave"],
|
||||
buttons: [
|
||||
{
|
||||
text: "Select",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Select", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
badge: "Master",
|
||||
price: "€45",
|
||||
subtitle: "Complete transformation.",
|
||||
features: [
|
||||
"Signature Package",
|
||||
"Beard Sculpting",
|
||||
"Deep Mask",
|
||||
],
|
||||
id: "3", badge: "Master", price: "€45", subtitle: "Complete transformation.", features: [
|
||||
"Signature Package", "Beard Sculpting", "Deep Mask"],
|
||||
buttons: [
|
||||
{
|
||||
text: "Select",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Select", href: "#contact"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
@@ -253,11 +168,9 @@ export default function LandingPage() {
|
||||
description="More than just a barbershop. We curate a space of relaxation, conversation, and refinement. Our goal is to ensure every man leaves feeling confident and renewed."
|
||||
buttons={[
|
||||
{
|
||||
text: "Learn More",
|
||||
href: "#about",
|
||||
},
|
||||
text: "Learn More", href: "#about"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/male-barber-giving-his-client-nice-haircut_23-2149186489.jpg?_wi=2"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/male-barber-giving-his-client-nice-haircut_23-2149186489.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -269,29 +182,13 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
members={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Alex",
|
||||
role: "Master Barber",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/isolated-view-bald-caucasian-hipster-male-with-thick-bushy-beard-tattoo-raising-eyebrows-crossing-arms-chest-his-closed-posture-look-expressing-distrust-body-language_343059-1709.jpg?_wi=2",
|
||||
},
|
||||
id: "t1", name: "Alex", role: "Master Barber", imageSrc: "http://img.b2bpic.net/free-photo/isolated-view-bald-caucasian-hipster-male-with-thick-bushy-beard-tattoo-raising-eyebrows-crossing-arms-chest-his-closed-posture-look-expressing-distrust-body-language_343059-1709.jpg"},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Marco",
|
||||
role: "Senior Stylist",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-putting-shaving-cream-elderly-client-beauty-salon_23-2148182015.jpg",
|
||||
},
|
||||
id: "t2", name: "Marco", role: "Senior Stylist", imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-putting-shaving-cream-elderly-client-beauty-salon_23-2148182015.jpg"},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Chris",
|
||||
role: "Beard Specialist",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-male-hairdresser-with-electric-trimmer_23-2147839779.jpg",
|
||||
},
|
||||
id: "t3", name: "Chris", role: "Beard Specialist", imageSrc: "http://img.b2bpic.net/free-photo/portrait-male-hairdresser-with-electric-trimmer_23-2147839779.jpg"},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David",
|
||||
role: "Creative Director",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/unpleased-looking-side-slavic-middle-aged-male-barber-uniform-holding-barber-tools-raising-hand-isolated-purple-wall_141793-90047.jpg",
|
||||
},
|
||||
id: "t4", name: "David", role: "Creative Director", imageSrc: "http://img.b2bpic.net/free-photo/unpleased-looking-side-slavic-middle-aged-male-barber-uniform-holding-barber-tools-raising-hand-isolated-purple-wall_141793-90047.jpg"},
|
||||
]}
|
||||
title="Meet The Masters"
|
||||
description="Our team of seasoned barbers brings unparalleled passion to every chair."
|
||||
@@ -303,30 +200,15 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "John Doe",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-attractive-woman-showing-thumb-up-outdoors_1262-12526.jpg",
|
||||
},
|
||||
id: "1", name: "John Doe", imageSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-attractive-woman-showing-thumb-up-outdoors_1262-12526.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Paul Smith",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/confident-young-male-barber-wearing-white-shirt-barber-apron-showing-comb-scissors-looking-pointing-camera-winking-isolated-blue-background_141793-138382.jpg",
|
||||
},
|
||||
id: "2", name: "Paul Smith", imageSrc: "http://img.b2bpic.net/free-photo/confident-young-male-barber-wearing-white-shirt-barber-apron-showing-comb-scissors-looking-pointing-camera-winking-isolated-blue-background_141793-138382.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Mark V.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/satisfied-male-customer-show-thumbs-up-smiling_176420-18690.jpg",
|
||||
},
|
||||
id: "3", name: "Mark V.", imageSrc: "http://img.b2bpic.net/free-photo/satisfied-male-customer-show-thumbs-up-smiling_176420-18690.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Lucas R.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-man-applying-shaving-cream_273609-21754.jpg",
|
||||
},
|
||||
id: "4", name: "Lucas R.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-man-applying-shaving-cream_273609-21754.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
name: "David K.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-kitchen-holding-cute-white-maltese-dog_1153-9862.jpg",
|
||||
},
|
||||
id: "5", name: "David K.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-kitchen-holding-cute-white-maltese-dog_1153-9862.jpg"},
|
||||
]}
|
||||
cardTitle="What Gentlemen Say"
|
||||
cardTag="Reviews"
|
||||
@@ -340,20 +222,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Do I need an appointment?",
|
||||
content: "While walk-ins are welcome if space is available, we highly recommend booking online.",
|
||||
},
|
||||
id: "1", title: "Do I need an appointment?", content: "While walk-ins are welcome if space is available, we highly recommend booking online."},
|
||||
{
|
||||
id: "2",
|
||||
title: "How long is a haircut?",
|
||||
content: "Our premium appointments typically last between 30 to 45 minutes.",
|
||||
},
|
||||
id: "2", title: "How long is a haircut?", content: "Our premium appointments typically last between 30 to 45 minutes."},
|
||||
{
|
||||
id: "3",
|
||||
title: "Are you open on weekends?",
|
||||
content: "Yes, we are open Saturday and Sunday for your convenience.",
|
||||
},
|
||||
id: "3", title: "Are you open on weekends?", content: "Yes, we are open Saturday and Sunday for your convenience."},
|
||||
]}
|
||||
title="Frequent Questions"
|
||||
description="All you need to know before your visit."
|
||||
@@ -365,8 +238,7 @@ export default function LandingPage() {
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
variant: "plain"}}
|
||||
tag="Booking"
|
||||
title="Schedule Your Ritual"
|
||||
description="Secure your preferred time slot online. We're looking forward to elevating your look."
|
||||
@@ -379,13 +251,9 @@ export default function LandingPage() {
|
||||
<FooterLogoReveal
|
||||
logoText="Elite Barber"
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
text: "Privacy Policy", href: "#"}}
|
||||
rightLink={{
|
||||
text: "Instagram",
|
||||
href: "https://instagram.com",
|
||||
}}
|
||||
text: "Instagram", href: "https://instagram.com"}}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
Reference in New Issue
Block a user