Compare commits
21 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| a910764a50 | |||
| 65fa9bbddc | |||
| 3accb9593d | |||
| 665feef4da | |||
| ec5901b271 | |||
| c4c4b2f922 | |||
| 4849d65603 | |||
| 8619e3a7f3 | |||
| 758d96714c | |||
| e7e4e6bc78 | |||
| aaa4c17787 | |||
| 5f2edab050 | |||
| f6c2d23a6d | |||
| ca54b8ec21 | |||
| 01b510789a | |||
| b296fc430d | |||
| b925fdc3ad | |||
| d12cc24645 | |||
| 6513e43b07 | |||
| 141b4840ff | |||
| 27bebf5aba |
59
src/app/order-confirmation/page.tsx
Normal file
59
src/app/order-confirmation/page.tsx
Normal file
@@ -0,0 +1,59 @@
|
||||
"use client";
|
||||
|
||||
import React from "react";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||
import HeroOverlay from "@/components/sections/hero/HeroOverlay";
|
||||
import { CheckCircle } from "lucide-react";
|
||||
|
||||
export default function OrderConfirmationPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="aurora"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
brandName="AirPro HVAC"
|
||||
navItems={[
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
{ name: "Place Order", id: "/order" }
|
||||
]}
|
||||
button={{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" }}
|
||||
animateOnLoad={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="order-confirmation" data-section="order-confirmation">
|
||||
<HeroOverlay
|
||||
title="Order Received!"
|
||||
description="Thank you for placing your service order with AirPro HVAC. We've received your request and will contact you shortly to confirm the details and schedule your service."
|
||||
tag="Confirmation"
|
||||
tagIcon={CheckCircle}
|
||||
buttons={[
|
||||
{ text: "Back to Home", href: "/" }
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
showDimOverlay={true}
|
||||
showBlur={true}
|
||||
textPosition="bottom"
|
||||
ariaLabel="Order confirmation section"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
68
src/app/order/page.tsx
Normal file
68
src/app/order/page.tsx
Normal file
@@ -0,0 +1,68 @@
|
||||
"use client";
|
||||
|
||||
import React from "react";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||
import { Sparkles } from "lucide-react";
|
||||
import ContactForm from "@/components/form/ContactForm";
|
||||
import { useRouter } from "next/navigation";
|
||||
|
||||
export default function OrderPage() {
|
||||
const router = useRouter();
|
||||
|
||||
const handleSubmitOrder = async (orderData: any) => {
|
||||
// In a real application, this would send orderData to your backend
|
||||
console.log("Submitting order:", orderData);
|
||||
// Simulate API call
|
||||
await new Promise(resolve => setTimeout(resolve, 1000));
|
||||
router.push('/order-confirmation'); // Redirect to confirmation page
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="aurora"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
brandName="AirPro HVAC"
|
||||
navItems={[
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
{ name: "Place Order", id: "/order" }
|
||||
]}
|
||||
button={{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" }}
|
||||
animateOnLoad={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="order-form" data-section="order-form">
|
||||
<ContactForm
|
||||
title="Place Your Service Order"
|
||||
description="Tell us what HVAC service you need. Our team will get back to you shortly."
|
||||
tag="New Order"
|
||||
tagIcon={Sparkles}
|
||||
inputPlaceholder="Enter your request details (e.g., 'AC Repair', 'Furnace Installation')"
|
||||
buttonText="Submit Order"
|
||||
termsText="By submitting, you agree to allow AirPro HVAC to contact you regarding your service request."
|
||||
onSubmit={handleSubmitOrder}
|
||||
centered={true}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
@@ -37,8 +37,9 @@ export default function HvacPage() {
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
{ name: "Place Order", id: "/order" }
|
||||
]}
|
||||
button={{ text: "Get a Quote", href: "#contact" }}
|
||||
button={{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" }}
|
||||
animateOnLoad={false}
|
||||
/>
|
||||
</div>
|
||||
@@ -50,12 +51,12 @@ export default function HvacPage() {
|
||||
avatars={[
|
||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-1.jpg", alt: "Client" },
|
||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-2.jpg", alt: "Client" },
|
||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.jpg", alt: "Client" },
|
||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.jpg", alt: "Client" }
|
||||
]}
|
||||
avatarText="Trusted by 500+ clients"
|
||||
buttons={[
|
||||
{ text: "Schedule Service", href: "#contact" },
|
||||
{ text: "Our Services", href: "#services" },
|
||||
{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" },
|
||||
{ text: "Our Services", href: "#services" }
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-1.jpg"
|
||||
@@ -73,7 +74,7 @@ export default function HvacPage() {
|
||||
{
|
||||
value: "2,500+", title: "Systems installed and serviced"},
|
||||
{
|
||||
value: "98%", title: "Customer satisfaction rate"},
|
||||
value: "98%", title: "Customer satisfaction rate"}
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-2.jpg"
|
||||
imageAlt="Commercial HVAC units on rooftop"
|
||||
@@ -89,7 +90,7 @@ export default function HvacPage() {
|
||||
<FeatureCardOne
|
||||
title="Our Services"
|
||||
description="From installations to emergency repairs, we have your comfort covered."
|
||||
buttons={[{ text: "Get a Quote", href: "#contact" }]}
|
||||
buttons={[{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" }]}
|
||||
buttonAnimation="slide-up"
|
||||
features={[
|
||||
{
|
||||
@@ -103,7 +104,7 @@ export default function HvacPage() {
|
||||
{
|
||||
title: "Duct Cleaning", description: "Professional duct cleaning to improve air quality and system efficiency throughout your property.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-8.jpg?_wi=1", imageAlt: "Duct cleaning service"},
|
||||
{
|
||||
title: "System Inspections", description: "Thorough inspections with detailed reports and transparent recommendations — no hidden fees.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-9.jpg", imageAlt: "HVAC system inspection"},
|
||||
title: "System Inspections", description: "Thorough inspections with detailed reports and transparent recommendations — no hidden fees.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-9.jpg", imageAlt: "HVAC system inspection"}
|
||||
]}
|
||||
gridVariant="uniform-all-items-equal"
|
||||
uniformGridCustomHeightClasses="aspect-square"
|
||||
@@ -126,7 +127,8 @@ export default function HvacPage() {
|
||||
title: "Quality Workmanship", description: "Our skilled technicians excel in various HVAC repairs, using only top-quality materials."},
|
||||
{
|
||||
icon: DollarSign,
|
||||
title: "Fair & Transparent Pricing", description: "No surprises here! We offer clear quotes and fair pricing for quality work."},
|
||||
title: "Fair & Transparent Pricing", description: "No surprises here! We offer clear quotes and fair pricing for quality work."
|
||||
}
|
||||
]}
|
||||
textboxLayout="default"
|
||||
animationType="slide-up"
|
||||
@@ -144,7 +146,8 @@ export default function HvacPage() {
|
||||
{
|
||||
title: "Expert Repair or Install", description: "We complete the work using premium parts and proven techniques — most jobs done same day.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-4.jpg?_wi=2", imageAlt: "HVAC repair in progress"},
|
||||
{
|
||||
title: "Quality Guarantee", description: "We test everything before we leave and back all work with our satisfaction guarantee.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-8.jpg?_wi=2", imageAlt: "Final quality check"},
|
||||
title: "Quality Guarantee", description: "We test everything before we leave and back all work with our satisfaction guarantee.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-8.jpg?_wi=2", imageAlt: "Final quality check"
|
||||
}
|
||||
]}
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
@@ -162,7 +165,8 @@ export default function HvacPage() {
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-2.jpg", imageAlt: "Linda M."},
|
||||
{
|
||||
id: "3", name: "Carlos D.", handle: "Homeowner, Houston TX", testimonial: "Our furnace broke down on the coldest night of the year. AirPro had someone at our door within two hours. Fixed it on the spot. Can't thank them enough.", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.jpg", imageAlt: "Carlos D."},
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.jpg", imageAlt: "Carlos D."
|
||||
}
|
||||
]}
|
||||
showRating={true}
|
||||
animationType="slide-up"
|
||||
@@ -173,7 +177,7 @@ export default function HvacPage() {
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
sideTitle="Frequently Asked Questions"
|
||||
buttons={[{ text: "Contact Us", href: "#contact" }]}
|
||||
buttons={[{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" }]}
|
||||
buttonAnimation="slide-up"
|
||||
faqsAnimation="slide-up"
|
||||
textPosition="left"
|
||||
@@ -188,7 +192,8 @@ export default function HvacPage() {
|
||||
{
|
||||
id: "4", title: "Do you offer financing options?", content: "Yes, we offer flexible financing plans for new installations and major repairs. Ask about our 0% interest options so you can stay comfortable without straining your budget."},
|
||||
{
|
||||
id: "5", title: "How long does a typical installation take?", content: "Most residential HVAC installations are completed in one day. Larger commercial projects may take 2-3 days depending on the scope. We'll give you an accurate timeline during your consultation."},
|
||||
id: "5", title: "How long does a typical installation take?", content: "Most residential HVAC installations are completed in one day. Larger commercial projects may take 2-3 days depending on the scope. We'll give you an accurate timeline during your consultation."
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -200,7 +205,7 @@ export default function HvacPage() {
|
||||
title="Ready to Stay Comfortable Year-Round?"
|
||||
description="Whether you need a new installation, emergency repair, or routine maintenance — our team is ready to help. Call us today or request a free quote."
|
||||
buttons={[
|
||||
{ text: "Get a Free Quote", href: "#contact" },
|
||||
{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" },
|
||||
{ text: "Call (512) 555-1234", href: "tel:5125551234" }
|
||||
]}
|
||||
background={{ variant: "plain" }}
|
||||
@@ -211,7 +216,7 @@ export default function HvacPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
logoText="AirPro HVAC"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-10.jpg"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-10.jpg?_wi=1"
|
||||
imageAlt="HVAC technician inspecting equipment"
|
||||
columns={[
|
||||
{
|
||||
@@ -219,24 +224,25 @@ export default function HvacPage() {
|
||||
{ label: "AC Installation", href: "#services" },
|
||||
{ label: "Heating Systems", href: "#services" },
|
||||
{ label: "Maintenance Plans", href: "#services" },
|
||||
{ label: "Emergency Repairs", href: "#services" },
|
||||
],
|
||||
{ label: "Emergency Repairs", href: "#services" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "#about" },
|
||||
{ label: "Testimonials", href: "#testimonials" },
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
],
|
||||
{ label: "Contact", href: "#contact" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Contact", items: [
|
||||
{ label: "(512) 555-1234", href: "tel:5125551234" },
|
||||
{ label: "info@airprohvac.com", href: "mailto:info@airprohvac.com" },
|
||||
{ label: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" },
|
||||
{ label: "123 Comfort St, Austin, TX 78701" }
|
||||
],
|
||||
},
|
||||
]
|
||||
}
|
||||
]}
|
||||
copyrightText="© 2026 | AirPro HVAC"
|
||||
/>
|
||||
@@ -244,4 +250,4 @@ export default function HvacPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
193
src/app/products/[id]/page.tsx
Normal file
193
src/app/products/[id]/page.tsx
Normal file
@@ -0,0 +1,193 @@
|
||||
"use client";
|
||||
|
||||
import React from "react";
|
||||
import { useParams } from "next/navigation";
|
||||
import Image from "next/image";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||
import FooterMedia from "@/components/sections/footer/FooterMedia";
|
||||
import ButtonTextShift from "@/components/button/ButtonTextShift/ButtonTextShift";
|
||||
|
||||
const dummyProducts = [
|
||||
{
|
||||
id: "1", name: "High-Efficiency AC Unit", description: "This 2-ton, 18 SEER AC unit provides superior cooling efficiency and quiet operation for medium-sized homes, significantly reducing energy consumption.", price: "$2,500", variant: "2-Ton, 18 SEER", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-4.jpg?w=800&h=600"
|
||||
},
|
||||
{
|
||||
id: "2", name: "Smart Thermostat", description: "Control your home's climate from anywhere with this Wi-Fi enabled smart thermostat. Features include energy usage reports, learning capabilities, and voice control compatibility.", price: "$199", variant: "Wi-Fi Enabled", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-9.jpg?w=800&h=600"
|
||||
},
|
||||
{
|
||||
id: "3", name: "Air Purifier", description: "Improve indoor air quality with this advanced air purifier. Equipped with a true HEPA filter, it captures 99.97% of airborne particles, including dust, pollen, pet dander, and smoke.", price: "$350", variant: "HEPA Filter", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-8.jpg?w=800&h=600"
|
||||
},
|
||||
{
|
||||
id: "4", name: "Furnace System", description: "A robust furnace system designed for reliable heating performance in colder climates. This 90,000 BTU unit ensures even heat distribution and energy efficiency throughout your home.", price: "$1,800", variant: "90,000 BTU", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-5.jpg?w=800&h=600"
|
||||
}
|
||||
];
|
||||
|
||||
export default function ProductDetailPage() {
|
||||
const params = useParams();
|
||||
const { id } = params;
|
||||
const product = dummyProducts.find((p) => p.id === id);
|
||||
|
||||
if (!product) {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="aurora"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<NavbarLayoutFloatingInline
|
||||
brandName="AirPro HVAC"
|
||||
navItems={[
|
||||
{ name: "Products", id: "/products" },
|
||||
{ name: "Cart", id: "/cart" },
|
||||
{ name: "Checkout", id: "/checkout" },
|
||||
{ name: "Services", id: "#services" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Testimonials", id: "#testimonials" },
|
||||
{ name: "Contact", id: "#contact" }
|
||||
]}
|
||||
button={{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" }}
|
||||
animateOnLoad={false}
|
||||
/>
|
||||
<div className="container mx-auto py-16 text-center">
|
||||
<h1 className="text-3xl font-bold mb-4">Product Not Found</h1>
|
||||
<p>The product you are looking for does not exist.</p>
|
||||
</div>
|
||||
<FooterMedia
|
||||
logoText="AirPro HVAC"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-10.jpg?_wi=2"
|
||||
imageAlt="HVAC technician inspecting equipment"
|
||||
columns={[
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "AC Installation", href: "#services" },
|
||||
{ label: "Heating Systems", href: "#services" },
|
||||
{ label: "Maintenance Plans", href: "#services" },
|
||||
{ label: "Emergency Repairs", href: "#services" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "#about" },
|
||||
{ label: "Testimonials", href: "#testimonials" },
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "Contact", href: "#contact" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Contact", items: [
|
||||
{ label: "(512) 555-1234", href: "tel:5125551234" },
|
||||
{ label: "info@airprohvac.com", href: "mailto:info@airprohvac.com" },
|
||||
{ label: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" },
|
||||
{ label: "123 Comfort St, Austin, TX 78701" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
copyrightText="© 2026 | AirPro HVAC"
|
||||
/>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="aurora"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
brandName="AirPro HVAC"
|
||||
navItems={[
|
||||
{ name: "Products", id: "/products" },
|
||||
{ name: "Cart", id: "/cart" },
|
||||
{ name: "Checkout", id: "/checkout" },
|
||||
{ name: "Services", id: "#services" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Testimonials", id: "#testimonials" },
|
||||
{ name: "Contact", id: "#contact" }
|
||||
]}
|
||||
button={{ text: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" }}
|
||||
animateOnLoad={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="container mx-auto py-16 px-4">
|
||||
<div className="grid md:grid-cols-2 gap-8 items-center">
|
||||
<div className="relative h-96 w-full rounded-lg overflow-hidden">
|
||||
<Image
|
||||
src={product.imageSrc}
|
||||
alt={product.name}
|
||||
layout="fill"
|
||||
objectFit="cover"
|
||||
className="rounded-lg"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-4">
|
||||
<h1 className="text-4xl font-bold">{product.name}</h1>
|
||||
<p className="text-2xl font-semibold text-primary-cta">{product.price}</p>
|
||||
<p className="text-lg text-foreground/80">{product.description}</p>
|
||||
{product.variant && (
|
||||
<p className="text-base text-foreground/60">Variant: {product.variant}</p>
|
||||
)}
|
||||
<ButtonTextShift text="Add to Cart" onClick={() => alert(`${product.name} added to cart!`)} className="w-fit mt-4" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
logoText="AirPro HVAC"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-10.jpg?_wi=3"
|
||||
imageAlt="HVAC technician inspecting equipment"
|
||||
columns={[
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "AC Installation", href: "#services" },
|
||||
{ label: "Heating Systems", href: "#services" },
|
||||
{ label: "Maintenance Plans", href: "#services" },
|
||||
{ label: "Emergency Repairs", href: "#services" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "#about" },
|
||||
{ label: "Testimonials", href: "#testimonials" },
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "Contact", href: "#contact" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Contact", items: [
|
||||
{ label: "(512) 555-1234", href: "tel:5125551234" },
|
||||
{ label: "info@airprohvac.com", href: "mailto:info@airprohvac.com" },
|
||||
{ label: "Chat on WhatsApp", href: "https://wa.me/message/ICLIEAFVM43DG1" },
|
||||
{ label: "123 Comfort St, Austin, TX 78701" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
copyrightText="© 2026 | AirPro HVAC"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
102
src/app/products/page.tsx
Normal file
102
src/app/products/page.tsx
Normal file
@@ -0,0 +1,102 @@
|
||||
"use client";
|
||||
|
||||
import ReactLenis from "lenis/react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||
import ProductCardFour from "@/components/sections/product/ProductCardFour";
|
||||
import FooterMedia from "@/components/sections/footer/FooterMedia";
|
||||
|
||||
export default function ProductsPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="aurora"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
brandName="AirPro HVAC"
|
||||
navItems={[
|
||||
{ name: "Products", id: "/products" },
|
||||
{ name: "Cart", id: "/cart" },
|
||||
{ name: "Checkout", id: "/checkout" },
|
||||
{ name: "Services", id: "#services" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Testimonials", id: "#testimonials" },
|
||||
{ name: "Contact", id: "#contact" }
|
||||
]}
|
||||
button={{ text: "Get a Quote", href: "#contact" }}
|
||||
animateOnLoad={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="min-h-screen py-16">
|
||||
<ProductCardFour
|
||||
title="Our Products"
|
||||
description="Discover our range of high-quality HVAC products."
|
||||
products={[
|
||||
{
|
||||
id: "1", name: "High-Efficiency AC Unit", price: "$2,500", variant: "2-Ton, 18 SEER", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-4.jpg?_wi=1", onProductClick: () => window.location.href = "/products/1"
|
||||
},
|
||||
{
|
||||
id: "2", name: "Smart Thermostat", price: "$199", variant: "Wi-Fi Enabled", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-9.jpg?_wi=1", onProductClick: () => window.location.href = "/products/2"
|
||||
},
|
||||
{
|
||||
id: "3", name: "Air Purifier", price: "$350", variant: "HEPA Filter", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-8.jpg?_wi=1", onProductClick: () => window.location.href = "/products/3"
|
||||
},
|
||||
{
|
||||
id: "4", name: "Furnace System", price: "$1,800", variant: "90,000 BTU", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-5.jpg?_wi=1", onProductClick: () => window.location.href = "/products/4"
|
||||
}
|
||||
]}
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
textboxLayout="default"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
logoText="AirPro HVAC"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/hvac/img-10.jpg"
|
||||
imageAlt="HVAC technician inspecting equipment"
|
||||
columns={[
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "AC Installation", href: "#services" },
|
||||
{ label: "Heating Systems", href: "#services" },
|
||||
{ label: "Maintenance Plans", href: "#services" },
|
||||
{ label: "Emergency Repairs", href: "#services" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "#about" },
|
||||
{ label: "Testimonials", href: "#testimonials" },
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "Contact", href: "#contact" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Contact", items: [
|
||||
{ label: "(512) 555-1234", href: "tel:5125551234" },
|
||||
{ label: "info@airprohvac.com", href: "mailto:info@airprohvac.com" },
|
||||
{ label: "123 Comfort St, Austin, TX 78701" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
copyrightText="© 2026 | AirPro HVAC"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user