Update src/app/page.tsx
This commit is contained in:
362
src/app/page.tsx
362
src/app/page.tsx
@@ -26,276 +26,110 @@ export default function LandingPage() {
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "Shop",
|
||||
id: "/shop",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "/about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Voltix"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Shop", id: "/shop" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
brandName="Voltix"
|
||||
button={{ text: "Get Started", href: "/contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlayTestimonial
|
||||
title="The Future of Smart Living & Mobility"
|
||||
description="Revolutionizing human experience through AI-integrated infrastructure and high-performance electric mobility solutions."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Alex Rivet",
|
||||
handle: "@techguru",
|
||||
testimonial: "The Voltix E-Motorcycle is the most advanced machine I have ever ridden.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cyberpunk-rider-speeding-through-neon-city_23-2151975913.jpg",
|
||||
},
|
||||
{
|
||||
name: "Sarah Chen",
|
||||
handle: "@smartliving",
|
||||
testimonial: "My smart kitchen setup is seamlessly integrated and stunningly fast.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-working-her-tablet-outside-drinking-coffee_23-2149318504.jpg",
|
||||
},
|
||||
{
|
||||
name: "Marcus Thorne",
|
||||
handle: "@urbanrider",
|
||||
testimonial: "Eco-friendly, fast, and remarkably stylish. A true game changer.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-using-technology-while-traveling-city_23-2149333102.jpg",
|
||||
},
|
||||
{
|
||||
name: "Elena V.",
|
||||
handle: "@futurist",
|
||||
testimonial: "Voltix is not just a brand; it is a lifestyle upgrade.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-s-hands-touching-screen-tablet_1157-2114.jpg",
|
||||
},
|
||||
{
|
||||
name: "James L.",
|
||||
handle: "@techceo",
|
||||
testimonial: "Exceptional build quality and groundbreaking AI performance.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-medical-mask-while-sitting-his-bike_23-2148777864.jpg",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore Products",
|
||||
href: "/shop",
|
||||
},
|
||||
{
|
||||
text: "Shop Now",
|
||||
href: "/shop",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cool-motorcycle-indoors_23-2150849403.jpg"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/futuristic-mean-transportation-ultra-modern-city_23-2151065395.jpg",
|
||||
alt: "User 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/biker-girl-leather-clothes-motorcycle_158595-3335.jpg",
|
||||
alt: "User 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/cyberpunk-portrait-flying-men-outdoors_23-2150006867.jpg",
|
||||
alt: "User 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/illustration-rain-futuristic-city_23-2151406610.jpg",
|
||||
alt: "User 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/cyberpunk-city-street-night-with-neon-lights-futuristic-aesthetic_23-2151488763.jpg",
|
||||
alt: "User 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Join 10,000+ satisfied pioneers"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlayTestimonial
|
||||
title="The Future of Smart Living & Mobility"
|
||||
description="Revolutionizing human experience through AI-integrated infrastructure and high-performance electric mobility solutions."
|
||||
testimonials={[
|
||||
{ name: "Alex Rivet", handle: "@techguru", testimonial: "The Voltix E-Motorcycle is the most advanced machine I have ever ridden.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/cyberpunk-rider-speeding-through-neon-city_23-2151975913.jpg" },
|
||||
{ name: "Sarah Chen", handle: "@smartliving", testimonial: "My smart kitchen setup is seamlessly integrated and stunningly fast.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-working-her-tablet-outside-drinking-coffee_23-2149318504.jpg" },
|
||||
{ name: "Marcus Thorne", handle: "@urbanrider", testimonial: "Eco-friendly, fast, and remarkably stylish. A true game changer.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-using-technology-while-traveling-city_23-2149333102.jpg" },
|
||||
{ name: "Elena V.", handle: "@futurist", testimonial: "Voltix is not just a brand; it is a lifestyle upgrade.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-s-hands-touching-screen-tablet_1157-2114.jpg" },
|
||||
{ name: "James L.", handle: "@techceo", testimonial: "Exceptional build quality and groundbreaking AI performance.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-medical-mask-while-sitting-his-bike_23-2148777864.jpg" }
|
||||
]}
|
||||
buttons={[{ text: "Explore Products", href: "/shop" }, { text: "Shop Now", href: "/shop" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cool-motorcycle-indoors_23-2150849403.jpg"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/futuristic-mean-transportation-ultra-modern-city_23-2151065395.jpg", alt: "User 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/biker-girl-leather-clothes-motorcycle_158595-3335.jpg", alt: "User 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/cyberpunk-portrait-flying-men-outdoors_23-2150006867.jpg", alt: "User 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/illustration-rain-futuristic-city_23-2151406610.jpg", alt: "User 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/cyberpunk-city-street-night-with-neon-lights-futuristic-aesthetic_23-2151488763.jpg", alt: "User 5" }
|
||||
]}
|
||||
avatarText="Join 10,000+ satisfied pioneers"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="categories" data-section="categories">
|
||||
<FeatureCardSixteen
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
negativeCard={{
|
||||
items: [
|
||||
"Smart Home Appliances",
|
||||
"Electric Bikes",
|
||||
"Motorcycles",
|
||||
],
|
||||
}}
|
||||
positiveCard={{
|
||||
items: [
|
||||
"Smart Gadgets",
|
||||
"Premium Bicycles",
|
||||
"High-Tech Accessories",
|
||||
],
|
||||
}}
|
||||
title="Product Ecosystem"
|
||||
description="Smart, connected, and sustainable innovations for the next generation of living."
|
||||
/>
|
||||
</div>
|
||||
<div id="categories" data-section="categories">
|
||||
<FeatureCardSixteen
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
negativeCard={{ items: ["Smart Home Appliances", "Electric Bikes", "Motorcycles"] }}
|
||||
positiveCard={{ items: ["Smart Gadgets", "Premium Bicycles", "High-Tech Accessories"] }}
|
||||
title="Product Ecosystem"
|
||||
description="Smart, connected, and sustainable innovations for the next generation of living."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "AI Smart Refrigerator",
|
||||
price: "$4,999",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/futuristic-kitchen-interior-design_23-2151821353.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Voltix Stealth Motorbike",
|
||||
price: "$12,499",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-racing-dirt-bike-fantasy-environment_23-2151500496.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Urban E-Scooter Pro",
|
||||
price: "$1,299",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-adult-using-electric-scooter-transportation_23-2149399797.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Smart Washer X1",
|
||||
price: "$2,899",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/person-inside-laundromat-with-washing-machines_23-2151176220.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Aero Sport Bicycle",
|
||||
price: "$3,599",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-sports-bicycle-s-front-set-handles-shot-black-white_181624-1564.jpg",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Neural Smart Helmet",
|
||||
price: "$899",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/model-wearing-motorcycle-helmet-portrait_23-2151585544.jpg",
|
||||
},
|
||||
]}
|
||||
title="Innovative Products"
|
||||
description="Explore our flagship range of AI-driven smart appliances and high-performance mobility."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "1", name: "AI Smart Refrigerator", price: "$4,999", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-kitchen-interior-design_23-2151821353.jpg" },
|
||||
{ id: "2", name: "Voltix Stealth Motorbike", price: "$12,499", imageSrc: "http://img.b2bpic.net/free-photo/man-racing-dirt-bike-fantasy-environment_23-2151500496.jpg" },
|
||||
{ id: "3", name: "Urban E-Scooter Pro", price: "$1,299", imageSrc: "http://img.b2bpic.net/free-photo/young-adult-using-electric-scooter-transportation_23-2149399797.jpg" },
|
||||
{ id: "4", name: "Smart Washer X1", price: "$2,899", imageSrc: "http://img.b2bpic.net/free-photo/person-inside-laundromat-with-washing-machines_23-2151176220.jpg" },
|
||||
{ id: "5", name: "Aero Sport Bicycle", price: "$3,599", imageSrc: "http://img.b2bpic.net/free-photo/closeup-sports-bicycle-s-front-set-handles-shot-black-white_181624-1564.jpg" },
|
||||
{ id: "6", name: "Neural Smart Helmet", price: "$899", imageSrc: "http://img.b2bpic.net/free-photo/model-wearing-motorcycle-helmet-portrait_23-2151585544.jpg" }
|
||||
]}
|
||||
title="Innovative Products"
|
||||
description="Explore our flagship range of AI-driven smart appliances and high-performance mobility."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="Our Vision"
|
||||
title="Pioneering Sustainable Technology"
|
||||
description="Voltix is dedicated to bridging the gap between cutting-edge technology and environmental sustainability."
|
||||
subdescription="We build smarter homes and cleaner commutes."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/panoramic-view-brooklyn-bridge-new-york-city_268835-766.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
icon={Zap}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="Our Vision"
|
||||
title="Pioneering Sustainable Technology"
|
||||
description="Voltix is dedicated to bridging the gap between cutting-edge technology and environmental sustainability."
|
||||
subdescription="We build smarter homes and cleaner commutes."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/panoramic-view-brooklyn-bridge-new-york-city_268835-766.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
icon={Zap}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Membership Plans"
|
||||
description="Choose the level of innovation that fits your lifestyle."
|
||||
plans={[
|
||||
{
|
||||
id: "starter",
|
||||
badge: "Essential",
|
||||
price: "$99",
|
||||
subtitle: "For daily commuters",
|
||||
buttons: [
|
||||
{
|
||||
text: "Get Started",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
features: [
|
||||
"Basic smart home access",
|
||||
"1-year warranty",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "pro",
|
||||
badge: "Advanced",
|
||||
price: "$299",
|
||||
subtitle: "For tech enthusiasts",
|
||||
buttons: [
|
||||
{
|
||||
text: "Go Pro",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
features: [
|
||||
"AI integration",
|
||||
"Priority support",
|
||||
"Full smart ecosystem",
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Membership Plans"
|
||||
description="Choose the level of innovation that fits your lifestyle."
|
||||
plans={[
|
||||
{ id: "starter", badge: "Essential", price: "$99", subtitle: "For daily commuters", buttons: [{ text: "Get Started", href: "#" }], features: ["Basic smart home access", "1-year warranty"] },
|
||||
{ id: "pro", badge: "Advanced", price: "$299", subtitle: "For tech enthusiasts", buttons: [{ text: "Go Pro", href: "#" }], features: ["AI integration", "Priority support", "Full smart ecosystem"] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Voltix"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigate",
|
||||
items: [
|
||||
{
|
||||
label: "Shop",
|
||||
href: "/shop",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "/about",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "/contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Voltix"
|
||||
columns={[
|
||||
{ title: "Navigate", items: [{ label: "Shop", href: "/shop" }, { label: "About", href: "/about" }, { label: "Contact", href: "/contact" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms", href: "#" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user