Merge version_1 into main #2
326
src/app/page.tsx
326
src/app/page.tsx
@@ -14,242 +14,112 @@ import { Award, Briefcase, DollarSign, ShieldCheck, Wallet, Zap } from "lucide-r
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="pill"
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "How it Works",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Tasks",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Support",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="TaskEarn"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "How it Works", id: "about" },
|
||||
{ name: "Tasks", id: "features" },
|
||||
{ name: "Support", id: "contact" },
|
||||
]}
|
||||
brandName="TaskEarn"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="Turn Your Free Time Into Extra Income"
|
||||
description="Complete simple, fun tasks and play games on your phone to start earning rewards instantly. Join the community of earners today."
|
||||
buttons={[
|
||||
{
|
||||
text: "Start Earning",
|
||||
href: "#features",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/african-american-accountant-video-call-with-representatives-sharing-insight_482257-124376.jpg?_wi=1"
|
||||
showBlur={true}
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-man-black-suit_23-2148401442.jpg",
|
||||
alt: "Portrait of man in black suit",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-businessman-face-portrait-wearing-suit_53876-148135.jpg",
|
||||
alt: "Smiling businessman face portrait, wearing suit",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/closeup-confident-asian-man-with-arms-crossed_1262-884.jpg",
|
||||
alt: "Closeup of Confident Asian Man with Arms Crossed",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/alone-specialist-handsome-daydreaming-collar_1262-870.jpg",
|
||||
alt: "alone specialist handsome daydreaming collar",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-portrait-cheerful-pretty-young-female-student-with-short-hair-lean-palm-looking-cute-camera-with-happy-smile-sitting-near-computer-use-laptop-mobile-phone-outdoors_197531-22161.jpg",
|
||||
alt: "Close-up portrait of cheerful pretty young female student",
|
||||
},
|
||||
]}
|
||||
avatarText="Join 10,000+ happy earners"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="Turn Your Free Time Into Extra Income"
|
||||
description="Complete simple, fun tasks and play games on your phone to start earning rewards instantly. Join the community of earners today."
|
||||
buttons={[{ text: "Start Earning", href: "#features" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/african-american-accountant-video-call-with-representatives-sharing-insight_482257-124376.jpg"
|
||||
showBlur={true}
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-man-black-suit_23-2148401442.jpg", alt: "Portrait of man in black suit" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/smiling-businessman-face-portrait-wearing-suit_53876-148135.jpg", alt: "Smiling businessman face portrait, wearing suit" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/closeup-confident-asian-man-with-arms-crossed_1262-884.jpg", alt: "Closeup of Confident Asian Man with Arms Crossed" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/alone-specialist-handsome-daydreaming-collar_1262-870.jpg", alt: "alone specialist handsome daydreaming collar" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-portrait-cheerful-pretty-young-female-student-with-short-hair-lean-palm-looking-cute-camera-with-happy-smile-sitting-near-computer-use-laptop-mobile-phone-outdoors_197531-22161.jpg", alt: "Close-up portrait of cheerful pretty young female student" },
|
||||
]}
|
||||
avatarText="Join 10,000+ happy earners"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Why Earn With TaskEarn?"
|
||||
metrics={[
|
||||
{
|
||||
label: "Total Earned",
|
||||
value: "$500,000+",
|
||||
icon: DollarSign,
|
||||
},
|
||||
{
|
||||
label: "Active Tasks",
|
||||
value: "24/7",
|
||||
icon: Award,
|
||||
},
|
||||
{
|
||||
label: "Fast Payouts",
|
||||
value: "Instant",
|
||||
icon: Zap,
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Why Earn With TaskEarn?"
|
||||
metrics={[
|
||||
{ label: "Total Earned", value: "$500,000+", icon: DollarSign },
|
||||
{ label: "Active Tasks", value: "24/7", icon: Award },
|
||||
{ label: "Fast Payouts", value: "Instant", icon: Zap },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Secure Payments",
|
||||
description: "We ensure all your earned rewards are transferred securely to your chosen account.",
|
||||
icon: ShieldCheck,
|
||||
},
|
||||
{
|
||||
title: "Play & Earn",
|
||||
description: "Turn downtime into money by playing your favorite casual games directly in the app.",
|
||||
icon: Briefcase,
|
||||
},
|
||||
{
|
||||
title: "Instant Rewards",
|
||||
description: "Withdraw your earnings the moment you reach the minimum threshold.",
|
||||
icon: Wallet,
|
||||
},
|
||||
]}
|
||||
title="How It Works"
|
||||
description="Getting started is simple. Choose your task, finish it, and get paid."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Secure Payments", description: "We ensure all your earned rewards are transferred securely to your chosen account.", icon: ShieldCheck },
|
||||
{ title: "Play & Earn", description: "Turn downtime into money by playing your favorite casual games directly in the app.", icon: Briefcase },
|
||||
{ title: "Instant Rewards", description: "Withdraw your earnings the moment you reach the minimum threshold.", icon: Wallet },
|
||||
]}
|
||||
title="How It Works"
|
||||
description="Getting started is simple. Choose your task, finish it, and get paid."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alex Rivet",
|
||||
date: "Jan 2024",
|
||||
title: "Gamer",
|
||||
quote: "I've been playing for a week and already earned my first $50. Truly works!",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-black-man-wool-suit_613910-16435.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/african-american-accountant-video-call-with-representatives-sharing-insight_482257-124376.jpg?_wi=2",
|
||||
imageAlt: "man headshot professional portrait",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Maria Silva",
|
||||
date: "Feb 2024",
|
||||
title: "Student",
|
||||
quote: "The easiest way to make pocket money between my classes.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-young-hispanic-male-student-studying-online-courses-writing-down-lecture-making-personal_1258-111887.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-inserting-bitcoin-into-pink-piggy-bank_53876-105929.jpg",
|
||||
imageAlt: "man headshot professional portrait",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Sam K.",
|
||||
date: "Mar 2024",
|
||||
title: "Full-time Earned",
|
||||
quote: "Consistent payouts and great variety of tasks available every single day.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/blond-businessman-with-glasses_1098-57.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/social-media-still-life-items-view_23-2149019278.jpg",
|
||||
imageAlt: "man headshot professional portrait",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Linda P.",
|
||||
date: "Apr 2024",
|
||||
title: "Part-timer",
|
||||
quote: "Finally an app that isn't a scam. The support team is also very responsive.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/enthusiastic-young-woman-celebrating-smiling-raising-hands-up-rejoicing-winning-triumphin_1258-88013.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/time-is-money_1048-1708.jpg",
|
||||
imageAlt: "man headshot professional portrait",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "David W.",
|
||||
date: "May 2024",
|
||||
title: "Gamer",
|
||||
quote: "Simply the best interface I've used. Earning money feels like a game.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/young-happy-african-woman-holding-laptop-hands_1153-9683.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/check-mark-shield-gradient_78370-4409.jpg",
|
||||
imageAlt: "man headshot professional portrait",
|
||||
},
|
||||
]}
|
||||
title="Join Thousands of Earners"
|
||||
description="See why our community loves TaskEarn."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Alex Rivet", date: "Jan 2024", title: "Gamer", quote: "I've been playing for a week and already earned my first $50. Truly works!", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-black-man-wool-suit_613910-16435.jpg", imageSrc: "http://img.b2bpic.net/free-photo/african-american-accountant-video-call-with-representatives-sharing-insight_482257-124376.jpg", imageAlt: "man headshot professional portrait" },
|
||||
{ id: "2", name: "Maria Silva", date: "Feb 2024", title: "Student", quote: "The easiest way to make pocket money between my classes.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-young-hispanic-male-student-studying-online-courses-writing-down-lecture-making-personal_1258-111887.jpg", imageSrc: "http://img.b2bpic.net/free-photo/woman-inserting-bitcoin-into-pink-piggy-bank_53876-105929.jpg", imageAlt: "man headshot professional portrait" },
|
||||
{ id: "3", name: "Sam K.", date: "Mar 2024", title: "Full-time Earned", quote: "Consistent payouts and great variety of tasks available every single day.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/blond-businessman-with-glasses_1098-57.jpg", imageSrc: "http://img.b2bpic.net/free-photo/social-media-still-life-items-view_23-2149019278.jpg", imageAlt: "man headshot professional portrait" },
|
||||
{ id: "4", name: "Linda P.", date: "Apr 2024", title: "Part-timer", quote: "Finally an app that isn't a scam. The support team is also very responsive.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/enthusiastic-young-woman-celebrating-smiling-raising-hands-up-rejoicing-winning-triumphin_1258-88013.jpg", imageSrc: "http://img.b2bpic.net/free-photo/time-is-money_1048-1708.jpg", imageAlt: "man headshot professional portrait" },
|
||||
{ id: "5", name: "David W.", date: "May 2024", title: "Gamer", quote: "Simply the best interface I've used. Earning money feels like a game.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/young-happy-african-woman-holding-laptop-hands_1153-9683.jpg", imageSrc: "http://img.b2bpic.net/free-vector/check-mark-shield-gradient_78370-4409.jpg", imageAlt: "man headshot professional portrait" },
|
||||
]}
|
||||
title="Join Thousands of Earners"
|
||||
description="See why our community loves TaskEarn."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
text="Ready to turn your time into cash? Let's get started!"
|
||||
buttons={[
|
||||
{
|
||||
text: "Sign Up Now",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
text="Ready to turn your time into cash? Let's get started!"
|
||||
buttons={[{ text: "Sign Up Now", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "TaskEarn",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Help Center",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 TaskEarn. All rights reserved."
|
||||
bottomRightText="Built for earners."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{ title: "TaskEarn", items: [{ label: "About Us", href: "#" }, { label: "Careers", href: "#" }] },
|
||||
{ title: "Support", items: [{ label: "Help Center", href: "#" }, { label: "Privacy Policy", href: "#" }] },
|
||||
]}
|
||||
bottomLeftText="© 2024 TaskEarn. All rights reserved."
|
||||
bottomRightText="Built for earners."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user