Compare commits
3 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| b8507df210 | |||
| 0301ce61ec | |||
| 06cbdccd51 |
276
src/app/page.tsx
276
src/app/page.tsx
@@ -7,7 +7,7 @@ import FaqBase from '@/components/sections/faq/FaqBase';
|
|||||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||||
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
||||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||||
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
|
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
|
||||||
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
||||||
|
|
||||||
@@ -26,68 +26,48 @@ export default function LandingPage() {
|
|||||||
headingFontWeight="bold"
|
headingFontWeight="bold"
|
||||||
>
|
>
|
||||||
<ReactLenis root>
|
<ReactLenis root>
|
||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav" className="fixed top-0 left-0 w-full z-50">
|
||||||
<NavbarStyleCentered
|
<NavbarLayoutFloatingOverlay
|
||||||
|
brandName="Jacksons"
|
||||||
navItems={[
|
navItems={[
|
||||||
{
|
{
|
||||||
name: "Home",
|
name: "Home", id: "hero"},
|
||||||
id: "hero",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "Services",
|
name: "Services", id: "services"},
|
||||||
id: "services",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "About",
|
name: "About", id: "about"},
|
||||||
id: "about",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "Contact",
|
name: "Contact", id: "contact"},
|
||||||
id: "contact",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
brandName="Jacksons"
|
button={{
|
||||||
|
text: "Book Now", href: "#contact"
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
<div id="hero" data-section="hero">
|
||||||
<HeroBillboardCarousel
|
<HeroBillboardCarousel
|
||||||
background={{
|
background={{
|
||||||
variant: "gradient-bars",
|
variant: "gradient-bars"}}
|
||||||
}}
|
|
||||||
title="Classic Cuts. Modern Style. Right Here in Balham."
|
title="Classic Cuts. Modern Style. Right Here in Balham."
|
||||||
description="Reliable, high-quality barbering with a friendly local touch. Open 7 days a week, walk-ins welcome."
|
description="Reliable, high-quality barbering with a friendly local touch. Open 7 days a week, walk-ins welcome."
|
||||||
buttons={[
|
buttons={[
|
||||||
{
|
{
|
||||||
text: "Visit Us Today",
|
text: "Visit Us Today", href: "#contact"},
|
||||||
href: "#contact",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
text: "View Services",
|
text: "View Services", href: "#services"},
|
||||||
href: "#services",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
mediaItems={[
|
mediaItems={[
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=1",
|
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=1", imageAlt: "Barber shop interior"},
|
||||||
imageAlt: "Barber shop interior",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=2",
|
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=2", imageAlt: "Barber shop tools"},
|
||||||
imageAlt: "Barber shop tools",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=3",
|
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=3", imageAlt: "Professional haircut"},
|
||||||
imageAlt: "Professional haircut",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=4",
|
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=4", imageAlt: "Clean barber station"},
|
||||||
imageAlt: "Clean barber station",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=5",
|
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=5", imageAlt: "Classic barber chair"},
|
||||||
imageAlt: "Classic barber chair",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -99,17 +79,11 @@ export default function LandingPage() {
|
|||||||
description="Jacksons is a trusted Balham institution built on experience, friendliness, and consistent quality. We treat every customer with the care they deserve."
|
description="Jacksons is a trusted Balham institution built on experience, friendliness, and consistent quality. We treat every customer with the care they deserve."
|
||||||
metrics={[
|
metrics={[
|
||||||
{
|
{
|
||||||
value: "20+",
|
value: "20+", title: "Years Experience"},
|
||||||
title: "Years Experience",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
value: "7",
|
value: "7", title: "Days Open"},
|
||||||
title: "Days Open",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
value: "100%",
|
value: "100%", title: "Commitment"},
|
||||||
title: "Commitment",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/hair-stylist-trimming-beard-aged-male-salon_23-2148181981.jpg?_wi=1"
|
imageSrc="http://img.b2bpic.net/free-photo/hair-stylist-trimming-beard-aged-male-salon_23-2148181981.jpg?_wi=1"
|
||||||
imageAlt="Jacksons Barber at work"
|
imageAlt="Jacksons Barber at work"
|
||||||
@@ -124,101 +98,15 @@ export default function LandingPage() {
|
|||||||
textboxLayout="split-description"
|
textboxLayout="split-description"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
plans={[
|
plans={[
|
||||||
{
|
{ id: "std", title: "Standard Haircut", price: "£22.00+", period: "30 mins", features: ["Traditional cut", "Expert styling"], button: { text: "Visit Us" } },
|
||||||
id: "basic",
|
{ id: "fade", title: "Skin Fade", price: "£26.00 - £36.00", period: "45 mins", features: ["Precision blend", "Skin fade"], button: { text: "Visit Us" } },
|
||||||
title: "Men’s Haircut",
|
{ id: "beard", title: "Beard Trim & Shape Up", price: "£15.00 - £16.00", period: "20 mins", features: ["Shape and edge", "Razor finish"], button: { text: "Visit Us" } },
|
||||||
price: "£25",
|
{ id: "shave", title: "Hot Towel Shave", price: "£18.00 - £23.00", period: "30 mins", features: ["Hot towel", "Traditional wet shave"], button: { text: "Visit Us" } },
|
||||||
period: "30 mins",
|
{ id: "kids", title: "Children/Kids Cut", price: "£17.00 - £21.00", period: "20 mins", features: ["Friendly trim", "Modern style"], button: { text: "Visit Us" } },
|
||||||
features: [
|
{ id: "wash", title: "Wash & Haircut", price: "£31.50 - £33.00", period: "45 mins", features: ["Deep cleanse", "Conditioning", "Full haircut"], button: { text: "Visit Us" } }
|
||||||
"Classic cut",
|
|
||||||
"Expert finish",
|
|
||||||
],
|
|
||||||
button: {
|
|
||||||
text: "Visit Us",
|
|
||||||
},
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=6",
|
|
||||||
imageAlt: "barber shop interior classic",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "wash",
|
|
||||||
title: "Wash & Haircut",
|
|
||||||
price: "£35",
|
|
||||||
period: "45 mins",
|
|
||||||
features: [
|
|
||||||
"Full wash",
|
|
||||||
"Conditioning",
|
|
||||||
"Style",
|
|
||||||
],
|
|
||||||
button: {
|
|
||||||
text: "Visit Us",
|
|
||||||
},
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/hair-stylist-trimming-beard-aged-male-salon_23-2148181981.jpg?_wi=2",
|
|
||||||
imageAlt: "professional barber cutting hair",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "beard",
|
|
||||||
title: "Beard Trim",
|
|
||||||
price: "£15",
|
|
||||||
period: "20 mins",
|
|
||||||
features: [
|
|
||||||
"Precision shaping",
|
|
||||||
"Hot towel",
|
|
||||||
],
|
|
||||||
button: {
|
|
||||||
text: "Visit Us",
|
|
||||||
},
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-hairdresser-shop_23-2149220544.jpg?_wi=1",
|
|
||||||
imageAlt: "happy customer haircut",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "shave",
|
|
||||||
title: "Wet Shave",
|
|
||||||
price: "£25",
|
|
||||||
period: "30 mins",
|
|
||||||
features: [
|
|
||||||
"Hot towel",
|
|
||||||
"Traditional razor",
|
|
||||||
],
|
|
||||||
button: {
|
|
||||||
text: "Visit Us",
|
|
||||||
},
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-barber-with-scissors-styling-old-man-hair_23-2148181945.jpg?_wi=1",
|
|
||||||
imageAlt: "father and son at barbershop",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "combo",
|
|
||||||
title: "Full Combo",
|
|
||||||
price: "£50",
|
|
||||||
period: "1 hr",
|
|
||||||
features: [
|
|
||||||
"Haircut",
|
|
||||||
"Wet Shave",
|
|
||||||
"Beard Trim",
|
|
||||||
],
|
|
||||||
button: {
|
|
||||||
text: "Visit Us",
|
|
||||||
},
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-getting-his-beard-styled-barber_23-2148985718.jpg?_wi=1",
|
|
||||||
imageAlt: "professional haircut results",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "kids",
|
|
||||||
title: "Children’s Cut",
|
|
||||||
price: "£18",
|
|
||||||
period: "20 mins",
|
|
||||||
features: [
|
|
||||||
"Standard trim",
|
|
||||||
"Friendly vibe",
|
|
||||||
],
|
|
||||||
button: {
|
|
||||||
text: "Visit Us",
|
|
||||||
},
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-shaving-his-beard_23-2148506239.jpg?_wi=1",
|
|
||||||
imageAlt: "man getting beard trim",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
title="Our Services"
|
title="Our Services"
|
||||||
description="Premium barbering at affordable prices."
|
description="Professional barbering for every need."
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -228,45 +116,15 @@ export default function LandingPage() {
|
|||||||
useInvertedBackground={true}
|
useInvertedBackground={true}
|
||||||
testimonials={[
|
testimonials={[
|
||||||
{
|
{
|
||||||
id: "1",
|
id: "1", title: "Top Service", quote: "Great haircut, top service every time. Highly recommended.", name: "Mark R.", role: "Resident", imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-hairdresser-shop_23-2149220544.jpg?_wi=2"},
|
||||||
title: "Top Service",
|
|
||||||
quote: "Great haircut, top service every time. Highly recommended.",
|
|
||||||
name: "Mark R.",
|
|
||||||
role: "Resident",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-hairdresser-shop_23-2149220544.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "2",
|
id: "2", title: "Friendly Staff", quote: "Friendly staff and consistent results. My regular local spot.", name: "David L.", role: "Local", imageSrc: "http://img.b2bpic.net/free-photo/professional-barber-with-scissors-styling-old-man-hair_23-2148181945.jpg?_wi=2"},
|
||||||
title: "Friendly Staff",
|
|
||||||
quote: "Friendly staff and consistent results. My regular local spot.",
|
|
||||||
name: "David L.",
|
|
||||||
role: "Local",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-barber-with-scissors-styling-old-man-hair_23-2148181945.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "3",
|
id: "3", title: "Great Experience", quote: "Good local barber, great for families. Safe and clean.", name: "James B.", role: "Parent", imageSrc: "http://img.b2bpic.net/free-photo/young-man-getting-his-beard-styled-barber_23-2148985718.jpg?_wi=2"},
|
||||||
title: "Great Experience",
|
|
||||||
quote: "Good local barber, great for families. Safe and clean.",
|
|
||||||
name: "James B.",
|
|
||||||
role: "Parent",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-getting-his-beard-styled-barber_23-2148985718.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "4",
|
id: "4", title: "Professional", quote: "Extremely professional, reliable, and always on point.", name: "Simon T.", role: "Professional", imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-shaving-his-beard_23-2148506239.jpg?_wi=2"},
|
||||||
title: "Professional",
|
|
||||||
quote: "Extremely professional, reliable, and always on point.",
|
|
||||||
name: "Simon T.",
|
|
||||||
role: "Professional",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-shaving-his-beard_23-2148506239.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "5",
|
id: "5", title: "Best Cut", quote: "Been coming here for years, always consistent.", name: "Liam K.", role: "Regular", imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-hairdresser-shop_23-2149220544.jpg?_wi=3"},
|
||||||
title: "Best Cut",
|
|
||||||
quote: "Been coming here for years, always consistent.",
|
|
||||||
name: "Liam K.",
|
|
||||||
role: "Regular",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-hairdresser-shop_23-2149220544.jpg?_wi=3",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
title="What Our Locals Say"
|
title="What Our Locals Say"
|
||||||
description="Proven consistency for the Balham community."
|
description="Proven consistency for the Balham community."
|
||||||
@@ -279,20 +137,11 @@ export default function LandingPage() {
|
|||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
faqs={[
|
faqs={[
|
||||||
{
|
{
|
||||||
id: "h1",
|
id: "h1", title: "Mon – Fri", content: "9:00 AM – 8:00 PM"},
|
||||||
title: "Mon – Fri",
|
|
||||||
content: "9:00 AM – 8:00 PM",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "h2",
|
id: "h2", title: "Saturday", content: "8:30 AM – 7:00 PM"},
|
||||||
title: "Saturday",
|
|
||||||
content: "8:30 AM – 7:00 PM",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "h3",
|
id: "h3", title: "Sunday", content: "10:00 AM – 5:00 PM"},
|
||||||
title: "Sunday",
|
|
||||||
content: "10:00 AM – 5:00 PM",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
title="Opening Hours"
|
title="Opening Hours"
|
||||||
description="Find us when it suits you."
|
description="Find us when it suits you."
|
||||||
@@ -307,20 +156,12 @@ export default function LandingPage() {
|
|||||||
description="Located at 123 Balham High Road. Walk-ins always welcome—no appointment necessary."
|
description="Located at 123 Balham High Road. Walk-ins always welcome—no appointment necessary."
|
||||||
inputs={[
|
inputs={[
|
||||||
{
|
{
|
||||||
name: "name",
|
name: "name", type: "text", placeholder: "Your Name"},
|
||||||
type: "text",
|
|
||||||
placeholder: "Your Name",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "email",
|
name: "email", type: "email", placeholder: "Your Email"},
|
||||||
type: "email",
|
|
||||||
placeholder: "Your Email",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
textarea={{
|
textarea={{
|
||||||
name: "message",
|
name: "message", placeholder: "Any special requests?"}}
|
||||||
placeholder: "Any special requests?",
|
|
||||||
}}
|
|
||||||
buttonText="Get Directions"
|
buttonText="Get Directions"
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/hair-stylist-trimming-beard-aged-male-salon_23-2148181981.jpg?_wi=3"
|
imageSrc="http://img.b2bpic.net/free-photo/hair-stylist-trimming-beard-aged-male-salon_23-2148181981.jpg?_wi=3"
|
||||||
mediaAnimation="slide-up"
|
mediaAnimation="slide-up"
|
||||||
@@ -332,46 +173,29 @@ export default function LandingPage() {
|
|||||||
imageSrc="http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=7"
|
imageSrc="http://img.b2bpic.net/free-photo/barber-tools-wallpaper-pattern-wooden-background-job-career-concept_53876-143260.jpg?_wi=7"
|
||||||
columns={[
|
columns={[
|
||||||
{
|
{
|
||||||
title: "Shop Info",
|
title: "Shop Info", items: [
|
||||||
items: [
|
|
||||||
{
|
{
|
||||||
label: "Balham Barber",
|
label: "Balham Barber", href: "#hero"},
|
||||||
href: "#hero",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: "Services",
|
label: "Services", href: "#services"},
|
||||||
href: "#services",
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Hours",
|
title: "Hours", items: [
|
||||||
items: [
|
|
||||||
{
|
{
|
||||||
label: "Mon-Fri: 9-8",
|
label: "Mon-Fri: 9-8", href: "#hours"},
|
||||||
href: "#hours",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: "Sat: 8:30-7",
|
label: "Sat: 8:30-7", href: "#hours"},
|
||||||
href: "#hours",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: "Sun: 10-5",
|
label: "Sun: 10-5", href: "#hours"},
|
||||||
href: "#hours",
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Location",
|
title: "Location", items: [
|
||||||
items: [
|
|
||||||
{
|
{
|
||||||
label: "123 Balham High Road",
|
label: "123 Balham High Road", href: "#contact"},
|
||||||
href: "#contact",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: "London, SW12 9AR",
|
label: "London, SW12 9AR", href: "#contact"},
|
||||||
href: "#contact",
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
|
|||||||
Reference in New Issue
Block a user