Merge version_1 into main #1

Merged
bender merged 1 commits from version_1 into main 2026-04-20 14:30:56 +00:00

View File

@@ -19,396 +19,180 @@ export default function LandingPage() {
defaultButtonVariant="text-shift"
defaultTextAnimation="entrance-slide"
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">
<NavbarStyleCentered
navItems={[
{
name: "Home",
id: "home",
},
{
name: "Products",
id: "products",
},
{
name: "Features",
id: "features",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="Mart"
/>
</div>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "home" },
{ name: "About", id: "about" },
{ name: "Products", id: "products" },
{ name: "Features", id: "features" },
{ name: "Metrics", id: "metrics" },
{ name: "Testimonials", id: "testimonials" },
{ name: "FAQ", id: "faq" },
{ name: "Contact", id: "contact" },
]}
brandName="Mart"
/>
</div>
<div id="home" data-section="home">
<HeroCentered
background={{
variant: "sparkles-gradient",
}}
title="Future of Commerce"
description="Experience our advanced 3D-integrated marketplace, built for the next generation of digital shoppers."
avatars={[
{
src: "http://img.b2bpic.net/free-photo/portrait-smiling-businessman-sitting-desk-table-business-company-office_482257-16773.jpg",
alt: "Avatar 1",
},
{
src: "http://img.b2bpic.net/free-photo/professional-young-woman-posing-office_23-2148452650.jpg",
alt: "Avatar 2",
},
{
src: "http://img.b2bpic.net/free-photo/studio-portrait-elegant-shaved-head-male-dressed-light-grey-suit_613910-11361.jpg",
alt: "Avatar 3",
},
{
src: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-13618.jpg",
alt: "Avatar 4",
},
{
src: "http://img.b2bpic.net/free-photo/portrait-middle-aged-hispanic-cheerful-female-with-curly-hair_181624-53321.jpg",
alt: "Avatar 5",
},
]}
buttons={[
{
text: "Shop Now",
href: "#products",
},
]}
buttonAnimation="slide-up"
marqueeItems={[
{
type: "text",
text: "Next-Gen 3D Shopping",
},
{
type: "text",
text: "Global Shipping",
},
{
type: "text",
text: "Secure Payments",
},
{
type: "text",
text: "24/7 Support",
},
{
type: "text",
text: "Instant Checkout",
},
]}
/>
</div>
<div id="home" data-section="home">
<HeroCentered
background={{ variant: "sparkles-gradient" }}
title="Future of Commerce"
description="Experience our advanced 3D-integrated marketplace, built for the next generation of digital shoppers."
avatars={[
{ src: "http://img.b2bpic.net/free-photo/portrait-smiling-businessman-sitting-desk-table-business-company-office_482257-16773.jpg", alt: "Avatar 1" },
{ src: "http://img.b2bpic.net/free-photo/professional-young-woman-posing-office_23-2148452650.jpg", alt: "Avatar 2" },
{ src: "http://img.b2bpic.net/free-photo/studio-portrait-elegant-shaved-head-male-dressed-light-grey-suit_613910-11361.jpg", alt: "Avatar 3" },
{ src: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-13618.jpg", alt: "Avatar 4" },
{ src: "http://img.b2bpic.net/free-photo/portrait-middle-aged-hispanic-cheerful-female-with-curly-hair_181624-53321.jpg", alt: "Avatar 5" },
]}
buttons={[{ text: "Shop Now", href: "#products" }]}
buttonAnimation="slide-up"
marqueeItems={[
{ type: "text", text: "Next-Gen 3D Shopping" },
{ type: "text", text: "Global Shipping" },
{ type: "text", text: "Secure Payments" },
{ type: "text", text: "24/7 Support" },
{ type: "text", text: "Instant Checkout" },
]}
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={true}
title="Innovation at Core"
description="We are revolutionizing how you interact with products through cutting-edge 3D visualization."
metrics={[
{
value: "10k+",
title: "Happy Users",
},
{
value: "500+",
title: "Products",
},
{
value: "24/7",
title: "Support",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/colleagues-smiling-speaking-discussing-new-ideas-office_176420-1713.jpg"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={true}
title="Innovation at Core"
description="We are revolutionizing how you interact with products through cutting-edge 3D visualization."
metrics={[
{ value: "10k+", title: "Happy Users" },
{ value: "500+", title: "Products" },
{ value: "24/7", title: "Support" },
]}
imageSrc="http://img.b2bpic.net/free-photo/colleagues-smiling-speaking-discussing-new-ideas-office_176420-1713.jpg"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="products" data-section="products">
<ProductCardTwo
animationType="scale-rotate"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "p1",
brand: "Mart",
name: "Tech Cube",
price: "$129",
rating: 5,
reviewCount: "120",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-autumn-journey-elements-composition-with-laptop_23-2148634126.jpg",
},
{
id: "p2",
brand: "Mart",
name: "Flow Device",
price: "$89",
rating: 4,
reviewCount: "85",
imageSrc: "http://img.b2bpic.net/free-photo/sustainability-concept-with-blank-geometric-forms-growing-plant_23-2148994247.jpg",
},
{
id: "p3",
brand: "Mart",
name: "Sync Pods",
price: "$159",
rating: 5,
reviewCount: "210",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-hard-drive-blue-light_23-2149417056.jpg",
},
{
id: "p4",
brand: "Mart",
name: "Apex Hub",
price: "$249",
rating: 5,
reviewCount: "45",
imageSrc: "http://img.b2bpic.net/free-photo/3d-view-blooming-flower_23-2150472254.jpg",
},
{
id: "p5",
brand: "Mart",
name: "Orbit Light",
price: "$69",
rating: 4,
reviewCount: "92",
imageSrc: "http://img.b2bpic.net/free-photo/perfectly-ordered-compositions-high-angle_23-2149872088.jpg",
},
{
id: "p6",
brand: "Mart",
name: "Nexus Core",
price: "$299",
rating: 5,
reviewCount: "300",
imageSrc: "http://img.b2bpic.net/free-photo/blue-model-career-kit-arrangement_23-2150084001.jpg",
},
]}
title="Explore Collections"
description="Hand-picked high-tech accessories for the modern lifestyle."
/>
</div>
<div id="products" data-section="products">
<ProductCardTwo
animationType="scale-rotate"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{ id: "p1", brand: "Mart", name: "Tech Cube", price: "$129", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/top-view-autumn-journey-elements-composition-with-laptop_23-2148634126.jpg" },
{ id: "p2", brand: "Mart", name: "Flow Device", price: "$89", rating: 4, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/sustainability-concept-with-blank-geometric-forms-growing-plant_23-2148994247.jpg" },
{ id: "p3", brand: "Mart", name: "Sync Pods", price: "$159", rating: 5, reviewCount: "210", imageSrc: "http://img.b2bpic.net/free-photo/top-view-hard-drive-blue-light_23-2149417056.jpg" },
{ id: "p4", brand: "Mart", name: "Apex Hub", price: "$249", rating: 5, reviewCount: "45", imageSrc: "http://img.b2bpic.net/free-photo/3d-view-blooming-flower_23-2150472254.jpg" },
{ id: "p5", brand: "Mart", name: "Orbit Light", price: "$69", rating: 4, reviewCount: "92", imageSrc: "http://img.b2bpic.net/free-photo/perfectly-ordered-compositions-high-angle_23-2149872088.jpg" },
{ id: "p6", brand: "Mart", name: "Nexus Core", price: "$299", rating: 5, reviewCount: "300", imageSrc: "http://img.b2bpic.net/free-photo/blue-model-career-kit-arrangement_23-2150084001.jpg" },
]}
title="Explore Collections"
description="Hand-picked high-tech accessories for the modern lifestyle."
/>
</div>
<div id="features" data-section="features">
<FeatureCardNineteen
textboxLayout="split"
useInvertedBackground={false}
features={[
{
tag: "3D",
title: "Interactive Views",
subtitle: "Visuals",
description: "Explore every angle with smooth 3D product previews.",
imageSrc: "http://img.b2bpic.net/free-photo/smartwatch-with-different-types-graphics_1134-417.jpg",
},
{
tag: "Sync",
title: "Live Status",
subtitle: "Updates",
description: "Get real-time tracking for all your orders worldwide.",
imageSrc: "http://img.b2bpic.net/free-photo/futuristic-presentation-by-businesswoman-white-shirt_53876-97048.jpg",
},
{
tag: "Fast",
title: "Instant Checkout",
subtitle: "Speed",
description: "Secure, one-click payment processing for maximum efficiency.",
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-holographic-cube_23-2150979692.jpg",
},
]}
title="Engineered for Performance"
description="Powerful capabilities designed to simplify your digital shopping journey."
/>
</div>
<div id="features" data-section="features">
<FeatureCardNineteen
textboxLayout="split"
useInvertedBackground={false}
features={[
{ tag: "3D", title: "Interactive Views", subtitle: "Visuals", description: "Explore every angle with smooth 3D product previews.", imageSrc: "http://img.b2bpic.net/free-photo/smartwatch-with-different-types-graphics_1134-417.jpg" },
{ tag: "Sync", title: "Live Status", subtitle: "Updates", description: "Get real-time tracking for all your orders worldwide.", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-presentation-by-businesswoman-white-shirt_53876-97048.jpg" },
{ tag: "Fast", title: "Instant Checkout", subtitle: "Speed", description: "Secure, one-click payment processing for maximum efficiency.", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-holographic-cube_23-2150979692.jpg" },
]}
title="Engineered for Performance"
description="Powerful capabilities designed to simplify your digital shopping journey."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardFourteen
useInvertedBackground={true}
title="By The Numbers"
tag="Milestones"
metrics={[
{
id: "m1",
value: "99.9%",
description: "Uptime Guarantee",
},
{
id: "m2",
value: "45ms",
description: "Avg Response Time",
},
{
id: "m3",
value: "1.2M+",
description: "Total Transactions",
},
]}
metricsAnimation="slide-up"
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardFourteen
useInvertedBackground={true}
title="By The Numbers"
tag="Milestones"
metrics={[
{ id: "m1", value: "99.9%", description: "Uptime Guarantee" },
{ id: "m2", value: "45ms", description: "Avg Response Time" },
{ id: "m3", value: "1.2M+", description: "Total Transactions" },
]}
metricsAnimation="slide-up"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSixteen
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1",
name: "Alice Chen",
role: "Designer",
company: "StudioX",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/black-businessman-happy-expression_1194-2707.jpg",
},
{
id: "2",
name: "Bob Smith",
role: "Dev",
company: "TechLab",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/handsome-groom-classy-black-suit-stands-dark-room_8353-7083.jpg",
},
{
id: "3",
name: "Cara Dee",
role: "Lead",
company: "GrowthCo",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-fashionable-well-dressed-man-with-beard-posing-outdoors_1328-3268.jpg",
},
{
id: "4",
name: "Dan Evans",
role: "CTO",
company: "CodeFlow",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-elegant-woman_1328-4107.jpg",
},
{
id: "5",
name: "Eve Wong",
role: "Founder",
company: "Innovate",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-flannel-suit-glasses-standing-against-brick-wall_613910-6746.jpg",
},
]}
kpiItems={[
{
value: "5x",
label: "Retention",
},
{
value: "98%",
label: "Happiness",
},
{
value: "24/7",
label: "Uptime",
},
]}
title="Loved By Creators"
description="See why our platform is the top choice for modern innovators."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSixteen
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{ id: "1", name: "Alice Chen", role: "Designer", company: "StudioX", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/black-businessman-happy-expression_1194-2707.jpg" },
{ id: "2", name: "Bob Smith", role: "Dev", company: "TechLab", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/handsome-groom-classy-black-suit-stands-dark-room_8353-7083.jpg" },
{ id: "3", name: "Cara Dee", role: "Lead", company: "GrowthCo", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-fashionable-well-dressed-man-with-beard-posing-outdoors_1328-3268.jpg" },
{ id: "4", name: "Dan Evans", role: "CTO", company: "CodeFlow", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-elegant-woman_1328-4107.jpg" },
{ id: "5", name: "Eve Wong", role: "Founder", company: "Innovate", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-flannel-suit-glasses-standing-against-brick-wall_613910-6746.jpg" },
]}
kpiItems={[
{ value: "5x", label: "Retention" },
{ value: "98%", label: "Happiness" },
{ value: "24/7", label: "Uptime" },
]}
title="Loved By Creators"
description="See why our platform is the top choice for modern innovators."
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
textboxLayout="split"
useInvertedBackground={true}
faqs={[
{
id: "f1",
title: "How does shipping work?",
content: "We offer global priority shipping with live tracking.",
},
{
id: "f2",
title: "Can I return products?",
content: "Yes, we accept returns within 30 days of purchase.",
},
{
id: "f3",
title: "Are there subscription tiers?",
content: "We offer pro memberships for exclusive access.",
},
]}
title="Common Questions"
description="Find answers to your most frequent inquiries."
faqsAnimation="blur-reveal"
imageSrc="http://img.b2bpic.net/free-photo/doctor-pressing-virtual-application_1134-640.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
textboxLayout="split"
useInvertedBackground={true}
faqs={[
{ id: "f1", title: "How does shipping work?", content: "We offer global priority shipping with live tracking." },
{ id: "f2", title: "Can I return products?", content: "Yes, we accept returns within 30 days of purchase." },
{ id: "f3", title: "Are there subscription tiers?", content: "We offer pro memberships for exclusive access." },
]}
title="Common Questions"
description="Find answers to your most frequent inquiries."
faqsAnimation="blur-reveal"
imageSrc="http://img.b2bpic.net/free-photo/doctor-pressing-virtual-application_1134-640.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={false}
background={{
variant: "rotated-rays-animated-grid",
}}
tag="Support"
title="Get in Touch"
description="Ready to transform your retail experience? Let's chat."
imageSrc="http://img.b2bpic.net/free-photo/3d-rendering-geometric-shapes-sculpture_23-2150979585.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={false}
background={{ variant: "rotated-rays-animated-grid" }}
tag="Support"
title="Get in Touch"
description="Ready to transform your retail experience? Let's chat."
imageSrc="http://img.b2bpic.net/free-photo/3d-rendering-geometric-shapes-sculpture_23-2150979585.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{
items: [
{
label: "Shop",
href: "#products",
},
{
label: "About",
href: "#about",
},
],
},
{
items: [
{
label: "Support",
href: "#faq",
},
{
label: "Contact",
href: "#contact",
},
],
},
{
items: [
{
label: "Terms",
href: "#",
},
{
label: "Privacy",
href: "#",
},
],
},
]}
logoText="Mart"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{ items: [{ label: "Shop", href: "#products" }, { label: "About", href: "#about" }] },
{ items: [{ label: "Support", href: "#faq" }, { label: "Contact", href: "#contact" }] },
{ items: [{ label: "Terms", href: "#" }, { label: "Privacy", href: "#" }] },
]}
logoText="Mart"
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
}