Update src/app/page.tsx
This commit is contained in:
409
src/app/page.tsx
409
src/app/page.tsx
@@ -18,303 +18,138 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="expand-hover"
|
||||
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">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Shop",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Lumina Dept"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Shop", id: "products" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Lumina Dept"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Elevate Your Everyday"
|
||||
description="Discover a curated collection of premium goods, fashion, and home essentials designed to inspire."
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/girl-library_1150-18018.jpg",
|
||||
imageAlt: "elegant department store clothing collection",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vintage-modern-restaurant-with-full-comfort_140725-9761.jpg",
|
||||
imageAlt: "elegant department store clothing collection",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/asian-women-looking-something-phone_23-2149122958.jpg",
|
||||
imageAlt: "elegant department store clothing collection",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/empty-trendy-clothing-store-selling-fashionable-items-shoes_482257-93115.jpg",
|
||||
imageAlt: "elegant department store clothing collection",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/girl-with-shopping-bags-looking-window_23-2148286185.jpg",
|
||||
imageAlt: "elegant department store clothing collection",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/people-enjoy-shopping_53876-20708.jpg",
|
||||
imageAlt: "elegant department store clothing collection",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Elevate Your Everyday"
|
||||
description="Discover a curated collection of premium goods, fashion, and home essentials designed to inspire."
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/girl-library_1150-18018.jpg", imageAlt: "elegant department store clothing collection" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/vintage-modern-restaurant-with-full-comfort_140725-9761.jpg", imageAlt: "elegant department store clothing collection" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/asian-women-looking-something-phone_23-2149122958.jpg", imageAlt: "elegant department store clothing collection" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/empty-trendy-clothing-store-selling-fashionable-items-shoes_482257-93115.jpg", imageAlt: "elegant department store clothing collection" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/girl-with-shopping-bags-looking-window_23-2148286185.jpg", imageAlt: "elegant department store clothing collection" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/people-enjoy-shopping_53876-20708.jpg", imageAlt: "elegant department store clothing collection" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "Lumina",
|
||||
name: "Modern Chronograph",
|
||||
price: "$299",
|
||||
rating: 5,
|
||||
reviewCount: "128",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/crop-hands-using-smartwatch_23-2147800900.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "Velvet",
|
||||
name: "Leather Tote Bag",
|
||||
price: "$150",
|
||||
rating: 4,
|
||||
reviewCount: "89",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashionable-women-collection-multi-colored-leather-purses-generated-by-ai_188544-37924.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
brand: "HomeStyle",
|
||||
name: "Artisan Ceramic Vase",
|
||||
price: "$85",
|
||||
rating: 5,
|
||||
reviewCount: "42",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/indoors-furniture-table-dressing-elegant_1203-4647.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
brand: "Aura",
|
||||
name: "Signature Scent",
|
||||
price: "$120",
|
||||
rating: 4,
|
||||
reviewCount: "215",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/women-s-day-still-life-with-makeup-jewelry_23-2149263199.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
brand: "Stride",
|
||||
name: "Minimalist Sneakers",
|
||||
price: "$180",
|
||||
rating: 5,
|
||||
reviewCount: "96",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/huge-variety-female-shoes-bags-different-colors-shelves-shop_627829-10303.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
brand: "LuxWare",
|
||||
name: "Premium Wool Coat",
|
||||
price: "$350",
|
||||
rating: 5,
|
||||
reviewCount: "54",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/rack-with-overclothes-shop_23-2147784096.jpg",
|
||||
},
|
||||
]}
|
||||
title="New Arrivals"
|
||||
description="Explore our latest selection of premium department store essentials."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", brand: "Lumina", name: "Modern Chronograph", price: "$299", rating: 5, reviewCount: "128", imageSrc: "http://img.b2bpic.net/free-photo/crop-hands-using-smartwatch_23-2147800900.jpg" },
|
||||
{ id: "p2", brand: "Velvet", name: "Leather Tote Bag", price: "$150", rating: 4, reviewCount: "89", imageSrc: "http://img.b2bpic.net/free-photo/fashionable-women-collection-multi-colored-leather-purses-generated-by-ai_188544-37924.jpg" },
|
||||
{ id: "p3", brand: "HomeStyle", name: "Artisan Ceramic Vase", price: "$85", rating: 5, reviewCount: "42", imageSrc: "http://img.b2bpic.net/free-photo/indoors-furniture-table-dressing-elegant_1203-4647.jpg" },
|
||||
{ id: "p4", brand: "Aura", name: "Signature Scent", price: "$120", rating: 4, reviewCount: "215", imageSrc: "http://img.b2bpic.net/free-photo/women-s-day-still-life-with-makeup-jewelry_23-2149263199.jpg" },
|
||||
{ id: "p5", brand: "Stride", name: "Minimalist Sneakers", price: "$180", rating: 5, reviewCount: "96", imageSrc: "http://img.b2bpic.net/free-photo/huge-variety-female-shoes-bags-different-colors-shelves-shop_627829-10303.jpg" },
|
||||
{ id: "p6", brand: "LuxWare", name: "Premium Wool Coat", price: "$350", rating: 5, reviewCount: "54", imageSrc: "http://img.b2bpic.net/free-photo/rack-with-overclothes-shop_23-2147784096.jpg" },
|
||||
]}
|
||||
title="New Arrivals"
|
||||
description="Explore our latest selection of premium department store essentials."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={true}
|
||||
title="Quality You Trust"
|
||||
description={[
|
||||
"For over three decades, we have been bringing high-quality products to your doorstep.",
|
||||
"Our departmental store combines luxury aesthetics with accessible pricing to provide a truly exceptional shopping experience.",
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={true}
|
||||
title="Quality You Trust"
|
||||
description={[
|
||||
"For over three decades, we have been bringing high-quality products to your doorstep.", "Our departmental store combines luxury aesthetics with accessible pricing to provide a truly exceptional shopping experience."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Fast Shipping",
|
||||
author: "Delivery",
|
||||
description: "Get your items within 2-3 business days.",
|
||||
tags: [
|
||||
"Reliable",
|
||||
"Fast",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-pretty-woman-wearing-christmas-hat-isolated_140725-100465.jpg",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Easy Returns",
|
||||
author: "Service",
|
||||
description: "Hassle-free 30-day return policy on all items.",
|
||||
tags: [
|
||||
"Safe",
|
||||
"Simple",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/pre-order-label-collection_23-2148795521.jpg",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Premium Support",
|
||||
author: "Support",
|
||||
description: "Dedicated assistance via chat and email 24/7.",
|
||||
tags: [
|
||||
"Care",
|
||||
"Help",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-being-excited-by-special-offers-internet_23-2148404325.jpg",
|
||||
},
|
||||
]}
|
||||
title="Why Shop With Us?"
|
||||
description="We strive to offer a frictionless shopping experience that puts our customers first."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "f1", title: "Fast Shipping", author: "Delivery", description: "Get your items within 2-3 business days.", tags: ["Reliable", "Fast"], imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-pretty-woman-wearing-christmas-hat-isolated_140725-100465.jpg" },
|
||||
{ id: "f2", title: "Easy Returns", author: "Service", description: "Hassle-free 30-day return policy on all items.", tags: ["Safe", "Simple"], imageSrc: "http://img.b2bpic.net/free-vector/pre-order-label-collection_23-2148795521.jpg" },
|
||||
{ id: "f3", title: "Premium Support", author: "Support", description: "Dedicated assistance via chat and email 24/7.", tags: ["Care", "Help"], imageSrc: "http://img.b2bpic.net/free-photo/man-being-excited-by-special-offers-internet_23-2148404325.jpg" },
|
||||
]}
|
||||
title="Why Shop With Us?"
|
||||
description="We strive to offer a frictionless shopping experience that puts our customers first."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Emma R.",
|
||||
handle: "@emmar",
|
||||
testimonial: "The collection is always curated with such style. Love my recent coat purchase!",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-with-shopping-bags_23-2148225588.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "James L.",
|
||||
handle: "@jamesl",
|
||||
testimonial: "Shipping was lightning fast and the quality exceeded my expectations.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-purchases_23-2147652094.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Sophia K.",
|
||||
handle: "@sophiak",
|
||||
testimonial: "My go-to store for all home décor needs. Always something new and elegant.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-woman-with-eyeglasses-holding-shopping-bags_23-2147823601.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Marcus B.",
|
||||
handle: "@marcusb",
|
||||
testimonial: "Excellent customer support and very simple return process. Highly recommend.",
|
||||
rating: 4,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-redhead-man-buying-gifts-holding-shopping-bags-smiling-standing-pink-background_1258-145649.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Chloe T.",
|
||||
handle: "@chloet",
|
||||
testimonial: "Simply the best shopping experience I've had. Everything is high quality.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/successful-shopping-with-best-friends_329181-8030.jpg",
|
||||
},
|
||||
]}
|
||||
showRating={true}
|
||||
title="Loved by Shoppers"
|
||||
description="See why customers choose Lumina for their everyday needs."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Emma R.", handle: "@emmar", testimonial: "The collection is always curated with such style. Love my recent coat purchase!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-with-shopping-bags_23-2148225588.jpg" },
|
||||
{ id: "t2", name: "James L.", handle: "@jamesl", testimonial: "Shipping was lightning fast and the quality exceeded my expectations.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-purchases_23-2147652094.jpg" },
|
||||
{ id: "t3", name: "Sophia K.", handle: "@sophiak", testimonial: "My go-to store for all home décor needs. Always something new and elegant.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-woman-with-eyeglasses-holding-shopping-bags_23-2147823601.jpg" },
|
||||
{ id: "t4", name: "Marcus B.", handle: "@marcusb", testimonial: "Excellent customer support and very simple return process. Highly recommend.", rating: 4, imageSrc: "http://img.b2bpic.net/free-photo/cheerful-redhead-man-buying-gifts-holding-shopping-bags-smiling-standing-pink-background_1258-145649.jpg" },
|
||||
{ id: "t5", name: "Chloe T.", handle: "@chloet", testimonial: "Simply the best shopping experience I've had. Everything is high quality.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/successful-shopping-with-best-friends_329181-8030.jpg" },
|
||||
]}
|
||||
showRating={true}
|
||||
title="Loved by Shoppers"
|
||||
description="See why customers choose Lumina for their everyday needs."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How long is shipping?",
|
||||
content: "Orders typically arrive within 2-3 business days.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Can I return items?",
|
||||
content: "Yes, we offer a 30-day hassle-free return policy.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Is customer support available?",
|
||||
content: "Yes, our support team is available 24/7.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/african-american-employee-preparing-bag-with-purchase-elderly-client-modern-boutique-fashionable-woman-buying-stylish-casual-wear-store-making-electronic-payment-pos-terminal_482257-71889.jpg"
|
||||
title="Common Questions"
|
||||
description="Find answers to our most frequently asked questions here."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "q1", title: "How long is shipping?", content: "Orders typically arrive within 2-3 business days." },
|
||||
{ id: "q2", title: "Can I return items?", content: "Yes, we offer a 30-day hassle-free return policy." },
|
||||
{ id: "q3", title: "Is customer support available?", content: "Yes, our support team is available 24/7." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/african-american-employee-preparing-bag-with-purchase-elderly-client-modern-boutique-fashionable-woman-buying-stylish-casual-wear-store-making-electronic-payment-pos-terminal_482257-71889.jpg"
|
||||
title="Common Questions"
|
||||
description="Find answers to our most frequently asked questions here."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
tag="Contact Us"
|
||||
title="Need Help?"
|
||||
description="Have specific questions about our products or your order? We are here to help."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Support",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
tag="Contact Us"
|
||||
title="Need Help?"
|
||||
description="Have specific questions about our products or your order? We are here to help."
|
||||
buttons={[{ text: "Contact Support", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Lumina Dept"
|
||||
leftLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Lumina Dept"
|
||||
leftLink={{ text: "Terms of Service", href: "#" }}
|
||||
rightLink={{ text: "Privacy Policy", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user