Merge version_1 into main #3
319
src/app/page.tsx
319
src/app/page.tsx
@@ -28,208 +28,139 @@ export default function LandingPage() {
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Services", id: "features"},
|
||||
{
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Testimonials", id: "testimonials"},
|
||||
{
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="GreenScapes"
|
||||
button={{
|
||||
text: "Get Quote", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="GreenScapes"
|
||||
button={{ text: "Get Quote", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplit
|
||||
background={{
|
||||
variant: "sparkles-gradient"}}
|
||||
title="Premium Lawn Care & Landscaping Services"
|
||||
description="We transform your outdoor space into a lush, professional paradise. From routine tree trimming to expert landscaping, our team delivers quality results you can see."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Your Quote", href: "#contact"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/darkhaired-man-using-portable-powered-leaf-blower-blow-beveled-leaves-from-footpath-back-yard_7502-10567.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/view-robot-tending-maintaining-gardens_23-2151803950.jpg", alt: "View of robot tending and maintaining gardens"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/caucasian-male-worker-gloves-removing-dry-leaves-from-sidewalk-with-hand-blower-park-side-view_7502-10152.jpg", alt: "Caucasian male worker in gloves removing dry leaves from sidewalk with hand blower in park side view"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/woman-pruning-bushes-smiling-camera_651396-3821.jpg", alt: "Woman pruning bushes and smiling on camera"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/hard-working-man-casual-outfit-removing-dry-leaves-from-sidewalk-with-hand-blower-sunny-day_7502-10151.jpg", alt: "Hard working man in casual outfit removing dry leaves from sidewalk with hand blower in sunny day"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/professional-gardeners-growing-plants-shooting-them-phone_74855-16434.jpg", alt: "Professional gardeners growing plants and shooting them on phone"},
|
||||
]}
|
||||
avatarText="Trusted by 500+ local homeowners"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text", text: "Eco-Friendly Fertilizers"},
|
||||
{
|
||||
type: "text", text: "Sustainable Landscaping"},
|
||||
{
|
||||
type: "text", text: "Expert Tree Care"},
|
||||
{
|
||||
type: "text", text: "Routine Lawn Maintenance"},
|
||||
{
|
||||
type: "text", text: "Hardscape Design"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplit
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Premium Lawn Care & Landscaping Services"
|
||||
description="We transform your outdoor space into a lush, professional paradise. From routine tree trimming to expert landscaping, our team delivers quality results you can see."
|
||||
buttons={[{ text: "Get Your Quote", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/darkhaired-man-using-portable-powered-leaf-blower-blow-beveled-leaves-from-footpath-back-yard_7502-10567.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/view-robot-tending-maintaining-gardens_23-2151803950.jpg", alt: "View of robot tending and maintaining gardens" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/caucasian-male-worker-gloves-removing-dry-leaves-from-sidewalk-with-hand-blower-park-side-view_7502-10152.jpg", alt: "Caucasian male worker in gloves removing dry leaves from sidewalk with hand blower in park side view" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/woman-pruning-bushes-smiling-camera_651396-3821.jpg", alt: "Woman pruning bushes and smiling on camera" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/hard-working-man-casual-outfit-removing-dry-leaves-from-sidewalk-with-hand-blower-sunny-day_7502-10151.jpg", alt: "Hard working man in casual outfit removing dry leaves from sidewalk with hand blower in sunny day" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/professional-gardeners-growing-plants-shooting-them-phone_74855-16434.jpg", alt: "Professional gardeners growing plants and shooting them on phone" }
|
||||
]}
|
||||
avatarText="Trusted by 500+ local homeowners"
|
||||
marqueeItems={[
|
||||
{ type: "text", text: "Eco-Friendly Fertilizers" },
|
||||
{ type: "text", text: "Sustainable Landscaping" },
|
||||
{ type: "text", text: "Expert Tree Care" },
|
||||
{ type: "text", text: "Routine Lawn Maintenance" },
|
||||
{ type: "text", text: "Hardscape Design" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Why Choose GreenScapes?"
|
||||
description="With over 15 years of experience, we provide meticulous lawn maintenance and landscape design tailored to your specific environment and aesthetic preferences."
|
||||
metrics={[
|
||||
{
|
||||
value: "500+", title: "Lawns Maintained"},
|
||||
{
|
||||
value: "15+", title: "Years Experience"},
|
||||
{
|
||||
value: "100%", title: "Satisfaction"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/smiling-brunet-male-gardener-cutting-overgrown-bush-by-hedge-trimmer-sunny-day-front-view-hard_7502-10573.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Why Choose GreenScapes?"
|
||||
description="With over 15 years of experience, we provide meticulous lawn maintenance and landscape design tailored to your specific environment and aesthetic preferences."
|
||||
metrics={[
|
||||
{ value: "500+", title: "Lawns Maintained" },
|
||||
{ value: "15+", title: "Years Experience" },
|
||||
{ value: "100%", title: "Satisfaction" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/smiling-brunet-male-gardener-cutting-overgrown-bush-by-hedge-trimmer-sunny-day-front-view-hard_7502-10573.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureBento
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Lawn Care", description: "Routine mowing, aeration, and fertilization programs to keep your turf dense, green, and healthy throughout the season.", bentoComponent: { bentoComponent: "reveal-icon", icon: Sparkles },
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/busy-man-using-weedwacker-garden_329181-20572.jpg", imageAlt: "lawn mowing service residential grass"},
|
||||
{
|
||||
title: "Tree Trimming", description: "Certified pruning and crown reduction to ensure safety and aesthetic health for all types of ornamental and shade trees.", bentoComponent: { bentoComponent: "reveal-icon", icon: Shield },
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/darkhaired-man-using-portable-powered-leaf-blower-blow-beveled-leaves-from-footpath-back-yard_7502-10567.jpg", imageAlt: "lawn mowing service residential grass"},
|
||||
{
|
||||
title: "Landscaping", description: "Custom hardscaping and flower bed design that complements your home architecture and local soil conditions.", bentoComponent: { bentoComponent: "reveal-icon", icon: Zap },
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-brunet-male-gardener-cutting-overgrown-bush-by-hedge-trimmer-sunny-day-front-view-hard_7502-10573.jpg", imageAlt: "lawn mowing service residential grass"},
|
||||
]}
|
||||
title="Our Professional Services"
|
||||
description="We offer full-cycle landscaping services to ensure your property looks its best year-round."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureBento
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Lawn Care", description: "Routine mowing, aeration, and fertilization programs to keep your turf dense, green, and healthy throughout the season.", bentoComponent: { bentoComponent: "reveal-icon", icon: Sparkles }, imageSrc: "http://img.b2bpic.net/free-photo/busy-man-using-weedwacker-garden_329181-20572.jpg", imageAlt: "lawn mowing service residential grass" },
|
||||
{ title: "Tree Trimming", description: "Certified pruning and crown reduction to ensure safety and aesthetic health for all types of ornamental and shade trees.", bentoComponent: { bentoComponent: "reveal-icon", icon: Shield }, imageSrc: "http://img.b2bpic.net/free-photo/darkhaired-man-using-portable-powered-leaf-blower-blow-beveled-leaves-from-footpath-back-yard_7502-10567.jpg", imageAlt: "lawn mowing service residential grass" },
|
||||
{ title: "Landscaping", description: "Custom hardscaping and flower bed design that complements your home architecture and local soil conditions.", bentoComponent: { bentoComponent: "reveal-icon", icon: Zap }, imageSrc: "http://img.b2bpic.net/free-photo/smiling-brunet-male-gardener-cutting-overgrown-bush-by-hedge-trimmer-sunny-day-front-view-hard_7502-10573.jpg", imageAlt: "lawn mowing service residential grass" }
|
||||
]}
|
||||
title="Our Professional Services"
|
||||
description="We offer full-cycle landscaping services to ensure your property looks its best year-round."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardFourteen
|
||||
useInvertedBackground={false}
|
||||
title="Quality Performance"
|
||||
tag="Our Impact"
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", value: "95%", description: "Retention rate with our recurring service plans."},
|
||||
{
|
||||
id: "m2", value: "24h", description: "Average response time for new service inquiries."},
|
||||
{
|
||||
id: "m3", value: "120+", description: "Active residential service routes weekly."},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardFourteen
|
||||
useInvertedBackground={false}
|
||||
title="Quality Performance"
|
||||
tag="Our Impact"
|
||||
metrics={[
|
||||
{ id: "m1", value: "95%", description: "Retention rate with our recurring service plans." },
|
||||
{ id: "m2", value: "24h", description: "Average response time for new service inquiries." },
|
||||
{ id: "m3", value: "120+", description: "Active residential service routes weekly." }
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="socialProof" data-section="socialProof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"LawnKing Systems", "ArborCare Pro", "GreenGrow Fertilizers", "AquaLogic Sprinklers", "StoneMasters Hardscape", "Evergreen Nurseries", "SoilSync Analysis"]}
|
||||
title="Trusted Partners"
|
||||
description="We use only professional-grade equipment and sustainable materials for all projects."
|
||||
/>
|
||||
</div>
|
||||
<div id="socialProof" data-section="socialProof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={["LawnKing Systems", "ArborCare Pro", "GreenGrow Fertilizers", "AquaLogic Sprinklers", "StoneMasters Hardscape", "Evergreen Nurseries", "SoilSync Analysis"]}
|
||||
title="Trusted Partners"
|
||||
description="We use only professional-grade equipment and sustainable materials for all projects."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Sarah Jenkins", role: "Homeowner", company: "Willow Creek", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/confident-hispanic-expert-explaining-his-idea_1262-16155.jpg"},
|
||||
{
|
||||
id: "2", name: "Mark Thornton", role: "Architect", company: "Thornton Design", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/grandparents-little-boy-working-garden_23-2148980628.jpg"},
|
||||
{
|
||||
id: "3", name: "Emily Chen", role: "Real Estate Agent", company: "City Properties", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/confident-young-handsome-slavic-gardener-uniform-hat-holding-hoe-rake-rake-shoulders-looking_141793-57959.jpg"},
|
||||
{
|
||||
id: "4", name: "David Wilson", role: "Homeowner", company: "Oak Ridge", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-decorating-her-house-with-orchids_23-2150970141.jpg"},
|
||||
{
|
||||
id: "5", name: "Linda Thompson", role: "Teacher", company: "Westside Estates", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/old-women-balcony-with-coffee_1398-4083.jpg"},
|
||||
]}
|
||||
title="Client Reviews"
|
||||
description="See why homeowners in our area trust us with their lawn care needs."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah Jenkins", role: "Homeowner", company: "Willow Creek", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/confident-hispanic-expert-explaining-his-idea_1262-16155.jpg" },
|
||||
{ id: "2", name: "Mark Thornton", role: "Architect", company: "Thornton Design", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/grandparents-little-boy-working-garden_23-2148980628.jpg" },
|
||||
{ id: "3", name: "Emily Chen", role: "Real Estate Agent", company: "City Properties", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/confident-young-handsome-slavic-gardener-uniform-hat-holding-hoe-rake-rake-shoulders-looking_141793-57959.jpg" },
|
||||
{ id: "4", name: "David Wilson", role: "Homeowner", company: "Oak Ridge", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-decorating-her-house-with-orchids_23-2150970141.jpg" },
|
||||
{ id: "5", name: "Linda Thompson", role: "Teacher", company: "Westside Estates", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/old-women-balcony-with-coffee_1398-4083.jpg" }
|
||||
]}
|
||||
title="Client Reviews"
|
||||
description="See why homeowners in our area trust us with their lawn care needs."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain"}}
|
||||
tag="Contact Us"
|
||||
title="Ready for a Greener Lawn?"
|
||||
description="Contact us today for a free on-site estimate and learn more about our seasonal service packages."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us", href: "mailto:hello@greenscapes.com"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Contact Us"
|
||||
title="Ready for a Greener Lawn?"
|
||||
description="Contact us today for a free on-site estimate and learn more about our seasonal service packages."
|
||||
buttons={[{ text: "Contact Us", href: "mailto:hello@greenscapes.com" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="GreenScapes"
|
||||
columns={[
|
||||
{
|
||||
title: "Services", items: [
|
||||
{
|
||||
label: "Lawn Care", href: "#"},
|
||||
{
|
||||
label: "Tree Trimming", href: "#"},
|
||||
{
|
||||
label: "Landscaping", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{
|
||||
label: "About Us", href: "#"},
|
||||
{
|
||||
label: "Contact", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{
|
||||
label: "Privacy Policy", href: "#"},
|
||||
{
|
||||
label: "Terms of Service", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="GreenScapes"
|
||||
columns={[
|
||||
{ title: "Services", items: [{ label: "Lawn Care", href: "#" }, { label: "Tree Trimming", href: "#" }, { label: "Landscaping", href: "#" }] },
|
||||
{ title: "Company", items: [{ label: "About Us", href: "#" }, { label: "Contact", href: "#contact" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user