149 lines
7.6 KiB
TypeScript
149 lines
7.6 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
|
|
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
|
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="medium"
|
|
sizing="medium"
|
|
background="circleGradient"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="normal"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav" className="transition-all duration-300">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "Services", id: "services" },
|
|
{ name: "Gallery", id: "gallery" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
brandName="Elite Barber Shop"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardCarousel
|
|
background={{ variant: "gradient-bars" }}
|
|
title="Elite Barber Shop — Fresh Cuts & Clean Fades in City Center"
|
|
description="Walk-Ins Welcome • Book Online • Premium Grooming Experience. Your go-to spot for modern styles."
|
|
buttons={[
|
|
{ text: "Book Now", href: "#contact" },
|
|
{ text: "Call Now", href: "tel:5550123456" }
|
|
]}
|
|
mediaItems={[
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-hairdresser-washing-man-s-hair_23-2150665396.jpg", imageAlt: "barber cutting hair with scissors" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-leather-armchair_1156-3.jpg", imageAlt: "modern barber shop interior" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/composition-shaving-objects-with-copyspace_23-2148122052.jpg", imageAlt: "barber tools and accessories" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-spraying-hair-man_23-2147778776.jpg", imageAlt: "happy customer at barber shop" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/handsome-businessman-barbershop_1157-21635.jpg?_wi=1", imageAlt: "close up fresh fade haircut" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/view-scissors-hair-salon_23-2150462460.jpg", imageAlt: "barber grooming kit accessories" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardTwentyFour
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{ id: "f1", title: "Classic Cuts", author: "Precision", description: "Timeless styles meeting modern standards.", tags: ["Hair", "Classic"], imageSrc: "http://img.b2bpic.net/free-photo/handsome-businessman-barbershop_1157-21635.jpg?_wi=2" },
|
|
{ id: "f2", title: "Skin Fades", author: "Expertise", description: "Detailed fades with perfect blending techniques.", tags: ["Fade", "Modern"], imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BWODXzGSyTdm5m9Zkudsgd49uo/uploaded-1774605354725-rywizbmw.jpg" },
|
|
{ id: "f3", title: "Beard Trim", author: "Detail", description: "Sharp lines and clean finishes for a sharp look.", tags: ["Beard", "Grooming"], imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BWODXzGSyTdm5m9Zkudsgd49uo/uploaded-1774605404651-twd0ruf0.jpg" },
|
|
{ id: "f4", title: "Full Package", author: "Premium", description: "Complete haircut and beard grooming combination.", tags: ["Combo", "Premium"], imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BWODXzGSyTdm5m9Zkudsgd49uo/uploaded-1774605418984-4k3t5xch.jpg" }
|
|
]}
|
|
title="Our Services"
|
|
description="Professional grooming services tailored for every individual need."
|
|
/>
|
|
</div>
|
|
|
|
<div id="gallery" data-section="gallery">
|
|
<ProductCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{ id: "p1", brand: "Style", name: "Modern Fade", price: "Featured", rating: 5, reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-psd/barbershop-instagram-posts-collection_23-2149487551.jpg" },
|
|
{ id: "p2", brand: "Style", name: "Sharp Beard", price: "Featured", rating: 5, reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-with-beard-smiling_23-2148618892.jpg" },
|
|
{ id: "p3", brand: "Style", name: "Classic Taper", price: "Featured", rating: 5, reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/close-up-stylist-drying-wet-hair_23-2147769808.jpg" },
|
|
{ id: "p4", brand: "Style", name: "Interior", price: "Featured", rating: 5, reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-talking-phone_23-2149361903.jpg" }
|
|
]}
|
|
title="Portfolio"
|
|
description="Browse our latest work from the shop floor."
|
|
cardRatingClassName="text-orange-500"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{ id: "t1", name: "John D.", role: "Local", company: "Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-talking-phone_23-2149235740.jpg" },
|
|
{ id: "t2", name: "Mike S.", role: "Local", company: "Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-man-blazer-beauty-style_1139-773.jpg" },
|
|
{ id: "t3", name: "Alex R.", role: "Local", company: "Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-man-with-tablet_23-2149927583.jpg" },
|
|
{ id: "t4", name: "Sam B.", role: "Local", company: "Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiley-man-holding-tablet-close-up_23-2148943517.jpg" }
|
|
]}
|
|
kpiItems={[
|
|
{ value: "1000+", label: "Satisfied Customers" },
|
|
{ value: "5", label: "Years Experience" },
|
|
{ value: "4.9", label: "Avg Rating" }
|
|
]}
|
|
title="Happy Clients"
|
|
description="What our local community has to say about us."
|
|
ratingClassName="text-orange-500"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
useInvertedBackground={false}
|
|
background={{ variant: "plain" }}
|
|
tag="Contact"
|
|
title="Ready for a Fresh Cut?"
|
|
description="Book your appointment now or call us to reserve a time."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseReveal
|
|
columns={[
|
|
{
|
|
title: "Location", items: [
|
|
{ label: "123 Main St, City", href: "#" },
|
|
{ label: "555-012-3456", href: "tel:5550123456" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
copyrightText="© 2024 Elite Barber Shop. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|