337 lines
18 KiB
TypeScript
337 lines
18 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
|
|
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
|
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
|
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
|
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
|
import { Sparkles, Zap, Shield, Mail } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="shift-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="soft"
|
|
contentWidth="smallMedium"
|
|
sizing="mediumLargeSizeMediumTitles"
|
|
background="circleGradient"
|
|
cardStyle="subtle-shadow"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="medium"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleMinimal
|
|
brandName="Webild"
|
|
button={{
|
|
text: "Get Started", href: "contact"
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogoBillboard
|
|
logoText="webild"
|
|
description="Transform your project generation process. Automate workflows, accelerate delivery, and generate results at scale with intelligent project creation technology."
|
|
imageSrc="https://img.b2bpic.net/free-photo/portrait-smiling-coworkers-looking-revenue-figures-paperwork_482257-126641.jpg"
|
|
imageAlt="Webild project generation platform showcasing automation capabilities"
|
|
frameStyle="browser"
|
|
logoLineHeight={1.1}
|
|
ariaLabel="Webild - Project Generation Platform hero section"
|
|
logoContainerClassName="text-5xl md:text-7xl font-bold tracking-tighter"
|
|
descriptionClassName="text-base md:text-xl leading-relaxed max-w-2xl"
|
|
mediaWrapperClassName="mt-12 rounded-lg overflow-hidden shadow-lg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextSplitAbout
|
|
title="About Webild"
|
|
description={[
|
|
"Webild is revolutionizing how teams generate and manage projects. Our platform combines artificial intelligence with intuitive design to eliminate manual setup processes and accelerate project delivery.", "We believe that intelligent automation should empower teams, not replace them. Our mission is to help developers, managers, and organizations achieve more by automating the repetitive aspects of project creation while keeping humans at the center of decision-making.", "Founded by industry veterans passionate about developer productivity, Webild brings years of expertise to the project management space. We're committed to continuous innovation and customer success."
|
|
]}
|
|
useInvertedBackground="noInvert"
|
|
showBorder={false}
|
|
buttons={[
|
|
{
|
|
text: "Learn Our Story", href: "#"
|
|
}
|
|
]}
|
|
titleClassName="text-4xl md:text-5xl font-bold leading-tight"
|
|
descriptionClassName="text-base leading-relaxed mb-4"
|
|
buttonContainerClassName="flex gap-4 mt-8"
|
|
buttonClassName="px-6 py-3 rounded-lg font-medium transition-all"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentyOne
|
|
tag="Core Features"
|
|
title="Powerful Capabilities Built for Teams"
|
|
description="Experience intelligent project generation that understands your team's workflows and adapts to your needs."
|
|
imageSrc="https://img.b2bpic.net/free-photo/information-technology-connection-graphics-concept_53876-121040.jpg"
|
|
imageAlt="Webild automation features interface"
|
|
mediaPosition="left"
|
|
useInvertedBackground="noInvert"
|
|
accordionItems={[
|
|
{
|
|
id: "1", title: "Intelligent Project Generation", content: "Our AI-powered engine analyzes your requirements and generates complete project structures in seconds, including configurations, templates, and best practices tailored to your tech stack."
|
|
},
|
|
{
|
|
id: "2", title: "Smart Workflow Automation", content: "Automate repetitive project setup tasks. Define templates once, generate unlimited projects with consistent quality. Reduce setup time from hours to minutes."
|
|
},
|
|
{
|
|
id: "3", title: "Seamless Integration", content: "Integrate with your favorite tools including GitHub, GitLab, Jira, Slack, and more. Connect Webild to your existing development stack effortlessly."
|
|
},
|
|
{
|
|
id: "4", title: "Team Collaboration", content: "Share project templates across teams, manage permissions, and collaborate in real-time. Keep everyone aligned on project standards and best practices."
|
|
}
|
|
]}
|
|
buttons={[
|
|
{
|
|
text: "Explore Features", href: "#"
|
|
}
|
|
]}
|
|
titleClassName="text-3xl md:text-4xl font-bold leading-tight"
|
|
descriptionClassName="text-base leading-relaxed mb-6"
|
|
tagClassName="text-sm font-semibold uppercase tracking-wide"
|
|
accordionTitleClassName="text-lg font-semibold"
|
|
accordionContentClassName="text-base leading-relaxed"
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardTwo
|
|
title="Solutions for Every Team Size"
|
|
description="Choose the right plan for your organization. From freelancers to enterprises, Webild scales with your needs."
|
|
tag="Product Suite"
|
|
products={[
|
|
{
|
|
id: "1", brand: "Webild", name: "Basic Project Generator", price: "$49/mo", rating: 4,
|
|
reviewCount: "1.2k", imageSrc: "https://img.b2bpic.net/free-photo/information-technology-connection-graphics-concept_53876-121040.jpg", imageAlt: "Basic project generation tool"
|
|
},
|
|
{
|
|
id: "2", brand: "Webild", name: "Advanced Automation Suite", price: "$149/mo", rating: 5,
|
|
reviewCount: "2.8k", imageSrc: "https://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg", imageAlt: "Advanced automation and analytics platform"
|
|
},
|
|
{
|
|
id: "3", brand: "Webild", name: "Enterprise Intelligence", price: "$499/mo", rating: 5,
|
|
reviewCount: "5.1k", imageSrc: "https://img.b2bpic.net/free-photo/close-up-young-colleagues-having-meeting_23-2149060234.jpg", imageAlt: "Enterprise collaboration and project management"
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
gridVariant="three-columns-all-equal-width"
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardTwo
|
|
title="Simple, Transparent Pricing"
|
|
description="Choose the plan that fits your team's needs. All plans include core project generation capabilities."
|
|
tag="Pricing"
|
|
tagIcon={Sparkles}
|
|
plans={[
|
|
{
|
|
id: "starter", badge: "Starter", badgeIcon: Zap,
|
|
price: "$29/mo", subtitle: "Perfect for individuals and small projects", buttons: [
|
|
{
|
|
text: "Start Free Trial", href: "#"
|
|
},
|
|
{
|
|
text: "Learn More", href: "#"
|
|
}
|
|
],
|
|
features: [
|
|
"Up to 5 projects per month", "Basic templates", "Community support", "1GB storage", "Email notifications"
|
|
]
|
|
},
|
|
{
|
|
id: "professional", badge: "Professional", badgeIcon: Sparkles,
|
|
price: "$99/mo", subtitle: "Ideal for growing teams and agencies", buttons: [
|
|
{
|
|
text: "Start Free Trial", href: "#"
|
|
},
|
|
{
|
|
text: "Contact Sales", href: "#"
|
|
}
|
|
],
|
|
features: [
|
|
"Unlimited projects", "Advanced templates", "Priority support", "100GB storage", "Team collaboration", "API access", "Custom integrations"
|
|
]
|
|
},
|
|
{
|
|
id: "enterprise", badge: "Enterprise", badgeIcon: Shield,
|
|
price: "Custom", subtitle: "Tailored solutions for large organizations", buttons: [
|
|
{
|
|
text: "Request Demo", href: "#"
|
|
},
|
|
{
|
|
text: "Get Pricing", href: "#"
|
|
}
|
|
],
|
|
features: [
|
|
"Unlimited everything", "Custom templates", "Dedicated support", "Unlimited storage", "Advanced analytics", "SSO & compliance", "On-premise deployment"
|
|
]
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
titleClassName="text-3xl md:text-4xl font-bold leading-tight mb-3"
|
|
descriptionClassName="text-base leading-relaxed mb-8"
|
|
badgeClassName="text-xs font-semibold uppercase tracking-wide"
|
|
priceClassName="text-3xl md:text-4xl font-bold mb-2"
|
|
subtitleClassName="text-sm text-gray-600 mb-4"
|
|
featuresClassName="space-y-3"
|
|
featureItemClassName="flex items-start gap-3 text-sm"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSix
|
|
title="Loved by Teams Worldwide"
|
|
description="Hear what industry leaders and developers are saying about how Webild transformed their project workflows."
|
|
tag="Testimonials"
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
speed={40}
|
|
topMarqueeDirection="left"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Chen", handle: "@sarahtech", testimonial: "Webild has cut our project setup time by 80%. What used to take a full day now happens in minutes. Absolutely transformative for our team.", imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageAlt: "Sarah Chen"
|
|
},
|
|
{
|
|
id: "2", name: "Marcus Rodriguez", handle: "@marcus_dev", testimonial: "The automation capabilities are incredible. We've standardized all our projects across teams, and the consistency has been a game-changer for code quality.", imageSrc: "https://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg", imageAlt: "Marcus Rodriguez"
|
|
},
|
|
{
|
|
id: "3", name: "Elena Volkov", handle: "@elenadev", testimonial: "The integration with our existing tools was seamless. Webild fits perfectly into our development pipeline without any friction or learning curve.", imageSrc: "https://img.b2bpic.net/free-photo/close-up-competitive-employee_1098-2870.jpg", imageAlt: "Elena Volkov"
|
|
},
|
|
{
|
|
id: "4", name: "James Park", handle: "@jamespark_", testimonial: "Outstanding customer support and continuous feature updates. The team at Webild genuinely listens to user feedback and iterates quickly.", imageSrc: "https://img.b2bpic.net/free-photo/positive-confident-businessman-posing-outside_74855-1183.jpg", imageAlt: "James Park"
|
|
},
|
|
{
|
|
id: "5", name: "Priya Sharma", handle: "@priyatech", testimonial: "Perfect for startups. We can now focus on building features instead of wasting time on boilerplate and setup. Webild is a huge productivity multiplier.", imageSrc: "https://img.b2bpic.net/free-photo/closeup-handsome-middle-aged-business-leader_1262-4822.jpg", imageAlt: "Priya Sharma"
|
|
},
|
|
{
|
|
id: "6", name: "David Thompson", handle: "@dthompson", testimonial: "Enterprise-grade features at a reasonable price point. We evaluated several solutions, and Webild offered the best value for our large-scale operations.", imageSrc: "https://img.b2bpic.net/free-photo/positive-middle-aged-business-leader-window_1262-5388.jpg", imageAlt: "David Thompson"
|
|
}
|
|
]}
|
|
titleClassName="text-3xl md:text-4xl font-bold leading-tight mb-3"
|
|
descriptionClassName="text-base leading-relaxed mb-8"
|
|
tagClassName="text-sm font-semibold uppercase tracking-wide mb-4"
|
|
testimonialClassName="text-base leading-relaxed"
|
|
nameClassName="font-semibold text-sm"
|
|
handleClassName="text-xs text-gray-500"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
tag="Get Started"
|
|
tagIcon={Mail}
|
|
title="Stay Updated on Webild"
|
|
description="Join our community of developers and teams. Get early access to new features, exclusive tips, and special offers."
|
|
useInvertedBackground="noInvert"
|
|
imageSrc="https://img.b2bpic.net/free-photo/standard-quality-control-collage-concept_23-2149595844.jpg"
|
|
imageAlt="Webild contact and communication image"
|
|
mediaPosition="right"
|
|
inputPlaceholder="your@email.com"
|
|
buttonText="Subscribe Now"
|
|
termsText="We respect your privacy. Unsubscribe at any time. See our privacy policy."
|
|
tagClassName="text-xs font-semibold uppercase tracking-wide"
|
|
titleClassName="text-3xl md:text-4xl font-bold leading-tight mb-3"
|
|
descriptionClassName="text-base leading-relaxed mb-6"
|
|
inputClassName="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2"
|
|
buttonClassName="px-6 py-3 rounded-lg font-semibold transition-all"
|
|
termsClassName="text-xs text-gray-500 leading-relaxed"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterSimple
|
|
columns={[
|
|
{
|
|
title: "Product", items: [
|
|
{
|
|
label: "Features", href: "#"
|
|
},
|
|
{
|
|
label: "Pricing", href: "#"
|
|
},
|
|
{
|
|
label: "Security", href: "#"
|
|
},
|
|
{
|
|
label: "Roadmap", href: "#"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{
|
|
label: "About", href: "#"
|
|
},
|
|
{
|
|
label: "Blog", href: "#"
|
|
},
|
|
{
|
|
label: "Careers", href: "#"
|
|
},
|
|
{
|
|
label: "Contact", href: "#"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Resources", items: [
|
|
{
|
|
label: "Documentation", href: "#"
|
|
},
|
|
{
|
|
label: "API Reference", href: "#"
|
|
},
|
|
{
|
|
label: "Community", href: "#"
|
|
},
|
|
{
|
|
label: "Support", href: "#"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{
|
|
label: "Privacy Policy", href: "#"
|
|
},
|
|
{
|
|
label: "Terms of Service", href: "#"
|
|
},
|
|
{
|
|
label: "Cookie Policy", href: "#"
|
|
},
|
|
{
|
|
label: "GDPR", href: "#"
|
|
}
|
|
]
|
|
}
|
|
]}
|
|
bottomLeftText="© 2025 Webild. All rights reserved."
|
|
bottomRightText="Made with innovation and passion"
|
|
columnTitleClassName="font-semibold text-base mb-4"
|
|
columnItemClassName="text-sm mb-3 hover:font-semibold transition-all"
|
|
bottomLeftTextClassName="text-xs text-gray-600"
|
|
bottomRightTextClassName="text-xs text-gray-600"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |