303 lines
11 KiB
TypeScript
303 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import BlogCardThree from '@/components/sections/blog/BlogCardThree';
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-shift"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="pill"
|
|
contentWidth="small"
|
|
sizing="mediumSizeLargeTitles"
|
|
background="floatingGradient"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="normal"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{
|
|
name: "Features",
|
|
id: "features",
|
|
},
|
|
{
|
|
name: "Testimonials",
|
|
id: "testimonials",
|
|
},
|
|
{
|
|
name: "Blog",
|
|
id: "blog",
|
|
},
|
|
{
|
|
name: "Contact",
|
|
id: "contact",
|
|
},
|
|
]}
|
|
brandName="WorkflowPro"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitDualMedia
|
|
background={{
|
|
variant: "plain",
|
|
}}
|
|
title="Work Smarter, Not Harder—Anywhere"
|
|
description="Our intuitive mobile app streamlines your daily workflow with powerful features designed for modern teams. Start free today and experience the difference."
|
|
tag="Trusted by 5,000+ teams worldwide"
|
|
buttons={[
|
|
{
|
|
text: "Download App Now",
|
|
href: "#download",
|
|
},
|
|
{
|
|
text: "See How It Works",
|
|
href: "#features",
|
|
},
|
|
]}
|
|
mediaItems={[
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-male-hand-holding-smartphone-with-black-friday-discount-coupon-while-paying-purchases-checkout-cashier-scanning-promotional-promo-code-displayed-consumer-mobile-device_482257-69278.jpg?_wi=1",
|
|
imageAlt: "Mobile App Dashboard",
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/man-controlling-smart-lamp-with-his-phone_23-2149036884.jpg?_wi=1",
|
|
imageAlt: "App UI Widgets",
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/minimalist-white-smartphone-design-white-background_187299-46485.jpg?_wi=1",
|
|
imageAlt: "Collaboration View",
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/top-view-smartphone-desk-with-coffee-cup-notebook_23-2149404181.jpg?_wi=1",
|
|
imageAlt: "Calendar Management",
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169842.jpg?_wi=1",
|
|
imageAlt: "Analytics Dashboard",
|
|
},
|
|
]}
|
|
mediaAnimation="slide-up"
|
|
rating={5}
|
|
ratingText="Rated 4.9/5 by global industry experts"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardNineteen
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
tag: "Collaboration",
|
|
title: "Team-first Workflows",
|
|
subtitle: "Real-time sync",
|
|
description: "Collaborate seamlessly across devices with real-time syncing that ensures everyone is always on the same page.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/minimalist-white-smartphone-design-white-background_187299-46485.jpg?_wi=2",
|
|
},
|
|
{
|
|
tag: "Organization",
|
|
title: "Smart Scheduling",
|
|
subtitle: "AI-powered tasks",
|
|
description: "Automate your daily schedule with our AI assistant that prioritizes tasks based on your productivity patterns.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/top-view-smartphone-desk-with-coffee-cup-notebook_23-2149404181.jpg?_wi=2",
|
|
},
|
|
{
|
|
tag: "Insights",
|
|
title: "Performance Analytics",
|
|
subtitle: "Detailed reports",
|
|
description: "Gain deep insights into your team's workflow and identify bottlenecks with visual reports that show you what matters.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169842.jpg?_wi=2",
|
|
},
|
|
]}
|
|
title="Built for Maximum Efficiency"
|
|
description="Streamline your workflow with tools designed specifically for the pace of modern business."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFive
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
name: "Sarah Johnson",
|
|
date: "Jan 2025",
|
|
title: "Product Lead",
|
|
quote: "This app changed my daily workflow completely.",
|
|
tag: "Verified",
|
|
avatarSrc: "http://img.b2bpic.net/free-photo/close-up-positive-businesswoman_1098-3531.jpg",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-male-hand-holding-smartphone-with-black-friday-discount-coupon-while-paying-purchases-checkout-cashier-scanning-promotional-promo-code-displayed-consumer-mobile-device_482257-69278.jpg?_wi=2",
|
|
imageAlt: "mobile app ui mockup dark mode",
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "Michael Chen",
|
|
date: "Dec 2024",
|
|
title: "CEO",
|
|
quote: "The best productivity app for startups.",
|
|
tag: "Verified",
|
|
avatarSrc: "http://img.b2bpic.net/free-photo/woman-artist-holds-painting-brushes-gray-high-quality-photo_114579-63496.jpg",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/man-controlling-smart-lamp-with-his-phone_23-2149036884.jpg?_wi=2",
|
|
imageAlt: "mobile app 3d UI floating elements",
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Emily Rodriguez",
|
|
date: "Nov 2024",
|
|
title: "Developer",
|
|
quote: "I love the clean, intuitive interface.",
|
|
tag: "Verified",
|
|
avatarSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-man-using-tablet-street-cafe_1262-19056.jpg",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/minimalist-white-smartphone-design-white-background_187299-46485.jpg?_wi=3",
|
|
imageAlt: "team collaboration mobile interface dark",
|
|
},
|
|
{
|
|
id: "4",
|
|
name: "David Kim",
|
|
date: "Oct 2024",
|
|
title: "Manager",
|
|
quote: "Essential tool for our remote team.",
|
|
tag: "Verified",
|
|
avatarSrc: "http://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/top-view-smartphone-desk-with-coffee-cup-notebook_23-2149404181.jpg?_wi=3",
|
|
imageAlt: "calendar schedule app ui mobile",
|
|
},
|
|
{
|
|
id: "5",
|
|
name: "Anna V.",
|
|
date: "Sept 2024",
|
|
title: "Designer",
|
|
quote: "Beautiful design and really powerful features.",
|
|
tag: "Verified",
|
|
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-smart-brunette-glasses-street-with-interesting-architecture-background_613910-14022.jpg",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169842.jpg?_wi=3",
|
|
imageAlt: "data visualization app dashboard",
|
|
},
|
|
]}
|
|
title="Loved by Professionals"
|
|
description="See why top teams trust our mobile application to get more done in less time."
|
|
/>
|
|
</div>
|
|
|
|
<div id="blog" data-section="blog">
|
|
<BlogCardThree
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
title="Insights & Productivity Tips"
|
|
description="Explore our blog for helpful tips, tricks, and insights on mastering your workflow."
|
|
blogs={[
|
|
{
|
|
id: "1",
|
|
category: "Productivity",
|
|
title: "Mastering the Remote Workflow",
|
|
excerpt: "Essential tips for staying productive while working from home.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/top-view-laptop-coffee-table_23-2147625102.jpg",
|
|
authorName: "Jane Doe",
|
|
authorAvatar: "http://img.b2bpic.net/free-photo/close-up-positive-businesswoman_1098-3531.jpg",
|
|
date: "Jan 12, 2025",
|
|
},
|
|
{
|
|
id: "2",
|
|
category: "Tech",
|
|
title: "The Future of Team Sync",
|
|
excerpt: "How new technologies are changing the way teams collaborate daily.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/view-desk-items-arrangement_23-2148975774.jpg",
|
|
authorName: "John Smith",
|
|
authorAvatar: "http://img.b2bpic.net/free-photo/woman-artist-holds-painting-brushes-gray-high-quality-photo_114579-63496.jpg",
|
|
date: "Dec 28, 2024",
|
|
},
|
|
{
|
|
id: "3",
|
|
category: "Design",
|
|
title: "Designing Intuitive Mobile Interfaces",
|
|
excerpt: "A deep dive into our design process for the WorkflowPro app.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/3d-geometric-abstract-twist-background_1048-17488.jpg",
|
|
authorName: "Emma Wilson",
|
|
authorAvatar: "http://img.b2bpic.net/free-photo/smiling-middle-aged-man-using-tablet-street-cafe_1262-19056.jpg",
|
|
date: "Dec 15, 2024",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "plain",
|
|
}}
|
|
tag="Join Now"
|
|
title="Start Your Productivity Journey Today"
|
|
description="Join thousands of professionals already working smarter. Sign up for free and get started instantly."
|
|
imageSrc="http://img.b2bpic.net/free-photo/layers-black-torn-paper_23-2148748898.jpg"
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
imageSrc="http://img.b2bpic.net/free-photo/close-up-male-hand-holding-smartphone-with-black-friday-discount-coupon-while-paying-purchases-checkout-cashier-scanning-promotional-promo-code-displayed-consumer-mobile-device_482257-69278.jpg?_wi=3"
|
|
logoText="WorkflowPro"
|
|
columns={[
|
|
{
|
|
title: "Product",
|
|
items: [
|
|
{
|
|
label: "Features",
|
|
href: "#features",
|
|
},
|
|
{
|
|
label: "Pricing",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Company",
|
|
items: [
|
|
{
|
|
label: "About",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "Blog",
|
|
href: "#blog",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Legal",
|
|
items: [
|
|
{
|
|
label: "Privacy",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "Terms",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|