bender/35069a9c-d47a-4ddb-baef-0337e5705f49
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: bender:version_2
Branches Tags
bender:main bender:version_4 bender:version_3 bender:version_2 bender:version_1
..
compare: bender:version_3
Branches Tags
bender:main bender:version_4 bender:version_3 bender:version_2 bender:version_1

4 Commits
version_2 ... version_3

Author SHA1 Message Date
bender
8ffaa4199b Update src/app/page.tsx 2026-05-12 19:56:06 +00:00
bender
0a9ae4f293 Update src/app/page.tsx 2026-05-12 19:55:37 +00:00
bender
514c8ac597 Merge version_2 into main 
Merge version_2 into main
 2026-05-12 19:49:49 +00:00
bender
210799f042 Merge version_2 into main 
Merge version_2 into main
 2026-05-12 19:49:25 +00:00
1 changed files with 60 additions and 146 deletions
Expand all files Collapse all files

206
src/app/page.tsx
View File

@@ -30,82 +30,33 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "About", id: "about"},
{
name: "Services", id: "services"},
{
name: "Testimonials", id: "testimonials"},
{
name: "Book Now", id: "contact"},
{ name: "About", id: "about" },
{ name: "Services", id: "services" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Book Now", id: "contact" },
]}
brandName="Darlene's"
brandName="Rockledge Barber Shop"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitDoubleCarousel
background={{
variant: "gradient-bars"}}
title="The Barber You Finally Trust."
description="Precision cuts, genuine conversation, and a welcoming chair for the whole family."
background={{ variant: "gradient-bars" }}
title="Precision Cuts. Classic Style."
description="Experience professional grooming in a welcoming, comfortable environment. Rockledge Barber Shop provides the finest cuts and shaves."
leftCarouselItems={[
{
imageSrc: "https://img.b2bpic.net/free-photo/modern-luxury-furniture-adorns-comfortable-home-interior-generated-by-ai_188544-29070.jpg", imageAlt: "Barber shop atmosphere 1"},
{
imageSrc: "https://img.b2bpic.net/free-photo/barber-equipment-working-surface-by-mirror-barbershop_627829-8282.jpg", imageAlt: "Barber shop atmosphere 2"},
{
imageSrc: "https://img.b2bpic.net/free-photo/retro-world-theatre-day-scenes-with-backstage_23-2151211363.jpg", imageAlt: "Barber shop atmosphere 3"},
{
imageSrc: "https://img.b2bpic.net/free-photo/woman-grooming-man-s-beard-professional-barber-shop-close-up_23-2148353420.jpg", imageAlt: "Barber shop atmosphere 4"},
{
imageSrc: "https://img.b2bpic.net/free-photo/hairdressing-chair-vintage-barber-shop_23-2148298304.jpg", imageAlt: "Barber shop atmosphere 5"},
{
imageSrc: "https://img.b2bpic.net/free-photo/smiling-barber-man-holding-clipper-client-hair-salon_23-2148560055.jpg", imageAlt: "Barber shop atmosphere 6"},
{ imageSrc: "https://img.b2bpic.net/free-photo/barber-giving-haircut-man_23-2149186458.jpg", imageAlt: "Professional barber cutting hair" },
{ imageSrc: "https://img.b2bpic.net/free-photo/close-up-man-getting-his-hair-trimmed_23-2148256979.jpg", imageAlt: "Hair trimming detail" },
{ imageSrc: "https://img.b2bpic.net/free-photo/barber-using-clippers-customer-hair_23-2148560055.jpg", imageAlt: "Barber using equipment" },
]}
rightCarouselItems={[
{
imageSrc: "https://img.b2bpic.net/free-photo/retro-theatre-scene-celebrate-world-theatre-day_23-2151211472.jpg", imageAlt: "Barber shop atmosphere 7"},
{
imageSrc: "https://img.b2bpic.net/free-photo/attractive-young-man-shaving-before-work-holding-disposable-razor-shave-his-face-using-foam_343059-1186.jpg", imageAlt: "Barber shop atmosphere 8"},
{
imageSrc: "https://img.b2bpic.net/free-photo/close-up-man-getting-his-hair-trimmed_23-2148256979.jpg", imageAlt: "Barber shop atmosphere 9"},
{
imageSrc: "https://img.b2bpic.net/free-photo/high-angle-man-getting-groomed_23-2150668468.jpg", imageAlt: "Barber shop atmosphere 10"},
{
imageSrc: "https://img.b2bpic.net/free-photo/young-bearded-man-getting-shaved-with-straight-edge-razor-by-hairdresser-barbershop_1153-9769.jpg", imageAlt: "Barber shop atmosphere 11"},
{
imageSrc: "https://img.b2bpic.net/free-photo/smiling-barber-cutting-man-hair-professional-salon_23-2148750955.jpg?_wi=1", imageAlt: "Barber shop atmosphere 12"},
{ imageSrc: "https://img.b2bpic.net/free-photo/barber-shaving-man-s-beard-with-straight-razor_23-2148560068.jpg", imageAlt: "Straight razor shave" },
{ imageSrc: "https://img.b2bpic.net/free-photo/hairdresser-trimming-beard-man-barbershop_23-2149141768.jpg", imageAlt: "Beard grooming service" },
{ imageSrc: "https://img.b2bpic.net/free-photo/barber-smiling-client-after-service_23-2148750955.jpg", imageAlt: "Satisfied client" },
]}
buttons={[
{
text: "Book Appointment", href: "#contact"},
{
text: "Call Now", href: "tel:5550123"},
]}
avatars={[
{
src: "https://img.b2bpic.net/free-photo/barber-doing-haircut-bearded-aged-client-hair-salon_23-2148182013.jpg", alt: "Barber shop atmosphere"},
{
src: "https://img.b2bpic.net/free-photo/retro-theatre-scene-celebrate-world-theatre-day_23-2151211458.jpg", alt: "Barber shop interior"},
{
src: "https://img.b2bpic.net/free-photo/men-looking-out-window-cafe_23-2147775903.jpg", alt: "Barber shop style"},
{
src: "https://img.b2bpic.net/free-photo/front-view-baber-shop-chiar_23-2148506337.jpg", alt: "Barber chair view"},
{
src: "https://img.b2bpic.net/free-photo/hairdresser-cutting-man-s-hair-barber-shop_23-2149186474.jpg", alt: "Barber service"},
]}
marqueeItems={[
{
type: "image", src: "https://img.b2bpic.net/free-photo/crop-hands-shaving-neck-customer_23-2147778915.jpg", alt: "Barber tool"},
{
type: "image", src: "https://img.b2bpic.net/free-photo/close-up-man-shaving-his-beard-with-razor_23-2147839813.jpg", alt: "Barber tool"},
{
type: "image", src: "https://img.b2bpic.net/free-photo/hairdresser-getting-ready-their-clients_23-2149205895.jpg", alt: "Barber tool"},
{
type: "image", src: "https://img.b2bpic.net/free-photo/close-up-barber-combing-moustache-client_23-2147778838.jpg", alt: "Barber tool"},
{
type: "image", src: "https://img.b2bpic.net/free-photo/mustache-guy-barbershop_140725-7723.jpg", alt: "Barber tool"},
{ text: "Book Appointment", href: "#contact" },
{ text: "Call Now", href: "tel:5550123" },
]}
/>
</div>
@@ -113,20 +64,15 @@ export default function LandingPage() {
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={false}
title="More Than a Haircut."
description="At Darlene's, we believe in listening carefully, helping nervous clients relax, and building long-term relationships with families. It's about consistency, attention to detail, and a warm, authentic welcome."
title="Crafted for You."
description="At Rockledge Barber Shop, we treat every client with the respect they deserve. From our clean, modern space to our focus on high-quality grooming, we’re here to help you look and feel your absolute best."
metrics={[
{
value: "5+", title: "Star Rating"},
{
value: "2022", title: "Established"},
{
value: "100%", title: "Commitment"},
{ value: "100%", title: "Satisfaction Guaranteed" },
{ value: "5+", title: "Years Experienced" },
{ value: "Unlimited", title: "Style Options" },
]}
imageSrc="https://img.b2bpic.net/free-photo/full-shot-man-barber-shop_23-2149141768.jpg"
imageAlt="Darlene welcoming clients"
mediaAnimation="blur-reveal"
metricsAnimation="slide-up"
imageSrc="https://img.b2bpic.net/free-photo/professional-barber-working-modern-shop_23-2149141768.jpg"
imageAlt="Our barbershop interior"
/>
</div>
@@ -137,58 +83,40 @@ export default function LandingPage() {
useInvertedBackground={false}
features={[
{
id: "f1", title: "Haircuts", author: "Professional", description: "Clean fades, classic cuts, trims, and modern styles.", tags: [
"Fade", "Classic", "Modern"],
imageSrc: "https://img.b2bpic.net/free-photo/blond-man-happy-expression_1194-2921.jpg"},
id: "s1", title: "The Classic Cut", author: "Style", description: "A timeless haircut designed to keep you sharp and polished.", tags: ["Cut", "Classic"],
imageSrc: "https://img.b2bpic.net/free-photo/barber-cutting-man-hair-professional-salon_23-2148750955.jpg"
},
{
id: "f2", title: "Beard Grooming", author: "Precision", description: "Precision beard shaping and detailing for a sharp look.", tags: [
"Shaping", "Detailing"],
imageSrc: "https://img.b2bpic.net/free-photo/smiling-barber-cutting-man-hair-professional-salon_23-2148750955.jpg?_wi=2"},
{
id: "f3", title: "Hot Towel Shave", author: "Classic", description: "Classic barber experience with premium finishing touches.", tags: [
"Relaxing", "Luxury"],
imageSrc: "https://img.b2bpic.net/free-photo/young-man-getting-his-beard-styled-barber_23-2148985723.jpg"},
id: "s2", title: "Signature Shave", author: "Premium", description: "A relaxing hot towel shave experience with premium finishing touches.", tags: ["Relaxing", "Premium"],
imageSrc: "https://img.b2bpic.net/free-photo/barber-shaving-bearded-man-barbershop_23-2148256979.jpg"
},
]}
title="Premium Grooming Services"
description="Professional care tailored to your style."
title="Our Services"
description="Choose the service that best suits your lifestyle."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFifteen
useInvertedBackground={false}
testimonial="Darlene genuinely loves what she does. She listens and gets it right every time. I finally found someone who cuts my hair exactly the way I want."
testimonial="Finally a barbershop that really cares. I always walk out looking like a new man. Professional service and a great atmosphere every time!"
rating={5}
author="Mark Johnson"
avatars={[
{
src: "https://img.b2bpic.net/free-photo/man-getting-his-hair-cut-barber-shop4_23-2149186458.jpg", alt: "Client 1"},
{
src: "https://img.b2bpic.net/free-photo/medium-shot-hairdresser-washing-man-s-hair_23-2150665396.jpg", alt: "Client 2"},
{
src: "https://img.b2bpic.net/free-photo/side-view-man-bathroom_23-2150323118.jpg", alt: "Client 3"},
{
src: "https://img.b2bpic.net/free-photo/medium-shot-man-getting-haircut_23-2150665403.jpg", alt: "Client 4"},
{
src: "https://img.b2bpic.net/free-photo/crazy-businessman-happy-expression_1194-3609.jpg", alt: "Client 5"},
]}
author="Michael Smith"
avatars={[{ src: "https://img.b2bpic.net/free-photo/happy-man-after-barber-visit_23-2149186474.jpg", alt: "Client" }]}
ratingAnimation="blur-reveal"
avatarsAnimation="slide-up"
useInvertedBackground={false}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardFourteen
useInvertedBackground={false}
title="Why Clients Stay"
tag="Trusted Quality"
title="The Rockledge Standard"
tag="Quality Assurance"
metrics={[
{
id: "m1", value: "5-Star", description: "Local Reputation"},
{
id: "m2", value: "Family", description: "Friendly Environment"},
{
id: "m3", value: "Modern", description: "Affordable Luxury"},
{ id: "m1", value: "5k+", description: "Cuts Completed" },
{ id: "m2", value: "100%", description: "Safety Focused" },
{ id: "m3", value: "Daily", description: "Client Satisfaction" },
]}
metricsAnimation="slide-up"
/>
@@ -199,33 +127,26 @@ export default function LandingPage() {
textboxLayout="split"
useInvertedBackground={false}
faqs={[
{
id: "q1", title: "Are walk-ins welcome?", content: "Yes, we always welcome walk-ins whenever possible."},
{
id: "q2", title: "Do you offer kids haircuts?", content: "Absolutely, we love serving the whole family with patient, friendly service."},
{
id: "q3", title: "What payment methods do you accept?", content: "We accept cash and most major credit cards."},
{ id: "q1", title: "How can I book an appointment?", content: "You can book directly through our website contact link or give us a call." },
{ id: "q2", title: "Is the shop open on weekends?", content: "Yes, we are open on weekends to accommodate your busy schedule." },
]}
title="Common Questions"
description="We are here to help."
title="FAQs"
description="Got questions? We have answers."
faqsAnimation="blur-reveal"
imageSrc="https://img.b2bpic.net/free-photo/side-view-leather-barber-shop-chair_23-2148242807.jpg"
imageAlt="Barber chair"
mediaAnimation="slide-up"
imageSrc="https://img.b2bpic.net/free-photo/barber-shop-interior-design_23-2148242807.jpg"
imageAlt="Shop details"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={false}
background={{
variant: "plain"}}
background={{ variant: "plain" }}
tag="Booking"
title="Ready for Your New Go-To Barber?"
description="Reserve your appointment today for a premium grooming experience."
mediaAnimation="slide-up"
imageSrc="https://img.b2bpic.net/free-photo/close-up-details-hairdresser-salon_23-2149205856.jpg"
imageAlt="Barber shop detail"
title="Book Your Chair"
description="Join the hundreds of happy clients at Rockledge Barber Shop. Click below to secure your spot."
imageSrc="https://img.b2bpic.net/free-photo/barber-equipment-detail_23-2149205856.jpg"
imageAlt="Barber equipment"
/>
</div>
@@ -233,25 +154,18 @@ export default function LandingPage() {
<FooterBase
columns={[
{
title: "Explore", items: [
{
label: "About", href: "#about"},
{
label: "Services", href: "#services"},
{
label: "Reviews", href: "#testimonials"},
],
title: "Quick Links", items: [
{ label: "About", href: "#about" },
{ label: "Services", href: "#services" },
]
},
{
title: "Legal", items: [
{
label: "Privacy Policy", href: "#"},
{
label: "Terms of Service", href: "#"},
],
},
title: "Info", items: [
{ label: "Contact", href: "#contact" },
]
}
]}
logoText="Darlene's"
logoText="Rockledge Barber Shop"
/>
</div>
</ReactLenis>