198 lines
9.4 KiB
TypeScript
198 lines
9.4 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
|
|
import TextAbout from '@/components/sections/about/TextAbout';
|
|
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
|
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
|
|
import FeatureBento from '@/components/sections/feature/FeatureBento';
|
|
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import { Trophy, CheckCircle, Star, Users, Award, Zap, Facebook, Instagram, Linkedin, Sparkles } from 'lucide-react';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="medium"
|
|
sizing="mediumLarge"
|
|
background="circleGradient"
|
|
cardStyle="gradient-bordered"
|
|
primaryButtonStyle="primary-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{ name: "Home", id: "home" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Services", id: "features" },
|
|
{ name: "Contact", id: "contact" },
|
|
{ name: "Testimonials", id: "testimonial" }
|
|
]}
|
|
brandName="Salen's Landscaping"
|
|
bottomLeftText="Est. 1985"
|
|
bottomRightText="info@salenslandscaping.com"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitKpi
|
|
title="Professional Landscaping for Every Project"
|
|
description="Transform your outdoor spaces with expertise spanning residential, commercial, and industrial landscaping. Salen's Landscaping has been delivering excellence since 1985."
|
|
background={{ variant: "glowing-orb" }}
|
|
kpis={[
|
|
{ value: "40+", label: "Years of Excellence" },
|
|
{ value: "500+", label: "Projects Completed" },
|
|
{ value: "99%", label: "Client Satisfaction" }
|
|
]}
|
|
enableKpiAnimation={true}
|
|
imageSrc="http://img.b2bpic.net/free-photo/beautiful-panorama-green-city-park-dawn_1127-3213.jpg"
|
|
imageAlt="Professional landscaping work with lush green spaces and hardscape elements"
|
|
mediaAnimation="blur-reveal"
|
|
imagePosition="right"
|
|
buttons={[
|
|
{ text: "Get Started", href: "#contact" },
|
|
{ text: "Learn More", href: "#about" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextAbout
|
|
tag="About Salen's"
|
|
title="Transforming Outdoor Spaces Since 1985"
|
|
useInvertedBackground={false}
|
|
buttons={[
|
|
{ text: "View Our Work", href: "#features" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardOne
|
|
title="Our Impact"
|
|
description="Delivering proven results across all landscape types"
|
|
tag="Statistics"
|
|
metrics={[
|
|
{ id: "1", value: "40", title: "Years", description: "Industry Experience", icon: Trophy },
|
|
{ id: "2", value: "500", title: "+", description: "Completed Projects", icon: CheckCircle },
|
|
{ id: "3", value: "99", title: "%", description: "Client Retention", icon: Star }
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardSeven
|
|
title="Our Services"
|
|
description="Comprehensive landscaping solutions for every need"
|
|
tag="Services"
|
|
features={[
|
|
{
|
|
id: 1,
|
|
title: "Residential Landscaping", description: "Create stunning outdoor living spaces with custom design, planting, hardscaping, and maintenance to enhance your home's curb appeal and value.", imageSrc: "http://img.b2bpic.net/free-photo/man-cutting-grass-with-lawn-mover-back-yard-male-black-apron-guy-repairs_1157-41431.jpg"
|
|
},
|
|
{
|
|
id: 2,
|
|
title: "Commercial Landscaping", description: "Professional grounds maintenance and design for businesses, retail centers, and office parks to create welcoming, well-maintained environments.", imageSrc: "http://img.b2bpic.net/free-photo/stone-path-way-garden_74190-3631.jpg"
|
|
},
|
|
{
|
|
id: 3,
|
|
title: "Hardscape Installation", description: "Expert concrete work, patios, pathways, and retaining walls built to last with precision craftsmanship and attention to detail.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-cactus-with-blurred-background_23-2148249096.jpg"
|
|
}
|
|
]}
|
|
animationType="blur-reveal"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="bento-features" data-section="bento-features">
|
|
<FeatureBento
|
|
title="Why Choose Salen's Landscaping"
|
|
description="Discover the benefits of working with industry experts"
|
|
features={[
|
|
{
|
|
title: "Custom Design", description: "Personalized landscape solutions tailored to your vision", bentoComponent: "globe"
|
|
},
|
|
{
|
|
title: "Expert Team", description: "Skilled professionals with decades of combined experience", bentoComponent: "icon-info-cards", items: [
|
|
{ icon: Users, label: "Professionals", value: "25+" },
|
|
{ icon: Award, label: "Certifications", value: "15+" },
|
|
{ icon: Zap, label: "Equipment", value: "Modern" }
|
|
]
|
|
},
|
|
{
|
|
title: "Quality Guaranteed", description: "Superior materials and workmanship on every project", bentoComponent: "animated-bar-chart"
|
|
},
|
|
{
|
|
title: "Sustainable Practices", description: "Environmentally responsible landscaping methods", bentoComponent: "map"
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonial" data-section="testimonial">
|
|
<TestimonialCardFifteen
|
|
testimonial="Salen's Landscaping transformed our backyard into a stunning outdoor oasis. Their attention to detail, professionalism, and commitment to quality exceeded our expectations. We couldn't be happier with the results!"
|
|
rating={5}
|
|
author="Sarah Mitchell, Homeowner"
|
|
avatars={[
|
|
{ src: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", alt: "Sarah Mitchell" },
|
|
{ src: "http://img.b2bpic.net/free-photo/successful-businesswoman-ready-challenges_1163-4336.jpg", alt: "John Davis" },
|
|
{ src: "http://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg", alt: "Michael Chen" },
|
|
{ src: "http://img.b2bpic.net/free-photo/successful-businesswoman-ready-challenges_1163-4336.jpg", alt: "Emily Rodriguez" }
|
|
]}
|
|
ratingAnimation="slide-up"
|
|
avatarsAnimation="blur-reveal"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
tag="Get in Touch"
|
|
title="Ready to Transform Your Outdoor Space?"
|
|
description="Subscribe to our newsletter for landscaping tips, seasonal updates, and exclusive offers. Let's create something beautiful together."
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
background={{ variant: "glowing-orb" }}
|
|
useInvertedBackground={true}
|
|
imageSrc="http://img.b2bpic.net/free-photo/concentrated-gardeners-arranging-coniferous-plants-garden-man-woman-wearing-aprons-growing-small-thuja-greenhouse-selective-focus-commercial-gardening-activity-summer-concept_74855-12739.jpg"
|
|
imageAlt="Salen's Landscaping team at work"
|
|
mediaAnimation="blur-reveal"
|
|
mediaPosition="right"
|
|
inputPlaceholder="Enter your email"
|
|
buttonText="Subscribe"
|
|
termsText="We respect your privacy and will only send you relevant landscaping updates and offers."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="Salen's Landscaping"
|
|
copyrightText="© 1985-2025 Salen's Landscaping Inc. All rights reserved."
|
|
socialLinks={[
|
|
{ icon: Facebook, href: "https://facebook.com/salenslandscaping", ariaLabel: "Facebook" },
|
|
{ icon: Instagram, href: "https://instagram.com/salenslandscaping", ariaLabel: "Instagram" },
|
|
{ icon: Linkedin, href: "https://linkedin.com/company/salenslandscaping", ariaLabel: "LinkedIn" }
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|