bender/35d17ea8-b94f-4aa8-acb0-72220acf4235
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-05-13 14:55:56 +00:00
parent e9d78edf84
commit db1f2db86f
1 changed files with 55 additions and 349 deletions
Download Patch File Download Diff File Expand all files Collapse all files

404
src/app/page.tsx
View File

@@ -13,7 +13,7 @@ import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TeamCardOne from '@/components/sections/team/TeamCardOne';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import { Award, Scissors, Users } from "lucide-react";
import { Award, Scissors, Users, Zap, Star } from "lucide-react";
export default function LandingPage() {
return (
@@ -33,22 +33,10 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "Services",
id: "features",
},
{
name: "Pricing",
id: "pricing",
},
{
name: "Contact",
id: "contact",
},
{ name: "Home", id: "hero" },
{ name: "Services", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "Contact", id: "contact" },
]}
brandName="LEGENDS"
/>
@@ -57,98 +45,31 @@ export default function LandingPage() {
<div id="hero" data-section="hero">
<HeroBillboardTestimonial
useInvertedBackground={true}
background={{
variant: "gradient-bars",
}}
background={{ variant: "gradient-bars" }}
title="Crafting Legends, One Cut at a Time."
description="Welcome to Legends Barbershop, where traditional technique meets modern precision. Experience the ultimate grooming experience tailored to your style."
testimonials={[
{
name: "James R.",
handle: "@jr_style",
testimonial: "Best haircut I've had in years. Legends never misses.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/modern-luxury-furniture-adorns-comfortable-home-interior-generated-by-ai_188544-29070.jpg?_wi=1",
imageAlt: "barber shop interior vintage style",
},
{
name: "Mike T.",
handle: "@miket",
testimonial: "The classic shave experience here is unmatched.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-gray-checkered-suit_158538-4205.jpg?_wi=1",
imageAlt: "barber shop interior vintage style",
},
{
name: "Chris B.",
handle: "@chrisb",
testimonial: "Super professional staff and great atmosphere.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/using-towel-beard-aged-male-barbershop_23-2148181892.jpg?_wi=1",
imageAlt: "barber shop interior vintage style",
},
{
name: "David L.",
handle: "@dl4life",
testimonial: "Finally found my permanent barber spot.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-items-spa-therapy_23-2148290933.jpg?_wi=1",
imageAlt: "barber shop interior vintage style",
},
{
name: "Alex P.",
handle: "@alexp",
testimonial: "Exceptional attention to detail. Highly recommend.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/crop-barber-trimming-moustache-client_23-2147778835.jpg?_wi=1",
imageAlt: "barber shop interior vintage style",
},
{ name: "James R.", handle: "@jr_style", testimonial: "Best haircut I've had in years. Legends never misses.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/modern-luxury-furniture-adorns-comfortable-home-interior-generated-by-ai_188544-29070.jpg", imageAlt: "barber shop interior vintage style" },
{ name: "Mike T.", handle: "@miket", testimonial: "The classic shave experience here is unmatched.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-gray-checkered-suit_158538-4205.jpg", imageAlt: "barber shop interior vintage style" },
{ name: "Chris B.", handle: "@chrisb", testimonial: "Super professional staff and great atmosphere.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/using-towel-beard-aged-male-barbershop_23-2148181892.jpg", imageAlt: "barber shop interior vintage style" },
{ name: "David L.", handle: "@dl4life", testimonial: "Finally found my permanent barber spot.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/high-angle-items-spa-therapy_23-2148290933.jpg", imageAlt: "barber shop interior vintage style" },
{ name: "Alex P.", handle: "@alexp", testimonial: "Exceptional attention to detail. Highly recommend.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/crop-barber-trimming-moustache-client_23-2147778835.jpg", imageAlt: "barber shop interior vintage style" }
]}
imageSrc="http://img.b2bpic.net/free-photo/modern-luxury-furniture-adorns-comfortable-home-interior-generated-by-ai_188544-29070.jpg?_wi=2"
imageSrc="http://img.b2bpic.net/free-photo/modern-luxury-furniture-adorns-comfortable-home-interior-generated-by-ai_188544-29070.jpg"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/front-view-baber-shop-chiar_23-2148506339.jpg",
alt: "Front view of baber shop chiar",
},
{
src: "http://img.b2bpic.net/free-photo/barbershop-washbasin-with-professional-chairs_23-2148298338.jpg",
alt: "Barbershop washbasin with professional chairs",
},
{
src: "http://img.b2bpic.net/free-photo/close-up-expensive-barber-shop-chair_23-2148256916.jpg",
alt: "Close-up expensive barber shop chair",
},
{
src: "http://img.b2bpic.net/free-photo/comfortable-old-fashioned-chair-rustic-antique-elegance-indoors-generated-by-ai_188544-29043.jpg",
alt: "Comfortable old fashioned chair",
},
{
src: "http://img.b2bpic.net/free-photo/barber-man-apron-holding-scissors-comb-making-stop-gesture-with-hands-standing-orange-background_141793-67572.jpg",
alt: "Barber man in apron",
},
{ src: "http://img.b2bpic.net/free-photo/front-view-baber-shop-chiar_23-2148506339.jpg", alt: "Front view of baber shop chiar" },
{ src: "http://img.b2bpic.net/free-photo/barbershop-washbasin-with-professional-chairs_23-2148298338.jpg", alt: "Barbershop washbasin with professional chairs" },
{ src: "http://img.b2bpic.net/free-photo/close-up-expensive-barber-shop-chair_23-2148256916.jpg", alt: "Close-up expensive barber shop chair" },
{ src: "http://img.b2bpic.net/free-photo/comfortable-old-fashioned-chair-rustic-antique-elegance-indoors-generated-by-ai_188544-29043.jpg", alt: "Comfortable old fashioned chair" },
{ src: "http://img.b2bpic.net/free-photo/barber-man-apron-holding-scissors-comb-making-stop-gesture-with-hands-standing-orange-background_141793-67572.jpg", alt: "Barber man in apron" }
]}
avatarText="Join 5,000+ satisfied clients"
marqueeItems={[
{
type: "text",
text: "PRECISION CUTS",
},
{
type: "text",
text: "TRADITIONAL SHAVES",
},
{
type: "text",
text: "MODERN GROOMING",
},
{
type: "text",
text: "PREMIUM CARE",
},
{
type: "text",
text: "LEGENDARY SERVICE",
},
{ type: "text", text: "PRECISION CUTS" },
{ type: "text", text: "TRADITIONAL SHAVES" },
{ type: "text", text: "MODERN GROOMING" },
{ type: "text", text: "PREMIUM CARE" },
{ type: "text", text: "LEGENDARY SERVICE" }
]}
/>
</div>
@@ -158,21 +79,9 @@ export default function LandingPage() {
useInvertedBackground={false}
title="Our Legacy"
metrics={[
{
icon: Award,
label: "Years Experience",
value: "15+",
},
{
icon: Users,
label: "Happy Clients",
value: "5000+",
},
{
icon: Scissors,
label: "Expert Barbers",
value: "8",
},
{ icon: Award, label: "Years Experience", value: "15+" },
{ icon: Users, label: "Happy Clients", value: "5000+" },
{ icon: Scissors, label: "Expert Barbers", value: "8" }
]}
metricsAnimation="slide-up"
/>
@@ -183,30 +92,10 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={true}
features={[
{
title: "Precision Cuts",
description: "Classic and modern styles customized to your hair texture.",
imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-gray-checkered-suit_158538-4205.jpg?_wi=2",
buttonIcon: "Scissors",
},
{
title: "Classic Shaves",
description: "Hot towel treatment and traditional straight razor shave.",
imageSrc: "http://img.b2bpic.net/free-photo/using-towel-beard-aged-male-barbershop_23-2148181892.jpg?_wi=2",
buttonIcon: "Zap",
},
{
title: "Premium Products",
description: "High-quality pomades, oils, and balms for home maintenance.",
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-items-spa-therapy_23-2148290933.jpg?_wi=2",
buttonIcon: "Star",
},
{
title: "Beard Sculpting",
description: "Professional beard shape-up and grooming for refined looks.",
imageSrc: "http://img.b2bpic.net/free-photo/crop-barber-trimming-moustache-client_23-2147778835.jpg?_wi=2",
buttonIcon: "Award",
},
{ title: "Precision Cuts", description: "Classic and modern styles customized to your hair texture.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-gray-checkered-suit_158538-4205.jpg", buttonIcon: Scissors },
{ title: "Classic Shaves", description: "Hot towel treatment and traditional straight razor shave.", imageSrc: "http://img.b2bpic.net/free-photo/using-towel-beard-aged-male-barbershop_23-2148181892.jpg", buttonIcon: Zap },
{ title: "Premium Products", description: "High-quality pomades, oils, and balms for home maintenance.", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-items-spa-therapy_23-2148290933.jpg", buttonIcon: Star },
{ title: "Beard Sculpting", description: "Professional beard shape-up and grooming for refined looks.", imageSrc: "http://img.b2bpic.net/free-photo/crop-barber-trimming-moustache-client_23-2147778835.jpg", buttonIcon: Award }
]}
title="Mastery in Every Service"
description="We specialize in precision grooming for the modern gentleman."
@@ -220,42 +109,12 @@ export default function LandingPage() {
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Signature Pomade",
price: "$25",
imageSrc: "http://img.b2bpic.net/free-photo/impressed-slavic-middle-aged-male-barber-uniform-holding-water-spray-bottle-isolated-orange-wall_141793-82847.jpg",
},
{
id: "p2",
name: "Beard Oil",
price: "$18",
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-bottle-oils-with-pipette_23-2148317664.jpg",
},
{
id: "p3",
name: "Barber Scissors",
price: "$85",
imageSrc: "http://img.b2bpic.net/free-photo/set-razors-table_23-2147736987.jpg",
},
{
id: "p4",
name: "Aftershave Balm",
price: "$22",
imageSrc: "http://img.b2bpic.net/free-photo/man-doing-his-face-care-routine_23-2149288066.jpg",
},
{
id: "p5",
name: "Shaving Brush",
price: "$30",
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-composition-shaving-objects_23-2148121997.jpg",
},
{
id: "p6",
name: "Styling Clay",
price: "$22",
imageSrc: "http://img.b2bpic.net/free-photo/containers-with-cosmetics_23-2147803536.jpg",
},
{ id: "p1", name: "Signature Pomade", price: "$25", imageSrc: "http://img.b2bpic.net/free-photo/impressed-slavic-middle-aged-male-barber-uniform-holding-water-spray-bottle-isolated-orange-wall_141793-82847.jpg" },
{ id: "p2", name: "Beard Oil", price: "$18", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-bottle-oils-with-pipette_23-2148317664.jpg" },
{ id: "p3", name: "Barber Scissors", price: "$85", imageSrc: "http://img.b2bpic.net/free-photo/set-razors-table_23-2147736987.jpg" },
{ id: "p4", name: "Aftershave Balm", price: "$22", imageSrc: "http://img.b2bpic.net/free-photo/man-doing-his-face-care-routine_23-2149288066.jpg" },
{ id: "p5", name: "Shaving Brush", price: "$30", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-composition-shaving-objects_23-2148121997.jpg" },
{ id: "p6", name: "Styling Clay", price: "$22", imageSrc: "http://img.b2bpic.net/free-photo/containers-with-cosmetics_23-2147803536.jpg" }
]}
title="Shop Our Essentials"
description="Professional products curated by our experts."
@@ -268,59 +127,9 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={true}
plans={[
{
id: "basic",
badge: "Essential",
price: "$35",
subtitle: "Precision Cut",
buttons: [
{
text: "Book Now",
href: "#contact",
},
],
features: [
"Consultation",
"Haircut",
"Style",
],
},
{
id: "pro",
badge: "Most Popular",
price: "$55",
subtitle: "Legends Experience",
buttons: [
{
text: "Book Now",
href: "#contact",
},
],
features: [
"Haircut & Shave",
"Beard Trim",
"Hot Towel",
"Premium Products",
],
},
{
id: "premium",
badge: "VIP",
price: "$75",
subtitle: "Ultimate Grooming",
buttons: [
{
text: "Book Now",
href: "#contact",
},
],
features: [
"Full Grooming",
"Scalp Massage",
"Face Treatment",
"Priority Booking",
],
},
{ id: "basic", badge: "Essential", price: "$35", subtitle: "Precision Cut", buttons: [{ text: "Book Now", href: "#contact" }], features: ["Consultation", "Haircut", "Style"] },
{ id: "pro", badge: "Most Popular", price: "$55", subtitle: "Legends Experience", buttons: [{ text: "Book Now", href: "#contact" }], features: ["Haircut & Shave", "Beard Trim", "Hot Towel", "Premium Products"] },
{ id: "premium", badge: "VIP", price: "$75", subtitle: "Ultimate Grooming", buttons: [{ text: "Book Now", href: "#contact" }], features: ["Full Grooming", "Scalp Massage", "Face Treatment", "Priority Booking"] }
]}
title="Transparent Pricing"
description="Choose the service that fits your needs."
@@ -334,24 +143,9 @@ export default function LandingPage() {
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
members={[
{
id: "m1",
name: "Marcus V.",
role: "Master Barber",
imageSrc: "http://img.b2bpic.net/free-photo/confident-young-caucasian-male-barber-wearing-glasses-wavy-hair-band-uniform-holding-hair-clippers-isolated-crimson-background-with-copy-space_141793-31955.jpg",
},
{
id: "m2",
name: "Daniel S.",
role: "Senior Stylist",
imageSrc: "http://img.b2bpic.net/free-photo/client-barber-greeting-each-other-barbershop_23-2148181951.jpg",
},
{
id: "m3",
name: "Leo C.",
role: "Barber Expert",
imageSrc: "http://img.b2bpic.net/free-photo/positive-bearded-black-male-with-tattoo-cross-arms-dressed-white-shirt_613910-15917.jpg",
},
{ id: "m1", name: "Marcus V.", role: "Master Barber", imageSrc: "http://img.b2bpic.net/free-photo/confident-young-caucasian-male-barber-wearing-glasses-wavy-hair-band-uniform-holding-hair-clippers-isolated-crimson-background-with-copy-space_141793-31955.jpg" },
{ id: "m2", name: "Daniel S.", role: "Senior Stylist", imageSrc: "http://img.b2bpic.net/free-photo/client-barber-greeting-each-other-barbershop_23-2148181951.jpg" },
{ id: "m3", name: "Leo C.", role: "Barber Expert", imageSrc: "http://img.b2bpic.net/free-photo/positive-bearded-black-male-with-tattoo-cross-arms-dressed-white-shirt_613910-15917.jpg" }
]}
title="Our Experts"
description="Meet the artisans behind the chair."
@@ -364,60 +158,16 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={true}
testimonials={[
{
id: "t1",
name: "Liam K.",
role: "Architect",
company: "DesignCo",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg",
},
{
id: "t2",
name: "Ethan M.",
role: "Consultant",
company: "BizLab",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-make-up-half-his-face-wearing-different-clothes_23-2148784403.jpg",
},
{
id: "t3",
name: "Noah J.",
role: "Designer",
company: "CreativeStudio",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/handsome-male-sitting-chair_329181-1673.jpg",
},
{
id: "t4",
name: "Mason T.",
role: "Executive",
company: "CorpGroup",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-sunbathed-fashion-man-model-wearing-white-shirt-clothes-posing-street_158538-2385.jpg",
},
{
id: "t5",
name: "Lucas P.",
role: "Tech Lead",
company: "Innovate",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/master-hairdresser-prepares-face-shaving-barber-shop_613910-6221.jpg",
},
{ id: "t1", name: "Liam K.", role: "Architect", company: "DesignCo", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg" },
{ id: "t2", name: "Ethan M.", role: "Consultant", company: "BizLab", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-make-up-half-his-face-wearing-different-clothes_23-2148784403.jpg" },
{ id: "t3", name: "Noah J.", role: "Designer", company: "CreativeStudio", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/handsome-male-sitting-chair_329181-1673.jpg" },
{ id: "t4", name: "Mason T.", role: "Executive", company: "CorpGroup", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-sunbathed-fashion-man-model-wearing-white-shirt-clothes-posing-street_158538-2385.jpg" },
{ id: "t5", name: "Lucas P.", role: "Tech Lead", company: "Innovate", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/master-hairdresser-prepares-face-shaving-barber-shop_613910-6221.jpg" }
]}
kpiItems={[
{
value: "4.9/5",
label: "Avg Rating",
},
{
value: "100+",
label: "Daily Clients",
},
{
value: "10k+",
label: "Cuts Per Year",
},
{ value: "4.9/5", label: "Avg Rating" },
{ value: "100+", label: "Daily Clients" },
{ value: "10k+", label: "Cuts Per Year" }
]}
title="Hear From Our Legends"
description="Join our community of satisfied clients."
@@ -428,21 +178,9 @@ export default function LandingPage() {
<FaqSplitText
useInvertedBackground={false}
faqs={[
{
id: "f1",
title: "Do I need an appointment?",
content: "We recommend booking ahead to guarantee your preferred time, but walk-ins are welcome if space is available.",
},
{
id: "f2",
title: "What payment methods are accepted?",
content: "We accept all major credit cards, digital wallets, and cash.",
},
{
id: "f3",
title: "Is parking available?",
content: "Yes, complimentary parking is available behind the shop for all our clients.",
},
{ id: "f1", title: "Do I need an appointment?", content: "We recommend booking ahead to guarantee your preferred time, but walk-ins are welcome if space is available." },
{ id: "f2", title: "What payment methods are accepted?", content: "We accept all major credit cards, digital wallets, and cash." },
{ id: "f3", title: "Is parking available?", content: "Yes, complimentary parking is available behind the shop for all our clients." }
]}
sideTitle="Questions?"
sideDescription="We've got you covered."
@@ -453,9 +191,7 @@ export default function LandingPage() {
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={true}
background={{
variant: "plain",
}}
background={{ variant: "plain" }}
tag="Visit Us"
title="Book Your Appointment"
description="Ready for a legendary transformation? Contact us today."
@@ -467,38 +203,8 @@ export default function LandingPage() {
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{
items: [
{
label: "Services",
href: "#features",
},
{
label: "Pricing",
href: "#pricing",
},
{
label: "Location",
href: "#contact",
},
],
},
{
items: [
{
label: "About",
href: "#about",
},
{
label: "FAQ",
href: "#faq",
},
{
label: "Contact",
href: "#contact",
},
],
},
{ items: [{ label: "Services", href: "#features" }, { label: "Pricing", href: "#pricing" }, { label: "Location", href: "#contact" }] },
{ items: [{ label: "About", href: "#about" }, { label: "FAQ", href: "#faq" }, { label: "Contact", href: "#contact" }] }
]}
logoText="LEGENDS"
/>