Merge version_1 into main #2
505
src/app/page.tsx
505
src/app/page.tsx
@@ -29,370 +29,165 @@ export default function LandingPage() {
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "home",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "pricing",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Gente De Zona"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "home" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Gente De Zona"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="home" data-section="home">
|
||||
<HeroBillboardGallery
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Unsx Excellence in Hialeah"
|
||||
description="Premium grooming experience for the modern gentleman. Discover the art of the perfect cut at Gente De Zona."
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-getting-haircut-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6410.jpg?_wi=1",
|
||||
imageAlt: "Barbershop interior",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-getting-haircut-with-trimmer_23-2148256902.jpg?_wi=1",
|
||||
imageAlt: "Fade cut detail",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/two-businessmen-talking-phone-city_1153-8202.jpg",
|
||||
imageAlt: "Beard trim detail",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-giving-thumbs-up-holding-trimmer_23-2148389897.jpg",
|
||||
imageAlt: "Razor shave detail",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/brown-vintage-leather-chairs-stylish-barber-shop_627829-6188.jpg?_wi=1",
|
||||
imageAlt: "Barbershop workspace",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-barber-giving-his-client-nice-haircut_23-2149186489.jpg",
|
||||
imageAlt: "Storefront",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="home" data-section="home">
|
||||
<HeroBillboardGallery
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Unsx Excellence in Hialeah"
|
||||
description="Premium grooming experience for the modern gentleman. Discover the art of the perfect cut at Gente De Zona."
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-getting-haircut-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6410.jpg", imageAlt: "Barbershop interior" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-getting-haircut-with-trimmer_23-2148256902.jpg", imageAlt: "Fade cut detail" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/two-businessmen-talking-phone-city_1153-8202.jpg", imageAlt: "Beard trim detail" }
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={false}
|
||||
heading={[
|
||||
{
|
||||
type: "text",
|
||||
content: "The Gente De Zona Standard",
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/otoscope-syringe-surgical-instruments-roll-gauze-black-fountain-pen-wooden-desk_23-2148050553.jpg",
|
||||
alt: "Our shop",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={false}
|
||||
heading={[
|
||||
{ type: "text", content: "The Gente De Zona Standard" },
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/otoscope-syringe-surgical-instruments-roll-gauze-black-fountain-pen-wooden-desk_23-2148050553.jpg", alt: "Our shop" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Beard Maintenance",
|
||||
description: "Expert shaping and care for a refined beard.",
|
||||
icon: Scissors,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-barber-combing-moustache-client_23-2147778838.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-hairy-man-shaving-beard_23-2149615818.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-getting-haircut-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6410.jpg?_wi=2",
|
||||
imageAlt: "beard trim scissors service",
|
||||
},
|
||||
{
|
||||
title: "Precision Cuts",
|
||||
description: "Fade cuts, buzz cuts, and custom styles.",
|
||||
icon: Zap,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-from-man-barber-shop_23-2148257045.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-shop-retro-vintage-style_1150-17931.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/brown-vintage-leather-chairs-stylish-barber-shop_627829-6188.jpg?_wi=2",
|
||||
imageAlt: "beard trim scissors service",
|
||||
},
|
||||
{
|
||||
title: "Essential Grooming",
|
||||
description: "Eyebrow trimming and hot towel services.",
|
||||
icon: Sparkles,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wooden-background-table_627829-6236.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-customer-getting-his-beard-trimmed_23-2148256866.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-getting-haircut-with-trimmer_23-2148256902.jpg?_wi=2",
|
||||
imageAlt: "beard trim scissors service",
|
||||
},
|
||||
]}
|
||||
title="Grooming Services"
|
||||
description="Our specialized services are tailored to keep you looking your best."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Grooming Services"
|
||||
description="Our specialized services are tailored to keep you looking your best."
|
||||
features={[
|
||||
{
|
||||
title: "Beard Maintenance", description: "Expert shaping and care for a refined beard.", icon: Scissors,
|
||||
mediaItems: [
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-barber-combing-moustache-client_23-2147778838.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/front-view-hairy-man-shaving-beard_23-2149615818.jpg" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Precision Cuts", description: "Fade cuts, buzz cuts, and custom styles.", icon: Zap,
|
||||
mediaItems: [
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-from-man-barber-shop_23-2148257045.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-shop-retro-vintage-style_1150-17931.jpg" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Essential Grooming", description: "Eyebrow trimming and hot towel services.", icon: Sparkles,
|
||||
mediaItems: [
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wooden-background-table_627829-6236.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-customer-getting-his-beard-trimmed_23-2148256866.jpg" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "p1",
|
||||
tag: "Essentials",
|
||||
price: "$25",
|
||||
period: "service",
|
||||
description: "Quick maintenance and trim.",
|
||||
button: {
|
||||
text: "Book Now",
|
||||
},
|
||||
featuresTitle: "Includes",
|
||||
features: [
|
||||
"Beard trim",
|
||||
"Eyebrow cleanup",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
tag: "Popular",
|
||||
price: "$45",
|
||||
period: "service",
|
||||
description: "Full haircut and style.",
|
||||
button: {
|
||||
text: "Book Now",
|
||||
},
|
||||
featuresTitle: "Includes",
|
||||
features: [
|
||||
"Precision cut",
|
||||
"Styling",
|
||||
"Beard trim",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
tag: "Premium",
|
||||
price: "$65",
|
||||
period: "service",
|
||||
description: "The full grooming experience.",
|
||||
button: {
|
||||
text: "Book Now",
|
||||
},
|
||||
featuresTitle: "Includes",
|
||||
features: [
|
||||
"Custom cut",
|
||||
"Hot towel shave",
|
||||
"Full grooming",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Choose Your Service"
|
||||
description="Quality grooming packages for every style."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Choose Your Service"
|
||||
description="Quality grooming packages for every style."
|
||||
plans={[
|
||||
{ id: "p1", tag: "Essentials", price: "$25", period: "service", description: "Quick maintenance and trim.", button: { text: "Book Now" }, featuresTitle: "Includes", features: ["Beard trim", "Eyebrow cleanup"] },
|
||||
{ id: "p2", tag: "Popular", price: "$45", period: "service", description: "Full haircut and style.", button: { text: "Book Now" }, featuresTitle: "Includes", features: ["Precision cut", "Styling", "Beard trim"] },
|
||||
{ id: "p3", tag: "Premium", price: "$65", period: "service", description: "The full grooming experience.", button: { text: "Book Now" }, featuresTitle: "Includes", features: ["Custom cut", "Hot towel shave", "Full grooming"] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
groups={[
|
||||
{
|
||||
id: "g1",
|
||||
groupTitle: "Expert Stylists",
|
||||
members: [
|
||||
{
|
||||
id: "m1",
|
||||
title: "Carlos R.",
|
||||
subtitle: "Lead Barber",
|
||||
detail: "Master of fades.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/positive-bearded-black-male-with-tattoo-cross-arms-dressed-white-shirt_613910-15917.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
title: "Luis M.",
|
||||
subtitle: "Stylist",
|
||||
detail: "Expert in custom cuts.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-male-who-himself-shaving-while-sitting-barber-chair-hairdressing-salon_613910-18649.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
title: "Javier S.",
|
||||
subtitle: "Groomer",
|
||||
detail: "Precision beard work.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-with-tattoo-his-face-arms-dressed-white-shirt-grey-background_613910-8168.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-getting-haircut-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6410.jpg?_wi=3",
|
||||
imageAlt: "barber portrait professional apron",
|
||||
},
|
||||
]}
|
||||
title="Meet Our Experts"
|
||||
description="The best barbers in Hialeah."
|
||||
/>
|
||||
</div>
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Meet Our Experts"
|
||||
description="The best barbers in Hialeah."
|
||||
groups={[
|
||||
{
|
||||
id: "g1", groupTitle: "Expert Stylists", members: [
|
||||
{ id: "m1", title: "Carlos R.", subtitle: "Lead Barber", detail: "Master of fades.", imageSrc: "http://img.b2bpic.net/free-photo/positive-bearded-black-male-with-tattoo-cross-arms-dressed-white-shirt_613910-15917.jpg" },
|
||||
{ id: "m2", title: "Luis M.", subtitle: "Stylist", detail: "Expert in custom cuts.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-male-who-himself-shaving-while-sitting-barber-chair-hairdressing-salon_613910-18649.jpg" },
|
||||
{ id: "m3", title: "Javier S.", subtitle: "Groomer", detail: "Precision beard work.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-with-tattoo-his-face-arms-dressed-white-shirt-grey-background_613910-8168.jpg" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Alex P.",
|
||||
role: "Client",
|
||||
company: "Miami Local",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-female-office-workers-thumbing-up-smiling-two-cheerful-professional-businesswomen-standing-together-posing-meeting-room-teamwork-business-success-cooperation-concept_74855-7378.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Jorge V.",
|
||||
role: "Client",
|
||||
company: "Regular",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-girl-holding-book-dog_23-2148861603.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Mario F.",
|
||||
role: "Client",
|
||||
company: "Business",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/looking-camera-young-handsome-male-barber-uniform-combing-hair-with-comb-holding-scissors_141793-96529.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Luis G.",
|
||||
role: "Client",
|
||||
company: "Miami Local",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-barbershop_23-2148506248.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Pedro R.",
|
||||
role: "Client",
|
||||
company: "Fan",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-getting-haircut-barbershop_23-2148506184.jpg",
|
||||
},
|
||||
]}
|
||||
title="Client Reviews"
|
||||
description="Hear what our Hialeah community says."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Client Reviews"
|
||||
description="Hear what our Hialeah community says."
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Alex P.", role: "Client", company: "Miami Local", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-female-office-workers-thumbing-up-smiling-two-cheerful-professional-businesswomen-standing-together-posing-meeting-room-teamwork-business-success-cooperation-concept_74855-7378.jpg" },
|
||||
{ id: "t2", name: "Jorge V.", role: "Client", company: "Regular", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-girl-holding-book-dog_23-2148861603.jpg" },
|
||||
{ id: "t3", name: "Mario F.", role: "Client", company: "Business", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/looking-camera-young-handsome-male-barber-uniform-combing-hair-with-comb-holding-scissors_141793-96529.jpg" },
|
||||
{ id: "t4", name: "Luis G.", role: "Client", company: "Miami Local", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-barbershop_23-2148506248.jpg" },
|
||||
{ id: "t5", name: "Pedro R.", role: "Client", company: "Fan", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-getting-haircut-barbershop_23-2148506184.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Do I need an appointment?",
|
||||
content: "Yes, we recommend booking online.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Do you accept walk-ins?",
|
||||
content: "Walk-ins are subject to availability.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Where is the shop?",
|
||||
content: "We are conveniently located in Hialeah.",
|
||||
},
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Get answers about our services."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Common Questions"
|
||||
description="Get answers about our services."
|
||||
faqsAnimation="slide-up"
|
||||
faqs={[
|
||||
{ id: "q1", title: "Do I need an appointment?", content: "Yes, we recommend booking online." },
|
||||
{ id: "q2", title: "Do you accept walk-ins?", content: "Walk-ins are subject to availability." },
|
||||
{ id: "q3", title: "Where is the shop?", content: "We are conveniently located in Hialeah." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
tag="Location"
|
||||
title="Visit Us Today"
|
||||
description="Ready for a fresh look? Book your slot."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/hotel-fisherman-s-bay-rural-flavor-thailand-services-housing_169016-3542.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
tag="Location"
|
||||
title="Visit Us Today"
|
||||
description="Ready for a fresh look? Book your slot."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/hotel-fisherman-s-bay-rural-flavor-thailand-services-housing_169016-3542.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#features",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Pricing",
|
||||
href: "#pricing",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="Gente De Zona"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
logoText="Gente De Zona"
|
||||
columns={[
|
||||
{ items: [{ label: "About", href: "#about" }, { label: "Services", href: "#features" }] },
|
||||
{ items: [{ label: "Pricing", href: "#pricing" }, { label: "Contact", href: "#contact" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user