184 lines
14 KiB
TypeScript
184 lines
14 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
|
|
import AboutMetric from '@/components/sections/about/AboutMetric';
|
|
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
|
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import { CalendarDays, Smile, Sparkles, Award, Palette, Grass, BrickWall, TreeDeciduous } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="elastic-effect"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="compact"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="circleGradient"
|
|
cardStyle="outline"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
brandName="Four Seasons Landscaping"
|
|
navItems={[
|
|
{ name: "Home", id: "#hero" },
|
|
{ name: "Services", id: "#services" },
|
|
{ name: "About", id: "#about" },
|
|
{ name: "Testimonials", id: "#testimonials" },
|
|
{ name: "FAQ", id: "#faq" },
|
|
{ name: "Contact", id: "#contact" }
|
|
]}
|
|
button={{
|
|
text: "Get a Free Estimate", href: "#contact"
|
|
}}
|
|
/>
|
|
</div>
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardScroll
|
|
title="Your Dream Landscape, Realized."
|
|
description="Four Seasons Landscaping brings expertise and passion to every project, creating stunning, sustainable outdoor environments tailored to your vision and lifestyle."
|
|
buttons={[
|
|
{ text: "Explore Services", href: "#services" },
|
|
{ text: "Request a Quote", href: "#contact" }
|
|
]}
|
|
imageSrc="https://pixabay.com/get/g853ad2050d9a2fe46992b9bae4cf1b32f28204af8edacf1147833c876a01f2388fb7155c52301219c634f4b1a0da5be378682edc330e39f8243abfb6a9928112_1280.jpg"
|
|
imageAlt="Lush, beautifully designed garden with seating area"
|
|
background={{ variant: "radial-gradient" }}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
<div id="about" data-section="about">
|
|
<AboutMetric
|
|
title="Crafting Beautiful Landscapes for Over a Decade"
|
|
metrics={[
|
|
{ icon: CalendarDays, label: "Years of Experience", value: "15+" },
|
|
{ icon: Smile, label: "Happy Clients", value: "500+" },
|
|
{ icon: Sparkles, label: "Projects Completed", value: "1000+" },
|
|
{ icon: Award, label: "Award-Winning Designs", value: "5+" }
|
|
]}
|
|
metricsAnimation="slide-up"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
<div id="services" data-section="services">
|
|
<FeatureCardTwentyFive
|
|
title="Our Comprehensive Landscaping Services"
|
|
description="From lush gardens to elegant hardscapes, we offer a full spectrum of services to enhance your outdoor living."
|
|
features={[
|
|
{
|
|
title: "Landscape Design & Installation", description: "Bringing your vision to life with custom designs and professional installation, ensuring every detail reflects your style and needs.", icon: Palette,
|
|
mediaItems: [
|
|
{ imageSrc: "https://pixabay.com/get/gcd6b1eba1a8cb8c3198dc814c0f4119e9d100fdfb24d481e40004517c643c37aed15e347e9b08592341588ce77b9f715d0fac21fd6f2f2e0a97f635b93b01323_1280.jpg", imageAlt: "Landscape design sketch" },
|
|
{ imageSrc: "https://pixabay.com/get/g668521c73fb7fb596d8d472656a7ed1d3ef65a3ef766bbcf40fb0aa5cb5732473b8878c364e3923472f68473f1777fb951fd298ff9bc14f5b58a2ecafbcf769e_1280.jpg", imageAlt: "Landscaping installation" }
|
|
]
|
|
},
|
|
{
|
|
title: "Lawn Care & Maintenance", description: "Keep your lawn vibrant, healthy, and pristine year-round with our expert mowing, fertilization, aeration, and pest control programs.", icon: Grass,
|
|
mediaItems: [
|
|
{ imageSrc: "https://pixabay.com/get/ged8cf8d8d074eff8890467519390daa2a7e1c565bf8540bbf9bd481a5538426dd9e993a8d65a97a4589738ddfb9534f265fef9a06fbcb6899d2430d4222d1ec1_1280.jpg", imageAlt: "Pristine green lawn" },
|
|
{ imageSrc: "https://pixabay.com/get/g4f9ab034246fe9ef1735af5e87a454dba5a98e68bfbe69fb4ece3e4b01d45a664acf35d410941e51b61cf89fe8317e05b2372e56004d038a25eb01a4a8c9163f_1280.jpg", imageAlt: "Gardener mowing lawn" }
|
|
]
|
|
},
|
|
{
|
|
title: "Hardscaping & Patios", description: "Create inviting and functional outdoor living areas with custom patios, walkways, retaining walls, and fire pits designed for durability and beauty.", icon: BrickWall,
|
|
mediaItems: [
|
|
{ imageSrc: "https://pixabay.com/get/g3b7e6e452c2b2d662dfe1b6ebe53460f2a78acba810003b984b8a28f19306d047d72aa9e2e54ea7d7b25388b6bbd60b25313f6365a1553ce18af4f90c299efb6_1280.jpg", imageAlt: "Elegant stone patio" },
|
|
{ imageSrc: "https://pixabay.com/get/g252c57e570e404cb105d4e4924b4486fa6c5b40330c4cc0b7a488cae52cae7720f765e3787132276694e124ee8ef74b049804bf80944246dac596919618710af_1280.jpg", imageAlt: "Stone walkway in garden" }
|
|
]
|
|
},
|
|
{
|
|
title: "Tree & Shrub Care", description: "Ensure the long-term health and aesthetic appeal of your trees and shrubs with our specialized pruning, disease management, and nutrient programs.", icon: TreeDeciduous,
|
|
mediaItems: [
|
|
{ imageSrc: "https://pixabay.com/get/g0d2b9aa0f8ad92848d050d858cd9ca89a9316b302ff8165dd66e9ea37fd645c7b710082100fa60c4a8950e891ba531f72ecda68fa60bad87d497edc7eeb821b3_1280.jpg", imageAlt: "Perfectly pruned tree" },
|
|
{ imageSrc: "https://pixabay.com/get/g2cabbee635c891a3abf095146e452c67faa40afb6433c7e96e53cbd2cc3988f9b7f12a3bfc31d5aa7a8730c054f1b3cc96927a7828006f3736cdb1005f51253b_1280.jpg", imageAlt: "Healthy green shrubs" }
|
|
]
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwo
|
|
title="What Our Clients Say"
|
|
description="Hear from homeowners who trusted Four Seasons Landscaping with their outdoor dreams."
|
|
testimonials={[
|
|
{ id: "1", name: "Sarah Johnson", role: "Homeowner, Maplewood", testimonial: "Four Seasons transformed our dull backyard into an incredible oasis. Professional, prompt, and truly exceeded our expectations!", imageSrc: "https://pixabay.com/get/gd2045bded3286373dcfe326326323d1ab2c4d2d8f38cecec8669801ac760e9b836521a8e90a915e7a5892980c5d46ab9_1280.jpg" },
|
|
{ id: "2", name: "Michael Chen", role: "Residential Client, Oakville", testimonial: "The team's attention to detail on our new patio was outstanding. We spend so much more time outdoors now, thanks to them.", imageSrc: "https://pixabay.com/get/g490337bb56fa908fa7d69255c4ff0bf2a452122a3b380f8f8747dbec76a19068169332ae63b55322dd4c_1280.jpg" },
|
|
{ id: "3", name: "Emily Rodriguez", role: "Property Manager, Green Valley", testimonial: "Our lawn has never looked better! Their regular maintenance service is reliable, thorough, and always leaves our property pristine.", imageSrc: "https://pixabay.com/get/gc049ccb07ec2d6862cbf08f1af345e64b54570dd6ff144a1e8ee695a1f8154388750d220e3f980aa2bc56c2f03096798cbe998ae61f079ad7beea02947105c22_1280.jpg" },
|
|
{ id: "4", name: "David Kim", role: "Homeowner, Riverside", testimonial: "From design to execution, Four Seasons Landscaping made the entire process seamless and enjoyable. Highly recommend their expertise!", imageSrc: "https://pixabay.com/get/gcf899bacc68b9e10910a91797c5aa6857c11c01a47c163e1ce68b7754e50ff805fe9cea136d76aad85dffb6113d7cb1e40847c5f12e20a453695b1415b35a4c6_1280.jpg" },
|
|
{ id: "5", name: "Jessica Lee", role: "Local Business Owner", testimonial: "We absolutely love our new garden. The plants are thriving, and it looks beautiful year-round, enhancing our business's curb appeal.", imageSrc: "https://pixabay.com/get/gbf540e3489b5425c27816fb5789c86c276c064b251a4e5adf64d83fdd79cd579c8c262749d9daca14b303382a0ce629458c65fae325fd60e13cb766a4f393d23_1280.jpg" },
|
|
{ id: "6", name: "Robert Miller", role: "Estate Owner, Willow Creek", testimonial: "Professional, creative, and always on time. Four Seasons Landscaping is simply the best in the business for large-scale projects.", imageSrc: "https://pixabay.com/get/g408db13f0cd9366b246c0ea191da287df08936ab013c78fdb057260e2c190fd8706dde557caa3b2ba92bcbe19c3ad7a0a6eb3c72c382f70d5e00c153323786a9_1280.jpg" }
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
<div id="social-proof" data-section="social-proof">
|
|
<SocialProofOne
|
|
title="Trusted by Local Communities & Businesses"
|
|
description="Proudly serving residential and commercial properties with top-tier landscaping solutions."
|
|
logos={[
|
|
"https://pixabay.com/get/g53fa3ce3f16c61c3f4f7058ba196ca59e6dd8d47a5be7b65c2b346be78e2f45c5d53f53e405ea2606d1a23ff14b79b2e6fc3e8f62f3db8fd725770323887cbe8_1280.jpg", "https://pixabay.com/get/g24abeb98eed9bd3fb7ce07bf8e2b9bd39560eee797ab829ae9b2eca4770ccfcd3d8392b7694b4bb6d1cff39fc7643ae0_1280.jpg", "https://pixabay.com/get/g6ba82c40e01ab9e30c51d0bbcf5f8b4ed0dcb9764c3588ba2bddf9d9fd058f3ea15ce8d4904507deed14cbd4e8dcf3a96a2ccd4276b5436a68474e62f8ccc430_1280.jpg", "https://pixabay.com/get/g09c57bbe67815d67f1d352615325d3f15ad00f7297d5885fe15b076e83e9c20ee67ebfc871464ea4fbd37d24144b322470e7a0950762f86994e8fd9e4a944f72_1280.jpg", "https://pixabay.com/get/g04e1b23c087888196999f94029251d489941afcbdd7474baee4c6b20ffefd9474442d7adcc8ce31ec4632e4376625aa345cdb6b421e3abd95175ee16a1c6d989_1280.jpg", "https://pixabay.com/get/g1f5e99f0d7e58ffc5279a71308552d0c7c431a05074e976f3e9cea6ee8777a6c06182f0f6482008ada0cc247dd3bfe19e3029a2e52a858141830da80970593e7_1280.jpg", "https://pixabay.com/get/g6890b6b1d9012967b09583d8add786f77f9d865da918e4bc2079579a5208286f1a63b890464f5bca7842a962dacb348af84557c812862f3f4b58f4b6654ef130_1280.jpg"
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
showCard={false}
|
|
/>
|
|
</div>
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
sideTitle="Common Questions About Our Services"
|
|
sideDescription="Find answers to frequently asked questions about our process, services, and pricing. We're here to provide clarity."
|
|
faqs={[
|
|
{ id: "1", title: "What areas do you serve?", content: "Four Seasons Landscaping proudly serves residential and commercial clients across [Your Service Area/City Name] and surrounding communities within a [X]-mile radius." },
|
|
{ id: "2", title: "Do you offer free estimates for projects?", content: "Yes, we provide complimentary, no-obligation estimates for all new landscaping design and installation projects. Contact us to schedule yours today!" },
|
|
{ id: "3", title: "How long does a typical landscaping project take?", content: "Project timelines vary significantly based on scope and complexity. We'll provide a detailed timeline with your estimate, keeping you informed every step of the way." },
|
|
{ id: "4", title: "What sets Four Seasons Landscaping apart from competitors?", content: "Our commitment to personalized design, sustainable practices, exceptional craftsmanship, and unparalleled customer service ensures a superior outdoor transformation and lasting satisfaction." }
|
|
]}
|
|
faqsAnimation="slide-up"
|
|
textPosition="left"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
tag="Get Your Dream Yard"
|
|
title="Ready to Transform Your Outdoor Space?"
|
|
description="Contact us today for a personalized consultation and let's bring your landscaping vision to life. We look forward to hearing from you!"
|
|
inputPlaceholder="Your Email Address"
|
|
buttonText="Request a Consultation"
|
|
termsText="By clicking 'Request a Consultation', you agree to our privacy policy and terms of service."
|
|
background={{ variant: "rotated-rays-animated-grid" }}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
imageSrc="https://pixabay.com/get/gb81cbad695c800e9c8c3fdf1ef7b249399fcaadf73da18a7dc23a68ebefc863f9ccbe1c61e3b531b74fa33c05cee0be38119412162d2a8ee90fb12ed239a7e7f_1280.jpg"
|
|
imageAlt="Lush green lawn at sunset"
|
|
columns={[
|
|
{ title: "Services", items: [{ label: "Landscape Design", href: "#services" }, { label: "Lawn Care", href: "#services" }, { label: "Hardscaping", href: "#services" }, { label: "Tree & Shrub Care", href: "#services" }] },
|
|
{ title: "Company", items: [{ label: "About Us", href: "#about" }, { label: "Testimonials", href: "#testimonials" }, { label: "FAQ", href: "#faq" }, { label: "Contact Us", href: "#contact" }] },
|
|
{ title: "Connect", items: [{ label: "Facebook", href: "https://facebook.com" }, { label: "Instagram", href: "https://instagram.com" }, { label: "LinkedIn", href: "https://linkedin.com" }] }
|
|
]}
|
|
logoText="Four Seasons Landscaping"
|
|
copyrightText="© 2024 Four Seasons Landscaping. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|