Merge version_1 into main #1
253
src/app/page.tsx
253
src/app/page.tsx
@@ -12,7 +12,7 @@ import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
|
||||
import TeamCardTen from '@/components/sections/team/TeamCardTen';
|
||||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||||
import TextAbout from '@/components/sections/about/TextAbout';
|
||||
import { Award, Scissors, Smile } from "lucide-react";
|
||||
import { Award, Scissors, Smile, Star, Zap } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -32,69 +32,29 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Team",
|
||||
id: "team",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Team", id: "team" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Backalive"
|
||||
button={{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="Timeless Grooming. Backalive."
|
||||
description="Experience the classic art of the barbershop, refined for the modern gentleman. Where style meets tradition."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Book Appointment", href: "#contact" }]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=y4a2ds",
|
||||
imageAlt: "barber shop interior premium",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6igbmb",
|
||||
imageAlt: "barber shop interior premium",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z1zg5o",
|
||||
imageAlt: "barber shop interior premium",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=tt29pc",
|
||||
imageAlt: "barber shop interior premium",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=nl37m5",
|
||||
imageAlt: "barber shop interior premium",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=lwroo5",
|
||||
imageAlt: "barber shop interior premium",
|
||||
},
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=y4a2ds", imageAlt: "barber shop interior premium" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6igbmb", imageAlt: "barber shop interior premium" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z1zg5o", imageAlt: "barber shop interior premium" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=tt29pc", imageAlt: "barber shop interior premium" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=nl37m5", imageAlt: "barber shop interior premium" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=lwroo5", imageAlt: "barber shop interior premium" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -103,12 +63,7 @@ export default function LandingPage() {
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Where Tradition Meets Modernity"
|
||||
buttons={[
|
||||
{
|
||||
text: "Our Services",
|
||||
href: "#services",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Our Services", href: "#services" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -117,30 +72,10 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Precision Cuts",
|
||||
description: "Tailored haircuts to match your unique style.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=iuxeya",
|
||||
buttonIcon: "Scissors",
|
||||
},
|
||||
{
|
||||
title: "Royal Shave",
|
||||
description: "Relaxing hot towel straight razor service.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=h9w0pg",
|
||||
buttonIcon: "Zap",
|
||||
},
|
||||
{
|
||||
title: "Beard Sculpting",
|
||||
description: "Expert grooming for the perfect beard line.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=u0rhz9",
|
||||
buttonIcon: "Star",
|
||||
},
|
||||
{
|
||||
title: "Scalp Therapy",
|
||||
description: "Revitalizing treatments for healthy hair.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=a3lu5s",
|
||||
buttonIcon: "Award",
|
||||
},
|
||||
{ title: "Precision Cuts", description: "Tailored haircuts to match your unique style.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=iuxeya", buttonIcon: Scissors },
|
||||
{ title: "Royal Shave", description: "Relaxing hot towel straight razor service.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=h9w0pg", buttonIcon: Zap },
|
||||
{ title: "Beard Sculpting", description: "Expert grooming for the perfect beard line.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=u0rhz9", buttonIcon: Star },
|
||||
{ title: "Scalp Therapy", description: "Revitalizing treatments for healthy hair.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=a3lu5s", buttonIcon: Award },
|
||||
]}
|
||||
title="Signature Grooming"
|
||||
description="Excellence in every cut and shave."
|
||||
@@ -154,21 +89,9 @@ export default function LandingPage() {
|
||||
tag="Expert Groomers"
|
||||
membersAnimation="slide-up"
|
||||
members={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Marcus",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=32ixz4",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Elena",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ihhya4",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Jordan",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=spp1uj",
|
||||
},
|
||||
{ id: "1", name: "Marcus", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=32ixz4" },
|
||||
{ id: "2", name: "Elena", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ihhya4" },
|
||||
{ id: "3", name: "Jordan", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=spp1uj" },
|
||||
]}
|
||||
memberVariant="card"
|
||||
/>
|
||||
@@ -180,39 +103,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "cut",
|
||||
badge: "Popular",
|
||||
price: "$35",
|
||||
subtitle: "Haircut",
|
||||
features: [
|
||||
"Precision cut",
|
||||
"Hot towel",
|
||||
"Style",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "shave",
|
||||
badge: "Add-on",
|
||||
price: "$25",
|
||||
subtitle: "Hot Shave",
|
||||
features: [
|
||||
"Straight razor",
|
||||
"Steam towel",
|
||||
"Aftercare",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "full",
|
||||
badge: "Full Pack",
|
||||
price: "$55",
|
||||
subtitle: "The Backalive",
|
||||
features: [
|
||||
"Haircut & beard",
|
||||
"Scalp treatment",
|
||||
"Hot towel",
|
||||
],
|
||||
},
|
||||
{ id: "cut", badge: "Popular", price: "$35", subtitle: "Haircut", features: ["Precision cut", "Hot towel", "Style"] },
|
||||
{ id: "shave", badge: "Add-on", price: "$25", subtitle: "Hot Shave", features: ["Straight razor", "Steam towel", "Aftercare"] },
|
||||
{ id: "full", badge: "Full Pack", price: "$55", subtitle: "The Backalive", features: ["Haircut & beard", "Scalp treatment", "Hot towel"] },
|
||||
]}
|
||||
title="Pricing & Services"
|
||||
description="Professional grooming for every budget."
|
||||
@@ -225,24 +118,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
icon: Smile,
|
||||
title: "Happy Clients",
|
||||
value: "5000+",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
icon: Scissors,
|
||||
title: "Cuts Weekly",
|
||||
value: "200+",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
icon: Award,
|
||||
title: "Years Experience",
|
||||
value: "10+",
|
||||
},
|
||||
{ id: "1", icon: Smile, title: "Happy Clients", value: "5000+" },
|
||||
{ id: "2", icon: Scissors, title: "Cuts Weekly", value: "200+" },
|
||||
{ id: "3", icon: Award, title: "Years Experience", value: "10+" },
|
||||
]}
|
||||
title="By The Numbers"
|
||||
description="Trusted by our community."
|
||||
@@ -255,49 +133,15 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alex R.",
|
||||
handle: "@alex",
|
||||
testimonial: "Best fade I've ever had, hands down.",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=b47nd2",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Jordan P.",
|
||||
handle: "@jordan",
|
||||
testimonial: "The hot towel shave is a must try.",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9ikq38",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Casey T.",
|
||||
handle: "@casey",
|
||||
testimonial: "Super clean and professional spot.",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=mfxaxi",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Sam K.",
|
||||
handle: "@sam",
|
||||
testimonial: "Finally found my permanent barber.",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6ks37z",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Riley D.",
|
||||
handle: "@riley",
|
||||
testimonial: "Always consistent and friendly team.",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ugyp1l",
|
||||
},
|
||||
{ id: "1", name: "Alex R.", handle: "@alex", testimonial: "Best fade I've ever had, hands down.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=b47nd2" },
|
||||
{ id: "2", name: "Jordan P.", handle: "@jordan", testimonial: "The hot towel shave is a must try.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9ikq38" },
|
||||
{ id: "3", name: "Casey T.", handle: "@casey", testimonial: "Super clean and professional spot.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=mfxaxi" },
|
||||
{ id: "4", name: "Sam K.", handle: "@sam", testimonial: "Finally found my permanent barber.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6ks37z" },
|
||||
{ id: "5", name: "Riley D.", handle: "@riley", testimonial: "Always consistent and friendly team.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ugyp1l" },
|
||||
]}
|
||||
showRating={true}
|
||||
title="Words From Our Community"
|
||||
description="What our clients say about us."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -307,23 +151,10 @@ export default function LandingPage() {
|
||||
title="Visit Us Today"
|
||||
description="Walk-ins welcome, or book ahead."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Your Email",
|
||||
required: true,
|
||||
},
|
||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Any special requests?",
|
||||
}}
|
||||
textarea={{ name: "message", placeholder: "Any special requests?" }}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=1srn2y"
|
||||
/>
|
||||
</div>
|
||||
@@ -331,14 +162,8 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Backalive Barbershop"
|
||||
leftLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
leftLink={{ text: "Terms of Service", href: "#" }}
|
||||
rightLink={{ text: "Privacy Policy", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
Reference in New Issue
Block a user