Update src/app/page.tsx
This commit is contained in:
205
src/app/page.tsx
205
src/app/page.tsx
@@ -30,99 +30,62 @@ export default function LandingPage() {
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Features",
|
||||
id: "features",
|
||||
},
|
||||
name: "Features", id: "features"},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "pricing",
|
||||
},
|
||||
name: "Pricing", id: "pricing"},
|
||||
]}
|
||||
brandName="VidGenAI"
|
||||
button={{
|
||||
text: "Launch App",
|
||||
href: "/dashboard",
|
||||
}}
|
||||
text: "Launch App", href: "/dashboard"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
variant: "plain"}}
|
||||
title="Turn Text Into Reality in Seconds"
|
||||
description="Experience the next evolution of creativity. Our AI generates stunning 2-minute high-definition videos from simple text prompts. Built for creators and visionaries."
|
||||
kpis={[
|
||||
{
|
||||
value: "100+",
|
||||
label: "Generation Modes",
|
||||
},
|
||||
value: "100+", label: "Generation Modes"},
|
||||
{
|
||||
value: "2M+",
|
||||
label: "Videos Generated",
|
||||
},
|
||||
value: "2M+", label: "Videos Generated"},
|
||||
{
|
||||
value: "4.9/5",
|
||||
label: "User Rating",
|
||||
},
|
||||
value: "4.9/5", label: "User Rating"},
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Generate Video Now",
|
||||
href: "#",
|
||||
},
|
||||
text: "Generate Video Now", href: "#"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/focused-editor-woman-works-video-montage-creative-software_482257-121069.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/focused-editor-woman-works-video-montage-creative-software_482257-121069.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/cheerful-young-woman-with-curly-hair_1262-18151.jpg",
|
||||
alt: "User 1",
|
||||
},
|
||||
src: "https://img.b2bpic.net/free-photo/cheerful-young-woman-with-curly-hair_1262-18151.jpg", alt: "User 1"},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/handsome-man-with-beard-wearing-shirt_1142-2051.jpg",
|
||||
alt: "User 2",
|
||||
},
|
||||
src: "https://img.b2bpic.net/free-photo/handsome-man-with-beard-wearing-shirt_1142-2051.jpg", alt: "User 2"},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/portrait-happy-young-woman-with-glasses_1139-4444.jpg",
|
||||
alt: "User 3",
|
||||
},
|
||||
src: "https://img.b2bpic.net/free-photo/portrait-happy-young-woman-with-glasses_1139-4444.jpg", alt: "User 3"},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/confident-man-posing_1139-2244.jpg",
|
||||
alt: "User 4",
|
||||
},
|
||||
src: "https://img.b2bpic.net/free-photo/confident-man-posing_1139-2244.jpg", alt: "User 4"},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/young-man-wearing-hoodie_1139-2041.jpg",
|
||||
alt: "User 5",
|
||||
},
|
||||
src: "https://img.b2bpic.net/free-photo/young-man-wearing-hoodie_1139-2041.jpg", alt: "User 5"},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Ultra-Fast Rendering",
|
||||
},
|
||||
type: "text", text: "Ultra-Fast Rendering"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Global Cloud Sync",
|
||||
},
|
||||
type: "text", text: "Global Cloud Sync"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Advanced Neural AI",
|
||||
},
|
||||
type: "text", text: "Advanced Neural AI"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Seamless 4K Export",
|
||||
},
|
||||
type: "text", text: "Seamless 4K Export"},
|
||||
{
|
||||
type: "text",
|
||||
text: "24/7 Priority Support",
|
||||
},
|
||||
type: "text", text: "24/7 Priority Support"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -134,49 +97,31 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "AI Text-to-Video",
|
||||
description: "Generate high-definition videos effortlessly from complex text prompts with advanced motion AI models.",
|
||||
icon: Sparkles,
|
||||
title: "AI Text-to-Video", description: "Generate high-definition videos effortlessly from complex text prompts with advanced motion AI models.", icon: Sparkles,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/linear-online-education-elements_1257-361.jpg?_wi=1",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/linear-online-education-elements_1257-361.jpg"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/linear-online-education-elements_1257-361.jpg?_wi=2",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/focused-editor-woman-works-video-montage-creative-software_482257-121069.jpg?_wi=2",
|
||||
imageAlt: "futuristic dashboard interface",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/linear-online-education-elements_1257-361.jpg"},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Credit Management",
|
||||
description: "Transparent credit system with seamless tracking, ensuring you get exactly what you pay for.",
|
||||
icon: CreditCard,
|
||||
title: "Credit Management", description: "Transparent credit system with seamless tracking, ensuring you get exactly what you pay for.", icon: CreditCard,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/worker-holding-device-with-greenscreen_482257-76711.jpg?_wi=1",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/worker-holding-device-with-greenscreen_482257-76711.jpg"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/worker-holding-device-with-greenscreen_482257-76711.jpg?_wi=2",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/linear-online-education-elements_1257-361.jpg?_wi=3",
|
||||
imageAlt: "ai text to video icon",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/worker-holding-device-with-greenscreen_482257-76711.jpg"},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Fast Processing",
|
||||
description: "Low-latency cloud rendering architecture ensures your videos are processed in record time.",
|
||||
icon: Zap,
|
||||
title: "Fast Processing", description: "Low-latency cloud rendering architecture ensures your videos are processed in record time.", icon: Zap,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cloud-network-hand-using-phone-technology-remix-galaxy_53876-104224.jpg?_wi=1",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cloud-network-hand-using-phone-technology-remix-galaxy_53876-104224.jpg"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cloud-network-hand-using-phone-technology-remix-galaxy_53876-104224.jpg?_wi=2",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/worker-holding-device-with-greenscreen_482257-76711.jpg?_wi=3",
|
||||
imageAlt: "saas dashboard credit ui",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cloud-network-hand-using-phone-technology-remix-galaxy_53876-104224.jpg"},
|
||||
]
|
||||
},
|
||||
]}
|
||||
title="Powerful Features Built for Scale"
|
||||
@@ -191,40 +136,16 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "starter",
|
||||
badge: "Starter",
|
||||
price: "₹500",
|
||||
subtitle: "Perfect for personal use",
|
||||
features: [
|
||||
"100 Credits",
|
||||
"Standard HD Export",
|
||||
"Basic AI Models",
|
||||
"Email Support",
|
||||
],
|
||||
id: "starter", badge: "Starter", price: "₹500", subtitle: "Perfect for personal use", features: [
|
||||
"100 Credits", "Standard HD Export", "Basic AI Models", "Email Support"],
|
||||
},
|
||||
{
|
||||
id: "pro",
|
||||
badge: "Pro",
|
||||
price: "₹1000",
|
||||
subtitle: "For dedicated content creators",
|
||||
features: [
|
||||
"250 Credits",
|
||||
"4K Ultra HD Export",
|
||||
"Advanced AI Models",
|
||||
"Priority Rendering",
|
||||
],
|
||||
id: "pro", badge: "Pro", price: "₹1000", subtitle: "For dedicated content creators", features: [
|
||||
"250 Credits", "4K Ultra HD Export", "Advanced AI Models", "Priority Rendering"],
|
||||
},
|
||||
{
|
||||
id: "enterprise",
|
||||
badge: "Enterprise",
|
||||
price: "₹2000",
|
||||
subtitle: "Maximum creative power",
|
||||
features: [
|
||||
"600 Credits",
|
||||
"Full 4K/60fps Export",
|
||||
"API Access Included",
|
||||
"24/7 Dedicated Support",
|
||||
],
|
||||
id: "enterprise", badge: "Enterprise", price: "₹2000", subtitle: "Maximum creative power", features: [
|
||||
"600 Credits", "Full 4K/60fps Export", "API Access Included", "24/7 Dedicated Support"],
|
||||
},
|
||||
]}
|
||||
title="Flexible Plans for Every Creator"
|
||||
@@ -238,20 +159,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "How does the credit system work?",
|
||||
content: "Credits are deducted per video generated. More complex prompts or higher resolutions may require more credits.",
|
||||
},
|
||||
id: "1", title: "How does the credit system work?", content: "Credits are deducted per video generated. More complex prompts or higher resolutions may require more credits."},
|
||||
{
|
||||
id: "2",
|
||||
title: "Do you support international payments?",
|
||||
content: "Yes, we support both Indian payments via Razorpay and international payments via Stripe.",
|
||||
},
|
||||
id: "2", title: "Do you support international payments?", content: "Yes, we support both Indian payments via Razorpay and international payments via Stripe."},
|
||||
{
|
||||
id: "3",
|
||||
title: "Can I upgrade my plan anytime?",
|
||||
content: "Absolutely. You can scale your credits at any time from your dashboard settings.",
|
||||
},
|
||||
id: "3", title: "Can I upgrade my plan anytime?", content: "Absolutely. You can scale your credits at any time from your dashboard settings."},
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Everything you need to know about getting started with our platform."
|
||||
@@ -269,20 +181,11 @@ export default function LandingPage() {
|
||||
description="Data-backed results for content creators worldwide."
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "99.9%",
|
||||
description: "Uptime Reliability",
|
||||
},
|
||||
id: "m1", value: "99.9%", description: "Uptime Reliability"},
|
||||
{
|
||||
id: "m2",
|
||||
value: "45ms",
|
||||
description: "Average Latency",
|
||||
},
|
||||
id: "m2", value: "45ms", description: "Average Latency"},
|
||||
{
|
||||
id: "m3",
|
||||
value: "15k+",
|
||||
description: "Active Creators",
|
||||
},
|
||||
id: "m3", value: "15k+", description: "Active Creators"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -293,29 +196,19 @@ export default function LandingPage() {
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Product",
|
||||
href: "#features",
|
||||
},
|
||||
label: "Product", href: "#features"},
|
||||
{
|
||||
label: "Pricing",
|
||||
href: "#pricing",
|
||||
},
|
||||
label: "Pricing", href: "#pricing"},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#",
|
||||
},
|
||||
label: "Contact", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
label: "Terms of Service", href: "#"},
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
label: "Privacy Policy", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user