Merge version_2 into main #2
417
src/app/page.tsx
417
src/app/page.tsx
@@ -2,17 +2,11 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
|
||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
import HeroSplit from '@/components/sections/hero/HeroSplit';
|
||||
import MediaAbout from '@/components/sections/about/MediaAbout';
|
||||
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||
import TeamCardSix from '@/components/sections/team/TeamCardSix';
|
||||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -29,356 +23,67 @@ export default function LandingPage() {
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Features",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "pricing",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "faq",
|
||||
},
|
||||
]}
|
||||
brandName="AutoFlow"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Hero", id: "hero" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Team", id: "team" },
|
||||
]}
|
||||
brandName="AutoFlow"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplit
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
title="Work smarter. Automate the rest."
|
||||
description="Streamline workflows, cut manual tasks by 70%, and free your team to focus on what matters. Join 5,000 companies saving 20 hours weekly."
|
||||
buttons={[
|
||||
{
|
||||
text: "Start Free Trial",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/computer-dark-room-with-graphs-screen_169016-55085.jpg?_wi=1"
|
||||
imageAlt="Workflow automation dashboard"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/network-analyst-studying-digital-commerce-progression-reports-computer_482257-126389.jpg",
|
||||
alt: "User avatar 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/man-trading-browsing-online-stock-investments-night_169016-57448.jpg",
|
||||
alt: "User avatar 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/computer-dark-room-with-graphs-screen_169016-57447.jpg",
|
||||
alt: "User avatar 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/man-trading-browsing-online-stock-investments-night_169016-57295.jpg",
|
||||
alt: "User avatar 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/student-desk-with-computer-books-notepads-wooden-table_169016-49051.jpg",
|
||||
alt: "User avatar 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Trusted by 5,000+ teams worldwide"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Seamless Workflow Triggers",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Real-time Data Sync",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Advanced Productivity Analytics",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Enterprise-Grade Security",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Unified Team Collaboration",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
title="Work smarter. Automate the rest."
|
||||
description="Streamline workflows, cut manual tasks by 70%, and free your team to focus on what matters. Join 5,000 companies saving 20 hours weekly."
|
||||
background={{ variant: "plain" }}
|
||||
buttons={[{ text: "Start Free Trial", href: "#" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/computer-dark-room-with-graphs-screen_169016-55085.jpg?_wi=1"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"TechCorp",
|
||||
"InnovateLab",
|
||||
"GrowthCo",
|
||||
"StartupXYZ",
|
||||
"DataSystems",
|
||||
"CloudBridge",
|
||||
"NexusOps",
|
||||
]}
|
||||
title="Trusted by 5,000+ industry leaders"
|
||||
description="Empowering operations teams worldwide with efficient automation."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Transparent pricing"
|
||||
description="Simple, flexible plans with no hidden fees."
|
||||
plans={[
|
||||
{ id: "basic", badge: "Starter", price: "$49", subtitle: "Best for growing teams", features: ["10 automations/mo", "Basic analytics"] },
|
||||
{ id: "pro", badge: "Pro", price: "$129", subtitle: "Best for scale", features: ["Unlimited automations", "Advanced analytics"] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Engineered for mid-market scale"
|
||||
description="Our software bridges the gap between complex operations and simple, effective automation. Designed for teams of 50-500, we prioritize ease of adoption and immediate ROI."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/aerial-view-african-descent-woman-working-computer-white-table-office_53876-31173.jpg?_wi=1"
|
||||
imageAlt="Product overview workspace"
|
||||
/>
|
||||
</div>
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardSix
|
||||
title="Meet our experts"
|
||||
description="The team building the future of automation."
|
||||
animationType="slide-up"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{ id: "m1", name: "Sarah Johnson", role: "CEO" },
|
||||
{ id: "m2", name: "Michael Chen", role: "CTO" },
|
||||
{ id: "m3", name: "Emily Rodriguez", role: "Head of Ops" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwelve
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "feat1",
|
||||
label: "Automation",
|
||||
title: "Smart Workflow Triggers",
|
||||
items: [
|
||||
"Custom trigger setup",
|
||||
"Automatic task routing",
|
||||
"Real-time updates",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "feat2",
|
||||
label: "Efficiency",
|
||||
title: "Productivity Analytics",
|
||||
items: [
|
||||
"Actionable insights",
|
||||
"Team performance tracking",
|
||||
"Bottleneck identification",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "feat3",
|
||||
label: "Integration",
|
||||
title: "Seamless Integrations",
|
||||
items: [
|
||||
"CRM syncing",
|
||||
"Cloud storage sync",
|
||||
"Slack & Teams alerts",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Powerful automation tools"
|
||||
description="Everything your operations team needs to excel."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardFourteen
|
||||
useInvertedBackground={false}
|
||||
title="Real-world impact"
|
||||
tag="Performance"
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "70%",
|
||||
description: "Manual task reduction",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "20 hrs",
|
||||
description: "Hours saved weekly",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "5,000+",
|
||||
description: "Active global companies",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "basic",
|
||||
badge: "Starter",
|
||||
price: "$49",
|
||||
subtitle: "Best for growing teams",
|
||||
features: [
|
||||
"10 automations/mo",
|
||||
"Basic analytics",
|
||||
"Standard support",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "pro",
|
||||
badge: "Pro",
|
||||
price: "$129",
|
||||
subtitle: "Best for scale",
|
||||
features: [
|
||||
"Unlimited automations",
|
||||
"Advanced analytics",
|
||||
"24/7 priority support",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "enterprise",
|
||||
badge: "Enterprise",
|
||||
price: "Custom",
|
||||
subtitle: "For large operations",
|
||||
features: [
|
||||
"Custom integrations",
|
||||
"Dedicated success manager",
|
||||
"Advanced security",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Transparent pricing"
|
||||
description="Simple, flexible plans with no hidden fees."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah Johnson",
|
||||
date: "2024",
|
||||
title: "Operations Lead",
|
||||
quote: "AutoFlow changed the game for our daily productivity.",
|
||||
tag: "Operations",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/business-woman-green-suit-using-phone-outside-street_1303-29546.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/computer-dark-room-with-graphs-screen_169016-55085.jpg?_wi=2",
|
||||
imageAlt: "professional business leader portrait studio lighting",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Michael Chen",
|
||||
date: "2024",
|
||||
title: "CTO",
|
||||
quote: "The ROI on this automation is absolutely incredible.",
|
||||
tag: "Tech",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-business-woman-office-by-window_1303-21128.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/aerial-view-african-descent-woman-working-computer-white-table-office_53876-31173.jpg?_wi=2",
|
||||
imageAlt: "professional business leader portrait studio lighting",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Emily Rodriguez",
|
||||
date: "2024",
|
||||
title: "Director",
|
||||
quote: "A truly user-friendly platform that delivers results.",
|
||||
tag: "Marketing",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/smiling-mature-businessman-standing-front-his-colleagues-workplace_23-2147900015.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-cheerful-man-classic-black-suit-white-shirt-with-wireless-earphones-happily-lookingin-camera-with-laptop-hands-while-spending-time-outdoor_574295-5776.jpg",
|
||||
imageAlt: "professional business leader portrait studio lighting",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David Kim",
|
||||
date: "2024",
|
||||
title: "Product Manager",
|
||||
quote: "Seamless integration and immediate team impact.",
|
||||
tag: "Product",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/content-beautiful-businesswoman-standing-window_1262-1778.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/network-analyst-studying-digital-commerce-progression-reports-computer_482257-126389.jpg",
|
||||
imageAlt: "professional business leader portrait studio lighting",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Jessica Lee",
|
||||
date: "2024",
|
||||
title: "Team Lead",
|
||||
quote: "Finally, an automation tool that actually works.",
|
||||
tag: "Growth",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/man-trading-browsing-online-stock-investments-night_169016-57448.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/computer-dark-room-with-graphs-screen_169016-57447.jpg",
|
||||
imageAlt: "professional business leader portrait studio lighting",
|
||||
},
|
||||
]}
|
||||
title="Loved by operations managers"
|
||||
description="See why 5,000+ businesses switched to AutoFlow."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Is there a free trial?",
|
||||
content: "Yes, we offer a 14-day free trial on all plans.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Can I upgrade anytime?",
|
||||
content: "Absolutely, you can upgrade, downgrade, or cancel whenever needed.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Is customer support included?",
|
||||
content: "Yes, all plans include email support, with priority support for Pro and Enterprise.",
|
||||
},
|
||||
]}
|
||||
title="Common questions"
|
||||
description="Everything you need to know about AutoFlow."
|
||||
faqsAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/office-desk-with-computer-digital-tablet-mobile-phone_1252-898.jpg"
|
||||
imageAlt="FAQ documentation setup"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Get Started"
|
||||
title="Ready to transform your workflow?"
|
||||
description="Start your 14-day free trial and experience the AutoFlow difference."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="AutoFlow © 2024"
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="AutoFlow © 2024"
|
||||
columns={[
|
||||
{ title: "Product", items: [{ label: "Features", href: "#" }, { label: "Pricing", href: "#" }] },
|
||||
{ title: "Company", items: [{ label: "About", href: "#" }, { label: "Careers", href: "#" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user