bender/45f16e1b-3bbd-4dee-8bf2-bdebbad9599e
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-03-07 23:48:03 +00:00
parent 0bbd2e060f
commit d8a52aa021
1 changed files with 140 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

239
src/app/page.tsx
View File

@@ -1,36 +1,54 @@
"use client";
import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import HeroCentered from "@/components/sections/hero/HeroCentered";
import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
import PricingCardEight from "@/components/sections/pricing/PricingCardEight";
import SplitAbout from "@/components/sections/about/SplitAbout";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import { Zap, TrendingUp, Palette, Monitor, Upload, Lock, Sparkles, Heart, CheckCircle } from "lucide-react";
import {
Zap,
TrendingUp,
Palette,
Monitor,
Upload,
Lock,
Target,
Globe,
Users,
DollarSign,
Gift,
Sparkles,
Crown,
CheckCircle,
Heart,
} from "lucide-react";
export default function HomePage() {
export default function Home() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Features", id: "/features" },
{ name: "Pricing", id: "/pricing" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
{ name: "Features", id: "#features" },
{ name: "Pricing", id: "#pricing" },
{ name: "About", id: "#about" },
];
return (
<ThemeProvider
defaultButtonVariant="text-shift"
defaultTextAnimation="reveal-blur"
borderRadius="soft"
contentWidth="smallMedium"
sizing="largeSizeMediumTitles"
background="noise"
cardStyle="inset"
primaryButtonStyle="shadow"
secondaryButtonStyle="layered"
headingFontWeight="semibold"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
@@ -48,22 +66,16 @@ export default function HomePage() {
background={{ variant: "animated-grid" }}
avatars={[
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AdN0gwMXJN4o9AEjWIWDR10e3G/portrait-of-a-professional-female-conten-1772927098524-a1bb9fd2.png",
alt: "Portrait of a professional female content creator in her late 20s, smiling confidently at camera. Mo",
},
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AdN0gwMXJN4o9AEjWIWDR10e3G/portrait-of-a-professional-female-conten-1772927098524-a1bb9fd2.png", alt: "Portrait of a professional female content creator in her late 20s, smiling confidently at camera. Mo"},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AdN0gwMXJN4o9AEjWIWDR10e3G/portrait-of-a-male-content-creator-in-hi-1772927098976-ece44af1.png",
alt: "Portrait of a male content creator in his early 30s, friendly expression, modern professional settin",
},
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AdN0gwMXJN4o9AEjWIWDR10e3G/portrait-of-a-male-content-creator-in-hi-1772927098976-ece44af1.png", alt: "Portrait of a male content creator in his early 30s, friendly expression, modern professional settin"},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AdN0gwMXJN4o9AEjWIWDR10e3G/portrait-of-a-creative-female-profession-1772927098345-8bac2707.png",
alt: "Portrait of a creative female professional in her mid-20s with modern style, warm and welcoming expr",
},
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AdN0gwMXJN4o9AEjWIWDR10e3G/portrait-of-a-creative-female-profession-1772927098345-8bac2707.png", alt: "Portrait of a creative female professional in her mid-20s with modern style, warm and welcoming expr"},
]}
avatarText="Trusted by 5,000+ creators"
buttons={[
{ text: "Start Free Trial", href: "/signup" },
{ text: "View Demo", href: "/features" },
{ text: "View Demo", href: "#features" },
]}
buttonAnimation="slide-up"
/>
@@ -80,39 +92,99 @@ export default function HomePage() {
features={[
{
icon: Zap,
title: "AI Script Generator",
description: "Generate engaging video scripts tailored to your niche. Choose from fitness, tech reviews, lifestyle, and more.",
},
title: "AI Script Generator", description:
"Generate engaging video scripts tailored to your niche. Choose from fitness, tech reviews, lifestyle, and more."},
{
icon: TrendingUp,
title: "Trending Ideas",
description: "Get real-time trending video concepts optimized for each platform with platform-specific ratios.",
},
title: "Trending Ideas", description:
"Get real-time trending video concepts optimized for each platform with platform-specific ratios."},
{
icon: Palette,
title: "Thumbnail Animations",
description: "Customizable animated thumbnails with AI design suggestions. Upload your images and enhance them instantly.",
},
title: "Thumbnail Animations", description:
"Customizable animated thumbnails with AI design suggestions. Upload your images and enhance them instantly."},
{
icon: Monitor,
title: "Multi-Platform Support",
description: "YouTube (16:9), TikTok (9:16), Instagram Reels (9:16), Facebook (16:9 or 1:1). All in one place.",
},
title: "Multi-Platform Support", description:
"YouTube (16:9), TikTok (9:16), Instagram Reels (9:16), Facebook (16:9 or 1:1). All in one place."},
{
icon: Upload,
title: "Image Integration",
description: "Upload your own images and integrate them seamlessly with AI designs for unique thumbnails.",
},
title: "Image Integration", description:
"Upload your own images and integrate them seamlessly with AI designs for unique thumbnails."},
{
icon: Lock,
title: "Secure Storage",
description: "Your content is saved to your account. Access it anytime, anywhere. Never lose your ideas.",
},
title: "Secure Storage", description:
"Your content is saved to your account. Access it anytime, anywhere. Never lose your ideas."},
]}
animationType="slide-up"
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardEight
title="Flexible Pricing for Every Creator"
description="Choose the plan that works best for you. No hidden fees. Cancel anytime."
tag="Transparent Pricing"
tagIcon={DollarSign}
textboxLayout="default"
useInvertedBackground={true}
animationType="slide-up"
plans={[
{
id: "free", badge: "Free Trial", badgeIcon: Gift,
price: "$0", subtitle: "Perfect for getting started", buttons: [{ text: "Get Started", href: "/signup" }],
features: [
"1 AI-generated script per day", "1 animated thumbnail per day", "Access to trending ideas", "Basic image upload (up to 5MB)", "YouTube, TikTok, Instagram, Facebook support", "Mobile app access", "Community support"],
},
{
id: "monthly", badge: "Most Popular", badgeIcon: Sparkles,
price: "$10", subtitle: "Billed monthly. Great for consistent creators.", buttons: [{ text: "Subscribe Now", href: "/checkout?plan=monthly" }],
features: [
"Unlimited AI-generated scripts", "Unlimited animated thumbnails", "Advanced customization options", "Unlimited image uploads", "All platform formats supported", "Priority email support", "Download in HD quality", "Monthly content calendar", "Early access to new features"],
},
{
id: "lifetime", badge: "Best Value", badgeIcon: Crown,
price: "$50", subtitle: "One-time payment. Unlimited access forever.", buttons: [{ text: "Buy Lifetime", href: "/checkout?plan=lifetime" }],
features: [
"Unlimited everything forever", "All current and future features", "Lifetime updates included", "Priority support 24/7", "Team collaboration (up to 5 users)", "Advanced analytics dashboard", "Custom branding options", "API access for integrations", "No subscription. Ever."],
},
]}
/>
</div>
<div id="about" data-section="about">
<SplitAbout
title="Why Syncora?"
description="We built Syncora because content creators deserve better tools. No complicated interfaces. No expensive software. Just AI that works."
tag="Our Mission"
tagIcon={Heart}
textboxLayout="default"
useInvertedBackground={false}
imagePosition="right"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AdN0gwMXJN4o9AEjWIWDR10e3G/modern-software-dashboard-for-content-cr-1772927099490-052886ae.png"
imageAlt="Syncora Platform Interface"
mediaAnimation="slide-up"
bulletPoints={[
{
icon: Zap,
title: "Time-Saving AI", description:
"Generate scripts and designs in seconds, not hours. Spend time creating, not planning."},
{
icon: Target,
title: "Niche-Specific Content", description:
"Whether you're in fitness, tech, lifestyle, or any other niche, we've got you covered."},
{
icon: Globe,
title: "Platform Optimized", description:
"Every video is optimized for its platform with correct aspect ratios and trending formats."},
{
icon: Users,
title: "Creator Community", description:
"Join thousands of creators using Syncora daily. Share ideas, learn, and grow together."},
]}
buttons={[{ text: "See All Features", href: "#features" }]}
/>
</div>
<div id="social-proof" data-section="social-proof">
<SocialProofOne
title="Trusted by Creators Worldwide"
@@ -121,15 +193,8 @@ export default function HomePage() {
tagIcon={CheckCircle}
textboxLayout="default"
useInvertedBackground={true}
logos={[
"http://img.b2bpic.net/free-vector/subscribers-label-set_23-2150975923.jpg",
"http://img.b2bpic.net/free-vector/social-media-logo-collection_23-2148072542.jpg",
"http://img.b2bpic.net/free-vector/holi-festival-instagram-post-concept_23-2148406719.jpg",
"http://img.b2bpic.net/free-vector/colorful-social-media-logo-collection_52683-3032.jpg",
"http://img.b2bpic.net/free-vector/interior-design-logo-template_742173-3120.jpg",
"http://img.b2bpic.net/free-vector/brain-love-logo-business-branding-template-designs-inspiration-isolated-white-background_384344-1306.jpg",
"http://img.b2bpic.net/free-vector/technology-logo-collection-gradient-style_52683-13893.jpg",
]}
names=[
"YouTube", "TikTok", "Instagram", "Facebook", "Creator Tools", "Content Studio", "Video Hub"]
speed={40}
showCard={true}
buttons={[{ text: "Join 5,000+ Creators", href: "/signup" }]}
@@ -146,45 +211,29 @@ export default function HomePage() {
animationType="smooth"
faqs={[
{
id: "1",
title: "What's included in the free tier?",
content: "The free tier gives you access to 1 AI-generated script and 1 animated thumbnail per day. You can use all platform formats (YouTube, TikTok, Instagram, Facebook) and upload up to 5MB of images daily. It's perfect for testing the platform.",
},
id: "1", title: "What's included in the free tier?", content:
"The free tier gives you access to 1 AI-generated script and 1 animated thumbnail per day. You can use all platform formats (YouTube, TikTok, Instagram, Facebook) and upload up to 5MB of images daily. It's perfect for testing the platform."},
{
id: "2",
title: "Can I cancel my subscription anytime?",
content: "Yes! You can cancel your monthly subscription at any time with no penalties. Your access continues until the end of your billing period. If you purchase the lifetime access, there's no subscription to cancel—it's yours forever.",
},
id: "2", title: "Can I cancel my subscription anytime?", content:
"Yes! You can cancel your monthly subscription at any time with no penalties. Your access continues until the end of your billing period. If you purchase the lifetime access, there's no subscription to cancel—it's yours forever."},
{
id: "3",
title: "What payment methods do you accept?",
content: "We accept credit card (Visa, Mastercard, American Express), Apple Pay, and Cash App. All payments are processed securely through industry-standard encryption.",
},
id: "3", title: "What payment methods do you accept?", content:
"We accept credit card (Visa, Mastercard, American Express), Apple Pay, and Cash App. All payments are processed securely through industry-standard encryption."},
{
id: "4",
title: "What aspect ratios does Syncora support?",
content: "We support all major platform ratios: YouTube Shorts (9:16), TikTok (9:16), Instagram Reels (9:16), YouTube standard (16:9), and Facebook (16:9 or 1:1). Our AI automatically adapts your content to each format.",
},
id: "4", title: "What aspect ratios does Syncora support?", content:
"We support all major platform ratios: YouTube Shorts (9:16), TikTok (9:16), Instagram Reels (9:16), YouTube standard (16:9), and Facebook (16:9 or 1:1). Our AI automatically adapts your content to each format."},
{
id: "5",
title: "Can I use Syncora content commercially?",
content: "Yes! All content generated through Syncora is yours to use. Whether you monetize on YouTube, sell products, or use it for commercial purposes, you have full rights to everything you create.",
},
id: "5", title: "Can I use Syncora content commercially?", content:
"Yes! All content generated through Syncora is yours to use. Whether you monetize on YouTube, sell products, or use it for commercial purposes, you have full rights to everything you create."},
{
id: "6",
title: "How do I access my saved content?",
content: "Once you sign up with your email, all your generated scripts and designs are saved to your account. You can access them from any device—desktop, tablet, or mobile—by logging in anytime.",
},
id: "6", title: "How do I access my saved content?", content:
"Once you sign up with your email, all your generated scripts and designs are saved to your account. You can access them from any device—desktop, tablet, or mobile—by logging in anytime."},
{
id: "7",
title: "Is my personal data safe?",
content: "Absolutely. We use enterprise-grade encryption to protect your data. We never sell your information to third parties, and we comply with GDPR and other privacy regulations.",
},
id: "7", title: "Is my personal data safe?", content:
"Absolutely. We use enterprise-grade encryption to protect your data. We never sell your information to third parties, and we comply with GDPR and other privacy regulations."},
{
id: "8",
title: "Can I upgrade from free or monthly to lifetime?",
content: "Yes! You can upgrade anytime. If you've already paid for monthly, we'll credit that towards your lifetime purchase, so you only pay the difference.",
},
id: "8", title: "Can I upgrade from free or monthly to lifetime?", content:
"Yes! You can upgrade anytime. If you've already paid for monthly, we'll credit that towards your lifetime purchase, so you only pay the difference."},
]}
/>
</div>
@@ -194,28 +243,20 @@ export default function HomePage() {
title="Ready to Transform Your Content?"
description="Join thousands of creators using Syncora. Start with one free use per day and upgrade whenever you're ready. No credit card required."
useInvertedBackground={false}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AdN0gwMXJN4o9AEjWIWDR10e3G/sleek-dashboard-interface-showing-syncor-1772927098863-4a07f700.png?_wi=1"
imageAlt="Sleek dashboard interface showing Syncora platform in action. Content creator workspace with video p"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AdN0gwMXJN4o9AEjWIWDR10e3G/sleek-dashboard-interface-showing-syncor-1772927098863-4a07f700.png"
imageAlt="Syncora Dashboard"
mediaAnimation="slide-up"
mediaPosition="right"
inputs={[
{
name: "email",
type: "email",
placeholder: "Enter your email",
required: true,
name: "email", type: "email", placeholder: "Enter your email", required: true,
},
{
name: "niche",
type: "text",
placeholder: "Your content niche (e.g., fitness, tech reviews)",
required: true,
name: "niche", type: "text", placeholder: "Your content niche (e.g., fitness, tech reviews)", required: true,
},
]}
textarea={{
name: "message",
placeholder: "Tell us about your content goals (optional)",
rows: 4,
name: "message", placeholder: "Tell us about your content goals (optional)", rows: 4,
required: false,
}}
buttonText="Get Started Free"
@@ -225,10 +266,10 @@ export default function HomePage() {
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Syncora"
leftLink={{ text: "Privacy Policy", href: "/privacy" }}
rightLink={{ text: "Terms of Service", href: "/terms" }}
leftLink={{ text: "Privacy Policy", href: "#privacy" }}
rightLink={{ text: "Terms of Service", href: "#terms" }}
/>
</div>
</ThemeProvider>
);
}
}