Files
846b52f9-e191-4e54-8b97-d36…/src/app/page.tsx
2026-04-20 03:05:06 +00:00

416 lines
12 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import { ShieldCheck, TrendingUp, Zap } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-magnetic"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="mediumLarge"
sizing="largeSizeMediumTitles"
background="none"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="bold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Features",
id: "features",
},
{
name: "Templates",
id: "products",
},
{
name: "Pricing",
id: "pricing",
},
{
name: "Testimonials",
id: "testimonials",
},
]}
brandName="SwiftPayout"
button={{
text: "Get Started",
href: "#contact",
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroLogoBillboard
background={{
variant: "gradient-bars",
}}
logoText="Launch Your Crypto Website in 60 Seconds"
description="The ultimate high-conversion engine for crypto vendors, gift card traders & USDT exchangers. Build trust, scale your business, and get paid instantly."
buttons={[
{
text: "Generate My Website",
href: "#contact",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/empty-workspace-desktop-running-day-trading-stock-market-trends_482257-126997.jpg"
imageAlt="SwiftPayout Platform Dashboard Preview"
mediaAnimation="slide-up"
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardThree
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
metrics={[
{
id: "m1",
icon: Zap,
title: "Launch Time",
value: "60s",
},
{
id: "m2",
icon: TrendingUp,
title: "Avg Conversion",
value: "45%",
},
{
id: "m3",
icon: ShieldCheck,
title: "Trusted Vendors",
value: "2.5k+",
},
]}
title="Built for High-Velocity Trading"
description="Engineered for speed, security, and maximum conversion rates in competitive crypto markets."
/>
</div>
<div id="features" data-section="features">
<FeatureCardSixteen
animationType="depth-3d"
textboxLayout="default"
useInvertedBackground={false}
negativeCard={{
items: [
"Complex drag-and-drop builders",
"No crypto-optimized features",
"Slow manual updates",
"Poor mobile conversion rates",
],
}}
positiveCard={{
items: [
"Instant rate updates via AI",
"WhatsApp-first checkout flow",
"Professional escrow trust badges",
"High-conversion rate display widget",
],
}}
title="Why Choose SwiftPayout?"
description="Traditional website builders are slow, complex, and unoptimized. SwiftPayout is a purpose-built engine for high-traffic, high-trust crypto operations."
/>
</div>
<div id="products" data-section="products">
<ProductCardFour
animationType="slide-up"
textboxLayout="split"
gridVariant="two-columns-alternating-heights"
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Gift Card Exchange",
price: "AI-Powered",
variant: "Premium Template",
imageSrc: "http://img.b2bpic.net/free-photo/3d-graph-computer-illustration_23-2151884871.jpg",
},
{
id: "p2",
name: "USDT Exchanger",
price: "AI-Powered",
variant: "Premium Template",
imageSrc: "http://img.b2bpic.net/free-vector/landing-page-template-bank-finance_23-2150500165.jpg",
},
{
id: "p3",
name: "Personal Trader",
price: "AI-Powered",
variant: "Premium Template",
imageSrc: "http://img.b2bpic.net/free-vector/business-landing-page-template-with-photo_52683-19826.jpg",
},
{
id: "p4",
name: "Arbitrage Landing",
price: "AI-Powered",
variant: "Premium Template",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-nutritional-counter-app-composition_23-2149880600.jpg",
},
{
id: "p5",
name: "Crypto Agency",
price: "AI-Powered",
variant: "Premium Template",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443518.jpg",
},
{
id: "p6",
name: "Vendor Portal",
price: "AI-Powered",
variant: "Premium Template",
imageSrc: "http://img.b2bpic.net/free-psd/flat-design-blue-november-template_23-2149818256.jpg",
},
]}
title="Turnkey Business Templates"
description="Select from industry-specialized layouts designed for maximum conversion and credibility in your specific niche."
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardEight
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
plans={[
{
id: "free",
badge: "Starter",
price: "$0",
subtitle: "Perfect for testing the market",
features: [
"1 Landing Page",
"WhatsApp Integration",
"Instant Rate Display",
"SwiftPayout Branding",
],
buttons: [
{
text: "Get Started",
href: "#contact",
},
],
},
{
id: "pro",
badge: "Pro",
price: "$49",
subtitle: "Best for active crypto vendors",
features: [
"Unlimited Sites",
"Custom Domain Support",
"Advanced Analytics",
"Zero Branding",
],
buttons: [
{
text: "Go Pro",
href: "#contact",
},
],
},
{
id: "enterprise",
badge: "Enterprise",
price: "$199",
subtitle: "For established exchange agencies",
features: [
"API Rate Integration",
"Priority Support",
"Custom Webhooks",
"Dedicated Account Manager",
],
buttons: [
{
text: "Contact Sales",
href: "#contact",
},
],
},
]}
title="Start for Free, Scale Profitably"
description="Choose the perfect plan to fuel your exchange growth."
/>
</div>
<div id="socialProof" data-section="socialProof">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
names={[
"BitExchanger",
"GlobalGiftCards",
"USDTNow",
"CryptoScale",
"ExchangeHQ",
"VendorFlow",
"SwiftTrade",
]}
title="Trusted by Market Leaders"
description="Join the fastest growing network of crypto entrepreneurs."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="asymmetric-60-wide-40-narrow"
useInvertedBackground={false}
testimonials={[
{
id: "t1",
name: "Sarah Johnson",
role: "Crypto Trader",
company: "BitExchanger",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/economy-expert-reviewing-financial-data-kpi-dashboards_482257-127132.jpg",
},
{
id: "t2",
name: "Michael Chen",
role: "Vendor",
company: "GlobalGiftCards",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/mature-business-manager-office_1098-21368.jpg",
},
{
id: "t3",
name: "Emily Rodriguez",
role: "Exchanger",
company: "USDTNow",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg",
},
{
id: "t4",
name: "David Kim",
role: "Trader",
company: "CryptoScale",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/financial-department-team-leader-researching-marketing-ideas-while-analyzing-company-expenses-report-startup-project-manager-developing-budget-growth-solutions-while-brainstorming-promoting-strategy_482257-38904.jpg",
},
{
id: "t5",
name: "Alex Smith",
role: "Agency Owner",
company: "ExchangeHQ",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-grey-haired-businessman-standing_74855-10324.jpg",
},
]}
title="Real Results from Crypto Vendors"
description="See why top traders trust us to build their digital presence."
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={false}
title="Launch Your Empire Today"
description="Ready to own your digital real estate? Tell us about your exchange business, and we'll generate your high-converting site in under 60 seconds."
inputs={[
{
name: "name",
type: "text",
placeholder: "Your Name",
},
{
name: "business",
type: "text",
placeholder: "Describe your crypto business",
},
{
name: "whatsapp",
type: "text",
placeholder: "Your WhatsApp Number",
},
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CbUvWHkRROogufvMIIrux0e3dW/uploaded-1776654274075-rl8mysmq.png?_wi=1"
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CbUvWHkRROogufvMIIrux0e3dW/uploaded-1776654274075-rl8mysmq.png?_wi=2"
logoText="SwiftPayout"
columns={[
{
title: "Platform",
items: [
{
label: "Features",
href: "#features",
},
{
label: "Templates",
href: "#products",
},
{
label: "Pricing",
href: "#pricing",
},
],
},
{
title: "Company",
items: [
{
label: "About Us",
href: "#",
},
{
label: "Contact",
href: "#contact",
},
{
label: "Privacy Policy",
href: "#",
},
],
},
{
title: "Resources",
items: [
{
label: "Blog",
href: "#",
},
{
label: "Support",
href: "#",
},
{
label: "Community",
href: "#",
},
],
},
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}