205 lines
12 KiB
TypeScript
205 lines
12 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import { CheckCircle, AlertTriangle } from "lucide-react";
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
|
|
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
|
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
|
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
|
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="bounce-effect"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="small"
|
|
sizing="large"
|
|
background="floatingGradient"
|
|
cardStyle="gradient-bordered"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="light"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
navItems={[
|
|
{ name: "Services", id: "#services" },
|
|
{ name: "Portfolio", id: "#portfolio" },
|
|
{ name: "Pricing", id: "#pricing" },
|
|
{ name: "Contact", id: "#contact" },
|
|
]}
|
|
brandName="GreenLeaf Care"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboard
|
|
background={{ variant: "gradient-bars" }}
|
|
title="Professional Landscaping & Expert Tree Care"
|
|
description="Transform your outdoor space with GreenLeaf Care. We specialize in precision tree cutting, lawn maintenance, and bespoke landscaping design."
|
|
buttons={[{ text: "Get a Quote", href: "#contact" }]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/park-outdoor-manicured-lawn-flowerbed-ai-generated-image_587448-1397.jpg"
|
|
mediaAnimation="slide-up"
|
|
avatars={[
|
|
{ src: "http://img.b2bpic.net/free-photo/beautiful-panorama-green-city-park-dawn_1127-3213.jpg", alt: "Happy client 1" },
|
|
{ src: "http://img.b2bpic.net/free-photo/green-grass-background_1372-416.jpg", alt: "Happy client 2" },
|
|
{ src: "http://img.b2bpic.net/free-photo/close-up-fresh-grass-with-leaves_1137-209.jpg", alt: "Happy client 3" },
|
|
{ src: "http://img.b2bpic.net/free-photo/view-robot-tending-maintaining-gardens_23-2151803953.jpg", alt: "Happy client 4" },
|
|
{ src: "http://img.b2bpic.net/free-photo/young-gardener-jumpsuit-hat-holding-shovel-looking-front-smiling-cheerfully-happy-positive-standing-orange-wall_141793-52873.jpg", alt: "Happy client 5" },
|
|
]}
|
|
marqueeItems={[
|
|
{ type: "text", text: "Licensed & Insured" },
|
|
{ type: "text", text: "15+ Years Experience" },
|
|
{ type: "text", text: "Free Consultations" },
|
|
{ type: "text", text: "24/7 Emergency Support" },
|
|
{ type: "text", text: "100% Satisfaction Guaranteed" },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<InlineImageSplitTextAbout
|
|
useInvertedBackground={false}
|
|
heading={[
|
|
{ type: "text", content: "Restoring the beauty of your " },
|
|
{ type: "image", src: "http://img.b2bpic.net/free-photo/senior-man-working-field_329181-12481.jpg", alt: "Green landscape" },
|
|
{ type: "text", content: " residential and commercial properties for over 15 years." },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardTwentySix
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{ title: "Tree Removal", description: "Safe and precise tree cutting and removal services.", imageSrc: "http://img.b2bpic.net/free-photo/outdoor-shot-unknown-person-worker-fixing-chainsaw-before-after-deforestation_176532-14592.jpg", buttonIcon: CheckCircle },
|
|
{ title: "Lawn Maintenance", description: "Regular mowing, edging, and fertilizing for a healthy lawn.", imageSrc: "http://img.b2bpic.net/free-photo/young-florist-taking-care-flowers-hands-close-up_176420-2077.jpg", buttonIcon: CheckCircle },
|
|
{ title: "Garden Design", description: "Custom landscape design to maximize your yard's potential.", imageSrc: "http://img.b2bpic.net/free-photo/view-backyard-garden-digital-art-style_23-2151488208.jpg", buttonIcon: CheckCircle },
|
|
{ title: "Hedge Trimming", description: "Professional shaping and maintenance of your garden hedges.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-cutting-plant-leaves_23-2148905236.jpg", buttonIcon: CheckCircle },
|
|
{ title: "Emergency Care", description: "Immediate response for storm-damaged trees and hazards.", imageSrc: "http://img.b2bpic.net/free-photo/pile-logs-green-forest_181624-42990.jpg", buttonIcon: AlertTriangle },
|
|
]}
|
|
title="Our Expert Services"
|
|
description="Comprehensive landscaping and tree care tailored to your needs."
|
|
/>
|
|
</div>
|
|
|
|
<div id="portfolio" data-section="portfolio">
|
|
<ProductCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{ id: "p1", brand: "Design", name: "Modern Patio Project", price: "Custom", rating: 5, reviewCount: "12", imageSrc: "http://img.b2bpic.net/free-photo/graveyard-background-concept_23-2149585151.jpg" },
|
|
{ id: "p2", brand: "Maintenance", name: "Lawn Refresh", price: "Custom", rating: 5, reviewCount: "8", imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-shovel-garden-with-trees_181624-33398.jpg" },
|
|
{ id: "p3", brand: "Arborist", name: "Tree Safety Job", price: "Custom", rating: 5, reviewCount: "15", imageSrc: "http://img.b2bpic.net/free-photo/portrait-lumberjack-woodcutter-standing-by-tree-trunk-woods-holding-chainsaw_342744-251.jpg" },
|
|
{ id: "p4", brand: "Design", name: "Hedge Architecture", price: "Custom", rating: 5, reviewCount: "6", imageSrc: "http://img.b2bpic.net/free-photo/professional-male-landscaper-trimming-thuja-tree-with-hedge-trimmer-summer-side-view-male_7502-10143.jpg" },
|
|
{ id: "p5", brand: "Design", name: "Full Garden Makeover", price: "Custom", rating: 5, reviewCount: "10", imageSrc: "http://img.b2bpic.net/free-photo/people-with-wheelbarrow-working-greenhouse_23-2147768529.jpg" },
|
|
{ id: "p6", brand: "Design", name: "Commercial Landscape", price: "Custom", rating: 5, reviewCount: "9", imageSrc: "http://img.b2bpic.net/free-photo/close-up-male-gardener-pruning-seedling-with-secateurs_23-2148165261.jpg" },
|
|
]}
|
|
title="Recent Projects"
|
|
description="See some of our favorite transformations."
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
plans={[
|
|
{ id: "basic", badge: "Essentials", price: "$45", subtitle: "Weekly Lawn Mowing", buttons: [{ text: "Select", href: "#contact" }], features: ["Mowing", "Edging", "Clipping Cleanup"] },
|
|
{ id: "pro", badge: "Popular", price: "$120", subtitle: "Landscaping Monthly", buttons: [{ text: "Select", href: "#contact" }], features: ["Everything in Basic", "Weeding", "Hedge Trim", "Mulch"] },
|
|
{ id: "enterprise", badge: "Full Care", price: "$300+", subtitle: "Total Tree Care", buttons: [{ text: "Get Quote", href: "#contact" }], features: ["Tree Inspection", "Pruning", "Hazard Removal", "Stump Grinding"] },
|
|
]}
|
|
title="Clear & Simple Pricing"
|
|
description="Transparent rates for all our services."
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardSeven
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{ id: "m1", value: "15+", title: "Years Experience", items: ["Expert Team", "Trusted Local Service"] },
|
|
{ id: "m2", value: "1.2k+", title: "Projects Completed", items: ["Happy Homeowners", "Commercial Trust"] },
|
|
{ id: "m3", value: "100%", title: "Satisfaction Rate", items: ["High Quality", "Reliable Service"] },
|
|
]}
|
|
title="Why Choose Us?"
|
|
description="Proven results for your peace of mind."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSix
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
testimonials={[
|
|
{ id: "1", name: "Sarah Miller", handle: "@sarahm", testimonial: "Excellent landscaping service, my yard looks fantastic!", imageSrc: "http://img.b2bpic.net/free-photo/young-adult-traveling-using-sustainable-mobility_23-2149292681.jpg" },
|
|
{ id: "2", name: "Tom Jones", handle: "@tjones", testimonial: "Very professional and fast tree removal.", imageSrc: "http://img.b2bpic.net/free-photo/joyful-young-woman-gardener-uniform-wearing-gardening-hat-holding-camera-with-hoe-rake-isolated-green_141793-87331.jpg" },
|
|
{ id: "3", name: "Linda White", handle: "@lindaw", testimonial: "Reliable and affordable lawn care.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-happy-people-with-plants_23-2149383707.jpg" },
|
|
{ id: "4", name: "Mark Evans", handle: "@mevans", testimonial: "Transformed our backyard completely.", imageSrc: "http://img.b2bpic.net/free-photo/middle-age-hispanic-woman-holding-lightbulb-inspiration-idea-smiling-happy-doing-ok-sign-with-hand-eye-looking-through-fingers_839833-1729.jpg" },
|
|
{ id: "5", name: "Jane Doe", handle: "@janed", testimonial: "Highly recommended landscaping experts!", imageSrc: "http://img.b2bpic.net/free-photo/pretty-woman-cute-clothes-reaching-plants-greenhouse_197531-12331.jpg" },
|
|
]}
|
|
title="Client Reviews"
|
|
description="Don't just take our word for it."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{ id: "q1", title: "Do you offer free quotes?", content: "Yes, we provide free on-site consultations and estimates." },
|
|
{ id: "q2", title: "Are you licensed?", content: "Yes, we are fully licensed and insured for all our services." },
|
|
{ id: "q3", title: "Do you offer emergency tree removal?", content: "Yes, we handle emergency tree care needs 24/7." },
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/man-cutting-dried-branches_23-2148396748.jpg"
|
|
mediaAnimation="slide-up"
|
|
title="Common Questions"
|
|
description="Everything you need to know."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
useInvertedBackground={true}
|
|
background={{ variant: "plain" }}
|
|
tag="Contact Us"
|
|
title="Ready to Transform Your Landscape?"
|
|
description="Get in touch today for a free assessment of your property."
|
|
imageSrc="http://img.b2bpic.net/free-photo/smiling-male-gardener-wearing-gardening-hat-gloves-holds-spade_141793-116342.jpg"
|
|
mediaAnimation="slide-up"
|
|
mediaPosition="right"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseReveal
|
|
logoText="GreenLeaf Care"
|
|
columns={[
|
|
{ title: "Company", items: [{ label: "About Us", href: "#" }, { label: "Services", href: "#services" }] },
|
|
{ title: "Support", items: [{ label: "FAQ", href: "#faq" }, { label: "Contact", href: "#contact" }] },
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |