294 lines
17 KiB
TypeScript
294 lines
17 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
|
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
|
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
|
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
|
import { CheckCircle, Crown, Heart, HelpCircle, Shield, Sparkles, Zap } from 'lucide-react';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="bounce-effect"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="soft"
|
|
contentWidth="medium"
|
|
sizing="largeSmall"
|
|
background="noise"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
brandName="BotRunner"
|
|
navItems={[
|
|
{ name: "Features", id: "features" },
|
|
{ name: "Pricing", id: "pricing" },
|
|
{ name: "How It Works", id: "howitworks" },
|
|
{ name: "FAQ", id: "faq" }
|
|
]}
|
|
button={{
|
|
text: "Get Started", href: "#contact"
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardTestimonial
|
|
title="Deploy Your Bot. Instantly."
|
|
description="Connect Discord. Check & Deploy. Run your app with zero friction. BotRunner handles the heavy lifting while you focus on building amazing bots."
|
|
tag="AI-Powered Deployment"
|
|
tagIcon={Zap}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "Start Deploying Now", href: "#pricing" },
|
|
{ text: "View Documentation", href: "#" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
testimonials={[
|
|
{
|
|
name: "Alex Johnson", handle: "@botbuilder", testimonial: "BotRunner cut our deployment time from hours to minutes. Game changer for bot development.", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-a-software-deve-1774109647249-5209e375.png?_wi=1", imageAlt: "Alex Johnson"
|
|
},
|
|
{
|
|
name: "Sarah Chen", handle: "@devops_sarah", testimonial: "Finally, a bot deployment platform that just works. No more manual configuration headaches.", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-a-system-admini-1774109646863-8c7c3b55.png?_wi=1", imageAlt: "Sarah Chen"
|
|
},
|
|
{
|
|
name: "Marcus Brown", handle: "@discord_dev", testimonial: "The Discord integration is seamless. Our entire team loves BotRunner.", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-a-product-manag-1774109647506-b1d162d7.png?_wi=1", imageAlt: "Marcus Brown"
|
|
}
|
|
]}
|
|
testimonialRotationInterval={5000}
|
|
useInvertedBackground={false}
|
|
background={{ variant: "noise" }}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/a-modern-ai-bot-deployment-dashboard-wit-1774109649647-852fa749.png"
|
|
imageAlt="BotRunner Dashboard"
|
|
mediaAnimation="slide-up"
|
|
avatars={[
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-a-software-deve-1774109647249-5209e375.png", alt: "User Avatar" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-a-system-admini-1774109646863-8c7c3b55.png", alt: "User Avatar" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-a-product-manag-1774109647506-b1d162d7.png", alt: "User Avatar" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-a-cloud-archite-1774109647235-7732a310.png", alt: "User Avatar" }
|
|
]}
|
|
avatarText="Trusted by 10,000+ developers"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardThree
|
|
title="Powerful Features Built for Speed"
|
|
description="Everything you need to deploy, manage, and scale your bots effortlessly."
|
|
tag="Core Capabilities"
|
|
tagIcon={CheckCircle}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "Explore All Features", href: "#" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
features={[
|
|
{
|
|
id: "discord-integration", title: "Discord Integration", description: "Native Discord bot support with full command management, server configuration, and real-time synchronization.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/a-close-up-view-of-discord-bot-commands--1774109650602-bb31d66a.png", imageAlt: "Discord Integration"
|
|
},
|
|
{
|
|
id: "one-click-deploy", title: "One-Click Deploy", description: "Deploy your bot with a single click. Automated testing, version control, and rollback capabilities built-in.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/deployment-pipeline-visualization-showin-1774109649019-057fce13.png", imageAlt: "One-Click Deployment"
|
|
},
|
|
{
|
|
id: "analytics", title: "Real-Time Analytics", description: "Monitor bot performance, uptime, user engagement, and errors with comprehensive dashboards and alerts.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/analytics-and-monitoring-dashboard-showi-1774109648802-091c5764.png", imageAlt: "Analytics Dashboard"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardThree
|
|
title="Choose Your Bot Configuration"
|
|
description="From simple bots to enterprise-grade automation, find the perfect plan."
|
|
tag="Bot Templates"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
products={[
|
|
{
|
|
id: "starter-bot", name: "Starter Bot", price: "Free", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/a-simple-starter-bot-configuration-inter-1774109648169-5b78af4c.png", imageAlt: "Starter Bot Template"
|
|
},
|
|
{
|
|
id: "pro-bot", name: "Pro Bot", price: "$29/mo", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/advanced-bot-configuration-dashboard-sho-1774109648615-2497dd7b.png", imageAlt: "Pro Bot Template"
|
|
},
|
|
{
|
|
id: "enterprise-bot", name: "Enterprise Bot", price: "Custom", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/enterprise-grade-bot-runner-platform-sho-1774109649145-dc2c15f3.png", imageAlt: "Enterprise Bot Solution"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSix
|
|
title="What Developers Love About BotRunner"
|
|
description="Join thousands of developers who deploy faster and run smarter."
|
|
tag="Developer Stories"
|
|
tagIcon={Heart}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "Read All Stories", href: "#" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Alex Johnson", handle: "@botbuilder", testimonial: "BotRunner cut our deployment time from hours to minutes. Game changer for bot development.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-a-software-deve-1774109647249-5209e375.png?_wi=2", imageAlt: "Alex Johnson"
|
|
},
|
|
{
|
|
id: "2", name: "Sarah Chen", handle: "@devops_sarah", testimonial: "Finally, a bot deployment platform that just works. No more manual configuration headaches.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-a-system-admini-1774109646863-8c7c3b55.png?_wi=2", imageAlt: "Sarah Chen"
|
|
},
|
|
{
|
|
id: "3", name: "Marcus Brown", handle: "@discord_dev", testimonial: "The Discord integration is seamless. Our entire team loves BotRunner.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-a-product-manag-1774109647506-b1d162d7.png?_wi=2", imageAlt: "Marcus Brown"
|
|
},
|
|
{
|
|
id: "4", name: "Lisa Garcia", handle: "@cloud_architect", testimonial: "Enterprise-grade reliability with startup simplicity. Perfect for scaling bot operations.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-a-cloud-archite-1774109647235-7732a310.png", imageAlt: "Lisa Garcia"
|
|
},
|
|
{
|
|
id: "5", name: "David Park", handle: "@automation_pro", testimonial: "The automation capabilities are incredible. Saved us hundreds of hours of manual work.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-an-automation-s-1774109647530-ba856e71.png", imageAlt: "David Park"
|
|
},
|
|
{
|
|
id: "6", name: "Emma Wilson", handle: "@tech_lead", testimonial: "BotRunner is the backbone of our bot infrastructure. Couldn't imagine operating without it.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BGJeWlYpGxL8JgYSBMJgp294fY/professional-headshot-of-a-team-lead-or--1774109647481-bd4996d2.png", imageAlt: "Emma Wilson"
|
|
}
|
|
]}
|
|
speed={40}
|
|
topMarqueeDirection="left"
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardEight
|
|
title="Simple, Transparent Pricing"
|
|
description="Scale your bot infrastructure with pricing that grows with you."
|
|
tag="No Hidden Fees"
|
|
tagIcon={Shield}
|
|
tagAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
plans={[
|
|
{
|
|
id: "hobby", badge: "Getting Started", badgeIcon: Sparkles,
|
|
price: "Free", subtitle: "Perfect for testing and small projects", features: [
|
|
"1 bot deployment", "Discord integration", "Basic analytics", "Community support"
|
|
],
|
|
buttons: [
|
|
{ text: "Start Free", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
id: "pro", badge: "Most Popular", badgeIcon: Zap,
|
|
price: "$29/mo", subtitle: "For growing bot operations", features: [
|
|
"Unlimited bots", "Advanced analytics", "Priority support", "Custom commands", "API access"
|
|
],
|
|
buttons: [
|
|
{ text: "Start 14-Day Trial", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
id: "enterprise", badge: "Enterprise", badgeIcon: Crown,
|
|
price: "Custom", subtitle: "For mission-critical deployments", features: [
|
|
"Unlimited everything", "Dedicated support", "SLA guarantee", "Custom integrations", "Advanced security"
|
|
],
|
|
buttons: [
|
|
{ text: "Contact Sales", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqDouble
|
|
title="Frequently Asked Questions"
|
|
description="Everything you need to know about deploying and managing bots on BotRunner."
|
|
tag="Get Answers"
|
|
tagIcon={HelpCircle}
|
|
tagAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqsAnimation="slide-up"
|
|
faqs={[
|
|
{
|
|
id: "1", title: "How do I connect my Discord bot?", content: "Simply provide your bot token during setup, and BotRunner automatically configures all Discord integrations. Your bot will be live within seconds."
|
|
},
|
|
{
|
|
id: "2", title: "Can I deploy multiple bots?", content: "Yes! Pro and Enterprise plans support unlimited bot deployments. You can manage all your bots from a single dashboard."
|
|
},
|
|
{
|
|
id: "3", title: "What happens if my bot crashes?", content: "BotRunner automatically detects and restarts crashed bots. You'll receive instant notifications, and our system maintains 99.9% uptime SLA."
|
|
},
|
|
{
|
|
id: "4", title: "Is my data secure?", content: "We use enterprise-grade encryption, regular security audits, and comply with GDPR and SOC 2 standards. Your bot data is always protected."
|
|
},
|
|
{
|
|
id: "5", title: "How do I monitor bot performance?", content: "Our real-time analytics dashboard shows CPU usage, memory, response times, error rates, and user engagement metrics."
|
|
},
|
|
{
|
|
id: "6", title: "Can I rollback to a previous version?", content: "Yes, BotRunner maintains version history and allows one-click rollbacks to any previous deployment version."
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseReveal
|
|
columns={[
|
|
{
|
|
title: "Product", items: [
|
|
{ label: "Features", href: "#features" },
|
|
{ label: "Pricing", href: "#pricing" },
|
|
{ label: "Security", href: "#" },
|
|
{ label: "Status", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Resources", items: [
|
|
{ label: "Documentation", href: "#" },
|
|
{ label: "API Reference", href: "#" },
|
|
{ label: "Tutorials", href: "#" },
|
|
{ label: "Community", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About", href: "#" },
|
|
{ label: "Blog", href: "#" },
|
|
{ label: "Careers", href: "#" },
|
|
{ label: "Contact", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{ label: "Privacy", href: "#" },
|
|
{ label: "Terms", href: "#" },
|
|
{ label: "Cookies", href: "#" },
|
|
{ label: "Compliance", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
copyrightText="© 2024 BotRunner. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |