169 lines
13 KiB
TypeScript
169 lines
13 KiB
TypeScript
"use client";
|
|
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
|
|
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
|
|
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="soft"
|
|
contentWidth="mediumLarge"
|
|
sizing="largeSmall"
|
|
background="fluid"
|
|
cardStyle="outline"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="light"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{ name: "Home", id: "home" },
|
|
{ name: "Services", id: "services" },
|
|
{ name: "Testimonials", id: "testimonials" },
|
|
{ name: "FAQ", id: "faq" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
brandName="Plumber's Crack"
|
|
bottomLeftText="24/7 Emergency Service"
|
|
bottomRightText="(555) CRACK-PLUM"
|
|
/>
|
|
</div>
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitDoubleCarousel
|
|
title="Expert Plumbing for a Leak-Free Life"
|
|
description="Providing reliable, efficient, and friendly plumbing services across the region. From minor drips to major overhauls, we've got your back."
|
|
background={{ variant: "plain" }}
|
|
leftCarouselItems={[
|
|
{ imageSrc: "https://pixabay.com/get/ge465ff81bcbdb7881a39f7ca854699eb74a473929ff106264f03d8ddd7c55bf374bf7957aaf80546c1cd577f3e03d4f5f935c2358cc37eab1b46f7b9545bc298_1280.jpg", imageAlt: "plumber fixing leaky pipe professional" },
|
|
{ imageSrc: "https://pixabay.com/get/g187b5092fa1316c983c2c2190456bf355fc235397439846db39fdd7f6b21eb919f06dd40fa0b244daaf5d0d34db818ff420dc179ecd324a6c978a233600ba8d4_1280.jpg", imageAlt: "bathroom renovation plumber installation" },
|
|
{ imageSrc: "https://pixabay.com/get/g8708b3c6ff93a9ebe5311102fa554baedd64da93d8749ac897121558dbf3db2ea2b8de5a02883c0fb0177ce7e83f43e4fcb7db25abcaea359f5c7ed37cd8805f_1280.jpg", imageAlt: "plumber working on pipe system house" },
|
|
{ imageSrc: "https://pixabay.com/get/gb023cc0a298b1b5e482c4df5e28febda315b4c4b688ba1bc4f909783e445b50f6b74f957b0bb991079e38eba4eca6250fb89a45755c3eefc2344f74b27892dc8_1280.jpg", imageAlt: "plumber giving thumbs up happy" }
|
|
]}
|
|
rightCarouselItems={[
|
|
{ imageSrc: "https://pixabay.com/get/ge76fc3940c0fce4a7af46a8a82d3a8396ee19d23fa5b62c7ed5d849df7b16cbd389bd8839c22b5e09d5ada3cb9cb243b9bcd86854ec43afff4f2cb30f5f075dc_1280.jpg", imageAlt: "plumbing wrench tool professional gear" },
|
|
{ imageSrc: "https://pixabay.com/get/gbda8e9f27c7d07684c7f863799c91b9499f5d37b341699457caa9bcf623c8d5b3c08291320e00c3d105106904233a11de4fc1b52102b1b88cf38b53fcdcb25c4_1280.jpg", imageAlt: "plumber fixing a clogged drain home" },
|
|
{ imageSrc: "https://pixabay.com/get/g8536167120625b03f16c8b9b5bc7afe8d11572e26b219e2bdb42a79f3135e41d171fbd633e5384f1de6be765fabc8fb5bd4d69f97757e72d1d7cc49c53066c8c_1280.jpg", imageAlt: "plumber's hand on a pipe close up" },
|
|
{ imageSrc: "https://pixabay.com/get/gf378e0962c68db7f5bb0fba3d4a608a9440694a19a8e85f2197782f534986fea344700038ae87c76a6e07d0a814fe0368b1f995e5095e0f56c686e48ed8c8c63_1280.jpg", imageAlt: "plumber inspecting pipes under sink" }
|
|
]}
|
|
buttons={[
|
|
{ text: "Book Service", href: "#contact" },
|
|
{ text: "Learn More", href: "#services" }
|
|
]}
|
|
carouselPosition="right"
|
|
ariaLabel="Hero section"
|
|
/>
|
|
</div>
|
|
<div id="services" data-section="services">
|
|
<FeatureCardTwentySeven
|
|
title="Our Professional Plumbing Services"
|
|
description="We offer a comprehensive range of plumbing solutions to meet all your needs, ensuring quality and peace of mind. Your trusted partner for all plumbing concerns."
|
|
features={[
|
|
{ id: "emergency-repairs", title: "24/7 Emergency Repairs", description: "Burst pipe? Leaky faucet? We're available day and night for urgent plumbing issues, providing fast and effective solutions when you need them most.", imageSrc: "https://pixabay.com/get/gb1335cd8e5534d3d51067a2d8dee105b91dc0cbdfab70b35eef41608fd80ab6af5e36be9d054104b3dfe78bb6c7c79b3c45116a743cd409359e2fe04d1aa71ab_1280.jpg", imageAlt: "plumber fixing burst pipe emergency" },
|
|
{ id: "drain-cleaning", title: "Expert Drain Cleaning", description: "Clogged drains are no match for our advanced tools and expertise. We clear blockages efficiently, restoring proper flow to your sinks, showers, and toilets.", imageSrc: "https://pixabay.com/get/g059623721ca7b186e51cff5bbf2df6a6af8fb0a972187e0dbe7037636b12fd4fa17cba6522ce8e14a6d7aaf29aee2b66fb87a4b3718f62f07bbbe071551e63b9_1280.jpg", imageAlt: "plumber unclogging drain snake tool" },
|
|
{ id: "water-heater", title: "Water Heater Services", description: "From installation to repair and maintenance, we ensure your water heater operates safely and efficiently, providing consistent hot water for your home.", imageSrc: "https://pixabay.com/get/ge8dab290038c14e57c815c13019a3f6c74cb087945f323129e3e9afa28ab217738f20334b8c3f94545f89695950be09a7ae1c541c2d5bd66e0d937f81a157569_1280.jpg", imageAlt: "water heater installation maintenance" },
|
|
{ id: "leak-detection", title: "Advanced Leak Detection", description: "Hidden leaks can cause significant damage. Our precise leak detection services identify and fix leaks quickly, preventing costly repairs and water waste.", imageSrc: "https://pixabay.com/get/gc2580dfd3fa71d3c5d4032e80d94daf5e6c5fbd3a7f221a6c65b1acac62bd6d2d9cfb3ac691edb4455c336bece61f3bf541568aa172360276ca4bd8d5e74ad7_1280.jpg", imageAlt: "plumber using leak detection equipment" },
|
|
{ id: "pipe-repair", title: "Pipe Repair & Replacement", description: "Whether it's a small crack or a major pipe replacement, our team handles all types of pipe work with durable materials and expert craftsmanship.", imageSrc: "https://pixabay.com/get/gc3b17c4a92b791bcf351123b12133615a7fa6b45e65e5c13622f705599e4b7ea2d9f14cc2890393070c5ba6d0f88cd7e1cd7921d8ff93520fa780b8ad9b8805b_1280.jpg", imageAlt: "pipe repair replacement technician" },
|
|
{ id: "bathroom-kitchen", title: "Bathroom & Kitchen Plumbing", description: "Installing new fixtures, repairing existing ones, or renovating your entire space. We cover all plumbing needs for your bathroom and kitchen.", imageSrc: "https://pixabay.com/get/gc5cba5962271f73eeabfd082b3e2ce1981708760ec069623484c08ff43f09a2415b738a92605d09b1dc452da7eddfb4dcc95c1cec528c307680e1f2af2b98d8b_1280.jpg", imageAlt: "bathroom plumbing installation shower" }
|
|
]}
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
ariaLabel="Feature section"
|
|
animationType="reveal-blur"
|
|
/>
|
|
</div>
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardFourteen
|
|
title="Years of Trusted Service & Customer Satisfaction"
|
|
tag="Our Impact"
|
|
metrics={[
|
|
{ id: "1", value: "15+", description: "Years of dedicated experience serving our community with top-notch plumbing solutions." },
|
|
{ id: "2", value: "5000+", description: "Happy customers who rely on Plumber's Crack for all their plumbing needs and emergencies." },
|
|
{ id: "3", value: "99%", description: "On-time arrival rate, ensuring we respect your time and provide prompt, reliable service every time." }
|
|
]}
|
|
metricsAnimation="entrance-slide"
|
|
useInvertedBackground={false}
|
|
ariaLabel="Metrics section"
|
|
/>
|
|
</div>
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
title="What Our Happy Customers Say"
|
|
description="Hear from homeowners and businesses who trust Plumber's Crack for all their plumbing needs and reliable service."
|
|
testimonials={[
|
|
{ id: "1", name: "Sarah J.", role: "Homeowner", company: "Local Resident", rating: 5, imageSrc: "https://pixabay.com/get/gec06a90557b7a5f260ee86e8c8e8d92b8a3eda56c2d519c0efbff5c9e5bc3502dac849570bac97a23dca271223903581f0cddb14a4a8f9c36dc8dafd821b7d33_1280.jpg", imageAlt: "happy customer smiling woman home" },
|
|
{ id: "2", name: "Michael T.", role: "Restaurant Owner", company: "The Bistro", rating: 5, imageSrc: "https://pixabay.com/get/gf2ecf04aa771487efe9421c9ea9c2fa3ec92fc9fdda7bc2b3e7ddf10edce298a692e139e90d9c3f703b73188d13e753e9d60db87694a76521a5828a0c8de5fca_1280.jpg", imageAlt: "man smiling in modern kitchen" },
|
|
{ id: "3", name: "Emily R.", role: "Property Manager", company: "Urban Living", rating: 5, imageSrc: "https://pixabay.com/get/ge2aee202a43288dbd806b0f910beb2a37f2e0b307fa498a7c5d8b162abb00a1ee41659af68f66963b7c1f1f03daa099230b09637aed314ac31c168284455c16e_1280.jpg", imageAlt: "woman homeowner satisfied service" },
|
|
{ id: "4", name: "David L.", role: "Family Man", company: "Local Resident", rating: 5, imageSrc: "https://pixabay.com/get/g00d555670704ae0c140a8c4dadb33fa15bc98e51d43b19a9c99b8f6856cade208c7dcf6e8e60fb4769983e04436f53dad08aaefe0ddb3f9af081ccd77a3ef51f_1280.jpg", imageAlt: "senior man happy at home" }
|
|
]}
|
|
kpiItems={[
|
|
{ value: "5-Star", label: "Average Rating" },
|
|
{ value: "Fast", label: "Response Time" },
|
|
{ value: "Quality", label: "Workmanship" }
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
ariaLabel="Testimonials section"
|
|
animationType="reveal-blur"
|
|
/>
|
|
</div>
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
title="Frequently Asked Questions"
|
|
description="Got questions about our services, pricing, or availability? Find quick answers to common queries below."
|
|
faqs={[
|
|
{ id: "1", title: "What are your hours of operation?", content: "We operate from Monday to Saturday, 8 AM to 6 PM. Emergency services are available 24/7." },
|
|
{ id: "2", title: "Do you offer emergency services?", content: "Yes, we provide 24/7 emergency plumbing services for urgent issues like burst pipes or major leaks. Call our emergency line for immediate assistance." },
|
|
{ id: "3", title: "What areas do you serve?", content: "We proudly serve the entire greater metropolitan area, including all surrounding suburbs. Contact us to confirm service in your specific location." },
|
|
{ id: "4", title: "How do I book an appointment?", content: "You can book an appointment by filling out the contact form on our website, calling us directly, or sending an email. We aim to respond within 24 hours." }
|
|
]}
|
|
imageSrc="https://pixabay.com/get/g0e440385448018e68c4232faef92eb8e73663ae3a7ec141c790016a12b6988a5137a295ad51278a925882a165fa10b80562456bed844a6017e6d1589ce71a806_1280.jpg"
|
|
imageAlt="customer service representative phone"
|
|
mediaAnimation="entrance-slide"
|
|
mediaPosition="left"
|
|
faqsAnimation="entrance-slide"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="smooth"
|
|
ariaLabel="FAQ section"
|
|
/>
|
|
</div>
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
tag="Get in Touch"
|
|
title="Need a Plumber? We're Here to Help!"
|
|
description="Contact Plumber's Crack today for reliable service. Fill out the form below or give us a call for a free estimate or emergency service."
|
|
background={{ variant: "rotated-rays-animated" }}
|
|
useInvertedBackground={true}
|
|
inputPlaceholder="Your Email Address"
|
|
buttonText="Send Message"
|
|
termsText="By sending a message, you agree to our terms and conditions and privacy policy."
|
|
ariaLabel="Contact section"
|
|
/>
|
|
</div>
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
columns={[
|
|
{ title: "Services", items: [{ label: "Emergency Repairs", href: "#services" }, { label: "Drain Cleaning", href: "#services" }, { label: "Water Heaters", href: "#services" }, { label: "Leak Repair", href: "#services" }] },
|
|
{ title: "Company", items: [{ label: "About Us", href: "#hero" }, { label: "Testimonials", href: "#testimonials" }, { label: "FAQ", href: "#faq" }] },
|
|
{ title: "Contact", items: [{ label: "Book Now", href: "#contact" }, { label: "Call Us", href: "tel:555-272-2578" }, { label: "Email Us", href: "mailto:info@plumberscrack.com" }] }
|
|
]}
|
|
logoText="Plumber's Crack"
|
|
copyrightText="© 2024 Plumber's Crack. All rights reserved."
|
|
ariaLabel="Site footer"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|