286 lines
13 KiB
TypeScript
286 lines
13 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
|
import TimelineProcessFlow from '@/components/cardStack/layouts/timelines/TimelineProcessFlow';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-bubble"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="rounded"
|
|
contentWidth="mediumLarge"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="blurBottom"
|
|
cardStyle="gradient-radial"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="bold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{
|
|
name: "Dashboard", id: "hero"},
|
|
{
|
|
name: "Features", id: "features"},
|
|
{
|
|
name: "Sync", id: "sync"},
|
|
{
|
|
name: "Stats", id: "metrics"},
|
|
{
|
|
name: "FAQ", id: "faq"},
|
|
]}
|
|
brandName="FinanceAI"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardTestimonial
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
title="Master Your Finances with AI Precision"
|
|
description="Simplify your income, expenses, and tax tracking. Reach your net worth goals faster with smart weekly planning."
|
|
testimonials={[
|
|
{
|
|
name: "John Doe", handle: "@johndoe", testimonial: "Finally, a tool that makes budgeting easier than Excel.", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6egcxc"},
|
|
{
|
|
name: "Jane Smith", handle: "@janesmith", testimonial: "I love the weekly goal tracking features.", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=4439ee"},
|
|
{
|
|
name: "Mark Wilson", handle: "@markw", testimonial: "Tax estimation has never been this simple.", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=1f8owv"},
|
|
{
|
|
name: "Sarah Lee", handle: "@sarahlee", testimonial: "Excellent for keeping track of my side income.", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=yd5wxz"},
|
|
{
|
|
name: "Mike Ross", handle: "@miker", testimonial: "Transformed my financial health in weeks.", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=t6ayxc"},
|
|
]}
|
|
buttons={[
|
|
{
|
|
text: "Get Started", href: "#"},
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wvltvz"
|
|
avatars={[
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wvltvz", alt: "portrait professional man"},
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=frkt2q", alt: "portrait businesswoman"},
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=v6o3n5", alt: "portrait mid-age professional"},
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3xo6kp", alt: "portrait adult worker"},
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=yv6arb", alt: "portrait startup founder"},
|
|
]}
|
|
marqueeItems={[
|
|
{
|
|
type: "text", text: "AI Tax Assistance"},
|
|
{
|
|
type: "text", text: "Real-time Net Worth"},
|
|
{
|
|
type: "text", text: "Weekly Goal Progress"},
|
|
{
|
|
type: "text", text: "Expense Categorization"},
|
|
{
|
|
type: "text", text: "Portfolio Analysis"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextSplitAbout
|
|
useInvertedBackground={false}
|
|
title="Your Financial Control Center"
|
|
description={[
|
|
"Replace complex Excel files with an intuitive dashboard.", "AI-driven tax calculations tailored to your side income.", "Clear visualization of your net worth and progress."]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardNineteen
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
tag: "Automated", title: "Tax Advisor AI", subtitle: "Always accurate", description: "Calculate taxes on additional income automatically.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=v6o3n5"},
|
|
{
|
|
tag: "Wealth", title: "Net Worth Tracking", subtitle: "Visual growth", description: "Real-time updates on your assets and liabilities.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3xo6kp"},
|
|
{
|
|
tag: "Productivity", title: "Weekly Goal Planner", subtitle: "Stay on track", description: "Set and monitor up to 5 habits per week.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=yv6arb"},
|
|
]}
|
|
title="Smart Features for Growth"
|
|
description="Powerful tools to manage your money efficiently."
|
|
/>
|
|
</div>
|
|
|
|
<div id="sync" data-section="sync">
|
|
<TimelineProcessFlow
|
|
title="Mi Band Data Synchronization"
|
|
description="Connect your wearable device to automatically import activity data and synchronize your health metrics with your financial dashboard for holistic lifestyle tracking."
|
|
textboxLayout="split"
|
|
animationType="slide-up"
|
|
items={[
|
|
{
|
|
content: "Pair your Mi Band device via Bluetooth to establish a secure, encrypted connection to your dashboard.", media: null,
|
|
reverse: false
|
|
},
|
|
{
|
|
content: "Enable API background syncing to allow real-time health data ingestion, ensuring your fitness goals update daily.", media: null,
|
|
reverse: true
|
|
},
|
|
{
|
|
content: "Track integrated metrics, correlating your physical activity levels with your overall well-being and productivity goals.", media: null,
|
|
reverse: false
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardSeven
|
|
animationType="depth-3d"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{
|
|
id: "m1", value: "$125k", title: "Net Worth", items: [
|
|
"Assets", "Liabilities", "Growth"],
|
|
},
|
|
{
|
|
id: "m2", value: "85%", title: "Budget Efficiency", items: [
|
|
"Income", "Expense", "Savings"],
|
|
},
|
|
{
|
|
id: "m3", value: "5/5", title: "Weekly Goals", items: [
|
|
"Target", "Completed", "Status"],
|
|
},
|
|
]}
|
|
title="Financial Insights"
|
|
description="High-level overview of your economic performance."
|
|
/>
|
|
</div>
|
|
|
|
<div id="product" data-section="product">
|
|
<ProductCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="bento-grid"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{
|
|
id: "p1", brand: "Module", name: "Expense Entry", price: "Free", rating: 5,
|
|
reviewCount: "100+", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ggo46i"},
|
|
{
|
|
id: "p2", brand: "Module", name: "Portfolio View", price: "Pro", rating: 5,
|
|
reviewCount: "200+", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=mwhtid"},
|
|
{
|
|
id: "p3", brand: "Module", name: "Tax Engine", price: "Pro", rating: 5,
|
|
reviewCount: "150+", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=gylugf"},
|
|
{
|
|
id: "p4", brand: "Module", name: "Categorization", price: "Free", rating: 5,
|
|
reviewCount: "300+", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=dgwoi4"},
|
|
{
|
|
id: "p5", brand: "Module", name: "Goal Tracker", price: "Free", rating: 5,
|
|
reviewCount: "500+", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=h4b7xx"},
|
|
{
|
|
id: "p6", brand: "Module", name: "Net Worth Calculator", price: "Pro", rating: 5,
|
|
reviewCount: "400+", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=4j0zp8"},
|
|
]}
|
|
title="Core Modules"
|
|
description="Specific tools for your daily financial needs."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonial" data-section="testimonial">
|
|
<TestimonialCardSixteen
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "t1", name: "Sarah Lee", role: "User", company: "Growth", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=nfdq4v"},
|
|
{
|
|
id: "t2", name: "Mike Ross", role: "User", company: "Finance", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o9pv7r"},
|
|
{
|
|
id: "t3", name: "Jane Doe", role: "User", company: "Tech", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=u603oq"},
|
|
{
|
|
id: "t4", name: "Tom White", role: "User", company: "Dev", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=cvhug7"},
|
|
{
|
|
id: "t5", name: "Anna Green", role: "User", company: "Consult", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3tcy83"},
|
|
]}
|
|
kpiItems={[
|
|
{
|
|
value: "10k+", label: "Active Users"},
|
|
{
|
|
value: "50M+", label: "Transactions"},
|
|
{
|
|
value: "99%", label: "Accuracy"},
|
|
]}
|
|
title="Trusted by Users"
|
|
description="See why others choose our platform for financial freedom."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "f1", title: "How do I calculate net worth?", content: "Our platform aggregates your assets and liabilities automatically."},
|
|
{
|
|
id: "f2", title: "Is my financial data safe?", content: "Yes, we use military-grade encryption for all user data."},
|
|
{
|
|
id: "f3", title: "Can I track tax for side income?", content: "Absolutely, the tax advisor module handles multiple income streams."},
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=0ly58s"
|
|
mediaAnimation="slide-up"
|
|
title="Frequently Asked"
|
|
description="Answers to common questions about our platform."
|
|
faqsAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactText
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
text="Ready to take control of your financial future?"
|
|
buttons={[
|
|
{
|
|
text: "Start Now", href: "#"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="FinanceAI"
|
|
copyrightText="© 2025 | FinanceAI Tools"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |