Merge version_2 into main #2
193
src/app/page.tsx
193
src/app/page.tsx
@@ -29,25 +29,15 @@ export default function LandingPage() {
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Services",
|
||||
id: "features",
|
||||
},
|
||||
name: "Services", id: "features"},
|
||||
{
|
||||
name: "Barbers",
|
||||
id: "team",
|
||||
},
|
||||
name: "Barbers", id: "team"},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
name: "Reviews", id: "testimonials"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="Trendsetters"
|
||||
/>
|
||||
@@ -56,71 +46,44 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
variant: "gradient-bars"}}
|
||||
title="Defining Modern Grooming"
|
||||
description="Trendsetters Barbershop brings you elite styling and precision grooming in an atmosphere that is as unique as your cut."
|
||||
kpis={[
|
||||
{
|
||||
value: "10k+",
|
||||
label: "Happy Clients",
|
||||
},
|
||||
value: "10k+", label: "Happy Clients"},
|
||||
{
|
||||
value: "15+",
|
||||
label: "Years Experience",
|
||||
},
|
||||
value: "15+", label: "Years Experience"},
|
||||
{
|
||||
value: "5.0",
|
||||
label: "Stars Rating",
|
||||
},
|
||||
value: "5.0", label: "Stars Rating"},
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/blonde-girl-getting-her-hair-done_23-2148108814.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/studio-portrait-bearded-male-dressed-blue-shirt-white-jacket-bow-tie-grey-background_613910-177.jpg",
|
||||
alt: "Marcus V.",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/studio-portrait-bearded-male-dressed-blue-shirt-white-jacket-bow-tie-grey-background_613910-177.jpg", alt: "Marcus V."},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/pleased-young-handsome-barber-wearing-uniform-holding-scissors-isolated-purple-wall_141793-94222.jpg",
|
||||
alt: "Julian D.",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/pleased-young-handsome-barber-wearing-uniform-holding-scissors-isolated-purple-wall_141793-94222.jpg", alt: "Julian D."},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-hairdresser-holding-hair-dryer_23-2149220573.jpg",
|
||||
alt: "Elena R.",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-hairdresser-holding-hair-dryer_23-2149220573.jpg", alt: "Elena R."},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/hipster-man-barber-shop-professional-hairdresser-uses-brush-almost-finished-hairstyle_613910-3886.jpg",
|
||||
alt: "Client",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/hipster-man-barber-shop-professional-hairdresser-uses-brush-almost-finished-hairstyle_613910-3886.jpg", alt: "Client"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205886.jpg",
|
||||
alt: "Client",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205886.jpg", alt: "Client"},
|
||||
]}
|
||||
avatarText="Join 10,000+ satisfied clients"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Fades",
|
||||
},
|
||||
type: "text", text: "Fades"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Hot Towel Shave",
|
||||
},
|
||||
type: "text", text: "Hot Towel Shave"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Beard Grooming",
|
||||
},
|
||||
type: "text", text: "Beard Grooming"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Taper",
|
||||
},
|
||||
type: "text", text: "Taper"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Classic Cuts",
|
||||
},
|
||||
type: "text", text: "Classic Cuts"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -132,28 +95,13 @@ export default function LandingPage() {
|
||||
features={[
|
||||
{
|
||||
id: 1,
|
||||
tag: "Precision",
|
||||
title: "Precision Cuts",
|
||||
subtitle: "Taper, Fade, Classic",
|
||||
description: "Expertly executed cuts for every hair type.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-with-tools-barbers_1163-715.jpg",
|
||||
},
|
||||
tag: "Precision", title: "Precision Cuts", subtitle: "Taper, Fade, Classic", description: "Expertly executed cuts for every hair type.", imageSrc: "http://img.b2bpic.net/free-photo/woman-with-tools-barbers_1163-715.jpg"},
|
||||
{
|
||||
id: 2,
|
||||
tag: "Relax",
|
||||
title: "Hot Towel Shave",
|
||||
subtitle: "Luxury Experience",
|
||||
description: "The ultimate relaxation with essential oils.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-tattooed-male-barber-cuts-beard-black-male_613910-8611.jpg",
|
||||
},
|
||||
tag: "Relax", title: "Hot Towel Shave", subtitle: "Luxury Experience", description: "The ultimate relaxation with essential oils.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-tattooed-male-barber-cuts-beard-black-male_613910-8611.jpg"},
|
||||
{
|
||||
id: 3,
|
||||
tag: "Style",
|
||||
title: "Beard Grooming",
|
||||
subtitle: "Sculpt & Trim",
|
||||
description: "Detailed shaping for a professional finish.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-sitting-chair-hairdresser-with-client-guy-drinkig-whiskey_1157-43567.jpg",
|
||||
},
|
||||
tag: "Style", title: "Beard Grooming", subtitle: "Sculpt & Trim", description: "Detailed shaping for a professional finish.", imageSrc: "http://img.b2bpic.net/free-photo/man-sitting-chair-hairdresser-with-client-guy-drinkig-whiskey_1157-43567.jpg"},
|
||||
]}
|
||||
title="Our Signature Services"
|
||||
description="Premium grooming solutions tailored for the modern man."
|
||||
@@ -167,23 +115,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
team={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Marcus V.",
|
||||
role: "Head Barber",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-bearded-male-dressed-blue-shirt-white-jacket-bow-tie-grey-background_613910-177.jpg?_wi=1",
|
||||
},
|
||||
id: "1", name: "Marcus V.", role: "Head Barber", imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-bearded-male-dressed-blue-shirt-white-jacket-bow-tie-grey-background_613910-177.jpg?_wi=1"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Julian D.",
|
||||
role: "Master Stylist",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-handsome-barber-wearing-uniform-holding-scissors-isolated-purple-wall_141793-94222.jpg",
|
||||
},
|
||||
id: "2", name: "Julian D.", role: "Master Stylist", imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-handsome-barber-wearing-uniform-holding-scissors-isolated-purple-wall_141793-94222.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Elena R.",
|
||||
role: "Grooming Specialist",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-holding-hair-dryer_23-2149220573.jpg",
|
||||
},
|
||||
id: "3", name: "Elena R.", role: "Grooming Specialist", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-holding-hair-dryer_23-2149220573.jpg"},
|
||||
]}
|
||||
title="Meet The Masters"
|
||||
description="Our team of seasoned professionals dedicated to your style."
|
||||
@@ -198,45 +134,20 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alex River",
|
||||
role: "Regular",
|
||||
company: "Client",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hipster-man-barber-shop-professional-hairdresser-uses-brush-almost-finished-hairstyle_613910-3886.jpg",
|
||||
},
|
||||
id: "1", name: "Alex River", role: "Regular", company: "Client", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hipster-man-barber-shop-professional-hairdresser-uses-brush-almost-finished-hairstyle_613910-3886.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Sam Thorne",
|
||||
role: "Regular",
|
||||
company: "Client",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205886.jpg",
|
||||
},
|
||||
id: "2", name: "Sam Thorne", role: "Regular", company: "Client", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205886.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Chris B.",
|
||||
role: "Regular",
|
||||
company: "Client",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-having-hair-shaved-by-crop-barber_23-2147778769.jpg",
|
||||
},
|
||||
id: "3", name: "Chris B.", role: "Regular", company: "Client", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-having-hair-shaved-by-crop-barber_23-2147778769.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
name: "David W.",
|
||||
role: "Regular",
|
||||
company: "Client",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-friends-dinner-party_23-2150648835.jpg",
|
||||
},
|
||||
id: "4", name: "David W.", role: "Regular", company: "Client", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-friends-dinner-party_23-2150648835.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
name: "James L.",
|
||||
role: "New Client",
|
||||
company: "Client",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-bearded-male-dressed-blue-shirt-white-jacket-bow-tie-grey-background_613910-177.jpg?_wi=2",
|
||||
},
|
||||
id: "5", name: "James L.", role: "New Client", company: "Client", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-bearded-male-dressed-blue-shirt-white-jacket-bow-tie-grey-background_613910-177.jpg?_wi=2"},
|
||||
]}
|
||||
title="What They Say"
|
||||
description="Trusted by our community to deliver excellence every time."
|
||||
@@ -247,14 +158,11 @@ export default function LandingPage() {
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
variant: "sparkles-gradient"}}
|
||||
text="Ready for your next cut? Book an appointment now and join the trendsetters."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#",
|
||||
},
|
||||
text: "Book Now", href: "#"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -264,34 +172,23 @@ export default function LandingPage() {
|
||||
logoText="Trendsetters"
|
||||
columns={[
|
||||
{
|
||||
title: "Visit Us",
|
||||
items: [
|
||||
title: "Visit Us", items: [
|
||||
{
|
||||
label: "123 Main St, City",
|
||||
href: "#",
|
||||
},
|
||||
label: "123 Main St, City", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Social",
|
||||
items: [
|
||||
title: "Social", items: [
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "#",
|
||||
},
|
||||
label: "Instagram", href: "#"},
|
||||
{
|
||||
label: "Facebook",
|
||||
href: "#",
|
||||
},
|
||||
label: "Facebook", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
title: "Legal", items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
label: "Privacy Policy", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
@@ -300,4 +197,4 @@ export default function LandingPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -12,13 +12,13 @@
|
||||
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--foreground: #f5f5f5;
|
||||
--primary-cta: #dfff1c;
|
||||
--foreground: #ffffffe6;
|
||||
--primary-cta: #e6e6e6;
|
||||
--primary-cta-text: #0a0a0a;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta-text: #ffffff;
|
||||
--accent: #8b9a1b;
|
||||
--background-accent: #5d6b00;
|
||||
--accent: #737373;
|
||||
--background-accent: #737373;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user