Merge version_1 into main #2
348
src/app/page.tsx
348
src/app/page.tsx
@@ -26,258 +26,116 @@ export default function LandingPage() {
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Templates",
|
||||
id: "#catalog",
|
||||
},
|
||||
{
|
||||
name: "Process",
|
||||
id: "#features",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "#testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="TemplateMarket"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Templates", id: "catalog" },
|
||||
{ name: "Process", id: "features" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="TemplateMarket"
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Scale Your Template Business"
|
||||
description="We research the best markets, identify target buyers, and guide them to your premium digital templates with clear pricing and secure payment paths."
|
||||
buttons={[
|
||||
{
|
||||
text: "Start Selling",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-professional-software-workspace-showin-1774790038754-6b0b9e99.png?_wi=1",
|
||||
imageAlt: "Market Research",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-person-analyzing-market-data-on-a-scre-1774790034187-5ee7c90a.png?_wi=1",
|
||||
imageAlt: "Buyer Research",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/an-automated-system-visualization-showin-1774790035185-55277436.png?_wi=1",
|
||||
imageAlt: "Secure Payment",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-stylized-design-template-being-shared--1774790036097-f537655a.png?_wi=1",
|
||||
imageAlt: "Template Delivery",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-high-quality-sleek-website-template-mo-1774790035286-d45d10c5.png?_wi=1",
|
||||
imageAlt: "Premium Design",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Scale Your Template Business"
|
||||
description="We research the best markets, identify target buyers, and guide them to your premium digital templates with clear pricing and secure payment paths."
|
||||
buttons={[{ text: "Start Selling", href: "#contact" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-professional-software-workspace-showin-1774790038754-6b0b9e99.png", imageAlt: "Market Research" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-person-analyzing-market-data-on-a-scre-1774790034187-5ee7c90a.png", imageAlt: "Buyer Research" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/an-automated-system-visualization-showin-1774790035185-55277436.png", imageAlt: "Secure Payment" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-stylized-design-template-being-shared--1774790036097-f537655a.png", imageAlt: "Template Delivery" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-high-quality-sleek-website-template-mo-1774790035286-d45d10c5.png", imageAlt: "Premium Design" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardMedia
|
||||
animationType="slide-up"
|
||||
textboxLayout="inline-image"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Market Insight",
|
||||
description: "Automated trend reports to find exactly who wants your templates.",
|
||||
tag: "Research",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-person-analyzing-market-data-on-a-scre-1774790034187-5ee7c90a.png?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Transaction Flow",
|
||||
description: "Secure payment routing directly to your preferred accounts.",
|
||||
tag: "Sales",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/an-automated-system-visualization-showin-1774790035185-55277436.png?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Targeted Outreach",
|
||||
description: "We help you position your assets in front of ready-to-buy users.",
|
||||
tag: "Growth",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-stylized-design-template-being-shared--1774790036097-f537655a.png?_wi=2",
|
||||
},
|
||||
]}
|
||||
title="Data-Driven Success"
|
||||
description="Our platform does the heavy lifting, connecting you with the right audience."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardMedia
|
||||
animationType="slide-up"
|
||||
textboxLayout="inline-image"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "f1", title: "Market Insight", description: "Automated trend reports to find exactly who wants your templates.", tag: "Research", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-person-analyzing-market-data-on-a-scre-1774790034187-5ee7c90a.png" },
|
||||
{ id: "f2", title: "Transaction Flow", description: "Secure payment routing directly to your preferred accounts.", tag: "Sales", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/an-automated-system-visualization-showin-1774790035185-55277436.png" },
|
||||
{ id: "f3", title: "Targeted Outreach", description: "We help you position your assets in front of ready-to-buy users.", tag: "Growth", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-stylized-design-template-being-shared--1774790036097-f537655a.png" }
|
||||
]}
|
||||
title="Data-Driven Success"
|
||||
description="Our platform does the heavy lifting, connecting you with the right audience."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="catalog" data-section="catalog">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "SaaS Website Kit",
|
||||
price: "$129",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-high-quality-sleek-website-template-mo-1774790035286-d45d10c5.png?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Enterprise Presentation",
|
||||
price: "$89",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-professional-business-presentation-tem-1774790036710-d25bcbc9.png",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Social Media Bundle",
|
||||
price: "$49",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-creative-social-media-marketing-templa-1774790040246-ce0d189b.png",
|
||||
},
|
||||
]}
|
||||
title="Template Collection"
|
||||
description="High-conversion assets ready for your audience."
|
||||
/>
|
||||
</div>
|
||||
<div id="catalog" data-section="catalog">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{ id: "p1", name: "SaaS Website Kit", price: "$129", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-high-quality-sleek-website-template-mo-1774790035286-d45d10c5.png" },
|
||||
{ id: "p2", name: "Enterprise Presentation", price: "$89", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-professional-business-presentation-tem-1774790036710-d25bcbc9.png" },
|
||||
{ id: "p3", name: "Social Media Bundle", price: "$49", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-creative-social-media-marketing-templa-1774790040246-ce0d189b.png" }
|
||||
]}
|
||||
title="Template Collection"
|
||||
description="High-conversion assets ready for your audience."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Alex Riv",
|
||||
date: "Jan 2025",
|
||||
title: "Designer",
|
||||
quote: "My template sales doubled in one month.",
|
||||
tag: "Pro",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/portrait-of-a-happy-creative-professiona-1774790034532-adc6ca4c.png",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-professional-software-workspace-showin-1774790038754-6b0b9e99.png?_wi=2",
|
||||
imageAlt: "A professional software workspace showing a modern template design being optimized for a customer. H",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Maria K",
|
||||
date: "Dec 2024",
|
||||
title: "Marketing",
|
||||
quote: "The buyer matching is surprisingly accurate.",
|
||||
tag: "Creator",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/portrait-of-a-content-marketing-manager-1774790033555-9b166789.png",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-person-analyzing-market-data-on-a-scre-1774790034187-5ee7c90a.png?_wi=3",
|
||||
imageAlt: "A person analyzing market data on a screen, focused on target buyer trends and template pricing stra",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Sam Low",
|
||||
date: "Nov 2024",
|
||||
title: "Freelancer",
|
||||
quote: "Pricing logic helped me increase margins significantly.",
|
||||
tag: "Seller",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/portrait-of-a-business-consultant-1774790035840-42e5e034.png",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/an-automated-system-visualization-showin-1774790035185-55277436.png?_wi=3",
|
||||
imageAlt: "An automated system visualization showing money and transactions with secure digital icons.",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Jude W",
|
||||
date: "Oct 2024",
|
||||
title: "Product Dev",
|
||||
quote: "Total lifesaver for my sales pipeline.",
|
||||
tag: "User",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/portrait-of-a-freelance-designer-1774790033770-80b17624.png",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-stylized-design-template-being-shared--1774790036097-f537655a.png?_wi=3",
|
||||
imageAlt: "A stylized design template being shared between users.",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Elena R.",
|
||||
date: "Sept 2024",
|
||||
title: "Agency Owner",
|
||||
quote: "The automated insights saved my team hundreds of hours.",
|
||||
tag: "Enterprise",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/portrait-of-a-happy-creative-professiona-1774790034532-adc6ca4c.png",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-high-quality-sleek-website-template-mo-1774790035286-d45d10c5.png?_wi=3",
|
||||
imageAlt: "A high-quality sleek website template mockup.",
|
||||
},
|
||||
]}
|
||||
title="Trusted by Creators"
|
||||
description="Hear from those who've successfully automated their template business."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Alex Riv", date: "Jan 2025", title: "Designer", quote: "My template sales doubled in one month.", tag: "Pro", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/portrait-of-a-happy-creative-professiona-1774790034532-adc6ca4c.png", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-professional-software-workspace-showin-1774790038754-6b0b9e99.png" },
|
||||
{ id: "t2", name: "Maria K", date: "Dec 2024", title: "Marketing", quote: "The buyer matching is surprisingly accurate.", tag: "Creator", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/portrait-of-a-content-marketing-manager-1774790033555-9b166789.png", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-person-analyzing-market-data-on-a-scre-1774790034187-5ee7c90a.png" },
|
||||
{ id: "t3", name: "Sam Low", date: "Nov 2024", title: "Freelancer", quote: "Pricing logic helped me increase margins significantly.", tag: "Seller", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/portrait-of-a-business-consultant-1774790035840-42e5e034.png", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/an-automated-system-visualization-showin-1774790035185-55277436.png" },
|
||||
{ id: "t4", name: "Jude W", date: "Oct 2024", title: "Product Dev", quote: "Total lifesaver for my sales pipeline.", tag: "User", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/portrait-of-a-freelance-designer-1774790033770-80b17624.png", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-stylized-design-template-being-shared--1774790036097-f537655a.png" },
|
||||
{ id: "t5", name: "Elena R.", date: "Sept 2024", title: "Agency Owner", quote: "The automated insights saved my team hundreds of hours.", tag: "Enterprise", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/portrait-of-a-happy-creative-professiona-1774790034532-adc6ca4c.png", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-high-quality-sleek-website-template-mo-1774790035286-d45d10c5.png" }
|
||||
]}
|
||||
title="Trusted by Creators"
|
||||
description="Hear from those who've successfully automated their template business."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How does the research work?",
|
||||
content: "We scrape market trends and keyword volume to match template demand.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Where does money go?",
|
||||
content: "Funds are directed to your linked business bank account or wallet.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Can I custom price?",
|
||||
content: "Yes, our dashboard allows you full control over your pricing tiers.",
|
||||
},
|
||||
]}
|
||||
sideTitle="Common Questions"
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "q1", title: "How does the research work?", content: "We scrape market trends and keyword volume to match template demand." },
|
||||
{ id: "q2", title: "Where does money go?", content: "Funds are directed to your linked business bank account or wallet." },
|
||||
{ id: "q3", title: "Can I custom price?", content: "Yes, our dashboard allows you full control over your pricing tiers." }
|
||||
]}
|
||||
sideTitle="Common Questions"
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Ready to Start?"
|
||||
description="Let's get your templates in front of the right buyers."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Tell us about your templates...",
|
||||
required: true,
|
||||
}}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-modern-minimalist-office-space-with-pl-1774790034048-6c837d0f.png"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Ready to Start?"
|
||||
description="Let's get your templates in front of the right buyers."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Email", required: true }
|
||||
]}
|
||||
textarea={{ name: "message", placeholder: "Tell us about your templates...", required: true }}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BcYhmoWYO98Piqjm1JMZgwGXYt/a-modern-minimalist-office-space-with-pl-1774790034048-6c837d0f.png"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="TemplateMarket"
|
||||
copyrightText="© 2025 TemplateMarket. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="TemplateMarket"
|
||||
copyrightText="© 2025 TemplateMarket. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user