213 lines
11 KiB
TypeScript
213 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactFaq from '@/components/sections/contact/ContactFaq';
|
|
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
|
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
|
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
import TextAbout from '@/components/sections/about/TextAbout';
|
|
import { Phone } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="small"
|
|
sizing="largeSizeMediumTitles"
|
|
background="blurBottom"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="normal"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
navItems={[
|
|
{
|
|
name: "Services", id: "services"},
|
|
{
|
|
name: "About", id: "about"},
|
|
{
|
|
name: "Testimonials", id: "testimonials"},
|
|
{
|
|
name: "Contact", id: "contact"},
|
|
]}
|
|
brandName="J&L Plumbing Solutions"
|
|
button={{
|
|
text: "Get a Quote", href: "#contact"}}
|
|
animateOnLoad={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogoBillboard
|
|
background={{
|
|
variant: "radial-gradient"}}
|
|
logoText="J&L Plumbing Solutions"
|
|
description="Solving Your Plumbing Problems with Expertise and Care, Ensuring Your Home Runs Smoothly."
|
|
buttons={[
|
|
{
|
|
text: "Get a Free Estimate", href: "#contact"},
|
|
{
|
|
text: "Our Services", href: "#services"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/ratchets-metallic-nozzles_23-2148180577.jpg"
|
|
imageAlt="Professional plumbing tools and pipes"
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextAbout
|
|
useInvertedBackground={false}
|
|
tag="About Us"
|
|
title="Dedicated to Quality & Trustworthy Plumbing"
|
|
buttons={[
|
|
{
|
|
text: "Learn More", href: "#"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardThree
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{
|
|
id: "emergency-repairs", title: "Emergency Repairs", description: "24/7 rapid response for burst pipes, major leaks, and urgent plumbing crises. We're here when you need us most.", imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721535.jpg", imageAlt: "Plumber fixing a leaky pipe"},
|
|
{
|
|
id: "drain-cleaning", title: "Expert Drain Cleaning", description: "Say goodbye to stubborn clogs! Our advanced techniques ensure your drains flow freely and efficiently.", imageSrc: "http://img.b2bpic.net/free-photo/shot-oilfield-worker-checking-quality-gas-pipes-construction-site_342744-363.jpg", imageAlt: "Drain being cleaned with specialized tools"},
|
|
{
|
|
id: "water-heater", title: "Water Heater Services", description: "Installation, repair, and maintenance for all types of water heaters, ensuring you always have hot water.", imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721541.jpg", imageAlt: "Modern water heater installation"},
|
|
{
|
|
id: "bathroom-remodel", title: "Bathroom Remodeling", description: "Transform your bathroom with our comprehensive plumbing solutions, from fixture upgrades to full overhauls.", imageSrc: "http://img.b2bpic.net/free-photo/washing-hands-with-open-faucet-soap-bar_53876-95002.jpg", imageAlt: "Luxurious renovated bathroom"},
|
|
]}
|
|
title="Comprehensive Plumbing Services"
|
|
description="From leaky faucets to major installations, J&L Plumbing Solutions covers all your needs with expertise and efficiency."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Johnson", role: "Homeowner", company: "Local Resident", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-wise-woman-posing-studio_23-2149883526.jpg", videoAriaLabel: "Testimonial video from Sarah Johnson"},
|
|
{
|
|
id: "2", name: "Michael Chen", role: "Property Manager", company: "Urban Living Mgmt", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/businessman-working-office-couch-putting-long-hours-work-businessperson-professional-environment_482257-33246.jpg", videoAriaLabel: "Testimonial video from Michael Chen"},
|
|
{
|
|
id: "3", name: "Yvonne Parker", role: "Daughter", company: "Proud Customer", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/elegant-cheerful-caucasian-female-pensioner-with-short-pixie-hairstyle-smiling-broadly-dressed-stylish-knitted-burgundy-pullover-people-age-style-knitwear-fashion-concept_343059-2680.jpg", videoAriaLabel: "Testimonial video from Yvonne Parker"},
|
|
{
|
|
id: "4", name: "Justin (from original testimonial)", role: "Customer Service", company: "J&L Plumbing Solutions", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-mechanic-smiling_1170-1139.jpg", videoAriaLabel: "Testimonial video from Justin"},
|
|
{
|
|
id: "5", name: "Emily Rodriguez", role: "Local Business Owner", company: "Cafe Aroma", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/smiley-business-woman-with-tablet-side-view_23-2149442245.jpg", videoAriaLabel: "Testimonial video from Emily Rodriguez"},
|
|
{
|
|
id: "6", name: "David Kim", role: "Homeowner", company: "Community Member", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-grey-t-shirt-smiling-while-bowing-head-front-view_176474-16095.jpg", videoAriaLabel: "Testimonial video from David Kim"},
|
|
]}
|
|
kpiItems={[
|
|
{
|
|
value: "20+", label: "Years Experience"},
|
|
{
|
|
value: "500+", label: "Projects Completed"},
|
|
{
|
|
value: "98%", label: "Customer Satisfaction"},
|
|
]}
|
|
title="Hear From Our Happy Customers"
|
|
description="Real stories from clients who trust J&L Plumbing Solutions for their homes and businesses."
|
|
/>
|
|
</div>
|
|
|
|
<div id="social-proof" data-section="social-proof">
|
|
<SocialProofOne
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
logos={[
|
|
"http://img.b2bpic.net/free-vector/labour-day-badge-collection-flat-design_23-2148473577.jpg", "http://img.b2bpic.net/free-vector/professional-company-page-linkedin-profile-picture_742173-3941.jpg", "http://img.b2bpic.net/free-vector/labor-day-badge-collection_23-2147649631.jpg", "http://img.b2bpic.net/free-vector/flat-design-labour-day-usa-badge-collection_23-2148270580.jpg", "http://img.b2bpic.net/free-vector/excavator-construction-logo-concept_23-2148661679.jpg", "http://img.b2bpic.net/free-vector/modern-business-card-template-with-elegant-style_23-2147958143.jpg", "http://img.b2bpic.net/free-vector/gradient-patented-label-collection_23-2149733588.jpg"]}
|
|
names={["Partner 1", "Partner 2", "Partner 3", "Partner 4", "Partner 5", "Partner 6", "Partner 7"]}
|
|
title="Our Trusted Partners & Brands"
|
|
description="We partner with leading brands and local organizations to provide the best solutions for our clients."
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactFaq
|
|
animationType="slide-up"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "faq-1", title: "What areas do you serve?", content: "J&L Plumbing Solutions proudly serves [Your City/Region] and the surrounding areas. Please contact us to confirm service availability in your specific location."},
|
|
{
|
|
id: "faq-2", title: "Do you offer emergency services?", content: "Yes, we understand plumbing emergencies can happen at any time. We offer 24/7 emergency services for urgent issues like burst pipes or major leaks. Call us immediately for rapid assistance."},
|
|
{
|
|
id: "faq-3", title: "How quickly can you respond to a service call?", content: "For emergency calls, we aim for the fastest possible response time. For non-emergency services, we strive to schedule appointments within 24-48 hours, depending on our current workload."},
|
|
]}
|
|
ctaTitle="Need Plumbing Help? Get in Touch!"
|
|
ctaDescription="Our experienced team is ready to assist you with any plumbing issue, big or small. Contact us today for reliable, professional service."
|
|
ctaButton={{
|
|
text: "Call J&L Today", href: "tel:+1-555-123-4567"}}
|
|
ctaIcon={Phone}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterSimple
|
|
columns={[
|
|
{
|
|
title: "Services", items: [
|
|
{
|
|
label: "Emergency Repairs", href: "#services"},
|
|
{
|
|
label: "Drain Cleaning", href: "#services"},
|
|
{
|
|
label: "Water Heaters", href: "#services"},
|
|
{
|
|
label: "Remodeling", href: "#services"},
|
|
],
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{
|
|
label: "About Us", href: "#about"},
|
|
{
|
|
label: "Testimonials", href: "#testimonials"},
|
|
{
|
|
label: "FAQ", href: "#contact"},
|
|
],
|
|
},
|
|
{
|
|
title: "Connect", items: [
|
|
{
|
|
label: "Contact Us", href: "#contact"},
|
|
{
|
|
label: "Call Now", href: "tel:+1-555-123-4567"},
|
|
{
|
|
label: "Email", href: "mailto:info@jlplumbing.com"},
|
|
],
|
|
},
|
|
]}
|
|
bottomLeftText="© 2024 J&L Plumbing Solutions. All rights reserved."
|
|
bottomRightText="Built with care by Webild"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |