Merge version_1 into main #1
495
src/app/page.tsx
495
src/app/page.tsx
@@ -19,365 +19,164 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="expand-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="S P Heating and Air"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Metrics", id: "metrics" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="S P Heating and Air"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
logoText="S P Heating and Air"
|
||||
description="Providing reliable, efficient, and comfortable heating and cooling solutions for your home and office."
|
||||
buttons={[
|
||||
{
|
||||
text: "Call Now",
|
||||
href: "tel:+16786972305",
|
||||
},
|
||||
{
|
||||
text: "Learn More",
|
||||
href: "#about",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-woman-wearing-helmet_23-2149366663.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{ variant: "gradient-bars" }}
|
||||
logoText="S P Heating and Air"
|
||||
description="Providing reliable, efficient, and comfortable heating and cooling solutions for your home and office."
|
||||
buttons={[
|
||||
{ text: "Call Now", href: "tel:+16786972305" },
|
||||
{ text: "Learn More", href: "#about" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-woman-wearing-helmet_23-2149366663.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Reliable Service You Can Trust"
|
||||
description="With years of experience in the industry, S P Heating and Air is committed to keeping your home comfortable all year round. We provide expert installation, maintenance, and repair services."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/portrait-happy-black-auto-mechanic-workshop_637285-9406.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Reliable Service You Can Trust"
|
||||
description="With years of experience in the industry, S P Heating and Air is committed to keeping your home comfortable all year round. We provide expert installation, maintenance, and repair services."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/portrait-happy-black-auto-mechanic-workshop_637285-9406.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "AC Maintenance",
|
||||
tags: [
|
||||
"AC",
|
||||
"Service",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=b30qpa",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Heating Installation",
|
||||
tags: [
|
||||
"Heating",
|
||||
"Setup",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-room-with-solid-fuel-boiler-working-biofuel-economical-heating_169016-14801.jpg",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Air Quality Service",
|
||||
tags: [
|
||||
"Filters",
|
||||
"Air",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-going-work-bicycle_23-2149413665.jpg",
|
||||
},
|
||||
{
|
||||
id: "f4",
|
||||
title: "Duct Cleaning",
|
||||
tags: [
|
||||
"HVAC",
|
||||
"Ventilation",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-ventilation-system_23-2149388960.jpg",
|
||||
},
|
||||
{
|
||||
id: "f5",
|
||||
title: "Emergency Repair",
|
||||
tags: [
|
||||
"Urgent",
|
||||
"Service",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/mechanic-using-control-box_107420-95947.jpg",
|
||||
},
|
||||
]}
|
||||
title="Our Expert Services"
|
||||
description="Comprehensive heating and air conditioning solutions for your comfort."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "f1", title: "AC Maintenance", tags: ["AC", "Service"], imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=b30qpa" },
|
||||
{ id: "f2", title: "Heating Installation", tags: ["Heating", "Setup"], imageSrc: "http://img.b2bpic.net/free-photo/man-room-with-solid-fuel-boiler-working-biofuel-economical-heating_169016-14801.jpg" },
|
||||
{ id: "f3", title: "Air Quality Service", tags: ["Filters", "Air"], imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-going-work-bicycle_23-2149413665.jpg" },
|
||||
{ id: "f4", title: "Duct Cleaning", tags: ["HVAC", "Ventilation"], imageSrc: "http://img.b2bpic.net/free-photo/close-up-ventilation-system_23-2149388960.jpg" },
|
||||
{ id: "f5", title: "Emergency Repair", tags: ["Urgent", "Service"], imageSrc: "http://img.b2bpic.net/free-photo/mechanic-using-control-box_107420-95947.jpg" }
|
||||
]}
|
||||
title="Our Expert Services"
|
||||
description="Comprehensive heating and air conditioning solutions for your comfort."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "Carrier",
|
||||
name: "Central AC Unit",
|
||||
price: "Contact for quote",
|
||||
rating: 5,
|
||||
reviewCount: "12",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-ventilation-system_23-2149388986.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "Trane",
|
||||
name: "Gas Furnace",
|
||||
price: "Contact for quote",
|
||||
rating: 5,
|
||||
reviewCount: "8",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/back-view-crouched-man-looking-working-oven_259150-59238.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
brand: "Nest",
|
||||
name: "Smart Thermostat",
|
||||
price: "$199",
|
||||
rating: 4,
|
||||
reviewCount: "25",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-finger-using-device_23-2148994138.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
brand: "Lennox",
|
||||
name: "Air Handler",
|
||||
price: "Contact for quote",
|
||||
rating: 5,
|
||||
reviewCount: "10",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-ventilation-system_23-2149388952.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
brand: "Honeywell",
|
||||
name: "Ventilation System",
|
||||
price: "Contact for quote",
|
||||
rating: 4,
|
||||
reviewCount: "15",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-ventilation-system_23-2149388961.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
brand: "Dyson",
|
||||
name: "Portable Heater",
|
||||
price: "$129",
|
||||
rating: 5,
|
||||
reviewCount: "40",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-smiley-woman-pushing-heater-s-red-button_23-2149395837.jpg",
|
||||
},
|
||||
]}
|
||||
title="Quality Equipment"
|
||||
description="Top-tier heating and cooling hardware to keep your systems running perfectly."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{ id: "p1", brand: "Carrier", name: "Central AC Unit", price: "Contact for quote", rating: 5, reviewCount: "12", imageSrc: "http://img.b2bpic.net/free-photo/close-up-ventilation-system_23-2149388986.jpg" },
|
||||
{ id: "p2", brand: "Trane", name: "Gas Furnace", price: "Contact for quote", rating: 5, reviewCount: "8", imageSrc: "http://img.b2bpic.net/free-photo/back-view-crouched-man-looking-working-oven_259150-59238.jpg" },
|
||||
{ id: "p3", brand: "Nest", name: "Smart Thermostat", price: "$199", rating: 4, reviewCount: "25", imageSrc: "http://img.b2bpic.net/free-photo/close-up-finger-using-device_23-2148994138.jpg" },
|
||||
{ id: "p4", brand: "Lennox", name: "Air Handler", price: "Contact for quote", rating: 5, reviewCount: "10", imageSrc: "http://img.b2bpic.net/free-photo/close-up-ventilation-system_23-2149388952.jpg" },
|
||||
{ id: "p5", brand: "Honeywell", name: "Ventilation System", price: "Contact for quote", rating: 4, reviewCount: "15", imageSrc: "http://img.b2bpic.net/free-photo/close-up-ventilation-system_23-2149388961.jpg" },
|
||||
{ id: "p6", brand: "Dyson", name: "Portable Heater", price: "$129", rating: 5, reviewCount: "40", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-smiley-woman-pushing-heater-s-red-button_23-2149395837.jpg" }
|
||||
]}
|
||||
title="Quality Equipment"
|
||||
description="Top-tier heating and cooling hardware to keep your systems running perfectly."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Mark R.",
|
||||
role: "Homeowner",
|
||||
company: "Local Area",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13336.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Jane D.",
|
||||
role: "Business Owner",
|
||||
company: "Small Biz",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-overjoyed-woman-rejoicing-her-success_74855-3513.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Robert S.",
|
||||
role: "Homeowner",
|
||||
company: "Local Area",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-working-as-plumber_23-2150746382.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Sarah P.",
|
||||
role: "Homeowner",
|
||||
company: "Local Area",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-beautiful-joyful-african-student-woman-with-dark-wavy-hair-green-cardigan-sitting-cafe-drinking-cup-coffee-smiling-camera-woman-waiting-her-boyfriend-after-university_176420-12329.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Mike T.",
|
||||
role: "Homeowner",
|
||||
company: "Local Area",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-sitting-desk_23-2148866942.jpg",
|
||||
},
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "100+",
|
||||
label: "Projects Completed",
|
||||
},
|
||||
{
|
||||
value: "500+",
|
||||
label: "Satisfied Clients",
|
||||
},
|
||||
{
|
||||
value: "10",
|
||||
label: "Years Experience",
|
||||
},
|
||||
]}
|
||||
title="What Our Clients Say"
|
||||
description="Reliable experts for our home and business."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Mark R.", role: "Homeowner", company: "Local Area", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13336.jpg" },
|
||||
{ id: "2", name: "Jane D.", role: "Business Owner", company: "Small Biz", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-overjoyed-woman-rejoicing-her-success_74855-3513.jpg" },
|
||||
{ id: "3", name: "Robert S.", role: "Homeowner", company: "Local Area", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-working-as-plumber_23-2150746382.jpg" },
|
||||
{ id: "4", name: "Sarah P.", role: "Homeowner", company: "Local Area", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-beautiful-joyful-african-student-woman-with-dark-wavy-hair-green-cardigan-sitting-cafe-drinking-cup-coffee-smiling-camera-woman-waiting-her-boyfriend-after-university_176420-12329.jpg" },
|
||||
{ id: "5", name: "Mike T.", role: "Homeowner", company: "Local Area", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-sitting-desk_23-2148866942.jpg" }
|
||||
]}
|
||||
kpiItems={[
|
||||
{ value: "100+", label: "Projects Completed" },
|
||||
{ value: "500+", label: "Satisfied Clients" },
|
||||
{ value: "10", label: "Years Experience" }
|
||||
]}
|
||||
title="What Our Clients Say"
|
||||
description="Reliable experts for our home and business."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "24/7",
|
||||
title: "Service Available",
|
||||
items: [
|
||||
"Always on call",
|
||||
"Rapid response",
|
||||
"Fast dispatch",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "100%",
|
||||
title: "Satisfaction",
|
||||
items: [
|
||||
"Customer focused",
|
||||
"Quality guaranteed",
|
||||
"Fair pricing",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "Local",
|
||||
title: "Family Owned",
|
||||
items: [
|
||||
"Rooted in community",
|
||||
"Trusted brand",
|
||||
"Service oriented",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Why Choose Us"
|
||||
description="Why customers consistently trust S P Heating and Air."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{ id: "m1", value: "24/7", title: "Service Available", items: ["Always on call", "Rapid response", "Fast dispatch"] },
|
||||
{ id: "m2", value: "100%", title: "Satisfaction", items: ["Customer focused", "Quality guaranteed", "Fair pricing"] },
|
||||
{ id: "m3", value: "Local", title: "Family Owned", items: ["Rooted in community", "Trusted brand", "Service oriented"] }
|
||||
]}
|
||||
title="Why Choose Us"
|
||||
description="Why customers consistently trust S P Heating and Air."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How often should I service my AC?",
|
||||
content: "We recommend annual maintenance.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "What are your service hours?",
|
||||
content: "We are available 24/7 for urgent calls.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Can you handle business HVAC?",
|
||||
content: "Yes, we specialize in both residential and commercial.",
|
||||
},
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Answers to common concerns about heating and air conditioning."
|
||||
faqsAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-heat-pump-outside-home_23-2149250261.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "q1", title: "How often should I service my AC?", content: "We recommend annual maintenance." },
|
||||
{ id: "q2", title: "What are your service hours?", content: "We are available 24/7 for urgent calls." },
|
||||
{ id: "q3", title: "Can you handle business HVAC?", content: "Yes, we specialize in both residential and commercial." }
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Answers to common concerns about heating and air conditioning."
|
||||
faqsAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-heat-pump-outside-home_23-2149250261.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={true}
|
||||
title="Schedule Your Service"
|
||||
description="Call us at +1 678-697-2305 or send a message to get started with an expert technician."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Your Email",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Tell us about your heating or cooling needs.",
|
||||
rows: 4,
|
||||
required: true,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/front-view-man-repairing-computer_23-2148419170.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={true}
|
||||
title="Schedule Your Service"
|
||||
description="Call us at +1 678-697-2305 or send a message to get started with an expert technician."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Your Email", required: true }
|
||||
]}
|
||||
textarea={{ name: "message", placeholder: "Tell us about your heating or cooling needs.", rows: 4, required: true }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/front-view-man-repairing-computer_23-2148419170.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="S P Heating and Air"
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="S P Heating and Air"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Terms of Service", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user