204 lines
10 KiB
TypeScript
204 lines
10 KiB
TypeScript
"use client";
|
||
|
||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
|
||
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
||
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
|
||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
||
import ContactFaq from '@/components/sections/contact/ContactFaq';
|
||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import { Calendar, Clock, MapPin, Phone, Scissors, Sparkles, Sun } from "lucide-react";
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="shift-hover"
|
||
defaultTextAnimation="entrance-slide"
|
||
borderRadius="soft"
|
||
contentWidth="small"
|
||
sizing="largeSmallSizeLargeTitles"
|
||
background="aurora"
|
||
cardStyle="glass-depth"
|
||
primaryButtonStyle="radial-glow"
|
||
secondaryButtonStyle="glass"
|
||
headingFontWeight="extrabold"
|
||
>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarStyleFullscreen
|
||
brandName="The Famous American Barbershop – Atlas"
|
||
navItems={[
|
||
{ name: "Home", id: "home" },
|
||
{ name: "Services", id: "services" },
|
||
{ name: "About", id: "about" },
|
||
{ name: "Gallery", id: "gallery" },
|
||
{ name: "Contact", id: "contact" },
|
||
]}
|
||
bottomLeftText="Virginia Gateway Shopping Center"
|
||
bottomRightText="(703) 754-2655"
|
||
/>
|
||
</div>
|
||
|
||
<div id="hero" data-section="hero">
|
||
<HeroCarouselLogo
|
||
logoText="ATLAS"
|
||
description="Classic American barbershop serving Gainesville and surrounding communities. Professional men's grooming in a relaxed, friendly atmosphere."
|
||
buttons={[
|
||
{ text: "Call Now", href: "tel:(703) 754-2655" },
|
||
{ text: "Visit Us", href: "#contact" },
|
||
]}
|
||
slides={[
|
||
{
|
||
imageSrc: "http://img.b2bpic.net/free-photo/brown-vintage-leather-chairs-stylish-barber-shop_627829-6188.jpg", imageAlt: "Classic barber shop interior"
|
||
},
|
||
{
|
||
imageSrc: "http://img.b2bpic.net/free-photo/luxury-armchairs-barber-shop_140725-7720.jpg?_wi=1", imageAlt: "Professional barber chairs"
|
||
},
|
||
{
|
||
imageSrc: "http://img.b2bpic.net/free-photo/attractive-pensive-man-is-waiting-his-turn-get-haircut-busy-barbershop_613910-21489.jpg?_wi=1", imageAlt: "Professional haircut service"
|
||
},
|
||
]}
|
||
autoplayDelay={4000}
|
||
showDimOverlay={true}
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about">
|
||
<TestimonialAboutCard
|
||
tag="About Our Shop"
|
||
tagIcon={Scissors}
|
||
title="Where Classic Meets Modern Barbering"
|
||
description="The Famous American Barbershop – Atlas"
|
||
subdescription="Your neighborhood destination for quality grooming"
|
||
icon={Scissors}
|
||
imageSrc="http://img.b2bpic.net/free-photo/luxury-armchairs-barber-shop_140725-7720.jpg?_wi=2"
|
||
imageAlt="Inside The Famous American Barbershop – Atlas"
|
||
mediaAnimation="slide-up"
|
||
useInvertedBackground={false}
|
||
/>
|
||
</div>
|
||
|
||
<div id="services" data-section="services">
|
||
<FeatureCardNineteen
|
||
title="Professional Men's Grooming Services"
|
||
description="Expert barbering services tailored to your style"
|
||
tag="Services"
|
||
tagIcon={Sparkles}
|
||
features={[
|
||
{
|
||
id: 1,
|
||
tag: "Classic", title: "Men's Haircuts", subtitle: "Timeless styles and modern fades", description: "Professional haircuts ranging from classic cuts to modern fades, tailored to your preferences by our experienced barbers.", imageSrc: "http://img.b2bpic.net/free-photo/professional-barber-working-with-client-hairdressing-salon-styling-beard-with-comb_613910-5069.jpg", imageAlt: "Professional men's haircut"
|
||
},
|
||
{
|
||
id: 2,
|
||
tag: "Precision", title: "Beard Trims & Razor Shaves", subtitle: "Traditional grooming expertise", description: "Expert beard maintenance and smooth razor shaves using traditional techniques for the ultimate grooming experience.", imageSrc: "http://img.b2bpic.net/free-photo/professional-hairdresser-modeling-beard-barbershop-close-up-photo_613910-18422.jpg", imageAlt: "Beard trim and razor shave service"
|
||
},
|
||
{
|
||
id: 3,
|
||
tag: "Detail Work", title: "Line Ups & Skin Fades", subtitle: "Precision edge work", description: "Sharp line ups and clean skin fades with attention to detail. Get that fresh, polished look you deserve.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-confident-groom-with-beard-mustaches-standing-looking-away-while-his-friend-standing-him-helping-dressing-up-shirt-bow-tie-hotel-room-wedding-day_8353-12417.jpg", imageAlt: "Precision line up and fade service"
|
||
},
|
||
]}
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
/>
|
||
</div>
|
||
|
||
<div id="gallery" data-section="gallery">
|
||
<ProductCardThree
|
||
products={[
|
||
{
|
||
id: "1", name: "Premium Haircut", price: "Expert Results", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYWRxrOSTb7MSIUJcLjcDOTIYv/uploaded-1772774046011-sm0yla2b.jpg", imageAlt: "Professional haircut example"
|
||
},
|
||
{
|
||
id: "2", name: "Precision Fade", price: "Sharp Lines", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYWRxrOSTb7MSIUJcLjcDOTIYv/uploaded-1772774046011-tje9e1md.jpg", imageAlt: "Precision fade service"
|
||
},
|
||
{
|
||
id: "3", name: "Classic Style", price: "Timeless Look", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYWRxrOSTb7MSIUJcLjcDOTIYv/uploaded-1772774046011-fax6znhd.jpg", imageAlt: "Classic haircut style"
|
||
},
|
||
{
|
||
id: "4", name: "Welcoming Atmosphere", price: "Community Focused", imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-washing-head-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6316.jpg", imageAlt: "Inside The Famous American Barbershop – Atlas"
|
||
},
|
||
]}
|
||
title="Gallery"
|
||
description="Explore our shop, tools, and expert craftsmanship"
|
||
tag="Gallery"
|
||
tagIcon={Sparkles}
|
||
gridVariant="bento-grid"
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
/>
|
||
</div>
|
||
|
||
<div id="hours-location" data-section="hours-location">
|
||
<MetricCardThree
|
||
metrics={[
|
||
{
|
||
id: "1", icon: Clock,
|
||
title: "Weekday Hours", value: "9 AM – 7 PM"
|
||
},
|
||
{
|
||
id: "2", icon: Calendar,
|
||
title: "Saturday", value: "8 AM – 5 PM"
|
||
},
|
||
{
|
||
id: "3", icon: Sun,
|
||
title: "Sunday", value: "9 AM – 4 PM"
|
||
},
|
||
{
|
||
id: "4", icon: MapPin,
|
||
title: "Location", value: "Gainesville, VA"
|
||
},
|
||
]}
|
||
title="Hours & Location"
|
||
description="Visit us in the heart of Virginia Gateway Shopping Center"
|
||
tag="Find Us"
|
||
tagIcon={MapPin}
|
||
textboxLayout="default"
|
||
animationType="slide-up"
|
||
useInvertedBackground={true}
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactFaq
|
||
faqs={[
|
||
{
|
||
id: "1", title: "What payment methods do you accept?", content: "We accept cash, credit cards, and digital payment methods. All major credit cards are welcome."
|
||
},
|
||
{
|
||
id: "2", title: "Is this a good barbershop for first-timers?", content: "Absolutely! Our barbers are experienced and friendly. We welcome new customers and take time to understand your desired style. Come in and experience the classic American barbershop atmosphere."
|
||
},
|
||
{
|
||
id: "3", title: "Where exactly are you located?", content: "We're located at 7325 Atlas Walk Way, Gainesville, VA 20155, in the Virginia Gateway Shopping Center. Easy access and convenient parking available."
|
||
},
|
||
{
|
||
id: "4", title: "What makes your barbershop special?", content: "We combine classic American barbering tradition with modern grooming techniques. Our experienced barbers deliver quality cuts, fades, and beard services in a relaxed, welcoming neighborhood atmosphere."
|
||
},
|
||
]}
|
||
ctaTitle="Get in Touch"
|
||
ctaDescription="Walk-ins welcome! Call now or visit during business hours—no appointment needed."
|
||
ctaButton={{
|
||
text: "Call (703) 754-2655", href: "tel:(703) 754-2655"
|
||
}}
|
||
ctaIcon={Phone}
|
||
useInvertedBackground={false}
|
||
animationType="slide-up"
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterLogoReveal
|
||
logoText="ATLAS"
|
||
leftLink={{
|
||
text: "Hours", href: "#hours-location"
|
||
}}
|
||
rightLink={{
|
||
text: "Contact", href: "#contact"
|
||
}}
|
||
/>
|
||
</div>
|
||
</ThemeProvider>
|
||
);
|
||
} |