Merge version_1 into main #2
292
src/app/page.tsx
292
src/app/page.tsx
@@ -32,64 +32,26 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Team",
|
||||
id: "team",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Team", id: "team" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Fade Factory ATL"
|
||||
button={{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Precision Cuts in the Heart of ATL"
|
||||
description="Fade Factory ATL is your premier destination for high-end men's grooming. Experience the art of the perfect fade."
|
||||
tag="Atlanta's Best Barbershop"
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairclips-scissors-bag_23-2147778856.jpg?_wi=1",
|
||||
imageAlt: "Barber shop interior modern",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-barber-s-instruments-shop_23-2149186524.jpg?_wi=1",
|
||||
imageAlt: "Barber tools on station",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-shop-tools-arrangement_23-2149167448.jpg",
|
||||
imageAlt: "Barber shop tools arrangement",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylist-cutting-beard-faceless-client_23-2147778868.jpg",
|
||||
imageAlt: "Stylist cutting beard of faceless client",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/mid-section-barber-wiping-clients-face-with-hot-towel_107420-94798.jpg",
|
||||
imageAlt: "Mid section on barber wiping clients face with hot towel",
|
||||
},
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/hairclips-scissors-bag_23-2147778856.jpg", imageAlt: "Barber shop interior modern" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/high-angle-barber-s-instruments-shop_23-2149186524.jpg", imageAlt: "Barber tools on station" }
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
@@ -102,21 +64,9 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
title="Why Fade Factory?"
|
||||
metrics={[
|
||||
{
|
||||
label: "Years in Business",
|
||||
value: "10+",
|
||||
icon: Award,
|
||||
},
|
||||
{
|
||||
label: "Happy Clients",
|
||||
value: "5K+",
|
||||
icon: Users,
|
||||
},
|
||||
{
|
||||
label: "Barbers on Staff",
|
||||
value: "12",
|
||||
icon: Scissors,
|
||||
},
|
||||
{ label: "Years in Business", value: "10+", icon: Award },
|
||||
{ label: "Happy Clients", value: "5K+", icon: Users },
|
||||
{ label: "Barbers on Staff", value: "12", icon: Scissors },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -129,46 +79,16 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Premium Grooming",
|
||||
description: "Top-tier cuts, beard trims, and hot towel treatments.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/angry-young-barber-wearing-uniform-glasses-holding-teaser-comb-hair-trimmer-looking-camera-showing-thumb-down-isolated-blue-background_141793-138706.jpg",
|
||||
imageAlt: "barber booking app mobile",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/imposing-bearded-man-is-standing-table-he-is-wearing-shirt-suspender-he-has-tattoes-his-arms-neck-he-is-holding-tablet-cup-coffee-man-is-reading_613910-20730.jpg",
|
||||
imageAlt: "hair style gallery app",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairclips-scissors-bag_23-2147778856.jpg?_wi=2",
|
||||
imageAlt: "barber booking app mobile",
|
||||
title: "Premium Grooming", description: "Top-tier cuts, beard trims, and hot towel treatments.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/angry-young-barber-wearing-uniform-glasses-holding-teaser-comb-hair-trimmer-looking-camera-showing-thumb-down-isolated-blue-background_141793-138706.jpg", imageAlt: "barber booking app mobile" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/imposing-bearded-man-is-standing-table-he-is-wearing-shirt-suspender-he-has-tattoes-his-arms-neck-he-is-holding-tablet-cup-coffee-man-is-reading_613910-20730.jpg", imageAlt: "hair style gallery app" }
|
||||
},
|
||||
{
|
||||
title: "Expert Staff",
|
||||
description: "Our master barbers are trained in the latest fade trends.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-managing-his-bike-business_23-2149039067.jpg",
|
||||
imageAlt: "hair style gallery app",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-dog-couch_23-2148949396.jpg",
|
||||
imageAlt: "barber booking app mobile",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-barber-s-instruments-shop_23-2149186524.jpg?_wi=2",
|
||||
imageAlt: "barber booking app mobile",
|
||||
title: "Expert Staff", description: "Our master barbers are trained in the latest fade trends.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/young-man-managing-his-bike-business_23-2149039067.jpg", imageAlt: "hair style gallery app" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-dog-couch_23-2148949396.jpg", imageAlt: "barber booking app mobile" }
|
||||
},
|
||||
{
|
||||
title: "Online Booking",
|
||||
description: "Book your appointment instantly through our seamless app.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-with-her-dog-using-mobile-phone_1301-4218.jpg",
|
||||
imageAlt: "barber booking app mobile",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-managing-his-bike-business_23-2149039047.jpg",
|
||||
imageAlt: "hair style gallery app",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/barber-shop-label-set_98292-1291.jpg",
|
||||
imageAlt: "barber booking app mobile",
|
||||
title: "Online Booking", description: "Book your appointment instantly through our seamless app.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-with-her-dog-using-mobile-phone_1301-4218.jpg", imageAlt: "barber booking app mobile" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/young-man-managing-his-bike-business_23-2149039047.jpg", imageAlt: "hair style gallery app" }
|
||||
},
|
||||
]}
|
||||
showStepNumbers={true}
|
||||
@@ -184,48 +104,12 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "s1",
|
||||
name: "Signature Fade",
|
||||
price: "$45",
|
||||
variant: "Premium",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-bearded-man-with-long-beard-moustache-brunette-hair-holding-hairdresser-barber-scissors-with-emotional-face-grey-wall_231208-7787.jpg",
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
name: "Beard Grooming",
|
||||
price: "$30",
|
||||
variant: "Basic",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18507.jpg",
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
name: "Hot Towel Shave",
|
||||
price: "$50",
|
||||
variant: "Premium",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-parting-client-studio_23-2148181861.jpg",
|
||||
},
|
||||
{
|
||||
id: "s4",
|
||||
name: "Hair Design",
|
||||
price: "$60",
|
||||
variant: "Deluxe",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-girlfriend-s-hand-touching-his-boyfriend-cheek_23-2148151949.jpg",
|
||||
},
|
||||
{
|
||||
id: "s5",
|
||||
name: "Classic Cut",
|
||||
price: "$35",
|
||||
variant: "Basic",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-getting-haircut-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6328.jpg",
|
||||
},
|
||||
{
|
||||
id: "s6",
|
||||
name: "Facial Treatment",
|
||||
price: "$40",
|
||||
variant: "Deluxe",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-hairdresser-massaging-young-customer-s-face-wrapped-towel-barbershop_181624-53211.jpg",
|
||||
},
|
||||
{ id: "s1", name: "Signature Fade", price: "$45", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-bearded-man-with-long-beard-moustache-brunette-hair-holding-hairdresser-barber-scissors-with-emotional-face-grey-wall_231208-7787.jpg" },
|
||||
{ id: "s2", name: "Beard Grooming", price: "$30", variant: "Basic", imageSrc: "http://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18507.jpg" },
|
||||
{ id: "s3", name: "Hot Towel Shave", price: "$50", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/barber-parting-client-studio_23-2148181861.jpg" },
|
||||
{ id: "s4", name: "Hair Design", price: "$60", variant: "Deluxe", imageSrc: "http://img.b2bpic.net/free-photo/close-up-girlfriend-s-hand-touching-his-boyfriend-cheek_23-2148151949.jpg" },
|
||||
{ id: "s5", name: "Classic Cut", price: "$35", variant: "Basic", imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-getting-haircut-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6328.jpg" },
|
||||
{ id: "s6", name: "Facial Treatment", price: "$40", variant: "Deluxe", imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-hairdresser-massaging-young-customer-s-face-wrapped-towel-barbershop_181624-53211.jpg" },
|
||||
]}
|
||||
title="Our Signature Services"
|
||||
description="Find the perfect grooming service tailored to your style."
|
||||
@@ -239,24 +123,9 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{
|
||||
id: "m1",
|
||||
name: "Marcus V.",
|
||||
role: "Master Barber",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-plus-size-man-working-as-hairstylist_23-2150754690.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
name: "Julian D.",
|
||||
role: "Senior Stylist",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pleased-slavic-middle-aged-male-barber-uniform-holding-barber-tools-isolated-purple-wall_141793-91610.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
name: "Samuel L.",
|
||||
role: "Junior Barber",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-male-barber-uniform-holding-hair-clippers-showing-peace-gesture-isolated-pink-wall_141793-103187.jpg",
|
||||
},
|
||||
{ id: "m1", name: "Marcus V.", role: "Master Barber", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-plus-size-man-working-as-hairstylist_23-2150754690.jpg" },
|
||||
{ id: "m2", name: "Julian D.", role: "Senior Stylist", imageSrc: "http://img.b2bpic.net/free-photo/pleased-slavic-middle-aged-male-barber-uniform-holding-barber-tools-isolated-purple-wall_141793-91610.jpg" },
|
||||
{ id: "m3", name: "Samuel L.", role: "Junior Barber", imageSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-male-barber-uniform-holding-hair-clippers-showing-peace-gesture-isolated-pink-wall_141793-103187.jpg" },
|
||||
]}
|
||||
title="Meet Your Barbers"
|
||||
description="Meet the talented team behind Fade Factory ATL."
|
||||
@@ -270,46 +139,11 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "John Doe",
|
||||
role: "Customer",
|
||||
company: "ATL Local",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-senior-man-laughing_23-2151203948.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Jane Smith",
|
||||
role: "Customer",
|
||||
company: "ATL Local",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-bright-portrait-young-handsome-hipster-man-wearing-plaid-shirt-pretty-face-brown-eyes_291049-1491.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Michael B.",
|
||||
role: "Customer",
|
||||
company: "ATL Local",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/couple-party_23-2148115738.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David W.",
|
||||
role: "Customer",
|
||||
company: "ATL Local",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-black-studio-lights-background_158538-9659.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Sarah P.",
|
||||
role: "Customer",
|
||||
company: "ATL Local",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/funny-worker-amusing-colleague-office-telling-joke_482257-102093.jpg",
|
||||
},
|
||||
{ id: "t1", name: "John Doe", role: "Customer", company: "ATL Local", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/side-view-senior-man-laughing_23-2151203948.jpg" },
|
||||
{ id: "t2", name: "Jane Smith", role: "Customer", company: "ATL Local", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-bright-portrait-young-handsome-hipster-man-wearing-plaid-shirt-pretty-face-brown-eyes_291049-1491.jpg" },
|
||||
{ id: "t3", name: "Michael B.", role: "Customer", company: "ATL Local", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/couple-party_23-2148115738.jpg" },
|
||||
{ id: "t4", name: "David W.", role: "Customer", company: "ATL Local", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-black-studio-lights-background_158538-9659.jpg" },
|
||||
{ id: "t5", name: "Sarah P.", role: "Customer", company: "ATL Local", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/funny-worker-amusing-colleague-office-telling-joke_482257-102093.jpg" },
|
||||
]}
|
||||
title="What Our Clients Say"
|
||||
description="See why we're Atlanta's favorite barbershop."
|
||||
@@ -320,21 +154,9 @@ export default function LandingPage() {
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Do I need an appointment?",
|
||||
content: "Yes, we highly recommend booking online for guaranteed service.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Where are you located?",
|
||||
content: "We are located right in the heart of Midtown Atlanta.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Do you offer beard services?",
|
||||
content: "Yes, we specialize in everything from beard trims to full facials.",
|
||||
},
|
||||
{ id: "f1", title: "Do I need an appointment?", content: "Yes, we highly recommend booking online for guaranteed service." },
|
||||
{ id: "f2", title: "Where are you located?", content: "We are located right in the heart of Midtown Atlanta." },
|
||||
{ id: "f3", title: "Do you offer beard services?", content: "Yes, we specialize in everything from beard trims to full facials." },
|
||||
]}
|
||||
sideTitle="Frequently Asked Questions"
|
||||
faqsAnimation="slide-up"
|
||||
@@ -344,16 +166,9 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
text="Ready to get the best cut in ATL? Book your spot today and join the factory."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "https://booking.fadefactoryatl.com",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Book Appointment", href: "https://booking.fadefactoryatl.com" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -363,33 +178,16 @@ export default function LandingPage() {
|
||||
logoText="Fade Factory ATL"
|
||||
columns={[
|
||||
{
|
||||
title: "Explore",
|
||||
items: [
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Team",
|
||||
href: "#team",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
title: "Explore", items: [
|
||||
{ label: "Services", href: "#services" },
|
||||
{ label: "Team", href: "#team" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
@@ -398,4 +196,4 @@ export default function LandingPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user