256 lines
13 KiB
TypeScript
256 lines
13 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
|
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
|
|
import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
|
|
import FeatureCardSixteen from "@/components/sections/feature/FeatureCardSixteen";
|
|
import ProductCardOne from "@/components/sections/product/ProductCardOne";
|
|
import MetricCardTwo from "@/components/sections/metrics/MetricCardTwo";
|
|
import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
|
|
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
|
|
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
|
|
import { Sparkles, Target, Shield, Zap, Star } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="shift-hover"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="medium"
|
|
sizing="largeSmall"
|
|
background="circleGradient"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="shadow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
brandName="LocalHero"
|
|
navItems={[
|
|
{ name: "Services", id: "services" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Testimonials", id: "testimonials" },
|
|
{ name: "Why Us", id: "features" },
|
|
]}
|
|
button={{ text: "Get Started", href: "#contact" }}
|
|
animateOnLoad={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitKpi
|
|
title="Transform Your Local Business Online"
|
|
description="LocalHero Services rebuilds websites for local businesses, creating powerful digital presences that convert visitors into loyal customers. We handle everything from design to strategy."
|
|
background={{ variant: "glowing-orb" }}
|
|
kpis={[
|
|
{ value: "500+", label: "Businesses Transformed" },
|
|
{ value: "2.5x", label: "Average Traffic Increase" },
|
|
{ value: "95%", label: "Client Satisfaction" },
|
|
]}
|
|
enableKpiAnimation={true}
|
|
tag="Local Business Solutions"
|
|
tagIcon={Sparkles}
|
|
buttons={[
|
|
{ text: "Get Free Website Audit", href: "#contact" },
|
|
{ text: "View Our Work", href: "#testimonials" },
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/elegant-woman-with-laptop-listening-music_1208-193.jpg"
|
|
imageAlt="Website transformation showcase"
|
|
mediaAnimation="slide-up"
|
|
imagePosition="right"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MetricSplitMediaAbout
|
|
tag="Our Mission"
|
|
tagIcon={Target}
|
|
title="Empowering Local Businesses Through Digital Excellence"
|
|
description="At LocalHero Services, we believe every local business deserves a world-class online presence. We combine strategic design, user experience, and digital marketing expertise to help businesses like yours reach new customers, build trust, and grow sustainably in the digital economy."
|
|
metrics={[
|
|
{ value: "48hrs", title: "Average Turnaround Time" },
|
|
{ value: "99.9%", title: "Uptime Guarantee" },
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/labor-union-members-working-together_23-2150994996.jpg"
|
|
imageAlt="Business growth and success"
|
|
useInvertedBackground={false}
|
|
mediaAnimation="blur-reveal"
|
|
metricsAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardSixteen
|
|
title="Why Choose LocalHero Services"
|
|
description="We don't just build websites—we build revenue engines for local businesses"
|
|
tag="Why Us"
|
|
tagIcon={Shield}
|
|
negativeCard={{
|
|
items: [
|
|
"Generic, template-based designs", "No local market expertise", "Poor mobile experience", "No ongoing support", "Hidden maintenance costs"
|
|
],
|
|
}}
|
|
positiveCard={{
|
|
items: [
|
|
"Custom, strategic designs tailored to your market", "Deep knowledge of local business challenges", "Fully responsive & SEO-optimized", "24/7 support & regular updates", "Transparent, predictable pricing"
|
|
],
|
|
}}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
buttons={[{ text: "Learn More", href: "#services" }]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<ProductCardOne
|
|
title="Our Core Services"
|
|
description="Complete website solutions designed to solve your specific business challenges"
|
|
tag="Services"
|
|
tagIcon={Zap}
|
|
products={[
|
|
{
|
|
id: "1", name: "Complete Website Rebuild", price: "Starting at $2,500", imageSrc: "/placeholders/placeholder1.webp?_wi=1", imageAlt: "Website rebuild service"
|
|
},
|
|
{
|
|
id: "2", name: "E-Commerce Setup", price: "Starting at $3,500", imageSrc: "/placeholders/placeholder1.webp?_wi=2", imageAlt: "E-commerce platform setup"
|
|
},
|
|
{
|
|
id: "3", name: "SEO Optimization", price: "Starting at $500/mo", imageSrc: "/placeholders/placeholder1.webp?_wi=3", imageAlt: "SEO optimization service"
|
|
},
|
|
]}
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
buttons={[{ text: "View All Services", href: "#contact" }]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardTwo
|
|
title="Our Impact by the Numbers"
|
|
description="Proven results for local businesses like yours"
|
|
metrics={[
|
|
{ id: "1", value: "500+", description: "Businesses Transformed" },
|
|
{ id: "2", value: "$15M", description: "Revenue Generated for Clients" },
|
|
{ id: "3", value: "2.5x", description: "Average Traffic Increase" },
|
|
{ id: "4", value: "12 yrs", description: "Industry Experience" },
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSix
|
|
title="Success Stories from Our Clients"
|
|
description="Real results from real local businesses we've transformed"
|
|
tag="Testimonials"
|
|
tagIcon={Star}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Martinez", handle: "Owner, Martinez Plumbing Co", testimonial:
|
|
"LocalHero completely transformed our online presence. Within 3 months, we saw a 300% increase in customer inquiries. Best investment we made this year.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/portrait-happy-financial-advisor-office-ready-meet-with-clients_482257-113530.jpg", imageAlt: "Sarah Martinez"
|
|
},
|
|
{
|
|
id: "2", name: "James Chen", handle: "Manager, Chen's Restaurant Group", testimonial:
|
|
"Professional team, clear communication, and amazing results. Our new website brought in a whole new customer base. Highly recommend LocalHero.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1600.jpg", imageAlt: "James Chen"
|
|
},
|
|
{
|
|
id: "3", name: "Michelle Thompson", handle: "Owner, Thompson's Boutique", testimonial:
|
|
"They understood my vision perfectly and delivered beyond expectations. The site loads fast, looks gorgeous, and we're finally competitive online.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/young-business-woman-with-laptop-standing-office_1303-20356.jpg", imageAlt: "Michelle Thompson"
|
|
},
|
|
{
|
|
id: "4", name: "Robert Garcia", handle: "CEO, Garcia's Home Services", testimonial:
|
|
"Outstanding support team and continuous improvements. They genuinely care about our success. This is exactly what local businesses need.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/blond-businessman-happy-expression_1194-3666.jpg", imageAlt: "Robert Garcia"
|
|
},
|
|
{
|
|
id: "5", name: "Lisa Anderson", handle: "Co-founder, Anderson & Associates", testimonial:
|
|
"LocalHero brought a level of professionalism to our business that we couldn't achieve before. Game-changer for our growth strategy.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/businesswoman-leader-modern-office-with-businesspeople-workin_1139-958.jpg", imageAlt: "Lisa Anderson"
|
|
},
|
|
{
|
|
id: "6", name: "David Lopez", handle: "Founder, Lopez's Automotive", testimonial:
|
|
"From concept to launch, everything was seamless. Our new website has become our best sales tool. Worth every penny and more.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/happy-successful-businessman-posing-outside_74855-2003.jpg", imageAlt: "David Lopez"
|
|
},
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
speed={40}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
title="Ready to Transform Your Business?"
|
|
description="Let's discuss how LocalHero Services can build a website that turns visitors into customers. Schedule a free consultation with our team today."
|
|
inputs={[
|
|
{
|
|
name: "business-name", type: "text", placeholder: "Business Name", required: true,
|
|
},
|
|
{
|
|
name: "owner-name", type: "text", placeholder: "Your Name", required: true,
|
|
},
|
|
{
|
|
name: "email", type: "email", placeholder: "Email Address", required: true,
|
|
},
|
|
{
|
|
name: "phone", type: "tel", placeholder: "Phone Number", required: true,
|
|
},
|
|
]}
|
|
textarea={{
|
|
name: "message", placeholder:
|
|
"Tell us about your business and what you're looking to achieve", rows: 5,
|
|
required: true,
|
|
}}
|
|
useInvertedBackground={false}
|
|
buttonText="Schedule Consultation"
|
|
mediaAnimation="blur-reveal"
|
|
mediaPosition="right"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseReveal
|
|
columns={[
|
|
{
|
|
title: "Product", items: [
|
|
{ label: "Services", href: "#services" },
|
|
{ label: "Pricing", href: "#services" },
|
|
{ label: "Case Studies", href: "#testimonials" },
|
|
],
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About Us", href: "#about" },
|
|
{ label: "Our Team", href: "#about" },
|
|
{ label: "Careers", href: "#" },
|
|
],
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" },
|
|
{ label: "Contact Us", href: "#contact" },
|
|
],
|
|
},
|
|
]}
|
|
copyrightText="© 2025 LocalHero Services. All rights reserved. Empowering local businesses online."
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|