Files
e9ce64a4-4cbb-4e1e-8328-d1c…/src/app/page.tsx
2026-04-22 22:49:43 +00:00

163 lines
12 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import SplitAbout from '@/components/sections/about/SplitAbout';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="smallMedium"
sizing="largeSizeMediumTitles"
background="blurBottom"
cardStyle="inset"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="layered"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{ name: "Home", id: "hero" },
{ name: "Services", id: "services" },
{ name: "About", id: "about" },
{ name: "Contact", id: "contact" }
]}
brandName="P & P"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardTestimonial
background={{ variant: "gradient-bars" }}
title="Built Right. Built to Last."
description="Precision plumbing & heating systems installed with unmatched craftsmanship."
testimonials={[
{ name: "Scott F.", handle: "@scottf", testimonial: "The most professional boiler installation I have ever seen. Even our contractors commented on how great it looks.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-installs-heating-system-house-checks-pipes-with-wrench_169016-55834.jpg?_wi=1", imageAlt: "professional plumbing boiler installation clean" },
{ name: "Brent B.", handle: "@brentb", testimonial: "Great people, skilled workmen, knowledgeable owner.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/burst-copper-pipes-from-cold-closeup_169016-3994.jpg?_wi=1", imageAlt: "professional plumbing boiler installation clean" },
{ name: "Sarah J.", handle: "@sarahj", testimonial: "Excellent service and attention to detail. Highly recommend.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/plant-picture-clean-room-equipment-stainless-steel-machines_645730-326.jpg?_wi=1", imageAlt: "professional plumbing boiler installation clean" },
{ name: "Mark D.", handle: "@markd", testimonial: "They did a full system replacement and it was flawless.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-getting-warm-near-heater_23-2149395839.jpg?_wi=1", imageAlt: "professional plumbing boiler installation clean" },
{ name: "Linda M.", handle: "@lindam", testimonial: "Responsive, professional, and clean. Best in town.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/male-worker-feeling-unwell-coughing-while-working-factory-coronavirus-pandemic_637285-12055.jpg?_wi=1", imageAlt: "professional plumbing boiler installation clean" }
]}
buttons={[{ text: "Request Service", href: "#contact" }, { text: "Call Now", href: "tel:5550100" }]}
imageSrc="http://img.b2bpic.net/free-photo/man-installs-heating-system-house-checks-pipes-with-wrench_169016-55834.jpg?_wi=2"
avatars={[{ src: "http://img.b2bpic.net/free-photo/medium-shot-woman-working-as-real-estate-agent_23-2151064993.jpg", alt: "Customer portrait 1" }, { src: "http://img.b2bpic.net/free-photo/front-view-cute-girl-looking-away_23-2148436134.jpg", alt: "Customer portrait 2" }, { src: "http://img.b2bpic.net/free-photo/cheerful-attractive-dark-haired-latin-man-posing-kitchen_74855-7991.jpg", alt: "Customer portrait 3" }, { src: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg", alt: "Customer portrait 4" }, { src: "http://img.b2bpic.net/free-photo/brunette-woman-putting-coin-piggy-bank_1169-112.jpg", alt: "Customer portrait 5" }]}
marqueeItems={[{ type: "text", text: "Certified Experts" }, { type: "text", text: "5-Star Rated" }, { type: "text", text: "Licensed & Insured" }, { type: "text", text: "Precision Work" }, { type: "text", text: "Prompt Service" }]}
/>
</div>
<div id="credibility" data-section="credibility">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
names={["Homeowners Choice", "Contractor Alliance", "Heating Specialists Guild", "Local Plumbers Association", "Certified Boiler Experts"]}
title="Trusted Excellence"
description="5-Star Rated & Contractor Approved"
/>
</div>
<div id="showcase" data-section="showcase">
<FeatureCardThree
animationType="slide-up"
textboxLayout="default"
gridVariant="one-large-left-three-stacked-right"
useInvertedBackground={false}
features={[{ title: "Precision Piping", description: "Every joint and turn installed with meticulous accuracy.", imageSrc: "http://img.b2bpic.net/free-photo/burst-copper-pipes-from-cold-closeup_169016-3994.jpg?_wi=2" }, { title: "Flawless Installs", description: "Systems that look as good as they perform.", imageSrc: "http://img.b2bpic.net/free-photo/plant-picture-clean-room-equipment-stainless-steel-machines_645730-326.jpg?_wi=2" }, { title: "System Organization", description: "Clean, intuitive layouts for long-term serviceability.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-getting-warm-near-heater_23-2149395839.jpg?_wi=2" }]}
title="Craftsmanship You Can See"
description="Our work doesn't just perform — it stands out. From precision piping to flawless boiler installs."
/>
</div>
<div id="services" data-section="services">
<ProductCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
products={[{ id: "p1", name: "Boiler Installation", price: "Custom Quote", imageSrc: "http://img.b2bpic.net/free-photo/white-kitchen-sink-faucet-close-up_58702-2359.jpg" }, { id: "p2", name: "Plumbing Repairs", price: "Standard Rate", imageSrc: "http://img.b2bpic.net/free-photo/asian-plumber-blue-overalls-clearing-blockage-drain_1098-17773.jpg" }, { id: "p3", name: "Heating Systems", price: "Expert Consult", imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-home-with-towel-heater_23-2149335139.jpg" }, { id: "p4", name: "System Upgrades", price: "Planning Phase", imageSrc: "http://img.b2bpic.net/free-photo/master-making-chess-figures-atelier_114579-11657.jpg" }, { id: "p5", name: "Emergency Service", price: "On Demand", imageSrc: "http://img.b2bpic.net/free-photo/purple-parking-lot_1127-39.jpg" }, { id: "p6", name: "Annual Maintenance", price: "Service Plan", imageSrc: "http://img.b2bpic.net/free-photo/water-gas-pipe-engineering-filtered-image-processed-vintage-effect_1232-4929.jpg" }]}
title="Specialized Services"
description="Expert solutions for your plumbing and heating needs."
/>
</div>
<div id="why-us" data-section="why-us">
<MetricCardSeven
animationType="depth-3d"
textboxLayout="default"
useInvertedBackground={false}
metrics={[{ id: "m1", value: "100%", title: "Attention to Detail", items: ["Clean piping", "Organized systems", "Precision planning"] }, { id: "m2", value: "Expert", title: "Skilled Team", items: ["Certified technicians", "Heating specialists", "Highly knowledgeable"] }, { id: "m3", value: "High", title: "Contractor Respect", items: ["Admired by pros", "Quality installations", "Industry trusted"] }]}
title="Why Homeowners Choose P & P"
description="Built on quality work and industry respect."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTen
textboxLayout="default"
useInvertedBackground={false}
testimonials={[{ id: "t1", title: "Best Install", quote: "The most professional boiler installation I have ever seen.", name: "Scott F.", role: "Homeowner", imageSrc: "http://img.b2bpic.net/free-photo/man-enjoying-cup-matcha-tea_23-2150215074.jpg" }, { id: "t2", title: "Skilled Experts", quote: "Great people, skilled workmen, knowledgeable owner.", name: "Brent B.", role: "Homeowner", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-posing-outdoors_23-2149557039.jpg" }, { id: "t3", title: "Responsive", quote: "They are now offering faster response times and reliable service.", name: "Sarah J.", role: "Property Manager", imageSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-attractive-woman-showing-thumb-up-outdoors_1262-12526.jpg" }, { id: "t4", title: "Top Tier", quote: "Work that even industry pros admire. Flawless execution.", name: "Mark D.", role: "Contractor", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-taking-selfie_23-2148819885.jpg" }, { id: "t5", title: "Highly Recommend", quote: "Professional, clean, and knowledgeable. Will use again.", name: "Linda M.", role: "Homeowner", imageSrc: "http://img.b2bpic.net/free-photo/close-up-handsome-senior-man-with-tattoos-beard-laughing-looking-candid-aside-chatting-having-fun-standing-happy-against-white-background_176420-54883.jpg" }]}
title="What Our Clients Say"
description="Real feedback from local property owners."
/>
</div>
<div id="reliability" data-section="reliability">
<FaqSplitText
useInvertedBackground={false}
faqs={[{ id: "f1", title: "Fast Response Times", content: "We prioritize fast communication and quick scheduling for all requests." }, { id: "f2", title: "Clear Communication", content: "We keep you informed from the first call until project completion." }, { id: "f3", title: "Easy Scheduling", content: "Our modern systems make booking and service seamless." }]}
sideTitle="Reliable Service — Start to Finish"
sideDescription="We're committed to responsive, dependable service every step of the way."
faqsAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<SplitAbout
textboxLayout="default"
useInvertedBackground={false}
title="Built on Craftsmanship"
description="P & P Plumbing & Heating was founded on a simple principle: do the job right, every time. With years of hands-on experience and a focus on precision, we deliver heating and plumbing systems that are built to last."
bulletPoints={[{ title: "Legacy Focused", description: "Systems engineered to function for decades." }, { title: "Detail Obsessed", description: "Every pipe and valve installed with care." }, { title: "Modern Methods", description: "Expert planning with up-to-date heating tech." }]}
imageSrc="http://img.b2bpic.net/free-photo/male-worker-feeling-unwell-coughing-while-working-factory-coronavirus-pandemic_637285-12055.jpg?_wi=2"
mediaAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={false}
background={{ variant: "gradient-bars" }}
tag="Get in touch"
title="Ready for Work Done Right?"
description="Whether it's a repair or a full system installation, leave your info and we'll call you back."
inputPlaceholder="Enter your phone number"
buttonText="Request Callback"
imageSrc="http://img.b2bpic.net/free-photo/worker-repairing-water-heater_23-2149334228.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="P & P Plumbing & Heating"
copyrightText="© 2025 P & P Plumbing & Heating"
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}