Merge version_2_1781571011643 into main #1

Merged
bender merged 2 commits from version_2_1781571011643 into main 2026-06-16 00:52:06 +00:00
10 changed files with 258 additions and 193 deletions

View File

@@ -95,8 +95,8 @@
--color-background-accent: var(--background-accent);
/* Fonts */
--font-sans: "Inter", sans-serif;
--font-tight: "Inter Tight", sans-serif;
--font-sans: "Plus Jakarta Sans", sans-serif;
--font-tight: "Plus Jakarta Sans", sans-serif;
--font-mono: monospace;
/* Border Radius */

View File

@@ -1,206 +1,39 @@
import { StyleProvider } from "@/components/ui/StyleProvider";
import HeroOverlayTestimonial from "@/components/sections/hero/HeroOverlayTestimonial";
import AboutTestimonial from "@/components/sections/about/AboutTestimonial";
import FeaturesDetailedSteps from "@/components/sections/features/FeaturesDetailedSteps";
import TeamGlassCards from "@/components/sections/team/TeamGlassCards";
import TeamOverlayCards from "@/components/sections/team/TeamOverlayCards";
import TestimonialAvatarCard from "@/components/sections/testimonial/TestimonialAvatarCard";
import FaqTwoColumn from "@/components/sections/faq/FaqTwoColumn";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
// AUTO-GENERATED shell by per-section-migrate.
// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
// files directly. Non-block content (wrappers, non-inlinable sections) is
// preserved inline; extracted section blocks become <XSection/> refs.
export default function HomePage() {
import { StyleProvider } from "@/components/ui/StyleProvider";
import React from 'react';
import HeroSection from './HomePage/sections/Hero';
import AboutSection from './HomePage/sections/About';
import ServicesSection from './HomePage/sections/Services';
import WhyUsSection from './HomePage/sections/WhyUs';
import TeamSection from './HomePage/sections/Team';
import TestimonialsSection from './HomePage/sections/Testimonials';
import FaqSection from './HomePage/sections/Faq';
import ContactSection from './HomePage/sections/Contact';
export default function HomePage(): React.JSX.Element {
return (
<StyleProvider heroBackground="none" siteBackground="none" buttonVariant="stagger">
<div id="hero" data-section="hero">
<HeroOverlayTestimonial
tag="Professional Landscaping"
title="Transform Your Outdoor Space"
description="Professional landscaping design, installation, and maintenance services. From lush gardens to stunning hardscapes, we bring your vision to life."
primaryButton={{ text: "Get Free Estimate", href: "#contact" }}
secondaryButton={{ text: "Our Services", href: "#services" }}
imageSrc="https://storage.googleapis.com/webild/default/templates/landscaping/hero.jpg"
testimonials={[
{
name: "Sarah M.",
handle: "Homeowner",
text: "GreenScape completely transformed our backyard. The team was professional, creative, and delivered beyond our expectations.",
rating: 5,
imageSrc: "https://storage.googleapis.com/webild/default/templates/web-agency-2/team-2.jpg",
},
{
name: "David K.",
handle: "Property Manager",
text: "We've used GreenScape for all our commercial properties. Their maintenance plans keep everything looking pristine year-round.",
rating: 5,
imageSrc: "https://storage.googleapis.com/webild/default/templates/web-agency-2/team-1.jpg",
},
]}
/>
</div>
<HeroSection />
<div id="about" data-section="about">
<AboutTestimonial
tag="About GreenScape"
quote="We've been transforming outdoor spaces for over 15 years — delivering designs that homeowners love and landscapes that last."
author="James Carter"
role="Lead Designer"
videoSrc="https://storage.googleapis.com/webild/default/templates/landscaping/about-video.mp4"
/>
</div>
<AboutSection />
<div id="services" data-section="services">
<FeaturesDetailedSteps
tag="Our Services"
title="What We Do"
description="From design to maintenance, we handle every aspect of your landscape."
steps={[
{
tag: "Design",
title: "Landscape Design",
subtitle: "Custom Plans",
description: "We create tailored landscape designs that complement your property's architecture and your personal style.",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-2.jpg",
},
{
tag: "Installation",
title: "Hardscape & Softscape",
subtitle: "Full Installation",
description: "From patios and walkways to gardens and trees, we handle the complete installation process.",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-3.jpg",
},
{
tag: "Maintenance",
title: "Lawn & Garden Care",
subtitle: "Ongoing Service",
description: "Keep your property looking pristine year-round with our professional maintenance plans.",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-4.jpg",
},
{
tag: "Irrigation",
title: "Smart Irrigation",
subtitle: "Water Management",
description: "Efficient irrigation systems that keep your landscape healthy while conserving water.",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-5.jpg",
},
]}
/>
</div>
<ServicesSection />
<div id="why-us" data-section="why-us">
<TeamGlassCards
tag=""
title="Why Choose GreenScape"
description="What sets us apart from the rest."
members={[
{
name: "Expert Craftsmanship",
role: "Decades of combined experience in landscape design and installation.",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-6.jpg",
},
{
name: "Eco-Friendly Approach",
role: "Sustainable practices and native plant selections that thrive naturally.",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-7.jpg",
},
{
name: "Full-Service Care",
role: "From initial design to ongoing maintenance, we handle everything.",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-8.jpg",
},
]}
/>
</div>
<WhyUsSection />
<div id="team" data-section="team">
<TeamOverlayCards
tag="Our Team"
title="Meet the Experts"
description="The skilled professionals behind every beautiful landscape."
members={[
{
name: "James Carter",
role: "Lead Designer",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-11.jpg",
},
{
name: "Maria Silva",
role: "Horticulturist",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-10.jpg",
},
{
name: "Ryan Mitchell",
role: "Project Manager",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-9.jpg",
},
]}
/>
</div>
<TeamSection />
<div id="testimonials" data-section="testimonials">
<TestimonialAvatarCard
tag="Trusted by Homeowners"
title="Over 500 happy clients trust GreenScape to transform and maintain their outdoor spaces."
primaryButton={{ text: "Contact Now", href: "#contact" }}
avatars={[
{ name: "Sarah M.", imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-10.jpg" },
{ name: "David K.", imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-11.jpg" },
{ name: "Emily R.", imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-4.jpg" },
{ name: "Ryan M.", imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-9.jpg" },
]}
/>
</div>
<TestimonialsSection />
<div id="faq" data-section="faq">
<FaqTwoColumn
tag="FAQ"
title="Frequently Asked Questions"
description="Everything you need to know about our landscaping services."
items={[
{
question: "How long does a typical landscaping project take?",
answer: "Most residential projects take 1-3 weeks depending on scope. We'll provide a detailed timeline during your consultation so you know exactly what to expect.",
},
{
question: "Do you offer free consultations?",
answer: "Yes! We offer complimentary on-site consultations where we assess your property, discuss your vision, and provide a detailed estimate — no obligation.",
},
{
question: "What areas do you serve?",
answer: "We serve the greater metropolitan area and surrounding suburbs within a 50-mile radius. Contact us to confirm service availability in your location.",
},
{
question: "Do you provide ongoing maintenance?",
answer: "Absolutely. We offer weekly, bi-weekly, and monthly maintenance plans that include mowing, trimming, fertilization, and seasonal cleanups.",
},
{
question: "Are your practices eco-friendly?",
answer: "Yes, sustainability is core to our approach. We use native plants, organic fertilizers, smart irrigation, and environmentally responsible methods whenever possible.",
},
{
question: "Do you handle permits and HOA approvals?",
answer: "We handle all necessary permits and can work directly with your HOA to ensure your project meets community guidelines and gets approved smoothly.",
},
]}
/>
</div>
<FaqSection />
<div id="contact" data-section="contact">
<ContactSplitForm
tag="Contact"
title="Get Your Free Estimate"
description="Tell us about your project and we'll get back to you within 24 hours."
inputs={[
{ name: "name", type: "text", placeholder: "Full Name", required: true },
{ name: "email", type: "email", placeholder: "Email Address", required: true },
{ name: "phone", type: "tel", placeholder: "Phone Number" },
]}
textarea={{ name: "message", placeholder: "Tell us about your project...", rows: 4, required: true }}
buttonText="Send Message"
imageSrc="https://storage.googleapis.com/webild/default/templates/landscaping/img-2.jpg"
/>
</div>
<ContactSection />
</StyleProvider>

View File

@@ -0,0 +1,19 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "about" section.
import React from 'react';
import AboutTestimonial from "@/components/sections/about/AboutTestimonial";
export default function AboutSection(): React.JSX.Element {
return (
<div id="about" data-section="about">
<AboutTestimonial
tag="About GreenScape"
quote="We've been transforming outdoor spaces for over 15 years — delivering designs that homeowners love and landscapes that last."
author="James Carter"
role="Lead Designer"
videoSrc="https://storage.googleapis.com/webild/default/templates/landscaping/about-video.mp4"
/>
</div>
);
}

View File

@@ -0,0 +1,25 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "contact" section.
import React from 'react';
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
export default function ContactSection(): React.JSX.Element {
return (
<div id="contact" data-section="contact">
<ContactSplitForm
tag="Contact"
title="Get Your Free Estimate"
description="Tell us about your project and we'll get back to you within 24 hours. You can also reach us at 0673 830 868 or visit us Opposite R-Square building, 582 Kaole Rd, Dar es Salaam."
inputs={[
{ name: "name", type: "text", placeholder: "Full Name", required: true },
{ name: "email", type: "email", placeholder: "Email Address", required: true },
{ name: "phone", type: "tel", placeholder: "Phone Number" },
]}
textarea={{ name: "message", placeholder: "Tell us about your project...", rows: 4, required: true }}
buttonText="Send Message"
imageSrc="https://storage.googleapis.com/webild/default/templates/landscaping/img-2.jpg"
/>
</div>
);
}

View File

@@ -0,0 +1,43 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "faq" section.
import React from 'react';
import FaqTwoColumn from "@/components/sections/faq/FaqTwoColumn";
export default function FaqSection(): React.JSX.Element {
return (
<div id="faq" data-section="faq">
<FaqTwoColumn
tag="FAQ"
title="Frequently Asked Questions"
description="Everything you need to know about our landscaping services."
items={[
{
question: "How long does a typical landscaping project take?",
answer: "Most residential projects take 1-3 weeks depending on scope. We'll provide a detailed timeline during your consultation so you know exactly what to expect.",
},
{
question: "Do you offer free consultations?",
answer: "Yes! We offer complimentary on-site consultations where we assess your property, discuss your vision, and provide a detailed estimate — no obligation.",
},
{
question: "What areas do you serve?",
answer: "We serve the greater metropolitan area and surrounding suburbs within a 50-mile radius. Contact us to confirm service availability in your location.",
},
{
question: "Do you provide ongoing maintenance?",
answer: "Absolutely. We offer weekly, bi-weekly, and monthly maintenance plans that include mowing, trimming, fertilization, and seasonal cleanups.",
},
{
question: "Are your practices eco-friendly?",
answer: "Yes, sustainability is core to our approach. We use native plants, organic fertilizers, smart irrigation, and environmentally responsible methods whenever possible.",
},
{
question: "Do you handle permits and HOA approvals?",
answer: "We handle all necessary permits and can work directly with your HOA to ensure your project meets community guidelines and gets approved smoothly.",
},
]}
/>
</div>
);
}

View File

@@ -0,0 +1,36 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "hero" section.
import React from 'react';
import HeroOverlayTestimonial from "@/components/sections/hero/HeroOverlayTestimonial";
export default function HeroSection(): React.JSX.Element {
return (
<div id="hero" data-section="hero">
<HeroOverlayTestimonial
tag="Angelic Gardens"
title="Transform Your Outdoor Space with Angelic Gardens"
description="Professional landscaping design, installation, and maintenance services. From lush gardens to stunning hardscapes, we bring your vision to life. Visit us Opposite R-Square building, 582 Kaole Rd, Dar es Salaam or call 0673 830 868."
primaryButton={{ text: "Get Free Estimate", href: "#contact" }}
secondaryButton={{ text: "Our Services", href: "#services" }}
imageSrc="https://storage.googleapis.com/webild/default/templates/landscaping/hero.jpg"
testimonials={[
{
name: "Sarah M.",
handle: "Homeowner",
text: "GreenScape completely transformed our backyard. The team was professional, creative, and delivered beyond our expectations.",
rating: 5,
imageSrc: "https://storage.googleapis.com/webild/default/templates/web-agency-2/team-2.jpg",
},
{
name: "David K.",
handle: "Property Manager",
text: "We've used GreenScape for all our commercial properties. Their maintenance plans keep everything looking pristine year-round.",
rating: 5,
imageSrc: "https://storage.googleapis.com/webild/default/templates/web-agency-2/team-1.jpg",
},
]}
/>
</div>
);
}

View File

@@ -0,0 +1,18 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "services" section.
import React from 'react';
import FeaturesDetailedSteps from "@/components/sections/features/FeaturesDetailedSteps";
export default function ServicesSection(): React.JSX.Element {
return (
<div id="services" data-section="services">
<FeaturesDetailedSteps
tag="Our Services"
title="What We Do"
description="From design to maintenance, we handle every aspect of your landscape."
steps={[{"imageSrc":"https://storage.googleapis.com/webild/default/templates/landscaping/img-3.jpg","title":"Installation","subtitle":"Full Installation","tag":"Installation","description":"We handle the complete installation process for your landscape."},{"tag":"Fumigation","subtitle":"Pest Control","description":"Professional fumigation services to keep your garden healthy.","imageSrc":"https://storage.googleapis.com/webild/default/templates/landscaping/img-4.jpg","title":"Fumigation"},{"title":"Lawn Mowing","imageSrc":"https://storage.googleapis.com/webild/default/templates/landscaping/img-5.jpg","description":"Keep your property looking pristine with our lawn mowing services.","subtitle":"Maintenance","tag":"Lawn Mowing"},{"imageSrc":"https://storage.googleapis.com/webild/default/templates/landscaping/img-2.jpg","title":"Pruning & Tree Cutting","tag":"Pruning","subtitle":"Tree Care","description":"Expert pruning and tree cutting for a safe and beautiful landscape."}]}
/>
</div>
);
}

View File

@@ -0,0 +1,34 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "team" section.
import React from 'react';
import TeamOverlayCards from "@/components/sections/team/TeamOverlayCards";
export default function TeamSection(): React.JSX.Element {
return (
<div id="team" data-section="team">
<TeamOverlayCards
tag="Our Team"
title="Meet the Experts"
description="The skilled professionals behind every beautiful landscape."
members={[
{
name: "James Carter",
role: "Lead Designer",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-11.jpg",
},
{
name: "Maria Silva",
role: "Horticulturist",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-10.jpg",
},
{
name: "Ryan Mitchell",
role: "Project Manager",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-9.jpg",
},
]}
/>
</div>
);
}

View File

@@ -0,0 +1,23 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "testimonials" section.
import React from 'react';
import TestimonialAvatarCard from "@/components/sections/testimonial/TestimonialAvatarCard";
export default function TestimonialsSection(): React.JSX.Element {
return (
<div id="testimonials" data-section="testimonials">
<TestimonialAvatarCard
tag="Trusted by Homeowners"
title="Over 500 happy clients trust GreenScape to transform and maintain their outdoor spaces."
primaryButton={{ text: "Contact Now", href: "#contact" }}
avatars={[
{ name: "Sarah M.", imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-10.jpg" },
{ name: "David K.", imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-11.jpg" },
{ name: "Emily R.", imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-4.jpg" },
{ name: "Ryan M.", imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-9.jpg" },
]}
/>
</div>
);
}

View File

@@ -0,0 +1,34 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "why-us" section.
import React from 'react';
import TeamGlassCards from "@/components/sections/team/TeamGlassCards";
export default function WhyUsSection(): React.JSX.Element {
return (
<div id="why-us" data-section="why-us">
<TeamGlassCards
tag=""
title="Why Choose GreenScape"
description="What sets us apart from the rest."
members={[
{
name: "Expert Craftsmanship",
role: "Decades of combined experience in landscape design and installation.",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-6.jpg",
},
{
name: "Eco-Friendly Approach",
role: "Sustainable practices and native plant selections that thrive naturally.",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-7.jpg",
},
{
name: "Full-Service Care",
role: "From initial design to ongoing maintenance, we handle everything.",
imageSrc: "https://storage.googleapis.com/webild/default/templates/landscaping/img-8.jpg",
},
]}
/>
</div>
);
}