Files
4aca277a-34fe-4a41-beba-689…/src/app/page.tsx
2026-04-07 03:07:24 +00:00

232 lines
7.9 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="small"
sizing="large"
background="aurora"
cardStyle="gradient-radial"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="glass"
headingFontWeight="extrabold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "Features",
id: "features",
},
{
name: "Testimonials",
id: "testimonials",
},
{
name: "FAQ",
id: "faq",
},
]}
brandName="VidGenAI"
button={{
text: "Get Started",
href: "#contact",
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroLogo
logoText="VidGenAI"
description="Generate high-quality videos from text in seconds. Completely free, no watermarks, professional AI power."
buttons={[
{
text: "Start Generating",
href: "#contact",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/swirl-spline-line-abstract-background-desktop-wallpaper_1048-15920.jpg?_wi=1"
imageAlt="AI Video Generation Background"
/>
</div>
<div id="features" data-section="features">
<FeatureCardNine
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "Text to Video AI",
description: "Convert simple text prompts into cinematic, high-resolution videos using our advanced models.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/horizontal-clay-phone-16-pro-max_187299-46100.jpg?_wi=1",
imageAlt: "Video Editor",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/horizontal-clay-phone-16-pro-max_187299-46100.jpg?_wi=2",
imageAlt: "Video Editor",
},
imageSrc: "http://img.b2bpic.net/free-photo/swirl-spline-line-abstract-background-desktop-wallpaper_1048-15920.jpg?_wi=2",
imageAlt: "abstract tech background dark blue glow",
},
{
title: "Ultra-Fast Rendering",
description: "Experience lightning-fast generation speeds thanks to our optimized cloud architecture.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/3d-shape-glowing-with-bright-holographic-colors_23-2151037235.jpg?_wi=1",
imageAlt: "Fast Rendering",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/3d-shape-glowing-with-bright-holographic-colors_23-2151037235.jpg?_wi=2",
imageAlt: "Fast Rendering",
},
imageSrc: "http://img.b2bpic.net/free-photo/horizontal-clay-phone-16-pro-max_187299-46100.jpg?_wi=3",
imageAlt: "video editing software dashboard",
},
{
title: "Free For Everyone",
description: "No hidden costs, no subscriptions. Access the full power of AI for free.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/horizontal-clay-phone-16-pro-max_187299-46100.jpg?_wi=4",
imageAlt: "Accessibility",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/horizontal-clay-phone-16-pro-max_187299-46100.jpg?_wi=5",
imageAlt: "Accessibility",
},
imageSrc: "http://img.b2bpic.net/free-photo/3d-shape-glowing-with-bright-holographic-colors_23-2151037235.jpg?_wi=3",
imageAlt: "lightning fast processing icon",
},
]}
showStepNumbers={true}
title="Why Choose VidGenAI"
description="Our cutting-edge technology gives you everything you need to create amazing videos effortlessly."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTen
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1",
title: "Amazing Speed",
quote: "I can't believe how fast this is. It's truly a game-changer.",
name: "Alex Smith",
role: "Content Creator",
imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1613.jpg",
},
{
id: "2",
title: "High Quality",
quote: "The output quality is surprisingly high for a free platform.",
name: "Sarah Jones",
role: "Developer",
imageSrc: "http://img.b2bpic.net/free-photo/interior-designer-working-out-office_23-2150379266.jpg",
},
{
id: "3",
title: "So Easy to Use",
quote: "Simple interface, massive results. Exactly what I needed.",
name: "Mike Chen",
role: "Creative Lead",
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-organizing-live-shop_23-2149947441.jpg",
},
{
id: "4",
title: "My Favorite Tool",
quote: "VidGenAI has completely changed my daily workflow.",
name: "Emily Davis",
role: "Manager",
imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-office-engages-communication-virtual-presentation-talking_482257-133582.jpg",
},
{
id: "5",
title: "Incredible Tech",
quote: "The AI models behind this are top tier. Simply incredible.",
name: "John Doe",
role: "Founder",
imageSrc: "http://img.b2bpic.net/free-photo/labor-union-members-working-together_23-2150969902.jpg",
},
]}
title="Loved by Creators"
description="See what our users have to say about VidGenAI."
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "f1",
title: "Is it really free?",
content: "Yes, VidGenAI is free for everyone to use, with no hidden charges.",
},
{
id: "f2",
title: "What video formats are supported?",
content: "We support MP4, AVI, and MOV for all your export needs.",
},
{
id: "f3",
title: "How long does it take?",
content: "Most videos are generated within 30-60 seconds depending on complexity.",
},
]}
title="Common Questions"
description="Need help? Check out our most frequently asked questions."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={false}
background={{
variant: "sparkles-gradient",
}}
tag="Get Started"
title="Ready to Start?"
description="Create your first video right now. Join the community of professional creators today."
buttons={[
{
text: "Generate Now",
href: "#",
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="VidGenAI"
copyrightText="© 2025 VidGenAI. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}