174 lines
9.2 KiB
TypeScript
174 lines
9.2 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
|
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
|
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
|
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
|
import TextAbout from '@/components/sections/about/TextAbout';
|
|
import { Award, Truck, Users, Zap, Shield, DollarSign, Phone } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="icon-arrow"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="compact"
|
|
sizing="mediumLargeSizeMediumTitles"
|
|
background="fluid"
|
|
cardStyle="soft-shadow"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="medium"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{ name: "About", id: "about" },
|
|
{ name: "Services", id: "features" },
|
|
{ name: "Products", id: "products" },
|
|
{ name: "Contact", id: "contact" },
|
|
]}
|
|
brandName="Woodmead Gas"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardCarousel
|
|
background={{ variant: "gradient-bars" }}
|
|
title="Reliable Gas Supply for Woodmead"
|
|
description="Safe, fast, and professional gas delivery services for your home and business. Experience peace of mind with our dedicated team."
|
|
tag="Trusted Energy Experts"
|
|
buttons={[{ text: "Order Now", href: "#contact" }, { text: "Our Products", href: "#products" }]}
|
|
mediaItems={[
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-gas-cylinder_23-2149290471.jpg?_wi=1", imageAlt: "Gas delivery truck" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-gas-cylinder_23-2149290458.jpg?_wi=1", imageAlt: "Gas canister delivery" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/barrels-storing-oil_1232-4392.jpg?_wi=1", imageAlt: "Gas warehouse" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-male-builder-wearing-uniform-safety-helmet-showing-two-pink_141793-74761.jpg", imageAlt: "Professional technician" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/wheel-bicycle-mountain-bike-gear-derailleur_1232-3840.jpg", imageAlt: "Safety check" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-simmering-smiling-bright-kitchen-easy-mood_169016-70828.jpg", imageAlt: "Gas stove" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextAbout
|
|
useInvertedBackground={false}
|
|
title="Quality Service You Can Rely On"
|
|
buttons={[{ text: "Contact Us", href: "#contact" }]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentySix
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{ title: "Fast Delivery", description: "Same day delivery to your doorstep.", buttonIcon: Zap, imageSrc: "http://img.b2bpic.net/free-photo/smart-factory-expert-using-digital-device-app-test-automated-systems-closeup_482257-126768.jpg", imageAlt: "gas distribution center" },
|
|
{ title: "Safety Guaranteed", description: "Strict quality and safety protocols.", buttonIcon: Shield, imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-gas-cylinder_23-2149290471.jpg?_wi=2", imageAlt: "gas distribution center" },
|
|
{ title: "Competitive Pricing", description: "Affordable rates for all volumes.", buttonIcon: DollarSign, imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-gas-cylinder_23-2149290458.jpg?_wi=2", imageAlt: "gas distribution center" },
|
|
{ title: "24/7 Support", description: "Available whenever you need us.", buttonIcon: Phone, imageSrc: "http://img.b2bpic.net/free-photo/barrels-storing-oil_1232-4392.jpg?_wi=2", imageAlt: "gas distribution center" }
|
|
]}
|
|
title="Why Choose Woodmead Gas"
|
|
description="We are committed to delivering excellence in every cylinder."
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
useInvertedBackground={false}
|
|
buttons={[{ text: "Order Now", href: "#contact" }]}
|
|
products={[
|
|
{ id: "p1", name: "9kg Gas Refill", price: "R350", rating: 5, reviewCount: "45 reviews", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-gas-cylinder_23-2149290456.jpg", brand: "Woodmead" },
|
|
{ id: "p2", name: "19kg Gas Refill", price: "R720", rating: 5, reviewCount: "82 reviews", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-gas-cylinder_23-2149290452.jpg", brand: "Woodmead" },
|
|
{ id: "p3", name: "48kg Gas Cylinder", price: "R1850", rating: 5, reviewCount: "21 reviews", imageSrc: "http://img.b2bpic.net/free-photo/view-tank-container-water-storage_23-2151748340.jpg", brand: "Woodmead" },
|
|
{ id: "p4", name: "Regulator Kit", price: "R250", rating: 4, reviewCount: "15 reviews", imageSrc: "http://img.b2bpic.net/free-photo/old-copper-faucet-public-place-street-old-city-turkey-travel-time-idea-background_166373-3598.jpg", brand: "Woodmead" },
|
|
{ id: "p5", name: "Industrial Hose", price: "R400", rating: 4, reviewCount: "12 reviews", imageSrc: "http://img.b2bpic.net/modern-autonomous-heating-system-boiler-room_169016-53594.jpg", brand: "Woodmead" },
|
|
{ id: "p6", name: "Camping Bottle", price: "R180", rating: 5, reviewCount: "30 reviews", imageSrc: "http://img.b2bpic.net/free-photo/hiker-sitting-sand-having-respite_613910-9452.jpg", brand: "Woodmead" }
|
|
]}
|
|
title="Our Gas Solutions"
|
|
description="Browse our range of gas products for residential and commercial needs."
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardThree
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{ id: "m1", icon: Truck, title: "Daily Deliveries", value: "50+" },
|
|
{ id: "m2", icon: Users, title: "Happy Customers", value: "2000+" },
|
|
{ id: "m3", icon: Award, title: "Years Experience", value: "15" }
|
|
]}
|
|
title="Our Impact"
|
|
description="Supporting our local community daily."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwelve
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{ id: "1", name: "Sarah Miller", imageSrc: "http://img.b2bpic.net/free-photo/front-view-portrait-beautiful-young-woman-giving-thumbs-up-standing-isolated-rosy_176532-7958.jpg" },
|
|
{ id: "2", name: "John Doe", imageSrc: "http://img.b2bpic.net/free-photo/expressive-young-woman-posing_344912-1420.jpg" },
|
|
{ id: "3", name: "Chef Marco", imageSrc: "http://img.b2bpic.net/happy-elderly-woman-wearing-bonete-looking-camrea-dining-room-home-retired-old-baker-with-kitchen-uniform-preparing-bakery-ingredients-table-ready-cook-homemade-bread-cakes-pasta_482257-14386.jpg" },
|
|
{ id: "4", name: "Anna Smith", imageSrc: "http://img.b2bpic.net/free-photo/young-crazy-man-happy-expression_1194-1930.jpg" },
|
|
{ id: "5", name: "David Wilson", imageSrc: "http://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5365.jpg" }
|
|
]}
|
|
cardTitle="Client Reviews"
|
|
cardTag="Testimonials"
|
|
cardAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqDouble
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{ id: "q1", title: "How do I order?", content: "Order online or call us directly." },
|
|
{ id: "q2", title: "Do you deliver on weekends?", content: "Yes, we offer weekend delivery services." },
|
|
{ id: "q3", title: "Is my cylinder safe?", content: "All cylinders are safety-checked before every delivery." }
|
|
]}
|
|
title="Common Questions"
|
|
description="Everything you need to know about our gas service."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
useInvertedBackground={false}
|
|
background={{ variant: "plain" }}
|
|
tag="Get in Touch"
|
|
title="Ready for your delivery?"
|
|
description="Leave your email and we'll be in touch immediately."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterSimple
|
|
columns={[
|
|
{ title: "Woodmead Gas", items: [{ label: "About", href: "#about" }, { label: "Services", href: "#features" }] },
|
|
{ title: "Support", items: [{ label: "Contact", href: "#contact" }, { label: "FAQs", href: "#faq" }] }
|
|
]}
|
|
bottomLeftText="© 2024 Woodmead Gas"
|
|
bottomRightText="All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |