Compare commits
11 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 4d87759c06 | |||
| 5168a5cfa1 | |||
| 21a9dd2de9 | |||
| 1dd4b7fdeb | |||
| 60a954b01b | |||
| 582cdee74d | |||
| f2313a01a0 | |||
| 33ef5db7f8 | |||
| 1fdcc85817 | |||
| bcc4522657 | |||
| 5b2d26cb6f |
@@ -4,7 +4,6 @@ import { Inter } from "next/font/google";
|
|||||||
import "./globals.css";
|
import "./globals.css";
|
||||||
import "@/lib/gsap-setup";
|
import "@/lib/gsap-setup";
|
||||||
import { ServiceWrapper } from "@/components/ServiceWrapper";
|
import { ServiceWrapper } from "@/components/ServiceWrapper";
|
||||||
import Tag from "@/tag/Tag";
|
|
||||||
import { getVisualEditScript } from "@/utils/visual-edit-script";
|
import { getVisualEditScript } from "@/utils/visual-edit-script";
|
||||||
import { Manrope } from "next/font/google";
|
import { Manrope } from "next/font/google";
|
||||||
import { DM_Sans } from "next/font/google";
|
import { DM_Sans } from "next/font/google";
|
||||||
@@ -39,7 +38,7 @@ export default function RootLayout({
|
|||||||
<html lang="en" suppressHydrationWarning>
|
<html lang="en" suppressHydrationWarning>
|
||||||
<ServiceWrapper>
|
<ServiceWrapper>
|
||||||
<body className={`${manrope.variable} ${dmSans.variable} antialiased`}>
|
<body className={`${manrope.variable} ${dmSans.variable} antialiased`}>
|
||||||
<Tag />
|
|
||||||
{children}
|
{children}
|
||||||
<script
|
<script
|
||||||
dangerouslySetInnerHTML={{
|
dangerouslySetInnerHTML={{
|
||||||
|
|||||||
290
src/app/page.tsx
290
src/app/page.tsx
@@ -31,29 +31,17 @@ export default function LandingPage() {
|
|||||||
<NavbarLayoutFloatingOverlay
|
<NavbarLayoutFloatingOverlay
|
||||||
navItems={[
|
navItems={[
|
||||||
{
|
{
|
||||||
name: "About",
|
name: "About", id: "#about"},
|
||||||
id: "#about",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "Services",
|
name: "Services", id: "#services"},
|
||||||
id: "#services",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "Team",
|
name: "Team", id: "#team"},
|
||||||
id: "#team",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "Testimonials",
|
name: "Testimonials", id: "#testimonials"},
|
||||||
id: "#testimonials",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "FAQ",
|
name: "FAQ", id: "#faq"},
|
||||||
id: "#faq",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "Contact",
|
name: "Contact", id: "#contact"},
|
||||||
id: "#contact",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
brandName="Lackawanna"
|
brandName="Lackawanna"
|
||||||
/>
|
/>
|
||||||
@@ -62,72 +50,38 @@ export default function LandingPage() {
|
|||||||
<div id="hero" data-section="hero">
|
<div id="hero" data-section="hero">
|
||||||
<HeroSplitKpi
|
<HeroSplitKpi
|
||||||
background={{
|
background={{
|
||||||
variant: "downward-rays-static",
|
variant: "downward-rays-static"}}
|
||||||
}}
|
|
||||||
title="Classic Style, Contemporary Precision."
|
title="Classic Style, Contemporary Precision."
|
||||||
description="At Lackawanna, we blend old-school charm with modern barbering. Experience the best cut in Morristown from barbers who actually care about your look."
|
description="At Lackawanna, we blend old-school charm with modern barbering. Experience the best cut in Morristown from barbers who actually care about your look."
|
||||||
kpis={[
|
kpis={[
|
||||||
{
|
{
|
||||||
value: "20+",
|
value: "20+", label: "Years Experience"},
|
||||||
label: "Years Experience",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
value: "10/10",
|
value: "10/10", label: "Recommend Rate"},
|
||||||
label: "Recommend Rate",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
value: "100%",
|
value: "100%", label: "Satisfaction"},
|
||||||
label: "Satisfaction",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
enableKpiAnimation={true}
|
enableKpiAnimation={true}
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/barber-shop-retro-vintage-style_1150-17931.jpg"
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CRaO5i0elf1aDIpszoFKWNR31x/uploaded-1776352201800-hefnk77v.jpg"
|
||||||
imageAlt="Lackawanna Barber Shop Interior"
|
imageAlt="Lackawanna Barber Shop"
|
||||||
mediaAnimation="slide-up"
|
mediaAnimation="slide-up"
|
||||||
avatars={[
|
avatars={[
|
||||||
{
|
{
|
||||||
src: "http://img.b2bpic.net/free-photo/retro-theatre-scene-celebrate-world-theatre-day_23-2151211458.jpg",
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CRaO5i0elf1aDIpszoFKWNR31x/uploaded-1776352201800-hefnk77v.jpg", alt: "Barber shop interior"},
|
||||||
alt: "Retro theatre scene to celebrate world theatre day",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
src: "http://img.b2bpic.net/free-photo/tall-bar-stool-wooden-background_181624-30147.jpg",
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CRaO5i0elf1aDIpszoFKWNR31x/uploaded-1776352201801-bp8o0yyb.jpg", alt: "Detail view"},
|
||||||
alt: "Tall bar stool on a wooden background",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
src: "http://img.b2bpic.net/free-photo/hair-salon-chair-with-towel-armchair_23-2148242777.jpg",
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CRaO5i0elf1aDIpszoFKWNR31x/uploaded-1776352201801-l2nw3w51.jpg", alt: "Chair and tools"},
|
||||||
alt: "Hair salon chair with towel on armchair",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
src: "http://img.b2bpic.net/free-photo/retro-world-theatre-day-scenes-with-backstage_23-2151211363.jpg",
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CRaO5i0elf1aDIpszoFKWNR31x/uploaded-1776352201801-opcyony6.jpg", alt: "Shop perspective"},
|
||||||
alt: "Retro world theatre day scenes with a backstage",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
src: "http://img.b2bpic.net/free-photo/client-barber-greeting-each-other-barbershop_23-2148181951.jpg",
|
|
||||||
alt: "Client and barber greeting each other at barbershop",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
avatarText="Join 500+ satisfied clients"
|
avatarText="Join 500+ satisfied clients"
|
||||||
marqueeItems={[
|
marqueeItems={[
|
||||||
{
|
{ type: "text", text: "Classic Cuts" },
|
||||||
type: "text",
|
{ type: "text", text: "Hot Towel Shave" },
|
||||||
text: "Classic Cuts",
|
{ type: "text", text: "Beard Grooming" },
|
||||||
},
|
{ type: "text", text: "Expert Fades" },
|
||||||
{
|
{ type: "text", text: "Precision Styling" },
|
||||||
type: "text",
|
|
||||||
text: "Hot Towel Shave",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: "Beard Grooming",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: "Expert Fades",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: "Precision Styling",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -140,19 +94,13 @@ export default function LandingPage() {
|
|||||||
description="We are a throwback barber shop where you can get a classic men's cut, beard trim, or a hot towel shave. We treat you like family, ensuring you leave with both the cut you wanted and the confidence you deserve."
|
description="We are a throwback barber shop where you can get a classic men's cut, beard trim, or a hot towel shave. We treat you like family, ensuring you leave with both the cut you wanted and the confidence you deserve."
|
||||||
bulletPoints={[
|
bulletPoints={[
|
||||||
{
|
{
|
||||||
title: "Old School Values",
|
title: "Old School Values", description: "Classic techniques combined with current styling trends."},
|
||||||
description: "Classic techniques combined with current styling trends.",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: "Warm Environment",
|
title: "Warm Environment", description: "Friendly, sociable atmosphere where you feel right at home."},
|
||||||
description: "Friendly, sociable atmosphere where you feel right at home.",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: "Expert Care",
|
title: "Expert Care", description: "Knowledgeable barbers who understand every hair type."},
|
||||||
description: "Knowledgeable barbers who understand every hair type.",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/side-view-man-hair-salon_23-2150665451.jpg"
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CRaO5i0elf1aDIpszoFKWNR31x/uploaded-1776352201801-bp8o0yyb.jpg"
|
||||||
mediaAnimation="blur-reveal"
|
mediaAnimation="blur-reveal"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -164,56 +112,16 @@ export default function LandingPage() {
|
|||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
plans={[
|
plans={[
|
||||||
{
|
{
|
||||||
id: "basic",
|
id: "basic", badge: "Classic", price: "$40", subtitle: "Precision Haircut", buttons: [{ text: "Walk-in Only", href: "#contact" }],
|
||||||
badge: "Classic",
|
features: ["Classic Scissor Cut", "Modern Styling", "Expert Consultation"],
|
||||||
price: "$40",
|
|
||||||
subtitle: "Precision Haircut",
|
|
||||||
buttons: [
|
|
||||||
{
|
|
||||||
text: "Walk-in Only",
|
|
||||||
href: "#contact",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Classic Scissor Cut",
|
|
||||||
"Modern Styling",
|
|
||||||
"Expert Consultation",
|
|
||||||
],
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "pro",
|
id: "pro", badge: "Premium", price: "$75", subtitle: "Full Grooming Experience", buttons: [{ text: "Walk-in Only", href: "#contact" }],
|
||||||
badge: "Premium",
|
features: ["Precision Haircut", "Beard Trim", "Hot Towel Service", "Relaxed Refresh"],
|
||||||
price: "$75",
|
|
||||||
subtitle: "Full Grooming Experience",
|
|
||||||
buttons: [
|
|
||||||
{
|
|
||||||
text: "Walk-in Only",
|
|
||||||
href: "#contact",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Precision Haircut",
|
|
||||||
"Beard Trim",
|
|
||||||
"Hot Towel Service",
|
|
||||||
"Relaxed Refresh",
|
|
||||||
],
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "kids",
|
id: "kids", badge: "Family", price: "$30", subtitle: "Youth Haircut", buttons: [{ text: "Walk-in Only", href: "#contact" }],
|
||||||
badge: "Family",
|
features: ["Gentle Scissor Cut", "Fast Friendly Service", "Classic Style"],
|
||||||
price: "$30",
|
|
||||||
subtitle: "Youth Haircut",
|
|
||||||
buttons: [
|
|
||||||
{
|
|
||||||
text: "Walk-in Only",
|
|
||||||
href: "#contact",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Gentle Scissor Cut",
|
|
||||||
"Fast Friendly Service",
|
|
||||||
"Classic Style",
|
|
||||||
],
|
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
title="Quality Service, Transparent Price"
|
title="Quality Service, Transparent Price"
|
||||||
@@ -228,26 +136,12 @@ export default function LandingPage() {
|
|||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
team={[
|
team={[
|
||||||
{
|
{
|
||||||
id: "t1",
|
id: "t1", name: "John Franco", role: "Master Barber", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CRaO5i0elf1aDIpszoFKWNR31x/uploaded-1776352542504-tkr21jqa.png"},
|
||||||
name: "John Franco",
|
|
||||||
role: "Master Barber",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/pleased-looking-down-young-beautiful-female-barber-uniform-wearing-glasses-combing-hair-isolated-blue-wall_141793-106074.jpg",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "t2",
|
id: "t2", name: "Elio", role: "Old School Specialist", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CRaO5i0elf1aDIpszoFKWNR31x/uploaded-1776352566826-2nyt55b1.jpg"},
|
||||||
name: "Elio",
|
|
||||||
role: "Old School Specialist",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-with-tattoo-his-face-with-crossed-arms-dressed-white-shirt-grey-background_613910-1374.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "t3",
|
|
||||||
name: "The New Crew",
|
|
||||||
role: "Modern Stylists",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-making-haircut_23-2149220581.jpg",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
title="Meet Your Barbers"
|
title="Meet Your Staff"
|
||||||
description="Classy, skilled, and sociable – our team is here to give you the best experience in Morristown."
|
description="Our dedicated team is here to ensure you get the absolute best service in Morristown."
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -257,60 +151,13 @@ export default function LandingPage() {
|
|||||||
textboxLayout="split-description"
|
textboxLayout="split-description"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
testimonials={[
|
testimonials={[
|
||||||
{
|
{ id: "1", name: "Barry H.", role: "Loyal Customer", company: "FL", rating: 5 },
|
||||||
id: "1",
|
{ id: "2", name: "Melissa C.", role: "Regular Client", company: "NY", rating: 5 },
|
||||||
name: "Barry H.",
|
|
||||||
role: "Loyal Customer",
|
|
||||||
company: "FL, FL",
|
|
||||||
rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-black-polo-shirt-swinging-paint-brush-with-aggressive-expression-standing-white-background_141793-20662.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "2",
|
|
||||||
name: "Melissa C.",
|
|
||||||
role: "Regular Client",
|
|
||||||
company: "New York, NY",
|
|
||||||
rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/back-view-father-son-shaving_23-2149434975.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3",
|
|
||||||
name: "Aidan D.",
|
|
||||||
role: "Customer",
|
|
||||||
company: "Morristown, NJ",
|
|
||||||
rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-men-bachelor-party_23-2149275459.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "4",
|
|
||||||
name: "Justin D.",
|
|
||||||
role: "Long-time Client",
|
|
||||||
company: "Morristown, NJ",
|
|
||||||
rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/drunk-friends-call-waiter_171337-19383.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "5",
|
|
||||||
name: "Jay V.",
|
|
||||||
role: "First-time Visitor",
|
|
||||||
company: "Little Falls, NJ",
|
|
||||||
rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/excited-young-male-barber-wearing-glasses-red-shirt-barber-apron-holding-barbering-tools-looking-camera-showing-thumb-up-isolated-blue-background_141793-138548.jpg",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
kpiItems={[
|
kpiItems={[
|
||||||
{
|
{ value: "100+", label: "Weekly Cuts" },
|
||||||
value: "100+",
|
{ value: "20+", label: "Years Served" },
|
||||||
label: "Weekly Cuts",
|
{ value: "5★", label: "Rating Average" },
|
||||||
},
|
|
||||||
{
|
|
||||||
value: "20+",
|
|
||||||
label: "Years Served",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: "5★",
|
|
||||||
label: "Rating Average",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
title="What Our Clients Say"
|
title="What Our Clients Say"
|
||||||
description="We are proud to serve our community and deliver the best cuts in town."
|
description="We are proud to serve our community and deliver the best cuts in town."
|
||||||
@@ -321,21 +168,8 @@ export default function LandingPage() {
|
|||||||
<FaqSplitText
|
<FaqSplitText
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
faqs={[
|
faqs={[
|
||||||
{
|
{ id: "q1", title: "Do you accept appointments?", content: "We operate primarily as a walk-in shop to maintain that classic, casual vibe." },
|
||||||
id: "q1",
|
{ id: "q2", title: "Is it cash only?", content: "Yes, we are a classic cash-only establishment." },
|
||||||
title: "Do you accept appointments?",
|
|
||||||
content: "We operate primarily as a walk-in shop to maintain that classic, casual vibe.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "q2",
|
|
||||||
title: "Is it cash only?",
|
|
||||||
content: "Yes, we are a classic cash-only establishment.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "q3",
|
|
||||||
title: "Are you a salon or a barber shop?",
|
|
||||||
content: "We are a traditional barber shop – no salon fluff, just great cuts.",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
sideTitle="Common Questions"
|
sideTitle="Common Questions"
|
||||||
faqsAnimation="blur-reveal"
|
faqsAnimation="blur-reveal"
|
||||||
@@ -345,16 +179,9 @@ export default function LandingPage() {
|
|||||||
<div id="contact" data-section="contact">
|
<div id="contact" data-section="contact">
|
||||||
<ContactText
|
<ContactText
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
background={{
|
background={{ variant: "sparkles-gradient" }}
|
||||||
variant: "sparkles-gradient",
|
|
||||||
}}
|
|
||||||
text="Ready for your next haircut? Stop by the shop today and meet the team. We look forward to seeing you!"
|
text="Ready for your next haircut? Stop by the shop today and meet the team. We look forward to seeing you!"
|
||||||
buttons={[
|
buttons={[{ text: "+1 (973) 538-1675", href: "tel:+19735381675" }]}
|
||||||
{
|
|
||||||
text: "Visit Us Today",
|
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -362,32 +189,7 @@ export default function LandingPage() {
|
|||||||
<FooterBaseReveal
|
<FooterBaseReveal
|
||||||
logoText="Lackawanna Barber Shop"
|
logoText="Lackawanna Barber Shop"
|
||||||
columns={[
|
columns={[
|
||||||
{
|
{ title: "Shop", items: [{ label: "Morristown, NJ", href: "#" }] },
|
||||||
title: "Shop",
|
|
||||||
items: [
|
|
||||||
{
|
|
||||||
label: "Morristown, NJ",
|
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "Cash Only",
|
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Social",
|
|
||||||
items: [
|
|
||||||
{
|
|
||||||
label: "Instagram",
|
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "Facebook",
|
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
copyrightText="© 2024 Lackawanna Barber Shop. All rights reserved."
|
copyrightText="© 2024 Lackawanna Barber Shop. All rights reserved."
|
||||||
/>
|
/>
|
||||||
@@ -395,4 +197,4 @@ export default function LandingPage() {
|
|||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user