229 lines
11 KiB
TypeScript
229 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FaqBase from '@/components/sections/faq/FaqBase';
|
|
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import TeamCardFive from '@/components/sections/team/TeamCardFive';
|
|
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
|
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
|
import { Facebook, Instagram, Scissors, ShieldCheck, Sparkles } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="icon-arrow"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="soft"
|
|
contentWidth="smallMedium"
|
|
sizing="large"
|
|
background="floatingGradient"
|
|
cardStyle="glass-depth"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "hero"},
|
|
{
|
|
name: "About", id: "about"},
|
|
{
|
|
name: "Team", id: "team"},
|
|
{
|
|
name: "Contact", id: "contact"},
|
|
]}
|
|
brandName="Maybach Barber Shop"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardTestimonial
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "plain"}}
|
|
title="Premium Fades, Flawless Cuts, Luxury Experience"
|
|
description="Maybach Barber Shop delivers precision barbering with the attention to detail that sets us apart. From classic fades to custom styles, our master barbers Damion, Dasmal, and Mikey ensure every client leaves satisfied."
|
|
testimonials={[
|
|
{
|
|
name: "Alex R.", handle: "@alexr", testimonial: "Best fade I've had in South Florida. The attention to detail is unmatched.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-hair-salon_23-2150665449.jpg"},
|
|
{
|
|
name: "Mike D.", handle: "@miked", testimonial: "Very professional and clean atmosphere. Damion is a master with the clippers.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/stylish-hairdresser-styling-hair-man_23-2147778738.jpg"},
|
|
{
|
|
name: "Sarah J.", handle: "@sarahj", testimonial: "Took my son here, he loves the kid-friendly vibe. Excellent service.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/woman-showcasing-their-home_23-2151624943.jpg"},
|
|
{
|
|
name: "David K.", handle: "@davidk", testimonial: "Consistently great cuts. The barbers are talented and respectful.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-positive-blond-bearded-male-dressed-red-fleece-shirt-makes-conversation_613910-13394.jpg"},
|
|
{
|
|
name: "John W.", handle: "@johnw", testimonial: "New to Coral Springs and finally found my forever shop. Highly recommend!", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-businesswoman-strict-clothes-black-jacket-with-optical-sunglasses-posing-grey-white-wall-work-job-office-business-woman-lady_140725-65015.jpg"},
|
|
]}
|
|
buttons={[
|
|
{
|
|
text: "Book Your Cut Today", href: "#contact"},
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CKIUaXr59FE1QYCKDNglueswIR/uploaded-1776262804407-sz27qbhs.jpg"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/high-angle-man-hair-salon_23-2150665446.jpg", alt: "Client profile 1"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-bearded-young-man-looking-away_23-2147955483.jpg", alt: "Client profile 2"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/attractive-smiling-blond-bearded-man-hoodie-joyfully-spending-time-with-friends-isolated-blue-background-good-mood_574295-3154.jpg", alt: "Client profile 3"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/european-brutal-man-with-beard-cut-barbershop_343596-4697.jpg", alt: "Client profile 4"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/closeup-portrait-elegantly-dressed-young-man-with-stylish-beard-hair-holding-hand-chin-looking-camera-studio-photo-against-dark-wall-background_613910-20287.jpg", alt: "Client profile 5"},
|
|
]}
|
|
avatarText="Join our 500+ satisfied clients"
|
|
marqueeItems={[
|
|
{
|
|
type: "text", text: "Precision Cuts"},
|
|
{
|
|
type: "text", text: "Hot Towel Shaves"},
|
|
{
|
|
type: "text", text: "Classic Style"},
|
|
{
|
|
type: "text", text: "Modern Fades"},
|
|
{
|
|
type: "text", text: "Premium Grooming"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextSplitAbout
|
|
useInvertedBackground={true}
|
|
title="A Commitment to Excellence"
|
|
description={[
|
|
"At Maybach Barber Shop, we believe grooming is a personalized craft. Our shop in Coral Springs offers a sanctuary where precision meets luxury.", "We prioritize cleanliness, a welcoming environment, and total consistency. Whether it's your first time or your fiftieth, we ensure a flawless experience tailored to you."]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureHoverPattern
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
icon: Scissors,
|
|
title: "Precision Cutting", description: "Expertly executed fades, tapers, and scissor cuts by master barbers."},
|
|
{
|
|
icon: Sparkles,
|
|
title: "Luxury Experience", description: "Impeccable attention to detail, hot towels, and clean, relaxed atmosphere."},
|
|
{
|
|
icon: ShieldCheck,
|
|
title: "49-Star Reputation", description: "Consistently recognized for reliability, consistency, and top-tier service."},
|
|
]}
|
|
title="Why Choose Maybach"
|
|
description="Experience grooming standards designed for the modern gentleman."
|
|
/>
|
|
</div>
|
|
|
|
<div id="team" data-section="team">
|
|
<TeamCardFive
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
team={[
|
|
{
|
|
id: "1", name: "Damion", role: "Master Barber", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CKIUaXr59FE1QYCKDNglueswIR/uploaded-1776262804407-oh6vwg6y.jpg"},
|
|
{
|
|
id: "2", name: "Dasmal", role: "Master Barber", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CKIUaXr59FE1QYCKDNglueswIR/uploaded-1776262804407-61ky0hed.jpg"},
|
|
{
|
|
id: "3", name: "Mikey", role: "Master Barber", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CKIUaXr59FE1QYCKDNglueswIR/uploaded-1776262804407-lpfpgz8b.jpg"},
|
|
]}
|
|
title="Meet Our Master Barbers"
|
|
description="Our team of seasoned professionals is dedicated to your look and confidence."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Alex R.", role: "Professional", company: "Local Resident", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/bearded-male-sitting-armchair-barber-shop-while-hairdresser-modeling-beard-with-scissors-comb-barbershop_613910-18515.jpg"},
|
|
{
|
|
id: "2", name: "Mike D.", role: "Professional", company: "Local Resident", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/pov-diverse-men-hotel-lobby-meeting-abroad-create-new-parnership-collaborate-project-team-businessmen-attend-videocall-conference-together-lounge-area_482257-69534.jpg"},
|
|
{
|
|
id: "3", name: "Sarah J.", role: "Parent", company: "Family", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-young-man-getting-haircut_23-2149220536.jpg"},
|
|
{
|
|
id: "4", name: "David K.", role: "Professional", company: "Newcomer", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/senior-man-talking-phone_23-2148404354.jpg"},
|
|
{
|
|
id: "5", name: "John W.", role: "Professional", company: "Newcomer", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/happy-mature-businessman-glasses-shaking-hands-with-female-partner-meeting-co-working-space_74855-10006.jpg"},
|
|
]}
|
|
title="Client Success Stories"
|
|
description="What the Coral Springs community says about their experience with us."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqBase
|
|
textboxLayout="split"
|
|
useInvertedBackground={true}
|
|
faqs={[
|
|
{
|
|
id: "1", title: "Do you accept walk-ins?", content: "We recommend booking in advance, but we accommodate walk-ins whenever possible."},
|
|
{
|
|
id: "2", title: "Are you kid-friendly?", content: "Yes, we are a family-friendly establishment and welcome kids for precision cuts."},
|
|
{
|
|
id: "3", title: "What payment methods do you accept?", content: "We accept major credit cards, digital payments, and cash."},
|
|
]}
|
|
title="Common Questions"
|
|
description="Everything you need to know about our services and booking."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactText
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "plain"}}
|
|
text="Ready for your next cut? Book an appointment with Damion, Dasmal, or Mikey today."
|
|
buttons={[
|
|
{
|
|
text: "Book Now", href: "#"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="Maybach Barber Shop"
|
|
copyrightText="© 2025 Maybach Barber Shop. All rights reserved."
|
|
socialLinks={[
|
|
{
|
|
icon: Instagram,
|
|
href: "https://instagram.com", ariaLabel: "Instagram"},
|
|
{
|
|
icon: Facebook,
|
|
href: "https://facebook.com", ariaLabel: "Facebook"},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|