Files
46f248b8-a25d-4cb5-a8f8-608…/src/app/page.tsx
2026-03-27 11:23:43 +00:00

208 lines
8.4 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import { ShieldCheck, Users, Zap } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="shift-hover"
defaultTextAnimation="background-highlight"
borderRadius="rounded"
contentWidth="mediumLarge"
sizing="mediumLargeSizeLargeTitles"
background="aurora"
cardStyle="inset"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Features", id: "features"},
{
name: "Pricing", id: "pricing"},
{
name: "About", id: "about"},
{
name: "Contact", id: "contact"},
]}
brandName="TeamUp"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplit
background={{
variant: "plain"}}
title="Connect With Professional Video Editors"
description="Hire skilled video editors or find clients for your editing services. Build your portfolio, grow your income, and collaborate seamlessly—all in one platform."
buttons={[
{
text: "Hire an Editor", href: "#"},
{
text: "Join as Editor", href: "#"},
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BWh3hiRS0N7XFyMRW0mRhVdZrx/a-high-tech-video-editing-interface-on-m-1774610578769-5e8d3fdf.png"
imageAlt="Editing Studio"
mediaAnimation="blur-reveal"
/>
</div>
<div id="features" data-section="features">
<FeatureHoverPattern
animationType="blur-reveal"
textboxLayout="split"
useInvertedBackground={true}
features={[
{
icon: Users,
title: "Vetted Talent Pool", description: "Connect with pre-screened professionals experienced in high-quality content production."},
{
icon: ShieldCheck,
title: "Secure Payments", description: "Escrow-based payment systems ensuring work is delivered and creators are protected."},
{
icon: Zap,
title: "Fast Turnaround", description: "Streamlined collaboration workflows and built-in project management tools."},
]}
title="Why Choose TeamUp?"
description="The complete ecosystem designed for modern video production and talent collaboration."
/>
</div>
<div id="about" data-section="about">
<MetricCardSeven
animationType="blur-reveal"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{
id: "1", value: "10k+", title: "Verified Editors", items: [
"Specialized in YouTube", "Agency Ready", "Global Access"],
},
{
id: "2", value: "500k+", title: "Projects Completed", items: [
"Successful Deliveries", "Content Optimized", "Satisfied Creators"],
},
{
id: "3", value: "24/7", title: "Global Support", items: [
"Always Online", "Quick Response", "Seamless Edits"],
},
]}
title="Scale With Confidence"
description="Data-driven results for creators and agencies scaling their video operations."
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardOne
animationType="depth-3d"
textboxLayout="default"
useInvertedBackground={true}
plans={[
{
id: "starter", badge: "Starter", price: "$29", subtitle: "Perfect for solo creators starting their journey.", features: [
"3 Projects / month", "Basic Messaging", "Standard Support"],
},
{
id: "pro", badge: "Pro", price: "$99", subtitle: "Best for growing channels and professional editors.", features: [
"Unlimited Projects", "Priority Messaging", "Advanced Search", "Profile Boosting"],
},
{
id: "agency", badge: "Agency", price: "$249", subtitle: "Advanced features for production houses and brands.", features: [
"Unlimited Projects", "Dedicated Support", "API Access", "Bulk Project Tools"],
},
]}
title="Flexible Membership Tiers"
description="Choose the right plan to scale your editing career or content production output."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwelve
useInvertedBackground={false}
testimonials={[
{
id: "1", name: "Sarah Johnson", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BWh3hiRS0N7XFyMRW0mRhVdZrx/close-up-abstract-video-editing-footage--1774610578048-404a2e51.png"},
{
id: "2", name: "Michael Chen", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BWh3hiRS0N7XFyMRW0mRhVdZrx/abstract-dark-waveform-digital-visualiza-1774610580089-4b36e2d1.png"},
{
id: "3", name: "Emily Rodriguez", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BWh3hiRS0N7XFyMRW0mRhVdZrx/glowing-digital-creative-workspace-backg-1774610579463-b457e638.png"},
{
id: "4", name: "David Kim", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BWh3hiRS0N7XFyMRW0mRhVdZrx/abstract-cinematic-light-streaks-over-a--1774610578472-e377b75d.png"},
]}
cardTitle="Loved by Creators"
cardAnimation="blur-reveal"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={true}
title="Get Started Today"
description="Ready to scale your production? Let's talk about your requirements."
inputs={[
{
name: "name", type: "text", placeholder: "Your Name"},
{
name: "email", type: "email", placeholder: "Email Address"},
]}
textarea={{
name: "message", placeholder: "Tell us about your needs..."}}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BWh3hiRS0N7XFyMRW0mRhVdZrx/a-sleek-dark-theme-support-dashboard-ui--1774610578818-e4aeef37.png"
mediaAnimation="blur-reveal"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
columns={[
{
title: "Product", items: [
{
label: "Features", href: "#features"},
{
label: "Pricing", href: "#pricing"},
{
label: "Support", href: "#contact"},
],
},
{
title: "Company", items: [
{
label: "About Us", href: "#about"},
{
label: "Careers", href: "#"},
{
label: "Contact", href: "#contact"},
],
},
{
title: "Legal", items: [
{
label: "Privacy", href: "#"},
{
label: "Terms", href: "#"},
],
},
]}
copyrightText="© 2024 TeamUp Marketplace. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}