Update src/app/page.tsx
This commit is contained in:
342
src/app/page.tsx
342
src/app/page.tsx
@@ -1,260 +1,96 @@
|
||||
"use client";
|
||||
'use client';
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
|
||||
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
||||
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
|
||||
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
||||
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
|
||||
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import Link from 'next/link';
|
||||
|
||||
export default function LandingPage() {
|
||||
const navItems = [{ name: 'Home', id: '/' }];
|
||||
|
||||
export default function Page() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="soft"
|
||||
contentWidth="small"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="floatingGradient"
|
||||
cardStyle="subtle-shadow"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Experience",
|
||||
id: "experience",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "reviews",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Sedona Barber Shop"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Sharp cuts. Clean beards. Sedona confidence."
|
||||
description="Precision barbering with elevated energy. Whether you need a fresh fade, a beard clean-up, a wedding-ready finish, or a dependable cut while in town, Sedona Barber Shop delivers detail, personality, and results."
|
||||
tag="Sedona’s trusted cut + beard destination"
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Your Cut",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "Call for Walk-Ins",
|
||||
href: "tel:9285551234",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/professional-hairdresser-sitting-barber-chair-waiting-customer_613910-3902.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={false}
|
||||
title="The barbershop Sedona remembers."
|
||||
description={[
|
||||
"Sedona Barber Shop feels different on purpose. The atmosphere is modern and chill, the service is personal, and the work speaks for itself.",
|
||||
"Clients mention trust, comfort, efficiency, and some of the best beard treatments and haircuts they’ve had in years.",
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwelve
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "s1",
|
||||
label: "$35+",
|
||||
title: "Signature Haircut",
|
||||
items: [
|
||||
"A refined, tailored cut shaped to your hair, face, style, and routine.",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
label: "$20+",
|
||||
title: "Beard Trim & Detail",
|
||||
items: [
|
||||
"Shape, line-up, clean edges, and beard care that elevates your whole look.",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
label: "$50+",
|
||||
title: "Haircut + Beard Combo",
|
||||
items: [
|
||||
"The complete refresh for clients who want to walk out polished, masculine, and camera-ready.",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "s4",
|
||||
label: "$25+",
|
||||
title: "Straight Razor Shave",
|
||||
items: [
|
||||
"Classic finishing work with a modern luxury feel.",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "s5",
|
||||
label: "$25+",
|
||||
title: "Kids’ Cuts",
|
||||
items: [
|
||||
"Patient, calm, and skilled service for younger clients.",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "s6",
|
||||
label: "Inquire",
|
||||
title: "Wedding/Event Grooming",
|
||||
items: [
|
||||
"Perfect for photos, big weekends, and special occasions.",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Signature Services"
|
||||
description="Professional grooming tailored to your style."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="experience" data-section="experience">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={false}
|
||||
title="What makes the experience different"
|
||||
description={[
|
||||
"Trusted for big moments: Wedding-day cuts and polished beard work when looking your best matters.",
|
||||
"Loved by locals and travelers: Repeat clients, Sedona regulars, and visitors needing same-day rescues.",
|
||||
"Confident, personal service: Friendly conversation and a stylist-barber approach that feels warm and skilled.",
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="reviews" data-section="reviews">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Wedding Grooming",
|
||||
quote: "Went in for a beard shave and left with one of the best cuts I’ve ever received… especially the day before my wedding.",
|
||||
name: "Sarah J.",
|
||||
role: "Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-caucasian-man-smiling-happy-standing-city_839833-10609.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Beard Mastery",
|
||||
quote: "Amazing, talented, knowledgeable cut and beard trim… I left with the best beard treatment I’ve ever had.",
|
||||
name: "Michael C.",
|
||||
role: "Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-bearded-man-xa_1163-2032.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Efficiency",
|
||||
quote: "Great experience… squeezed me in. Got right to it and was very efficient. One of the best haircuts I have had in awhile.",
|
||||
name: "David K.",
|
||||
role: "Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-businessman-conference-room-thinking-about-future_482257-25787.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
title: "Modern Vibe",
|
||||
quote: "I expected this place to be a traditional barber shop… I was so wrong. The music was chill and contemporary.",
|
||||
name: "Emily R.",
|
||||
role: "Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-getting-haircut_23-2148224309.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
title: "Skillful",
|
||||
quote: "Michele is incredibly skilled… best barber shop I’ve been to in years.",
|
||||
name: "Tina M.",
|
||||
role: "Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-young-caucasian-brunette-woman-white-shirt-looks-camera-holds-smartphone-sitting-table-with-coffee_197531-33244.jpg",
|
||||
},
|
||||
]}
|
||||
title="Client love, in their own words."
|
||||
description="See why locals and travelers trust us."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Visit Us"
|
||||
title="Book Your Appointment"
|
||||
description="123 Main Street, Sedona, AZ 86336 | (928) 555-1234. Walk-ins welcome when available."
|
||||
inputPlaceholder="Enter your email for reminders"
|
||||
buttonText="Request Appointment"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "Booking",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="Sedona Barber Shop"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
<ThemeProvider>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay navItems={navItems} brandName="Sedona Barber Shop" />
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Sharp cuts. Clean beards. Sedona confidence."
|
||||
description="Precision barbering with elevated energy. Whether you need a fresh fade, a beard clean-up, a wedding-ready finish, or a dependable cut while in town, Sedona Barber Shop delivers detail, personality, and results."
|
||||
tag="Sedona’s trusted cut + beard destination"
|
||||
buttons={[{ text: "Book Your Cut", href: "#contact" }, { text: "Call for Walk-Ins", href: "tel:9285551234" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/professional-hairdresser-sitting-barber-chair-waiting-customer_613910-3902.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={false}
|
||||
title="The barbershop Sedona remembers."
|
||||
description={["Sedona Barber Shop feels different on purpose. The atmosphere is modern and chill, the service is personal, and the work speaks for itself.", "Clients mention trust, comfort, efficiency, and some of the best beard treatments and haircuts they’ve had in years."]}
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwelve
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ id: "s1", label: "$35+", title: "Signature Haircut", items: ["A refined, tailored cut shaped to your hair, face, style, and routine."] },
|
||||
{ id: "s2", label: "$20+", title: "Beard Trim & Detail", items: ["Shape, line-up, clean edges, and beard care that elevates your whole look."] },
|
||||
{ id: "s3", label: "$50+", title: "Haircut + Beard Combo", items: ["The complete refresh for clients who want to walk out polished, masculine, and camera-ready."] },
|
||||
{ id: "s4", label: "$25+", title: "Straight Razor Shave", items: ["Classic finishing work with a modern luxury feel."] },
|
||||
{ id: "s5", label: "$25+", title: "Kids’ Cuts", items: ["Patient, calm, and skilled service for younger clients."] },
|
||||
{ id: "s6", label: "Inquire", title: "Wedding/Event Grooming", items: ["Perfect for photos, big weekends, and special occasions."] }
|
||||
]}
|
||||
title="Signature Services"
|
||||
description="Professional grooming tailored to your style."
|
||||
/>
|
||||
</div>
|
||||
<div id="experience" data-section="experience">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={false}
|
||||
title="What makes the experience different"
|
||||
description={["Trusted for big moments: Wedding-day cuts and polished beard work when looking your best matters.", "Loved by locals and travelers: Repeat clients, Sedona regulars, and visitors needing same-day rescues.", "Confident, personal service: Friendly conversation and a stylist-barber approach that feels warm and skilled."]}
|
||||
/>
|
||||
</div>
|
||||
<div id="reviews" data-section="reviews">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "1", title: "Wedding Grooming", quote: "Went in for a beard shave and left with one of the best cuts I’ve ever received… especially the day before my wedding.", name: "Sarah J.", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/young-caucasian-man-smiling-happy-standing-city_839833-10609.jpg" },
|
||||
{ id: "2", title: "Beard Mastery", quote: "Amazing, talented, knowledgeable cut and beard trim… I left with the best beard treatment I’ve ever had.", name: "Michael C.", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-bearded-man-xa_1163-2032.jpg" },
|
||||
{ id: "3", title: "Efficiency", quote: "Great experience… squeezed me in. Got right to it and was very efficient. One of the best haircuts I have had in awhile.", name: "David K.", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/portrait-businessman-conference-room-thinking-about-future_482257-25787.jpg" },
|
||||
{ id: "4", title: "Modern Vibe", quote: "I expected this place to be a traditional barber shop… I was so wrong. The music was chill and contemporary.", name: "Emily R.", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-getting-haircut_23-2148224309.jpg" },
|
||||
{ id: "5", title: "Skillful", quote: "Michele is incredibly skilled… best barber shop I’ve been to in years.", name: "Tina M.", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/modern-young-caucasian-brunette-woman-white-shirt-looks-camera-holds-smartphone-sitting-table-with-coffee_197531-33244.jpg" }
|
||||
]}
|
||||
title="Client love, in their own words."
|
||||
description="See why locals and travelers trust us."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Visit Us"
|
||||
title="Book Your Appointment"
|
||||
description="123 Main Street, Sedona, AZ 86336 | (928) 555-1234. Walk-ins welcome when available."
|
||||
inputPlaceholder="Enter your email for reminders"
|
||||
buttonText="Request Appointment"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[{ items: [{ label: "About", href: "#about" }, { label: "Services", href: "#services" }] }, { items: [{ label: "Contact", href: "#contact" }, { label: "Booking", href: "#contact" }] }]}
|
||||
logoText="Sedona Barber Shop"
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user