190 lines
11 KiB
TypeScript
190 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FaqBase from '@/components/sections/faq/FaqBase';
|
|
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
|
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
|
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
|
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="bounce-effect"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="small"
|
|
sizing="mediumLargeSizeMediumTitles"
|
|
background="none"
|
|
cardStyle="gradient-bordered"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="normal"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Portfolio", id: "portfolio" },
|
|
{ name: "Pricing", id: "pricing" },
|
|
]}
|
|
brandName="SmallBiz Sites"
|
|
button={{ text: "Get Started", href: "#contact" }}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardTestimonial
|
|
useInvertedBackground={false}
|
|
background={{ variant: "plain" }}
|
|
title="Simple Websites for Small Businesses"
|
|
description="We build clean, simple websites that help small businesses get more customers."
|
|
testimonials={[
|
|
{ name: "John Doe", handle: "Barber Shop", testimonial: "Amazing work, my bookings increased immediately!", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=kdd0n8&_wi=1", imageAlt: "laptop website mockup" },
|
|
{ name: "Jane Smith", handle: "Cafe", testimonial: "Simple, clean, and delivered fast.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=hlw776&_wi=1", imageAlt: "laptop website mockup" },
|
|
{ name: "Mike Ross", handle: "Cleaning Co", testimonial: "Great investment for our business growth.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8tqmhb&_wi=1", imageAlt: "laptop website mockup" },
|
|
{ name: "Sarah Lee", handle: "Bakery", testimonial: "Easy to use and perfectly on brand.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=mveseo&_wi=1", imageAlt: "laptop website mockup" },
|
|
{ name: "Tom Cook", handle: "FixIt", testimonial: "Highly recommended for local businesses.", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=axx006&_wi=1", imageAlt: "laptop website mockup" },
|
|
]}
|
|
buttons={[{ text: "View Our Work", href: "#portfolio" }]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=kdd0n8&_wi=2"
|
|
imageAlt="laptop website mockup"
|
|
avatars={[
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=hlw776", alt: "Client 1" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=zgxjq7", alt: "Client 2" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=rmlis0", alt: "Client 3" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=n7inle", alt: "Client 4" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=kdd0n8", alt: "Client 5" },
|
|
]}
|
|
avatarText="Trusted by 50+ local businesses"
|
|
marqueeItems={[
|
|
{ type: "text", text: "Professional" },
|
|
{ type: "text", text: "Fast" },
|
|
{ type: "text", text: "Responsive" },
|
|
{ type: "text", text: "SEO Friendly" },
|
|
{ type: "text", text: "High Conversion" },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextSplitAbout
|
|
useInvertedBackground={true}
|
|
title="About Our Team"
|
|
description={[
|
|
"Hi, we create simple and professional websites for small businesses in the USA.", "Our goal is to help local businesses get more clients with a clean online presence."]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="portfolio" data-section="portfolio">
|
|
<ProductCardThree
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{ id: "p1", name: "Barbershop Website", price: "Modern design for a local barbershop", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=hlw776&_wi=2" },
|
|
{ id: "p2", name: "Restaurant Website", price: "Clean layout with menu and photos", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8tqmhb&_wi=2" },
|
|
{ id: "p3", name: "Cleaning Service Website", price: "Professional design focused on leads", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=mveseo&_wi=2" },
|
|
{ id: "p4", name: "Bakery Portal", price: "Online order menu and contact", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=zgxjq7" },
|
|
{ id: "p5", name: "Local Consultant", price: "Personal brand website", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=axx006&_wi=2" },
|
|
{ id: "p6", name: "Pet Groomer", price: "Booking and service info", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8kjel3" },
|
|
]}
|
|
title="Our Work"
|
|
description="A selection of our latest projects for local businesses."
|
|
/>
|
|
</div>
|
|
|
|
<div id="benefits" data-section="benefits">
|
|
<FeatureCardNine
|
|
animationType="opacity"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{ title: "Simple Design", description: "Professional and clean layouts.", phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=rmlis0" }, phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=fm2gnp" } },
|
|
{ title: "Fast Delivery", description: "Get your site running in days.", phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wj7mw3" }, phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=jbp04v" } },
|
|
{ title: "One-time Payment", description: "No hidden subscription fees.", phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=vqpnxf" }, phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=n7inle" } },
|
|
]}
|
|
showStepNumbers={true}
|
|
title="Why Choose Us?"
|
|
description="Professional web solutions designed to scale your business."
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardNine
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
plans={[
|
|
{
|
|
id: "basic", title: "Web Starter", price: "$300", period: "once", features: ["Responsive Design", "Basic SEO", "Contact Form", "Mobile Friendly"],
|
|
button: { text: "Choose Plan", href: "#contact" },
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=hlw776&_wi=3", imageAlt: "barbershop interior modern"
|
|
},
|
|
{
|
|
id: "standard", title: "Business Pro", price: "$500", period: "once", features: ["Everything in Starter", "Premium Hosting", "Fast Loading", "Analytics Setup"],
|
|
button: { text: "Choose Plan", href: "#contact" },
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=kdd0n8&_wi=3", imageAlt: "barbershop interior modern"
|
|
},
|
|
{
|
|
id: "custom", title: "Custom Solution", price: "Custom", period: "quote", features: ["Full E-commerce", "Booking System", "Advanced SEO", "Ongoing Support"],
|
|
button: { text: "Request Quote", href: "#contact" },
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8tqmhb&_wi=3", imageAlt: "barbershop interior modern"
|
|
},
|
|
]}
|
|
title="Simple Pricing"
|
|
description="Transparent investment for your business."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqBase
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
faqs={[
|
|
{ id: "f1", title: "How long does it take?", content: "Most websites are delivered within 5-7 business days." },
|
|
{ id: "f2", title: "Do I have to pay monthly?", content: "No, we offer a one-time payment model for web design." },
|
|
{ id: "f3", title: "Can I edit the site myself?", content: "Yes, we provide easy instructions for basic updates." },
|
|
]}
|
|
title="Common Questions"
|
|
description="Everything you need to know about our process."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
useInvertedBackground={false}
|
|
background={{ variant: "plain" }}
|
|
tag="Let's Talk"
|
|
title="Get Your Website Today"
|
|
description="Ready to boost your clients? Contact us today via WhatsApp or email."
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=0agefi"
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterSimple
|
|
columns={[
|
|
{ title: "Services", items: [{ label: "Web Design", href: "#" }, { label: "SEO", href: "#" }] },
|
|
{ title: "Company", items: [{ label: "About", href: "#about" }, { label: "Portfolio", href: "#portfolio" }] },
|
|
{ title: "Support", items: [{ label: "Contact", href: "#contact" }, { label: "WhatsApp 1", href: "https://wa.me/9999490647" }, { label: "WhatsApp 2", href: "https://wa.me/9997664077" }] },
|
|
]}
|
|
bottomLeftText="© 2024 SmallBiz Sites. All rights reserved."
|
|
bottomRightText="WhatsApp: 9999490647"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|