Merge version_1 into main #2
410
src/app/page.tsx
410
src/app/page.tsx
@@ -2,6 +2,7 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { Zap, Award, CheckCircle, MapPin } from 'lucide-react';
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
@@ -13,299 +14,138 @@ import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCa
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="smallMedium"
|
||||
sizing="mediumSizeLargeTitles"
|
||||
background="noise"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="shadow"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="normal"
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="smallMedium"
|
||||
sizing="mediumSizeLargeTitles"
|
||||
background="noise"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="shadow"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Brooklyn Plumbing & Piping"
|
||||
button={{
|
||||
text: "Book Service",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Brooklyn Plumbing & Piping"
|
||||
button={{
|
||||
text: "Book Service", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Fast. Reliable. Brooklyn Plumbing Experts."
|
||||
description="From hidden leaks to full repairs — we keep your home running smoothly. Serving the Brooklyn area with excellence."
|
||||
tag="Licensed & Insured"
|
||||
buttons={[
|
||||
{
|
||||
text: "Call Now",
|
||||
href: "tel:+15550001111",
|
||||
},
|
||||
{
|
||||
text: "Book Service",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg?_wi=1"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Fast. Reliable. Brooklyn Plumbing Experts."
|
||||
description="From hidden leaks to full repairs — we keep your home running smoothly. Serving the Brooklyn area with excellence."
|
||||
tag="Licensed & Insured"
|
||||
buttons={[
|
||||
{ text: "Call Now", href: "tel:+15550001111" },
|
||||
{ text: "Book Service", href: "#contact" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentySix
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Fast response times",
|
||||
description: "We arrive quickly to resolve your emergency plumbing issues.",
|
||||
buttonIcon: "Zap",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg?_wi=2",
|
||||
imageAlt: "plumbing pipes background",
|
||||
},
|
||||
{
|
||||
title: "Experienced technicians",
|
||||
description: "Highly trained experts with years of local experience.",
|
||||
buttonIcon: "Award",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-lawyer-portrait_23-2151202433.jpg?_wi=1",
|
||||
imageAlt: "customer portrait white background",
|
||||
},
|
||||
{
|
||||
title: "Transparent pricing",
|
||||
description: "No hidden fees, just clear and honest service costs.",
|
||||
buttonIcon: "CheckCircle",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-young-redhead-woman-wearing-grey-checkered-shirt-laughing-out-loud-while-having-fun-indoors_273609-9041.jpg",
|
||||
imageAlt: "customer portrait white background",
|
||||
},
|
||||
{
|
||||
title: "Local experts",
|
||||
description: "Proudly serving the Brooklyn community for over a decade.",
|
||||
buttonIcon: "MapPin",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-portrait-woman_23-2150793994.jpg",
|
||||
imageAlt: "customer portrait white background",
|
||||
},
|
||||
]}
|
||||
title="Why Choose Us"
|
||||
description="We are the local experts you can trust for all your plumbing needs in Brooklyn."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentySix
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Fast response times", description: "We arrive quickly to resolve your emergency plumbing issues.", buttonIcon: Zap,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg", imageAlt: "plumbing pipes background"},
|
||||
{
|
||||
title: "Experienced technicians", description: "Highly trained experts with years of local experience.", buttonIcon: Award,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-lawyer-portrait_23-2151202433.jpg", imageAlt: "customer portrait white background"},
|
||||
{
|
||||
title: "Transparent pricing", description: "No hidden fees, just clear and honest service costs.", buttonIcon: CheckCircle,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-young-redhead-woman-wearing-grey-checkered-shirt-laughing-out-loud-while-having-fun-indoors_273609-9041.jpg", imageAlt: "customer portrait white background"},
|
||||
{
|
||||
title: "Local experts", description: "Proudly serving the Brooklyn community for over a decade.", buttonIcon: MapPin,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-portrait-woman_23-2150793994.jpg", imageAlt: "customer portrait white background"},
|
||||
]}
|
||||
title="Why Choose Us"
|
||||
description="We are the local experts you can trust for all your plumbing needs in Brooklyn."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "s1",
|
||||
brand: "Service",
|
||||
name: "Leak Detection",
|
||||
price: "Expert",
|
||||
rating: 5,
|
||||
reviewCount: "100+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg?_wi=3",
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
brand: "Service",
|
||||
name: "Fixture Repair",
|
||||
price: "Expert",
|
||||
rating: 5,
|
||||
reviewCount: "80+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg?_wi=4",
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
brand: "Service",
|
||||
name: "Pipe Replacement",
|
||||
price: "Expert",
|
||||
rating: 5,
|
||||
reviewCount: "90+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg?_wi=5",
|
||||
},
|
||||
{
|
||||
id: "s4",
|
||||
brand: "Service",
|
||||
name: "Pressure Fixes",
|
||||
price: "Expert",
|
||||
rating: 5,
|
||||
reviewCount: "70+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg?_wi=6",
|
||||
},
|
||||
{
|
||||
id: "s5",
|
||||
brand: "Service",
|
||||
name: "Emergency Repairs",
|
||||
price: "24/7",
|
||||
rating: 5,
|
||||
reviewCount: "200+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg?_wi=7",
|
||||
},
|
||||
{
|
||||
id: "s6",
|
||||
brand: "Service",
|
||||
name: "Bathroom Plumbing",
|
||||
price: "Expert",
|
||||
rating: 5,
|
||||
reviewCount: "120+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg?_wi=8",
|
||||
},
|
||||
]}
|
||||
title="Our Plumbing Services"
|
||||
description="Comprehensive plumbing solutions for your home."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{ id: "s1", brand: "Service", name: "Leak Detection", price: "Expert", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg" },
|
||||
{ id: "s2", brand: "Service", name: "Fixture Repair", price: "Expert", rating: 5, reviewCount: "80+", imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg" },
|
||||
{ id: "s3", brand: "Service", name: "Pipe Replacement", price: "Expert", rating: 5, reviewCount: "90+", imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg" },
|
||||
{ id: "s4", brand: "Service", name: "Pressure Fixes", price: "Expert", rating: 5, reviewCount: "70+", imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg" },
|
||||
{ id: "s5", brand: "Service", name: "Emergency Repairs", price: "24/7", rating: 5, reviewCount: "200+", imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg" },
|
||||
{ id: "s6", brand: "Service", name: "Bathroom Plumbing", price: "Expert", rating: 5, reviewCount: "120+", imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg" },
|
||||
]}
|
||||
title="Our Plumbing Services"
|
||||
description="Comprehensive plumbing solutions for your home."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Janiyah Hunter",
|
||||
date: "Jan 2024",
|
||||
title: "Homeowner",
|
||||
quote: "Our faucet handle became difficult to turn… They replaced worn components. It now moves smoothly.",
|
||||
tag: "Repair",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/front-view-lawyer-portrait_23-2151202433.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-brunette-woman-with-short-hair-wearing-casual-clothes-with-happy-cool-smile-face-lucky-person_839833-19672.jpg",
|
||||
imageAlt: "customer portrait white background",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Dominik Clay",
|
||||
date: "Dec 2023",
|
||||
title: "Resident",
|
||||
quote: "They located a hidden pipe leak and repaired it… resolved without further damage.",
|
||||
tag: "Leak Repair",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/stylish-young-redhead-woman-wearing-grey-checkered-shirt-laughing-out-loud-while-having-fun-indoors_273609-9041.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-beautiful-young-redhead-woman-with-charming-smile-healthy-clean-skin_273609-9036.jpg",
|
||||
imageAlt: "customer portrait white background",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Shayna Selina",
|
||||
date: "Nov 2023",
|
||||
title: "Homeowner",
|
||||
quote: "Bathroom water line was making a whistling sound… they fixed it quickly. Very smooth experience.",
|
||||
tag: "Fixes",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/3d-portrait-woman_23-2150793994.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-working-as-plumber_23-2150746394.jpg?_wi=1",
|
||||
imageAlt: "modern bathroom pipes repair",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Mark V.",
|
||||
date: "Oct 2023",
|
||||
title: "Customer",
|
||||
quote: "Absolutely top notch service. Brooklyn Plumbing is the only one I call.",
|
||||
tag: "Reliable",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/young-brunette-woman-with-short-hair-wearing-casual-clothes-with-happy-cool-smile-face-lucky-person_839833-19672.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg?_wi=9",
|
||||
imageAlt: "plumbing pipes background",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Elena R.",
|
||||
date: "Sept 2023",
|
||||
title: "Customer",
|
||||
quote: "Quick, clean, and professional. Highly recommended for any home piping issues.",
|
||||
tag: "Professional",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-beautiful-young-redhead-woman-with-charming-smile-healthy-clean-skin_273609-9036.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-lawyer-portrait_23-2151202433.jpg?_wi=2",
|
||||
imageAlt: "customer portrait white background",
|
||||
},
|
||||
]}
|
||||
title="Client Reviews"
|
||||
description="What our Brooklyn neighbors have to say about our work."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Janiyah Hunter", date: "Jan 2024", title: "Homeowner", quote: "Our faucet handle became difficult to turn… They replaced worn components. It now moves smoothly.", tag: "Repair", avatarSrc: "http://img.b2bpic.net/free-photo/front-view-lawyer-portrait_23-2151202433.jpg", imageSrc: "http://img.b2bpic.net/free-photo/young-brunette-woman-with-short-hair-wearing-casual-clothes-with-happy-cool-smile-face-lucky-person_839833-19672.jpg" },
|
||||
{ id: "t2", name: "Dominik Clay", date: "Dec 2023", title: "Resident", quote: "They located a hidden pipe leak and repaired it… resolved without further damage.", tag: "Leak Repair", avatarSrc: "http://img.b2bpic.net/free-photo/stylish-young-redhead-woman-wearing-grey-checkered-shirt-laughing-out-loud-while-having-fun-indoors_273609-9041.jpg", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-beautiful-young-redhead-woman-with-charming-smile-healthy-clean-skin_273609-9036.jpg" },
|
||||
{ id: "t3", name: "Shayna Selina", date: "Nov 2023", title: "Homeowner", quote: "Bathroom water line was making a whistling sound… they fixed it quickly. Very smooth experience.", tag: "Fixes", avatarSrc: "http://img.b2bpic.net/free-photo/3d-portrait-woman_23-2150793994.jpg", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-working-as-plumber_23-2150746394.jpg" },
|
||||
{ id: "t4", name: "Mark V.", date: "Oct 2023", title: "Customer", quote: "Absolutely top notch service. Brooklyn Plumbing is the only one I call.", tag: "Reliable", avatarSrc: "http://img.b2bpic.net/free-photo/young-brunette-woman-with-short-hair-wearing-casual-clothes-with-happy-cool-smile-face-lucky-person_839833-19672.jpg", imageSrc: "http://img.b2bpic.net/free-photo/engineer-with-blueprints-standing-near-electrical-panel-blue-light-engineer-energy-control_169016-71630.jpg" },
|
||||
{ id: "t5", name: "Elena R.", date: "Sept 2023", title: "Customer", quote: "Quick, clean, and professional. Highly recommended for any home piping issues.", tag: "Professional", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-beautiful-young-redhead-woman-with-charming-smile-healthy-clean-skin_273609-9036.jpg", imageSrc: "http://img.b2bpic.net/free-photo/front-view-lawyer-portrait_23-2151202433.jpg" },
|
||||
]}
|
||||
title="Client Reviews"
|
||||
description="What our Brooklyn neighbors have to say about our work."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={true}
|
||||
title="Need a Plumber in Brooklyn? We’ve Got You."
|
||||
description="Same-day service available. Contact us today for a free estimate."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
},
|
||||
{
|
||||
name: "phone",
|
||||
type: "tel",
|
||||
placeholder: "Your Phone Number",
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "description",
|
||||
placeholder: "Describe your plumbing issue here...",
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/high-angle-woman-working-as-plumber_23-2150746394.jpg?_wi=2"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={true}
|
||||
title="Need a Plumber in Brooklyn? We’ve Got You."
|
||||
description="Same-day service available. Contact us today for a free estimate."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Your Name" },
|
||||
{ name: "phone", type: "tel", placeholder: "Your Phone Number" },
|
||||
]}
|
||||
textarea={{ name: "description", placeholder: "Describe your plumbing issue here..." }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/high-angle-woman-working-as-plumber_23-2150746394.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Brooklyn Plumbing & Piping",
|
||||
items: [
|
||||
{
|
||||
label: "Brooklyn, NY",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "555-0111",
|
||||
href: "tel:+15550001111",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
{
|
||||
label: "Leak Detection",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Emergency Repair",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 Brooklyn Plumbing & Piping"
|
||||
bottomRightText="All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Brooklyn Plumbing & Piping", items: [
|
||||
{ label: "Brooklyn, NY", href: "#" },
|
||||
{ label: "555-0111", href: "tel:+15550001111" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "Leak Detection", href: "#services" },
|
||||
{ label: "Emergency Repair", href: "#services" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 Brooklyn Plumbing & Piping"
|
||||
bottomRightText="All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user