Merge version_2 into main #4

Merged
bender merged 2 commits from version_2 into main 2026-04-10 16:30:24 +00:00
2 changed files with 68 additions and 144 deletions

View File

@@ -3,13 +3,13 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import { Coffee, Palette, Scissors } from "lucide-react";
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import { Palette, Scissors } from "lucide-react";
export default function LandingPage() {
return (
@@ -29,14 +29,10 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{
name: "About", id: "about"},
{
name: "Services", id: "services"},
{
name: "Reviews", id: "reviews"},
{
name: "Contact", id: "contact"},
{ name: "About", id: "about" },
{ name: "Services", id: "services" },
{ name: "Reviews", id: "reviews" },
{ name: "Contact", id: "contact" },
]}
brandName="Ernesto's"
/>
@@ -46,158 +42,86 @@ export default function LandingPage() {
<HeroOverlayTestimonial
title="Ernesto's Hairstyling"
description="Expert haircuts and coloring in a comfortable, neighborhood atmosphere. Serving Washington, DC with professional care since 1994."
testimonials={[
{
name: "Jackson P.", handle: "Washington, DC", testimonial: "You can't get a better haircut for a better price anywhere. Comfortable and wonderful people.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-african-american-woman-talking-smartphone-armchair-office_23-2148042626.jpg?_wi=1", imageAlt: "elegant hair salon interior"},
{
name: "Heidi M.", handle: "Northwest, DC", testimonial: "Ernesto is quick, methodical and gives an excellent cut at a fair price. Hard to find vibe!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/adult-hairdresser-shaving-customers-beard-hair-salon_23-2148181971.jpg", imageAlt: "professional barber at work"},
{
name: "Sarah L.", handle: "Capitol Hill, DC", testimonial: "The best neighborhood salon I've ever visited. Truly personal service.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-washing-woman-s-hair_23-2148940880.jpg?_wi=1", imageAlt: "professional hair coloring service"},
{
name: "David W.", handle: "Dupont Circle, DC", testimonial: "Consistent, professional, and friendly. I wouldn't go anywhere else.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/man-cuts-hair-barbershop_1157-15500.jpg?_wi=1", imageAlt: "precision hair trim"},
{
name: "Maria G.", handle: "Georgetown, DC", testimonial: "Exquisite coloring skills and such a warm, inviting environment.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/mirror-hairdressing-salon_23-2147670185.jpg?_wi=1", imageAlt: "happy customer after hair service"},
]}
buttons={[
{
text: "Book Appointment", href: "#contact"},
]}
testimonials={[]}
buttons={[{ text: "Book Appointment", href: "#contact" }]}
imageSrc="http://img.b2bpic.net/free-photo/smiling-african-american-woman-talking-smartphone-armchair-office_23-2148042626.jpg?_wi=2"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/young-black-people-taking-care-afro-hair_23-2149575478.jpg", alt: "Customer 1"},
{
src: "http://img.b2bpic.net/free-photo/hairdresser-cutting-man-s-hair-barber-shop_23-2149186462.jpg", alt: "Customer 2"},
{
src: "http://img.b2bpic.net/free-photo/excited-girlfriends-sharing-with-news_23-2147762524.jpg", alt: "Customer 3"},
{
src: "http://img.b2bpic.net/free-photo/portrait-happy-young-man-bed_23-2147862652.jpg", alt: "Customer 4"},
{
src: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149230961.jpg", alt: "Customer 5"},
]}
/>
</div>
<div id="about" data-section="about">
<TextSplitAbout
useInvertedBackground={false}
title="A Community Staple"
description={[
"Located in the heart of Washington, DC, Ernesto's has been a community favorite for decades. We pride ourselves on providing high-quality, professional services in a friendly, relaxed setting.", "Whether you need a precise cut, expert coloring, or just a friendly conversation, our neighborhood salon is the place for you. We offer convenient access by metro or car, and always strive to make your visit a positive, refreshing experience."]}
/>
<TeamCardEleven
title="Our Stylists"
description="Meet the experts behind your perfect look. Ernesto and Adriana bring decades of professional passion to every client visit."
textboxLayout="split"
useInvertedBackground={false}
animationType="slide-up"
groups={[
{
id: "team", groupTitle: "The Team", members: [
{ id: "ernesto", title: "Ernesto", subtitle: "Lead Stylist", detail: "With over 30 years of experience, Ernesto specializes in precision cuts and classic styling." },
{ id: "adriana", title: "Adriana", subtitle: "Color Expert", detail: "Adriana brings artistic flair to all coloring services, ensuring vibrant and healthy results." }
]
}
]}
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentyFive
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
features={[
{
title: "Expert Coloring", description: "Customized color treatments using high-quality products for long-lasting vibrancy.", icon: Palette,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-washing-woman-s-hair_23-2148940880.jpg?_wi=2", imageAlt: "Coloring service"},
{
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-washing-woman-s-hair_23-2148940880.jpg?_wi=3", imageAlt: "Coloring service"},
],
},
{
title: "Precision Cutting", description: "Methodical, professional cuts adapted to your personal style and preferences.", icon: Scissors,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/man-cuts-hair-barbershop_1157-15500.jpg?_wi=2", imageAlt: "Hair cutting"},
{
imageSrc: "http://img.b2bpic.net/free-photo/man-cuts-hair-barbershop_1157-15500.jpg?_wi=3", imageAlt: "Hair cutting"},
],
},
{
title: "Relaxed Atmosphere", description: "A comfortable, neighborhood vibe that makes your salon visit a truly positive break.", icon: Coffee,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/mirror-hairdressing-salon_23-2147670185.jpg?_wi=2", imageAlt: "Salon vibe"},
{
imageSrc: "http://img.b2bpic.net/free-photo/mirror-hairdressing-salon_23-2147670185.jpg?_wi=3", imageAlt: "Salon vibe"},
],
},
]}
title="Our Services"
description="Professional hair services tailored to your needs by our experienced staff."
/>
<FeatureCardTwentyNine
title="Our Services"
description="Professional hair care tailored to you."
textboxLayout="split"
gridVariant="uniform-all-items-equal"
animationType="slide-up"
useInvertedBackground={false}
features={[
{ title: "Precision Cuts", description: "Tailored haircuts for every style.", imageSrc: "http://img.b2bpic.net/free-photo/man-cuts-hair-barbershop_1157-15500.jpg?_wi=1", titleIconSrc: "", buttonText: "Book Now", buttonHref: "#contact" },
{ title: "Expert Color", description: "High-quality professional color treatments.", imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-washing-woman-s-hair_23-2148940880.jpg?_wi=1", titleIconSrc: "", buttonText: "Book Now", buttonHref: "#contact" },
{ title: "Styling", description: "Professional blowouts and styling.", imageSrc: "http://img.b2bpic.net/free-photo/mirror-hairdressing-salon_23-2147670185.jpg?_wi=1", titleIconSrc: "", buttonText: "Book Now", buttonHref: "#contact" },
{ title: "Treatments", description: "Nourishing hair health treatments.", imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149230961.jpg?_wi=1", titleIconSrc: "", buttonText: "Book Now", buttonHref: "#contact" },
{ title: "Consultation", description: "Personalized style assessments.", imageSrc: "http://img.b2bpic.net/free-photo/adult-hairdresser-shaving-customers-beard-hair-salon_23-2148181971.jpg", titleIconSrc: "", buttonText: "Book Now", buttonHref: "#contact" },
{ title: "Maintenance", description: "Keep your look fresh and vibrant.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-young-man-bed_23-2147862652.jpg", titleIconSrc: "", buttonText: "Book Now", buttonHref: "#contact" }
]}
/>
</div>
<div id="reviews" data-section="reviews">
<TestimonialCardFifteen
useInvertedBackground={false}
testimonial="I have been going to Ernesto's for several years. The services are very professionally rendered and the shop is always very pleasant and clean. It is a community fixture."
rating={5}
author="Lea N."
avatars={[
{
src: "http://img.b2bpic.net/free-photo/young-black-people-taking-care-afro-hair_23-2149575478.jpg", alt: "Reviewer"},
{
src: "http://img.b2bpic.net/free-photo/hairdresser-cutting-man-s-hair-barber-shop_23-2149186462.jpg", alt: "Reviewer"},
{
src: "http://img.b2bpic.net/free-photo/excited-girlfriends-sharing-with-news_23-2147762524.jpg", alt: "Reviewer"},
{
src: "http://img.b2bpic.net/free-photo/portrait-happy-young-man-bed_23-2147862652.jpg", alt: "Reviewer"},
{
src: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149230961.jpg", alt: "Reviewer"},
]}
ratingAnimation="slide-up"
avatarsAnimation="slide-up"
/>
<TestimonialCardTen
title="Customer Experiences"
description="See why our neighborhood loves us."
textboxLayout="split"
useInvertedBackground={false}
testimonials={[
{ id: "1", title: "Excellent Service", quote: "Truly the best neighborhood salon.", name: "Sarah L.", role: "Local Resident" },
{ id: "2", title: "Professional", quote: "Ernesto is incredibly methodical and skilled.", name: "Heidi M.", role: "Local Resident" },
{ id: "3", title: "Consistent", quote: "I wouldn't go anywhere else.", name: "David W.", role: "Local Resident" }
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={true}
background={{
variant: "plain"}}
tag="Visit Us"
background={{ variant: "sparkles-gradient" }}
tag="Ready to visit?"
title="Book Your Appointment"
description="Experience our professional hairstyling today. Call us to schedule your visit or find out about our current services."
buttons={[
{
text: "Call to Book", href: "tel:+12025550199"},
]}
description="Call us at 202-686-0580 to schedule your next visit. We have dedicated parking available behind the building for your convenience."
buttons={[{ text: "Call 202-686-0580", href: "tel:+12026860580" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{
title: "Ernesto's Hairstyling", items: [
{
label: "Washington, DC", href: "#"},
{
label: "Phone: (202) 555-0199", href: "tel:+12025550199"},
],
},
{
title: "Links", items: [
{
label: "About", href: "#about"},
{
label: "Services", href: "#services"},
{
label: "Reviews", href: "#reviews"},
{
label: "Contact", href: "#contact"},
],
},
{ title: "Location", items: [{ label: "Washington, DC" }, { label: "Parking Available" }] },
{ title: "Contact", items: [{ label: "(202) 686-0580", href: "tel:+12026860580" }, { label: "Get Directions" }] },
{ title: "Quick Links", items: [{ label: "About", href: "#about" }, { label: "Services", href: "#services" }, { label: "Reviews", href: "#reviews" }, { label: "Contact", href: "#contact" }] },
]}
bottomLeftText="© 2025 Ernesto's Hairstyling"
bottomRightText="Built with passion in Washington, DC"
bottomRightText="Serving DC Since 1994"
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
}

View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #f5f4ef;
--card: #dad6cd;
--foreground: #2a2928;
--primary-cta: #2a2928;
--background: #f6f0e9;
--card: #efe7dd;
--foreground: #2b180a;
--primary-cta: #2b180a;
--primary-cta-text: #f5f4ef;
--secondary-cta: #ecebea;
--secondary-cta: #efe7dd;
--secondary-cta-text: #2a2928;
--accent: #ffffff;
--background-accent: #c6b180;
--accent: #94877c;
--background-accent: #afa094;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);