209 lines
9.6 KiB
TypeScript
209 lines
9.6 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
|
|
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
|
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
|
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
|
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
|
import { BarChart2, ShieldCheck, Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-magnetic"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="small"
|
|
sizing="medium"
|
|
background="floatingGradient"
|
|
cardStyle="glass-depth"
|
|
primaryButtonStyle="primary-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="light"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
navItems={[
|
|
{
|
|
name: "Features", id: "features"},
|
|
{
|
|
name: "Metrics", id: "metrics"},
|
|
{
|
|
name: "Pricing", id: "pricing"},
|
|
]}
|
|
brandName="TradePulse"
|
|
button={{
|
|
text: "Get Started", href: "#contact"}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardRotatedCarousel
|
|
background={{
|
|
variant: "rotated-rays-animated"}}
|
|
title="Master Your Trading Performance"
|
|
description="Log, analyze, and optimize every trade with automated logging—the ultimate platform built for serious traders who value precision, data, and edge."
|
|
buttons={[
|
|
{
|
|
text: "Start Journaling", href: "#contact"},
|
|
]}
|
|
carouselItems={[
|
|
{
|
|
id: "c1", imageSrc: "http://img.b2bpic.net/free-photo/desktop-pc-wooden-desk-showcases-infographics-client-reach-data_482257-126353.jpg", imageAlt: "Dashboard overview"},
|
|
{
|
|
id: "c2", imageSrc: "http://img.b2bpic.net/free-photo/person-looking-finance-graphs_52683-116600.jpg", imageAlt: "Chart analysis"},
|
|
{
|
|
id: "c3", imageSrc: "http://img.b2bpic.net/free-photo/closeup-african-american-entrepreneur-analyzing-company-profit_482257-20207.jpg", imageAlt: "Risk monitoring"},
|
|
{
|
|
id: "c4", imageSrc: "http://img.b2bpic.net/free-photo/digital-tablet-online-learning_53876-97299.jpg", imageAlt: "Performance tracking"},
|
|
{
|
|
id: "c5", imageSrc: "http://img.b2bpic.net/free-photo/computer-dark-room-with-graphs-screen_169016-54998.jpg", imageAlt: "Trade log"},
|
|
{
|
|
id: "c6", imageSrc: "http://img.b2bpic.net/free-photo/tablet-showing-financial-data-with-coffee_23-2152020633.jpg", imageAlt: "Strategy report"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardFourteen
|
|
useInvertedBackground={true}
|
|
title="Data That Moves Markets"
|
|
tag="Performance Stats"
|
|
metrics={[
|
|
{
|
|
id: "m1", value: "12,000+", description: "Trades Logged Daily"},
|
|
{
|
|
id: "m2", value: "45%", description: "Avg. Growth Rate"},
|
|
{
|
|
id: "m3", value: "99.9%", description: "Data Reliability"},
|
|
]}
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureBorderGlow
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
icon: BarChart2,
|
|
title: "Advanced Analytics", description: "Break down your performance with custom charts, P&L reporting, and asset allocation insights."},
|
|
{
|
|
icon: ShieldCheck,
|
|
title: "Risk Management", description: "Set dynamic position sizing rules and track your risk-to-reward ratios seamlessly."},
|
|
{
|
|
icon: Zap,
|
|
title: "Real-time Sync", description: "Connect your broker accounts for instant trade logging and automated journal updates."},
|
|
]}
|
|
title="Engineered for Growth"
|
|
description="Sophisticated tools designed to turn every trade into a learning opportunity and build your long-term success."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSix
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={true}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Alex Rivet", handle: "@alexr", testimonial: "The best trading journal I've used. My win rate improved significantly after just three months.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-businessman-cartoon-style_23-2151134089.jpg"},
|
|
{
|
|
id: "2", name: "Jordan Lee", handle: "@jlee", testimonial: "Game changer. The analytics engine is precise and actually helps me identify my emotional trading mistakes.", imageSrc: "http://img.b2bpic.net/free-photo/happy-girl-with-coffee-hands-emotion-concept-emotion-happiness_169016-66303.jpg"},
|
|
{
|
|
id: "3", name: "Morgan F.", handle: "@mf_trade", testimonial: "Solid platform. Clean UI and extremely fast synchronization with my broker.", imageSrc: "http://img.b2bpic.net/free-photo/bearded-stock-market-trader-looking-camera-with-hands-crossed_482257-30734.jpg"},
|
|
{
|
|
id: "4", name: "Casey Day", handle: "@casey", testimonial: "Data-driven trading is now possible for me. Highly recommended for full-time traders.", imageSrc: "http://img.b2bpic.net/free-photo/joyous-photographer-creative-agency-studio-adjusting-images_482257-121827.jpg"},
|
|
{
|
|
id: "5", name: "Sam Taylor", handle: "@st_invest", testimonial: "The risk management features have kept me profitable during volatile market swings.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-entrepreneur-showing-bitcoin-while-sitting-desk-with-laptop-computer-isolated-black_231208-11151.jpg"},
|
|
]}
|
|
title="Voices of the Market"
|
|
description="Join thousands of traders who are leveling up their strategy with TradePulse."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqDouble
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "f1", title: "Does this work with my broker?", content: "We support over 50 major brokerage platforms. Check our list to see if your account is compatible."},
|
|
{
|
|
id: "f2", title: "Is my data secure?", content: "Absolutely. We use enterprise-grade encryption to ensure your financial and trade data is private and secure."},
|
|
{
|
|
id: "f3", title: "Can I export my data?", content: "Yes, you can export your entire trading history to CSV or Excel at any time."},
|
|
]}
|
|
title="Frequently Asked Questions"
|
|
description="Everything you need to know about getting started with TradePulse."
|
|
faqsAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardEight
|
|
animationType="scale-rotate"
|
|
textboxLayout="split"
|
|
useInvertedBackground={true}
|
|
plans={[
|
|
{
|
|
id: "basic", badge: "Entry", price: "$19/mo", subtitle: "Essential Tools for Growth", buttons: [
|
|
{
|
|
text: "Get Started", href: "#"},
|
|
],
|
|
features: [
|
|
"Basic journal", "Daily analytics", "Community access"],
|
|
},
|
|
{
|
|
id: "pro", badge: "Elite", price: "$49/mo", subtitle: "Advanced Insights for Pro Traders", buttons: [
|
|
{
|
|
text: "Go Pro", href: "#"},
|
|
],
|
|
features: [
|
|
"Advanced reports", "Automated broker sync", "Priority support"],
|
|
},
|
|
]}
|
|
title="Flexible Pricing Plans"
|
|
description="Choose the right plan to fuel your trading journey."
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
useInvertedBackground={false}
|
|
title="Ready to get ahead?"
|
|
description="Join the waitlist or send us a request for a custom demo."
|
|
inputs={[
|
|
{
|
|
name: "name", type: "text", placeholder: "Your Name", required: true,
|
|
},
|
|
{
|
|
name: "email", type: "email", placeholder: "Your Email", required: true,
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/empty-business-office-with-cubicles-used-organizational-activity-efficiency_482257-125625.jpg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoReveal
|
|
logoText="TradePulse"
|
|
leftLink={{
|
|
text: "Privacy Policy", href: "#"}}
|
|
rightLink={{
|
|
text: "Terms of Service", href: "#"}}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |