283 lines
18 KiB
TypeScript
283 lines
18 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
|
import AboutMetric from '@/components/sections/about/AboutMetric';
|
|
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
|
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
|
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
|
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import { Award, Bolt, CheckCircle, Cloudy, Droplet, Fan, Gauge, ShieldCheck, ThermometerSun, Users, Wind, Wrench, AirVent, Flame } from "lucide-react";
|
|
|
|
const assetMap = {
|
|
"hero-carousel-1": { "url": "https://picsum.photos/seed/hero-carousel-1/1200/800", "alt": "Modern air conditioning unit home" },
|
|
"hero-carousel-2": { "url": "https://picsum.photos/seed/hero-carousel-2/1200/800", "alt": "hvac technician installing ac outdoor" },
|
|
"hero-carousel-3": { "url": "https://picsum.photos/seed/hero-carousel-3/1200/800", "alt": "family relaxing living room cool air" },
|
|
"hero-carousel-4": { "url": "https://picsum.photos/seed/hero-carousel-4/1200/800", "alt": "heating furnace installation winter" },
|
|
"hero-carousel-5": { "url": "https://picsum.photos/seed/hero-carousel-5/1200/800", "alt": "clean air filter replacement service" },
|
|
"hero-carousel-6": { "url": "https://picsum.photos/seed/hero-carousel-6/1200/800", "alt": "cooling system condenser unit outdoor" },
|
|
"features-media-1": { "url": "https://picsum.photos/seed/features-media-1/1200/800", "alt": "air conditioning repair maintenance service" },
|
|
"features-media-2": { "url": "https://picsum.photos/seed/features-media-2/1200/800", "alt": "heating system installation furnace" },
|
|
"features-media-3": { "url": "https://picsum.photos/seed/features-media-3/1200/800", "alt": "duct cleaning service home vents" },
|
|
"product-ac-unit-1": { "url": "https://picsum.photos/seed/product-ac-unit-1/1200/800", "alt": "modern high efficiency outdoor ac unit" },
|
|
"product-furnace-1": { "url": "https://picsum.photos/seed/product-furnace-1/1200/800", "alt": "new high efficiency gas furnace" },
|
|
"product-thermostat-1": { "url": "https://picsum.photos/seed/product-thermostat-1/1200/800", "alt": "smart wifi programmable thermostat" },
|
|
"product-air-purifier-1": { "url": "https://picsum.photos/seed/product-air-purifier-1/1200/800", "alt": "whole home air purification system" },
|
|
"product-heat-pump-1": { "url": "https://picsum.photos/seed/product-heat-pump-1/1200/800", "alt": "residential heat pump outdoor unit" },
|
|
"product-water-heater-1": { "url": "https://picsum.photos/seed/product-water-heater-1/1200/800", "alt": "modern tankless water heater installation" },
|
|
"testimonial-1": { "url": "https://picsum.photos/seed/testimonial-1/1200/800", "alt": "happy customer smiling home" },
|
|
"testimonial-2": { "url": "https://picsum.photos/seed/testimonial-2/1200/800", "alt": "man relaxing in cool house" },
|
|
"testimonial-3": { "url": "https://picsum.photos/seed/testimonial-3/1200/800", "alt": "woman looking at new furnace" },
|
|
"testimonial-4": { "url": "https://picsum.photos/seed/testimonial-4/1200/800", "alt": "business owner in office with ac" },
|
|
"testimonial-5": { "url": "https://picsum.photos/seed/testimonial-5/1200/800", "alt": "homeowner shaking hands with technician" },
|
|
"contact-image": { "url": "https://picsum.photos/seed/contact-image/1200/800", "alt": "hvac technician taking call on tablet" }
|
|
};
|
|
|
|
const getAssetUrl = (id) => assetMap[id]?.url || `https://picsum.photos/seed/${id}/1200/800`;
|
|
const getAssetAlt = (id) => assetMap[id]?.alt || `Image for ${id}`;
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant={"hover-magnetic"}
|
|
defaultTextAnimation={"entrance-slide"}
|
|
borderRadius={"soft"}
|
|
contentWidth={"medium"}
|
|
sizing={"medium"}
|
|
background={"noiseDiagonalGradient"}
|
|
cardStyle={"solid"}
|
|
primaryButtonStyle={"flat"}
|
|
secondaryButtonStyle={"layered"}
|
|
headingFontWeight={"light"}
|
|
>
|
|
<div id="nav" data-section="nav" className={undefined}>
|
|
<NavbarLayoutFloatingInline
|
|
brandName={"Air CareSaver"}
|
|
navItems={[
|
|
{ name: "Home", id: "#home" },
|
|
{ name: "Services", id: "#services" },
|
|
{ name: "Products", id: "#products" },
|
|
{ name: "About Us", id: "#about" },
|
|
{ name: "Testimonials", id: "#testimonials" },
|
|
{ name: "FAQ", id: "#faq" },
|
|
{ name: "Contact", id: "#contact" }
|
|
]}
|
|
button={{
|
|
text: "Schedule Service", href: "#contact"
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="home" data-section="home" className={undefined}>
|
|
<HeroBillboardCarousel
|
|
title={"Your Comfort, Our Priority. Quality AC & Heating."}
|
|
description={"Experience unparalleled comfort with Air CareSaver. We provide expert air conditioning and heating services, ensuring your home or business stays perfect all year round. Reliable, efficient, and always ready."}
|
|
background={{
|
|
variant: "downward-rays-static-grid"
|
|
}}
|
|
tag={"Trusted Local Experts"}
|
|
tagIcon={CheckCircle}
|
|
buttons={[
|
|
{ text: "Schedule Service", href: "#contact" },
|
|
{ text: "Explore Services", href: "#services" }
|
|
]}
|
|
mediaItems={[
|
|
{ imageSrc: getAssetUrl("hero-carousel-1"), imageAlt: getAssetAlt("hero-carousel-1") },
|
|
{ imageSrc: getAssetUrl("hero-carousel-2"), imageAlt: getAssetAlt("hero-carousel-2") },
|
|
{ imageSrc: getAssetUrl("hero-carousel-3"), imageAlt: getAssetAlt("hero-carousel-3") },
|
|
{ imageSrc: getAssetUrl("hero-carousel-4"), imageAlt: getAssetAlt("hero-carousel-4") },
|
|
{ imageSrc: getAssetUrl("hero-carousel-5"), imageAlt: getAssetAlt("hero-carousel-5") },
|
|
{ imageSrc: getAssetUrl("hero-carousel-6"), imageAlt: getAssetAlt("hero-carousel-6") }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about" className={undefined}>
|
|
<AboutMetric
|
|
title={"Air CareSaver: Dedicated to Your Comfort"}
|
|
metrics={[
|
|
{ icon: Gauge, label: "Years in Service", value: "20+" },
|
|
{ icon: Users, label: "Satisfied Customers", value: "5000+" },
|
|
{ icon: Wrench, label: "Certified Technicians", value: "25+" },
|
|
{ icon: Award, label: "Award-Winning Quality", value: "Top Rated" }
|
|
]}
|
|
metricsAnimation={"slide-up"}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services" className={undefined}>
|
|
<FeatureCardTen
|
|
features={[
|
|
{
|
|
title: "AC Repair & Maintenance", description: "Keep your cooling system running efficiently with our expert repair and preventative maintenance services. We handle all brands and models.", media: { imageSrc: getAssetUrl("features-media-1"), imageAlt: getAssetAlt("features-media-1") },
|
|
items: [
|
|
{ icon: ThermometerSun, text: "Diagnostic & Troubleshooting" },
|
|
{ icon: AirVent, text: "Filter Replacement" },
|
|
{ icon: ShieldCheck, text: "Seasonal Tune-ups" }
|
|
],
|
|
reverse: false
|
|
},
|
|
{
|
|
title: "Heating System Installation", description: "Stay warm all winter with our professional heating system installations. We offer a wide range of energy-efficient furnaces and heat pumps.", media: { imageSrc: getAssetUrl("features-media-2"), imageAlt: getAssetAlt("features-media-2") },
|
|
items: [
|
|
{ icon: Flame, text: "New Furnace Installs" },
|
|
{ icon: Fan, text: "Heat Pump Systems" },
|
|
{ icon: Bolt, text: "Energy-Efficient Upgrades" }
|
|
],
|
|
reverse: true
|
|
},
|
|
{
|
|
title: "Indoor Air Quality Solutions", description: "Breathe cleaner, healthier air with our advanced indoor air quality solutions, including air purifiers, humidifiers, and duct cleaning.", media: { imageSrc: getAssetUrl("features-media-3"), imageAlt: getAssetAlt("features-media-3") },
|
|
items: [
|
|
{ icon: Cloudy, text: "Air Purification" },
|
|
{ icon: Droplet, text: "Humidity Control" },
|
|
{ icon: Wind, text: "Duct Cleaning" }
|
|
],
|
|
reverse: false
|
|
}
|
|
]}
|
|
title={"Comprehensive HVAC Services You Can Trust"}
|
|
description={"From routine maintenance to emergency repairs and new installations, Air CareSaver provides full-service solutions for all your heating and cooling needs."}
|
|
textboxLayout={"default"}
|
|
animationType={"slide-up"}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products" className={undefined}>
|
|
<ProductCardThree
|
|
products={[
|
|
{ id: "ac-unit-1", name: "High-Efficiency AC Unit", price: "$3,200", imageSrc: getAssetUrl("product-ac-unit-1"), imageAlt: getAssetAlt("product-ac-unit-1") },
|
|
{ id: "furnace-1", name: "Smart Gas Furnace", price: "$2,800", imageSrc: getAssetUrl("product-furnace-1"), imageAlt: getAssetAlt("product-furnace-1") },
|
|
{ id: "thermostat-1", name: "Programmable Smart Thermostat", price: "$250", imageSrc: getAssetUrl("product-thermostat-1"), imageAlt: getAssetAlt("product-thermostat-1") },
|
|
{ id: "air-purifier-1", name: "Whole-Home Air Purifier", price: "$700", imageSrc: getAssetUrl("product-air-purifier-1"), imageAlt: getAssetAlt("product-air-purifier-1") },
|
|
{ id: "heat-pump-1", name: "Hybrid Heat Pump System", price: "$4,500", imageSrc: getAssetUrl("product-heat-pump-1"), imageAlt: getAssetAlt("product-heat-pump-1") },
|
|
{ id: "water-heater-1", name: "Tankless Water Heater", price: "$1,100", imageSrc: getAssetUrl("product-water-heater-1"), imageAlt: getAssetAlt("product-water-heater-1") }
|
|
]}
|
|
gridVariant={"three-columns-all-equal-width"}
|
|
animationType={"slide-up"}
|
|
title={"Premium HVAC Products for Every Home"}
|
|
description={"Upgrade your system with our selection of top-rated, energy-efficient air conditioners, furnaces, and indoor air quality products."}
|
|
textboxLayout={"default"}
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics" className={undefined}>
|
|
<MetricCardSeven
|
|
metrics={[
|
|
{ id: "m1", value: "98%", title: "Customer Satisfaction", items: ["Always aiming higher", "Feedback-driven improvements"] },
|
|
{ id: "m2", value: "24/7", title: "Emergency Service", items: ["Rapid response team", "Available day and night"] },
|
|
{ id: "m3", value: "100%", title: "Certified Technicians", items: ["Industry-leading training", "Experienced and skilled"] },
|
|
{ id: "m4", value: "5-Star", title: "Average Rating", items: ["Consistently exceeding expectations", "Trusted by homeowners"]
|
|
}
|
|
]}
|
|
animationType={"slide-up"}
|
|
title={"Our Commitment to Excellence"}
|
|
description={"At Air CareSaver, our numbers speak for themselves. We're dedicated to providing exceptional service and earning your trust every day."}
|
|
textboxLayout={"default"}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials" className={undefined}>
|
|
<TestimonialCardOne
|
|
testimonials={[
|
|
{ id: "1", name: "Sarah Johnson", role: "Homeowner", company: "Maple Grove", rating: 5, imageSrc: getAssetUrl("testimonial-1"), imageAlt: getAssetAlt("testimonial-1") },
|
|
{ id: "2", name: "Michael Chen", role: "Small Business Owner", company: "Downtown Cafe", rating: 5, imageSrc: getAssetUrl("testimonial-2"), imageAlt: getAssetAlt("testimonial-2") },
|
|
{ id: "3", name: "Emily Rodriguez", role: "Property Manager", company: "Riverbend Apartments", rating: 5, imageSrc: getAssetUrl("testimonial-3"), imageAlt: getAssetAlt("testimonial-3") },
|
|
{ id: "4", name: "David Kim", role: "New Home Buyer", company: "Sunset Valley", rating: 5, imageSrc: getAssetUrl("testimonial-4"), imageAlt: getAssetAlt("testimonial-4") },
|
|
{ id: "5", name: "Jessica Lee", role: "Residential Client", company: "Oakwood Estates", rating: 5, imageSrc: getAssetUrl("testimonial-5"), imageAlt: getAssetAlt("testimonial-5") }
|
|
]}
|
|
gridVariant={"three-columns-all-equal-width"}
|
|
animationType={"slide-up"}
|
|
title={"What Our Customers Say"}
|
|
description={"Hear directly from satisfied homeowners and business clients about their Air CareSaver experience. Your comfort is our greatest success."}
|
|
textboxLayout={"default"}
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq" className={undefined}>
|
|
<FaqDouble
|
|
faqs={[
|
|
{ id: "faq1", title: "How often should I have my AC system serviced?", content: "We recommend annual maintenance for your AC system, ideally in the spring, to ensure optimal performance and catch any potential issues before peak season." },
|
|
{ id: "faq2", title: "What's the difference between AC repair and replacement?", content: "Repair involves fixing existing components, while replacement means installing a brand new unit. We'll help you assess if repair is cost-effective or if a new, more efficient system is better for long-term savings." },
|
|
{ id: "faq3", title: "Do you offer emergency HVAC services?", content: "Yes, Air CareSaver provides 24/7 emergency services for both air conditioning and heating systems. Just give us a call, and our technicians will be there to help." },
|
|
{ id: "faq4", title: "How can I improve my home's indoor air quality?", content: "Improving indoor air quality can involve several solutions, including installing air purifiers, UV lights, maintaining optimal humidity levels, and regular duct cleaning. We can assess your home and recommend the best options." },
|
|
{ id: "faq5", title: "What brands of HVAC equipment do you service?", content: "Our certified technicians are trained and equipped to service and install all major brands of air conditioning and heating equipment. We work with leading manufacturers to provide you with the best solutions." },
|
|
{ id: "faq6", title: "Are your technicians certified and insured?", content: "Absolutely. All Air CareSaver technicians are fully certified, licensed, and insured, ensuring professional and reliable service every time. Your safety and satisfaction are our top priorities." }
|
|
]}
|
|
title={"Frequently Asked Questions"}
|
|
description={"Got questions about your HVAC system? We've got answers. Find quick solutions to common inquiries about our services, products, and maintenance tips."}
|
|
faqsAnimation={"slide-up"}
|
|
textboxLayout={"default"}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact" className={undefined}>
|
|
<ContactSplitForm
|
|
title={"Get in Touch with Air CareSaver"}
|
|
description={"Ready to experience ultimate comfort? Contact us today for reliable AC and heating services, installations, or a free consultation. We're here to help!"}
|
|
inputs={[
|
|
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
|
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
|
{ name: "phone", type: "tel", placeholder: "Phone Number", required: false }
|
|
]}
|
|
multiSelect={{
|
|
name: "serviceType", label: "Select Service Type", options: ["AC Repair", "Heating Repair", "New Installation", "Maintenance Plan", "Indoor Air Quality", "Other"]
|
|
}}
|
|
textarea={{
|
|
name: "message", placeholder: "Tell us about your needs...", rows: 4,
|
|
required: true
|
|
}}
|
|
useInvertedBackground={true}
|
|
imageSrc={getAssetUrl("contact-image")}
|
|
imageAlt={getAssetAlt("contact-image")}
|
|
mediaAnimation={"slide-up"}
|
|
mediaPosition={"left"}
|
|
buttonText={"Send Message"}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer" className={undefined}>
|
|
<FooterBase
|
|
columns={[
|
|
{
|
|
title: "Services", items: [
|
|
{ label: "AC Repair", href: "#services" },
|
|
{ label: "Heating Installation", href: "#services" },
|
|
{ label: "Maintenance Plans", href: "#services" },
|
|
{ label: "Air Quality", href: "#services" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About Us", href: "#about" },
|
|
{ label: "Testimonials", href: "#testimonials" },
|
|
{ label: "FAQ", href: "#faq" },
|
|
{ label: "Contact", href: "#contact" }
|
|
]
|
|
},
|
|
{
|
|
title: "Connect", items: [
|
|
{ label: "Facebook", href: "#" },
|
|
{ label: "Instagram", href: "#" },
|
|
{ label: "Twitter", href: "#" },
|
|
{ label: "LinkedIn", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
logoText={"Air CareSaver"}
|
|
copyrightText={"© 2024 Air CareSaver. All rights reserved."}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |