Update src/app/page.tsx
This commit is contained in:
412
src/app/page.tsx
412
src/app/page.tsx
@@ -16,295 +16,151 @@ import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="icon-arrow"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="soft"
|
||||
contentWidth="small"
|
||||
sizing="mediumLarge"
|
||||
background="grid"
|
||||
cardStyle="gradient-radial"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="bold"
|
||||
defaultButtonVariant="icon-arrow"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="soft"
|
||||
contentWidth="small"
|
||||
sizing="mediumLarge"
|
||||
background="grid"
|
||||
cardStyle="gradient-radial"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "pricing",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Four Seasons HVAC"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Four Seasons HVAC"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
logoText="Four Seasons Heating & Air Conditioning"
|
||||
description="Your comfort, all year round. Professional, reliable HVAC solutions for your home and business."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get a Quote",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "Our Services",
|
||||
href: "#services",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/zoom-shot-manifold-meters_482257-91084.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
imageAlt="hvac technician modern unit"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{ variant: "gradient-bars" }}
|
||||
logoText="Four Seasons Heating & Air Conditioning"
|
||||
description="Your comfort, all year round. Professional, reliable HVAC solutions for your home and business."
|
||||
buttons={[{ text: "Get a Quote", href: "#contact" }, { text: "Our Services", href: "#services" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/zoom-shot-manifold-meters_482257-91084.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
imageAlt="hvac technician modern unit"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={true}
|
||||
title="Trusted by Your Community"
|
||||
description={[
|
||||
"For over 20 years, Four Seasons has provided unparalleled heating and cooling services. Our mission is to keep your environment comfortable, no matter the weather outside.",
|
||||
"We prioritize energy efficiency, reliable service, and 100% customer satisfaction.",
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={true}
|
||||
title="Trusted by Your Community"
|
||||
description={[
|
||||
"For over 20 years, Four Seasons has provided unparalleled heating and cooling services. Our mission is to keep your environment comfortable, no matter the weather outside.", "We prioritize energy efficiency, reliable service, and 100% customer satisfaction."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentySeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "s1",
|
||||
title: "AC Installation",
|
||||
descriptions: [
|
||||
"High-efficiency cooling systems designed for your space.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-heat-pump-outside-home_23-2149250249.jpg",
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
title: "Emergency Repair",
|
||||
descriptions: [
|
||||
"Available 24/7 for urgent cooling and heating failures.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hvac-system-refrigerant-tank-check_482257-85115.jpg",
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
title: "Seasonal Maintenance",
|
||||
descriptions: [
|
||||
"Preventative checks to ensure your unit runs year-round.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/electrical-technician-looking-focused-while-working-switchboard-with-fuses_169016-23720.jpg",
|
||||
},
|
||||
]}
|
||||
title="Comprehensive HVAC Solutions"
|
||||
description="We offer a full range of heating and air conditioning services designed to optimize efficiency and comfort in your home."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentySeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "s1", title: "AC Installation", descriptions: ["High-efficiency cooling systems designed for your space."], imageSrc: "http://img.b2bpic.net/free-photo/close-up-heat-pump-outside-home_23-2149250249.jpg" },
|
||||
{ id: "s2", title: "Emergency Repair", descriptions: ["Available 24/7 for urgent cooling and heating failures."], imageSrc: "http://img.b2bpic.net/free-photo/hvac-system-refrigerant-tank-check_482257-85115.jpg" },
|
||||
{ id: "s3", title: "Seasonal Maintenance", descriptions: ["Preventative checks to ensure your unit runs year-round."], imageSrc: "http://img.b2bpic.net/free-photo/electrical-technician-looking-focused-while-working-switchboard-with-fuses_169016-23720.jpg" }
|
||||
]}
|
||||
title="Comprehensive HVAC Solutions"
|
||||
description="We offer a full range of heating and air conditioning services designed to optimize efficiency and comfort in your home."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardEleven
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "25+",
|
||||
title: "Years Experience",
|
||||
description: "Serving the local community since 1998.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-adult-getting-warm-by-heating_23-2149134351.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "98%",
|
||||
title: "Efficiency Rating",
|
||||
description: "We help you save energy and reduce costs.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-person-with-small-house_1048-17822.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "10k+",
|
||||
title: "Happy Clients",
|
||||
description: "Trusted by residential and commercial owners.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/couple-changing-bulb-home_23-2147766978.jpg",
|
||||
},
|
||||
]}
|
||||
title="Why Choose Us"
|
||||
description="Proven performance and unmatched reliability in every service call we make."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{ id: "m1", value: "25+", title: "Years Experience", description: "Serving the local community since 1998.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-adult-getting-warm-by-heating_23-2149134351.jpg" },
|
||||
{ id: "m2", value: "98%", title: "Efficiency Rating", description: "We help you save energy and reduce costs.", imageSrc: "http://img.b2bpic.net/free-photo/young-person-with-small-house_1048-17822.jpg" },
|
||||
{ id: "m3", value: "10k+", title: "Happy Clients", description: "Trusted by residential and commercial owners.", imageSrc: "http://img.b2bpic.net/free-photo/couple-changing-bulb-home_23-2147766978.jpg" }
|
||||
]}
|
||||
title="Why Choose Us"
|
||||
description="Proven performance and unmatched reliability in every service call we make."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "basic",
|
||||
badge: "Essential",
|
||||
price: "$99",
|
||||
subtitle: "Seasonal checkup",
|
||||
features: [
|
||||
"Visual inspection",
|
||||
"Filter replacement",
|
||||
"Performance test",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "pro",
|
||||
badge: "Recommended",
|
||||
price: "$199",
|
||||
subtitle: "Comprehensive care",
|
||||
features: [
|
||||
"System deep cleaning",
|
||||
"Minor repairs included",
|
||||
"Priority response",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Service Plans"
|
||||
description="Choose a plan that fits your maintenance needs."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{ id: "basic", badge: "Essential", price: "$99", subtitle: "Seasonal checkup", features: ["Visual inspection", "Filter replacement", "Performance test"] },
|
||||
{ id: "pro", badge: "Recommended", price: "$199", subtitle: "Comprehensive care", features: ["System deep cleaning", "Minor repairs included", "Priority response"] }
|
||||
]}
|
||||
title="Service Plans"
|
||||
description="Choose a plan that fits your maintenance needs."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardFifteen
|
||||
useInvertedBackground={true}
|
||||
testimonial="Four Seasons saved us during a heatwave! Professional, quick, and very honest pricing. Highly recommend."
|
||||
rating={5}
|
||||
author="Sarah Miller"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/happy-handsome-dark-haired-latin-man-posing-with-arms-folded-kitchen_74855-8094.jpg",
|
||||
alt: "happy homeowner smiling portrait",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/horizontal-portrait-beautiful-positive-young-european-female-blue-shirt-dress-relaxing-home-looking-front-with-easy-carefree-smile_343059-3894.jpg",
|
||||
alt: "senior man smiling home",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/little-son-hugging-her-parents-sitting-sofa-with-white-dog_23-2147938794.jpg",
|
||||
alt: "young family in living room",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-smiling-technical-support-specialist-call-center-office_482257-126112.jpg",
|
||||
alt: "man portrait smiling home",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13337.jpg",
|
||||
alt: "Stylish woman wearing yellow bandana",
|
||||
},
|
||||
]}
|
||||
ratingAnimation="blur-reveal"
|
||||
avatarsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardFifteen
|
||||
useInvertedBackground={true}
|
||||
testimonial="Four Seasons saved us during a heatwave! Professional, quick, and very honest pricing. Highly recommend."
|
||||
rating={5}
|
||||
author="Sarah Miller"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/happy-handsome-dark-haired-latin-man-posing-with-arms-folded-kitchen_74855-8094.jpg", alt: "happy homeowner smiling portrait" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/horizontal-portrait-beautiful-positive-young-european-female-blue-shirt-dress-relaxing-home-looking-front-with-easy-carefree-smile_343059-3894.jpg", alt: "senior man smiling home" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/little-son-hugging-her-parents-sitting-sofa-with-white-dog_23-2147938794.jpg", alt: "young family in living room" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-smiling-technical-support-specialist-call-center-office_482257-126112.jpg", alt: "man portrait smiling home" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13337.jpg", alt: "Stylish woman wearing yellow bandana" }
|
||||
]}
|
||||
ratingAnimation="blur-reveal"
|
||||
avatarsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "How often should I change filters?",
|
||||
content: "We recommend changing your HVAC air filters at least every 3 months for optimal efficiency.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "What's included in maintenance?",
|
||||
content: "Our maintenance includes a comprehensive system cleaning, refrigerant checks, and component inspection.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Do you offer financing?",
|
||||
content: "Yes, we offer flexible financing options for system installations and major repairs.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/smiling-women-embracing-looking-camera_1262-16510.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
title="Common Questions"
|
||||
description="Answers to the most frequently asked questions about our heating and cooling services."
|
||||
faqsAnimation="blur-reveal"
|
||||
imageAlt="friendly customer support office"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "f1", title: "How often should I change filters?", content: "We recommend changing your HVAC air filters at least every 3 months for optimal efficiency." },
|
||||
{ id: "f2", title: "What's included in maintenance?", content: "Our maintenance includes a comprehensive system cleaning, refrigerant checks, and component inspection." },
|
||||
{ id: "f3", title: "Do you offer financing?", content: "Yes, we offer flexible financing options for system installations and major repairs." }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/smiling-women-embracing-looking-camera_1262-16510.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
title="Common Questions"
|
||||
description="Answers to the most frequently asked questions about our heating and cooling services."
|
||||
faqsAnimation="blur-reveal"
|
||||
imageAlt="friendly customer support office"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "animated-grid",
|
||||
}}
|
||||
tag="Ready to book?"
|
||||
title="Get a Free Consultation"
|
||||
description="Leave your email and our team will get in touch to discuss your heating and cooling needs."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={true}
|
||||
background={{ variant: "animated-grid" }}
|
||||
tag="Ready to book?"
|
||||
title="Get a Free Consultation"
|
||||
description="Leave your email and our team will get in touch to discuss your heating and cooling needs."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Four Seasons HVAC"
|
||||
columns={[
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
{
|
||||
label: "Installation",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Repair",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Maintenance",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 Four Seasons HVAC. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Four Seasons HVAC"
|
||||
columns={[
|
||||
{ title: "Services", items: [{ label: "Installation", href: "#services" }, { label: "Repair", href: "#services" }, { label: "Maintenance", href: "#services" }] },
|
||||
{ title: "Company", items: [{ label: "About Us", href: "#about" }, { label: "Contact", href: "#contact" }, { label: "FAQ", href: "#faq" }] }
|
||||
]}
|
||||
copyrightText="© 2025 Four Seasons HVAC. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user