262 lines
16 KiB
TypeScript
262 lines
16 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
|
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
|
|
import FeatureCardTwentyFour from "@/components/sections/feature/FeatureCardTwentyFour";
|
|
import ProductCardThree from "@/components/sections/product/ProductCardThree";
|
|
import PricingCardNine from "@/components/sections/pricing/PricingCardNine";
|
|
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
|
|
import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
|
|
import FaqBase from "@/components/sections/faq/FaqBase";
|
|
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
|
|
import { Award, DollarSign, HelpCircle, Package, Sparkles, Star, Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="soft"
|
|
contentWidth="mediumSmall"
|
|
sizing="medium"
|
|
background="circleGradient"
|
|
cardStyle="soft-shadow"
|
|
primaryButtonStyle="shadow"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="bold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
brandName="WebSeller"
|
|
navItems={[
|
|
{ name: "Features", id: "features" },
|
|
{ name: "Pricing", id: "pricing" },
|
|
{ name: "FAQ", id: "faq" },
|
|
{ name: "Contact", id: "contact" },
|
|
]}
|
|
button={{ text: "Start Free Trial", href: "#pricing" }}
|
|
animateOnLoad={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitKpi
|
|
title="Build & Sell Beautiful Websites Effortlessly"
|
|
description="Create stunning, responsive websites for your clients without coding. Launch faster, earn more, and scale your web design business with our all-in-one platform."
|
|
background={{ variant: "glowing-orb" }}
|
|
kpis={[
|
|
{ value: "50K+", label: "Websites Created" },
|
|
{ value: "2M+", label: "Monthly Visitors" },
|
|
{ value: "99.9%", label: "Uptime Guaranteed" },
|
|
]}
|
|
enableKpiAnimation={true}
|
|
tag="Trusted by Web Professionals"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "Start Building Now", href: "#pricing" },
|
|
{ text: "Watch Demo", href: "#" },
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
imageSrc="http://img.b2bpic.net/free-photo/office-worker-setting-project-reminders_482257-119416.jpg"
|
|
imageAlt="Website builder dashboard interface"
|
|
mediaAnimation="slide-up"
|
|
imagePosition="right"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentyFour
|
|
title="Powerful Features for Modern Web Builders"
|
|
description="Everything you need to create, manage, and sell professional websites"
|
|
tag="Features"
|
|
tagIcon={Zap}
|
|
tagAnimation="slide-up"
|
|
features={[
|
|
{
|
|
id: "1", title: "Intuitive Drag-and-Drop Builder", author: "Design Team", description: "Build professional websites in minutes without touching code. Hundreds of pre-designed templates and components ready to customize.", tags: ["No-Code", "Fast"],
|
|
imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-mobile-app-banner-template_52683-5840.jpg", imageAlt: "Drag and drop website builder"},
|
|
{
|
|
id: "2", title: "Advanced Analytics & Insights", author: "Data Team", description: "Track visitor behavior, conversion rates, and performance metrics in real-time. Make data-driven decisions to optimize client websites.", tags: ["Analytics", "Insights"],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg", imageAlt: "Analytics dashboard with charts"},
|
|
{
|
|
id: "3", title: "24/7 Expert Support", author: "Support Team", description: "Dedicated support team ready to help you and your clients succeed. Live chat, email, and knowledge base available anytime.", tags: ["Support", "Reliability"],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/sales-assistant-being-employed-customer-care-support-job-working-telemarketing-call-center-helpdesk-female-receptionist-with-helpline-service-helping-clients-remote-communication_482257-43021.jpg", imageAlt: "Customer support representatives"},
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
buttons={[{ text: "Explore All Features", href: "#" }]}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardThree
|
|
title="Choose Your Perfect Plan"
|
|
description="Select the hosting package that fits your business needs"
|
|
tag="Website Plans"
|
|
tagIcon={Package}
|
|
tagAnimation="slide-up"
|
|
products={[
|
|
{
|
|
id: "1", name: "Starter Website Package", price: "$99", imageSrc: "http://img.b2bpic.net/free-photo/woman-moving-using-boxes_1157-35367.jpg?_wi=1", imageAlt: "Starter plan preview", initialQuantity: 1,
|
|
},
|
|
{
|
|
id: "2", name: "Professional Website Package", price: "$299", imageSrc: "http://img.b2bpic.net/free-photo/businessman-using-digital-tablet-while-sitting-airport-terminal_107420-85113.jpg?_wi=1", imageAlt: "Professional plan preview", initialQuantity: 1,
|
|
},
|
|
{
|
|
id: "3", name: "Enterprise Website Solution", price: "$999", imageSrc: "http://img.b2bpic.net/free-photo/investor-addresses-factory-management-investment-pitch-meeting_482257-126957.jpg?_wi=1", imageAlt: "Enterprise plan preview", initialQuantity: 1,
|
|
},
|
|
]}
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
buttons={[{ text: "View All Options", href: "#pricing" }]}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardNine
|
|
title="Simple, Transparent Pricing"
|
|
description="No hidden fees. Scale as you grow. Cancel anytime."
|
|
tag="Pricing Plans"
|
|
tagIcon={DollarSign}
|
|
tagAnimation="slide-up"
|
|
plans={[
|
|
{
|
|
id: "starter", title: "Starter", price: "$29", period: "/month", imageSrc: "http://img.b2bpic.net/free-photo/woman-moving-using-boxes_1157-35367.jpg?_wi=2", imageAlt: "Starter plan", button: { text: "Start Free Trial", href: "#" },
|
|
features: [
|
|
"Up to 5 websites", "Custom domain", "Basic analytics", "Email support", "1GB storage"],
|
|
},
|
|
{
|
|
id: "professional", title: "Professional", price: "$79", period: "/month", imageSrc: "http://img.b2bpic.net/free-photo/businessman-using-digital-tablet-while-sitting-airport-terminal_107420-85113.jpg?_wi=2", imageAlt: "Professional plan", button: { text: "Start Free Trial", href: "#" },
|
|
features: [
|
|
"Unlimited websites", "Advanced analytics", "Priority support", "100GB storage", "API access"],
|
|
},
|
|
{
|
|
id: "enterprise", title: "Enterprise", price: "$299", period: "/month", imageSrc: "http://img.b2bpic.net/free-photo/investor-addresses-factory-management-investment-pitch-meeting_482257-126957.jpg?_wi=2", imageAlt: "Enterprise plan", button: { text: "Schedule Demo", href: "#" },
|
|
features: [
|
|
"Unlimited everything", "Dedicated account manager", "Custom integrations", "White-label options", "24/7 phone support"],
|
|
},
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
buttons={[{ text: "All Plans Include Free Migration", href: "#" }]}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="social-proof" data-section="social-proof">
|
|
<SocialProofOne
|
|
title="Trusted by Industry Leaders"
|
|
description="Thousands of businesses worldwide rely on our platform to create and manage their online presence"
|
|
tag="Partners"
|
|
tagIcon={Award}
|
|
tagAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
names={[
|
|
"TechCorp", "Innovate Inc", "GrowthCo", "Digital Pro", "CloudBase", "Nexus", "Velocity", "Fusion"]}
|
|
logos={[
|
|
"http://img.b2bpic.net/free-vector/gradient-technology-logo-template-collection_23-2148220592.jpg", "http://img.b2bpic.net/free-vector/gradient-technology-logo-template-collection_23-2148220592.jpg", "http://img.b2bpic.net/free-vector/gradient-technology-logo-template-collection_23-2148220592.jpg", "http://img.b2bpic.net/free-vector/gradient-technology-logo-template-collection_23-2148220592.jpg", "http://img.b2bpic.net/free-vector/gradient-technology-logo-template-collection_23-2148220592.jpg", "http://img.b2bpic.net/free-vector/technological-logo-design_1424-39.jpg", "http://img.b2bpic.net/free-vector/gradient-technology-logo-template-collection_23-2148220592.jpg", "http://img.b2bpic.net/free-vector/gradient-technology-logo-template-collection_23-2148220592.jpg"]}
|
|
speed={40}
|
|
showCard={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwelve
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Johnson", imageSrc: "http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg?_wi=1", imageAlt: "Sarah Johnson"},
|
|
{
|
|
id: "2", name: "Michael Chen", imageSrc: "http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg?_wi=2", imageAlt: "Michael Chen"},
|
|
{
|
|
id: "3", name: "Emily Rodriguez", imageSrc: "http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg?_wi=3", imageAlt: "Emily Rodriguez"},
|
|
{
|
|
id: "4", name: "David Kim", imageSrc: "http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg?_wi=4", imageAlt: "David Kim"},
|
|
{
|
|
id: "5", name: "Jessica Lee", imageSrc: "http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg?_wi=5", imageAlt: "Jessica Lee"},
|
|
{
|
|
id: "6", name: "Robert Williams", imageSrc: "http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg?_wi=6", imageAlt: "Robert Williams"},
|
|
]}
|
|
cardTitle="Over 10,000+ Web Designers Trust Our Platform to Build Better Websites"
|
|
cardTag="Trusted by Professionals"
|
|
cardTagIcon={Star}
|
|
cardAnimation="slide-up"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqBase
|
|
title="Frequently Asked Questions"
|
|
description="Find answers to common questions about our website selling platform"
|
|
tag="Help"
|
|
tagIcon={HelpCircle}
|
|
tagAnimation="slide-up"
|
|
faqs={[
|
|
{
|
|
id: "1", title: "How do I get started selling websites?", content: "Sign up for a free account, choose your plan, and start building your first website using our drag-and-drop builder. You can be live in minutes with our pre-designed templates."},
|
|
{
|
|
id: "2", title: "Can I white-label the platform for my clients?", content: "Yes! Our Professional and Enterprise plans include white-label options so you can brand the entire platform as your own and offer it under your company name."},
|
|
{
|
|
id: "3", title: "What payment methods do you accept?", content: "We accept all major credit cards, PayPal, and bank transfers for enterprise customers. Billing is automated and you can change your plan or cancel anytime."},
|
|
{
|
|
id: "4", title: "Is there a free trial available?", content: "Yes! All plans come with a 14-day free trial. No credit card required. You get full access to all features during your trial period."},
|
|
{
|
|
id: "5", title: "What kind of support do you offer?", content: "We offer 24/7 email support for all plans, live chat for Professional plans, and dedicated account managers for Enterprise customers."},
|
|
{
|
|
id: "6", title: "Can I migrate existing websites?", content: "Absolutely! We offer free migration services for all new customers. Our team will help you transfer your existing sites with zero downtime."},
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
faqsAnimation="slide-up"
|
|
animationType="smooth"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoEmphasis
|
|
logoText="WebSeller"
|
|
columns={[
|
|
{
|
|
items: [
|
|
{ label: "Features", href: "#features" },
|
|
{ label: "Pricing", href: "#pricing" },
|
|
{ label: "FAQ", href: "#faq" },
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "About Us", href: "#" },
|
|
{ label: "Blog", href: "#" },
|
|
{ label: "Contact", href: "#" },
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" },
|
|
{ label: "Security", href: "#" },
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "Twitter", href: "https://twitter.com" },
|
|
{ label: "LinkedIn", href: "https://linkedin.com" },
|
|
{ label: "Facebook", href: "https://facebook.com" },
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|