Merge version_1 into main #2
228
src/app/page.tsx
228
src/app/page.tsx
@@ -31,22 +31,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "pricing",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Vladimir Barbershop"
|
||||
/>
|
||||
@@ -54,78 +42,32 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "downward-rays-animated",
|
||||
}}
|
||||
background={{ variant: "downward-rays-animated" }}
|
||||
title="Vladimir Barbershop: Premium Grooming for the Modern Man"
|
||||
description="Experience the art of the perfect cut. Expert craftsmanship meets a refined atmosphere in the heart of the city."
|
||||
kpis={[
|
||||
{
|
||||
value: "10+",
|
||||
label: "Years Experience",
|
||||
},
|
||||
{
|
||||
value: "5k+",
|
||||
label: "Satisfied Clients",
|
||||
},
|
||||
{
|
||||
value: "4.9★",
|
||||
label: "Average Rating",
|
||||
},
|
||||
{ value: "10+", label: "Years Experience" },
|
||||
{ value: "5k+", label: "Satisfied Clients" },
|
||||
{ value: "4.9★", label: "Average Rating" },
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/master-hairdresser-prepares-face-shaving-barber-shop_613910-6221.jpg?_wi=1"
|
||||
buttons={[{ text: "Book Appointment", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/master-hairdresser-prepares-face-shaving-barber-shop_613910-6221.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-bearded-young-man-sitting-cafe-using-mobile-phone_23-2148176693.jpg",
|
||||
alt: "Portrait of a bearded young man",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/crop-barber-styling-beard-customer_23-2147778885.jpg",
|
||||
alt: "Barber styling beard",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/crop-barber-shaving-hair-unrecognizable-man_23-2147778749.jpg",
|
||||
alt: "Barber shaving client",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg",
|
||||
alt: "Barber applying cream",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-satisfied-bearded-guy-white-shirt-showing-thumbs-up-approval-like-agree-positive-answer_1258-26715.jpg",
|
||||
alt: "Satisfied guy",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-bearded-young-man-sitting-cafe-using-mobile-phone_23-2148176693.jpg", alt: "Portrait of a bearded young man" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/crop-barber-styling-beard-customer_23-2147778885.jpg", alt: "Barber styling beard" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/crop-barber-shaving-hair-unrecognizable-man_23-2147778749.jpg", alt: "Barber shaving client" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", alt: "Barber applying cream" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-satisfied-bearded-guy-white-shirt-showing-thumbs-up-approval-like-agree-positive-answer_1258-26715.jpg", alt: "Satisfied guy" },
|
||||
]}
|
||||
avatarText="Trusted by 5,000+ men"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Precision Cuts",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Hot Towel Shaves",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Beard Sculpting",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Executive Grooming",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Classic Atmosphere",
|
||||
},
|
||||
{ type: "text", text: "Precision Cuts" },
|
||||
{ type: "text", text: "Hot Towel Shaves" },
|
||||
{ type: "text", text: "Beard Sculpting" },
|
||||
{ type: "text", text: "Executive Grooming" },
|
||||
{ type: "text", text: "Classic Atmosphere" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -149,21 +91,9 @@ export default function LandingPage() {
|
||||
title="Signature Services"
|
||||
description="We offer a curated selection of grooming treatments designed to keep you looking your best."
|
||||
accordionItems={[
|
||||
{
|
||||
id: "s1",
|
||||
title: "Precision Cut",
|
||||
content: "A tailored haircut focused on structure, texture, and your unique face shape.",
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
title: "Hot Towel Shave",
|
||||
content: "Indulge in a classic hot towel shave, featuring premium oils and precision blades.",
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
title: "Beard Sculpting",
|
||||
content: "Professional beard maintenance to keep your facial hair perfectly shaped and hydrated.",
|
||||
},
|
||||
{ id: "s1", title: "Precision Cut", content: "A tailored haircut focused on structure, texture, and your unique face shape." },
|
||||
{ id: "s2", title: "Hot Towel Shave", content: "Indulge in a classic hot towel shave, featuring premium oils and precision blades." },
|
||||
{ id: "s3", title: "Beard Sculpting", content: "Professional beard maintenance to keep your facial hair perfectly shaped and hydrated." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/hairstyle-supplies_1157-7704.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
@@ -177,33 +107,17 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
groups={[
|
||||
{
|
||||
id: "g1",
|
||||
groupTitle: "Leadership",
|
||||
members: [
|
||||
id: "g1", groupTitle: "Leadership", members: [
|
||||
{
|
||||
id: "m1",
|
||||
title: "Vladimir",
|
||||
subtitle: "Lead Barber & Founder",
|
||||
detail: "15 years of experience.",
|
||||
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: "m1", title: "Vladimir", subtitle: "Lead Barber & Founder", detail: "15 years of experience.", 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: "m2",
|
||||
title: "Alex",
|
||||
subtitle: "Senior Stylist",
|
||||
detail: "Precision cutting specialist.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bearded-male-with-tattooed-arms-wearing-top-hat_613910-1508.jpg",
|
||||
id: "m2", title: "Alex", subtitle: "Senior Stylist", detail: "Precision cutting specialist.", imageSrc: "http://img.b2bpic.net/free-photo/bearded-male-with-tattooed-arms-wearing-top-hat_613910-1508.jpg"
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
title: "Dimitri",
|
||||
subtitle: "Grooming Expert",
|
||||
detail: "Beard and shave artist.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-bearded-male-dressed-blue-shirt-white-jacket-bow-tie-grey-background_613910-177.jpg",
|
||||
id: "m3", title: "Dimitri", subtitle: "Grooming Expert", detail: "Beard and shave artist.", imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-bearded-male-dressed-blue-shirt-white-jacket-bow-tie-grey-background_613910-177.jpg"
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/master-hairdresser-prepares-face-shaving-barber-shop_613910-6221.jpg?_wi=2",
|
||||
imageAlt: "professional male barber headshot",
|
||||
]
|
||||
},
|
||||
]}
|
||||
title="Our Master Barbers"
|
||||
@@ -216,46 +130,11 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
title: "Exceptional",
|
||||
quote: "The best haircut in town.",
|
||||
name: "Mark D.",
|
||||
role: "Professional",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-man-bachelor-party-laughing_23-2149275479.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
title: "A True Ritual",
|
||||
quote: "The hot towel shave is a must.",
|
||||
name: "James L.",
|
||||
role: "Finance Executive",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-handsome-male-barber-uniform-holding-out-straight-razor-camera-isolated-blue_141793-73815.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
title: "Consistent Quality",
|
||||
quote: "Consistently perfect.",
|
||||
name: "Robert S.",
|
||||
role: "Entrepreneur",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-woman-getting-haircut_23-2148817196.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
title: "Top Tier",
|
||||
quote: "Incredible attention to detail.",
|
||||
name: "Thomas K.",
|
||||
role: "Designer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-braiding-hair-woman_23-2147784501.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
title: "The Gold Standard",
|
||||
quote: "Simply the best.",
|
||||
name: "Viktor R.",
|
||||
role: "Developer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bearded-man-black-t-shirt-happy-excited-showing-thumbs-up-standing-green-wall_141793-81905.jpg",
|
||||
},
|
||||
{ id: "t1", title: "Exceptional", quote: "The best haircut in town.", name: "Mark D.", role: "Professional", imageSrc: "http://img.b2bpic.net/free-photo/happy-man-bachelor-party-laughing_23-2149275479.jpg" },
|
||||
{ id: "t2", title: "A True Ritual", quote: "The hot towel shave is a must.", name: "James L.", role: "Finance Executive", imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-handsome-male-barber-uniform-holding-out-straight-razor-camera-isolated-blue_141793-73815.jpg" },
|
||||
{ id: "t3", title: "Consistent Quality", quote: "Consistently perfect.", name: "Robert S.", role: "Entrepreneur", imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-woman-getting-haircut_23-2148817196.jpg" },
|
||||
{ id: "t4", title: "Top Tier", quote: "Incredible attention to detail.", name: "Thomas K.", role: "Designer", imageSrc: "http://img.b2bpic.net/free-photo/woman-braiding-hair-woman_23-2147784501.jpg" },
|
||||
{ id: "t5", title: "The Gold Standard", quote: "Simply the best.", name: "Viktor R.", role: "Developer", imageSrc: "http://img.b2bpic.net/free-photo/bearded-man-black-t-shirt-happy-excited-showing-thumbs-up-standing-green-wall_141793-81905.jpg" },
|
||||
]}
|
||||
title="Client Experience"
|
||||
description="Hear from the gentlemen who trust us."
|
||||
@@ -269,37 +148,13 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "p1",
|
||||
badge: "Popular",
|
||||
price: "$45",
|
||||
subtitle: "Precision Cut",
|
||||
features: [
|
||||
"Style Consultation",
|
||||
"Wash & Cut",
|
||||
"Hot Neck Shave",
|
||||
],
|
||||
id: "p1", badge: "Popular", price: "$45", subtitle: "Precision Cut", features: ["Style Consultation", "Wash & Cut", "Hot Neck Shave"]
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
badge: "Essential",
|
||||
price: "$30",
|
||||
subtitle: "Beard Trim",
|
||||
features: [
|
||||
"Shape & Line Up",
|
||||
"Beard Oil Treatment",
|
||||
"Precision Detail",
|
||||
],
|
||||
id: "p2", badge: "Essential", price: "$30", subtitle: "Beard Trim", features: ["Shape & Line Up", "Beard Oil Treatment", "Precision Detail"]
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
badge: "Premium",
|
||||
price: "$75",
|
||||
subtitle: "Signature Service",
|
||||
features: [
|
||||
"Full Cut",
|
||||
"Hot Towel Shave",
|
||||
"Face Massage",
|
||||
],
|
||||
id: "p3", badge: "Premium", price: "$75", subtitle: "Signature Service", features: ["Full Cut", "Hot Towel Shave", "Face Massage"]
|
||||
},
|
||||
]}
|
||||
title="Investment in Yourself"
|
||||
@@ -310,18 +165,11 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
tag="Visit Us"
|
||||
title="Ready for a Refresh?"
|
||||
description="Book your slot today."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Your Appointment",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Book Your Appointment", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user