Update src/app/page.tsx

This commit is contained in:
2026-06-02 21:02:12 +00:00
parent 062787de5c
commit cb17bf83f5

View File

@@ -12,6 +12,10 @@ import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatin
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import ContactText from '@/components/sections/contact/ContactText';
import { Brush, Server, Lock, BarChart2, Activity, Smartphone, Palette, LifeBuoy } from 'lucide-react';
export default function LandingPage() {
return (
@@ -35,8 +39,12 @@ export default function LandingPage() {
name: "Home", id: "hero"},
{
name: "Features", id: "features"},
{
name: "What You Get", id: "what-customers-get"},
{
name: "Pricing", id: "pricing"},
{
name: "Why it Matters", id: "why-this-matters"},
{
name: "Testimonials", id: "testimonials"},
{
@@ -95,6 +103,42 @@ export default function LandingPage() {
/>
</div>
<div id="what-customers-get" data-section="what-customers-get">
<FeatureCardOne
animationType="slide-up"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
title="What Our Customers Get"
description="Comprehensive web solutions designed for growth and peace of mind."
features={[
{
title: "Website Build", description: "A custom-designed, high-converting website tailored to your business.", icon: Brush
},
{
title: "Hosting", description: "Reliable, fast, and secure hosting to keep your site online 24/7.", icon: Server
},
{
title: "SSL Certificate", description: "Essential security for your website, ensuring visitor data protection.", icon: Lock
},
{
title: "Analytics", description: "Track website performance and understand your audience with integrated analytics.", icon: BarChart2
},
{
title: "Uptime Monitoring", description: "Proactive monitoring to ensure your website is always available to customers.", icon: Activity
},
{
title: "Mobile Optimization", description: "Flawless display and functionality across all devices, from desktops to smartphones.", icon: Smartphone
},
{
title: "Clean Professional Design", description: "Modern, intuitive design that reflects your brand's professionalism.", icon: Palette
},
{
title: "Simple Support", description: "Dedicated, easy-to-reach support whenever you need assistance.", icon: LifeBuoy
}
]}
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardNine
animationType="slide-up"
@@ -184,6 +228,20 @@ export default function LandingPage() {
/>
</div>
<div id="why-this-matters" data-section="why-this-matters">
<MetricSplitMediaAbout
useInvertedBackground={false}
title="Why a Strong Website Matters for Your Small Business"
description="In today's digital age, your website is often the first impression potential customers have of your business. A professional, high-performing website isn't just an online brochure; it's a powerful tool for lead generation, brand building, and customer engagement. It establishes credibility, showcases your services, and provides an accessible platform for customers to learn about you 24/7. Don't let an outdated or non-existent website hold your business back."
imageSrc="http://img.b2bpic.net/free-photo/minimal-style-device-screen_23-2151913289.jpg"
imageAlt="business owner looking at website on screen"
mediaPosition="right"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
metrics={[]}
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
textboxLayout="split"
@@ -216,6 +274,21 @@ export default function LandingPage() {
/>
</div>
<div id="final-cta" data-section="final-cta">
<ContactText
background={{
variant: "sparkles-gradient"}}
text="Ready to make your business look professional online?"
buttons={[
{
text: "Start for $97/month", href: "#contact"
}
]}
animationType="entrance-slide"
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="http://img.b2bpic.net/free-photo/focused-software-developer-writing-code-laptop-looking-multiple-screens-with-programming-language-is-interrupted-by-colleague-coder-asking-advice-programmers-doing-online-cloud-computing_482257-33386.jpg"
@@ -237,6 +310,26 @@ export default function LandingPage() {
label: "Hosting", href: "#"},
],
},
{
title: "Solutions", items: [
{
label: "What You Get", href: "#what-customers-get"
},
{
label: "Why it Matters", href: "#why-this-matters"
}
]
},
{
title: "Support", items: [
{
label: "FAQ", href: "#faq"
},
{
label: "Contact", href: "#contact"
}
]
}
]}
imageAlt="professional web development services"
/>