210 lines
8.1 KiB
TypeScript
210 lines
8.1 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
|
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
|
|
import TeamCardTwo from '@/components/sections/team/TeamCardTwo';
|
|
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
|
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
|
import { Scissors } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="icon-arrow"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="soft"
|
|
contentWidth="mediumLarge"
|
|
sizing="largeSmallSizeMediumTitles"
|
|
background="fluid"
|
|
cardStyle="soft-shadow"
|
|
primaryButtonStyle="primary-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "hero"},
|
|
{
|
|
name: "About", id: "about"},
|
|
{
|
|
name: "Services", id: "pricing"},
|
|
{
|
|
name: "Contact", id: "contact"},
|
|
]}
|
|
brandName="Paul Fox Gents Barbers"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardCarousel
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
title="Precision Grooming in the Heart of the City"
|
|
description="Welcome to Paul Fox Gents Barbers. Expert cuts, traditional techniques, and modern styling for the discerning gentleman."
|
|
tag="Since 2012"
|
|
buttons={[
|
|
{
|
|
text: "Book Your Appointment", href: "#contact"},
|
|
]}
|
|
mediaItems={[]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TestimonialAboutCard
|
|
useInvertedBackground={false}
|
|
tag="Our Story"
|
|
title="Crafting Quality Cuts for Over a Decade"
|
|
description="Paul Fox Gents Barbers combines traditional wet-shaving and classic cutting methods with contemporary hair trends. We believe in high standards, friendly service, and a relaxed environment."
|
|
subdescription="Whether it's a routine trim or a complete style overhaul, our team ensures every client leaves looking their absolute best."
|
|
mediaAnimation="slide-up"
|
|
icon={Scissors}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DO7oLccHB3LV3ekAgQXeoHNZqa/uploaded-1778143809298-gdmc45xf.jpg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardThree
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
plans={[
|
|
{
|
|
id: "p1", name: "Classic Cut", price: "£25", features: [
|
|
"Consultation", "Cut & Style", "Finished with premium pomade"],
|
|
buttons: [
|
|
{
|
|
text: "Book Now", href: "#contact"},
|
|
],
|
|
},
|
|
{
|
|
id: "p2", name: "Beard Trim & Shape", price: "£18", features: [
|
|
"Beard sculpting", "Hot towel treatment", "Oil treatment"],
|
|
buttons: [
|
|
{
|
|
text: "Book Now", href: "#contact"},
|
|
],
|
|
},
|
|
{
|
|
id: "p3", name: "Signature Full Service", price: "£45", features: [
|
|
"Haircut & Wash", "Hot Towel Shave", "Beard Grooming"],
|
|
buttons: [
|
|
{
|
|
text: "Book Now", href: "#contact"},
|
|
],
|
|
},
|
|
]}
|
|
title="Services & Pricing"
|
|
description="Transparent pricing for our signature grooming services."
|
|
/>
|
|
</div>
|
|
|
|
<div id="team" data-section="team">
|
|
<TeamCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
members={[
|
|
{
|
|
id: "m1", name: "Paul Fox", role: "Head Barber", description: "Expert in classic scissor cuts."},
|
|
{
|
|
id: "m2", name: "Jack Smith", role: "Senior Stylist", description: "Specialist in modern fades."},
|
|
{
|
|
id: "m3", name: "Sam Rivers", role: "Master Groomer", description: "Beard artistry expert."},
|
|
]}
|
|
title="Meet Our Master Barbers"
|
|
description="Our professionals are dedicated to precision and style."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonial" data-section="testimonial">
|
|
<TestimonialCardFive
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "t1", name: "Alex Miller", date: "Oct 2023", title: "Top Tier", quote: "Best trim in the city by far.", tag: "Regular", avatarSrc: ""},
|
|
{
|
|
id: "t2", name: "Jordan P.", date: "Sept 2023", title: "Professional", quote: "Great environment and consistent quality.", tag: "Regular", avatarSrc: ""},
|
|
{
|
|
id: "t3", name: "Chris B.", date: "Aug 2023", title: "Highly Recommend", quote: "Paul never misses on the beard trim.", tag: "Regular", avatarSrc: ""},
|
|
{
|
|
id: "t4", name: "Ryan D.", date: "July 2023", title: "Great Staff", quote: "Friendly vibes and clean shop.", tag: "New", avatarSrc: ""},
|
|
{
|
|
id: "t5", name: "Luke F.", date: "June 2023", title: "Excellent", quote: "Consistently great cuts and service.", tag: "Regular", avatarSrc: ""},
|
|
]}
|
|
title="What Our Clients Say"
|
|
description="See why our clients choose Paul Fox."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqDouble
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "f1", title: "Do I need an appointment?", content: "We recommend booking, but we accept walk-ins when available."},
|
|
{
|
|
id: "f2", title: "What are your hours?", content: "We are open Tue-Sat: 9am-6pm. Closed Sun/Mon."},
|
|
{
|
|
id: "f3", title: "Where are you located?", content: "Find us at 12 Barber Street, City Center."},
|
|
]}
|
|
title="Frequently Asked Questions"
|
|
description="Answers to common queries."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "plain"}}
|
|
title="Get In Touch"
|
|
description="Ready to look your best? Book a slot today."
|
|
mediaAnimation="slide-up"
|
|
tag="Bookings"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterSimple
|
|
columns={[
|
|
{
|
|
title: "Navigation", items: [
|
|
{
|
|
label: "Home", href: "#hero"},
|
|
{
|
|
label: "About", href: "#about"},
|
|
{
|
|
label: "Services", href: "#pricing"},
|
|
],
|
|
},
|
|
{
|
|
title: "Info", items: [
|
|
{
|
|
label: "Contact", href: "#contact"},
|
|
{
|
|
label: "Privacy", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
bottomLeftText="© 2024 Paul Fox Gents Barbers"
|
|
bottomRightText="12 Barber Street, City Center"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |