Update src/app/page.tsx
This commit is contained in:
432
src/app/page.tsx
432
src/app/page.tsx
@@ -32,22 +32,12 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Products", id: "/products" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Login", id: "/login" },
|
||||
{ name: "Cart", id: "/cart" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
brandName="LUXE"
|
||||
/>
|
||||
@@ -56,387 +46,11 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardTestimonial
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Timeless Elegance, Crafted for You"
|
||||
description="Discover our collection of hand-curated pieces that define modern luxury. Simple, refined, and made to last."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Elena R.",
|
||||
handle: "@elena_luxury",
|
||||
testimonial: "The attention to detail in every single piece is incredible. Truly elevated.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/arrangement-skin-care-cream_23-2148761493.jpg?_wi=1",
|
||||
imageAlt: "luxury lifestyle fashion photography",
|
||||
},
|
||||
{
|
||||
name: "Marcus J.",
|
||||
handle: "@mj_style",
|
||||
testimonial: "Sophisticated designs that fit perfectly into my daily lifestyle.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/carpenter-using-screwdriver-wood_23-2148643198.jpg?_wi=1",
|
||||
imageAlt: "luxury lifestyle fashion photography",
|
||||
},
|
||||
{
|
||||
name: "Sarah W.",
|
||||
handle: "@sarah_w",
|
||||
testimonial: "Exceptional quality and a seamless shopping experience.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/round-gold-podium-minimal-pedestal-product-display-background-3d-rendering_56104-1272.jpg?_wi=1",
|
||||
imageAlt: "luxury lifestyle fashion photography",
|
||||
},
|
||||
{
|
||||
name: "David L.",
|
||||
handle: "@david_l",
|
||||
testimonial: "Minimalist at its absolute best. Highly recommend.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-beauty-products-flowers_23-2149353144.jpg?_wi=1",
|
||||
imageAlt: "luxury lifestyle fashion photography",
|
||||
},
|
||||
{
|
||||
name: "Chloe B.",
|
||||
handle: "@chloe_b",
|
||||
testimonial: "So soft, so beautiful. The luxury aesthetic is unmatched.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/apple-blue-table-isolated-orange_171337-13161.jpg?_wi=1",
|
||||
imageAlt: "luxury lifestyle fashion photography",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/arrangement-skin-care-cream_23-2148761493.jpg?_wi=2"
|
||||
imageAlt="luxury lifestyle fashion photography"
|
||||
testimonials={[]}
|
||||
mediaAnimation="blur-reveal"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/abstract-minimal-kitchen-objects_23-2148835348.jpg",
|
||||
alt: "Abstract minimal kitchen objects",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/modern-round-wireless-speaker-with-slick-design-floating-concrete-background_23-2150808029.jpg",
|
||||
alt: "Modern round wireless speaker with slick design floating on concrete background",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-elegant-beauty-selfcare-treatment_23-2149238337.jpg",
|
||||
alt: "Close up on elegant beauty selfcare treatment",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/view-charcoal-different-forms_23-2149654126.jpg",
|
||||
alt: "View of charcoal in different forms",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-woman-sitting-chair_23-2149241411.jpg",
|
||||
alt: "Close up woman sitting on chair",
|
||||
},
|
||||
]}
|
||||
avatarText="Join 5,000+ luxury enthusiasts"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "100% Sustainable",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Hand-Crafted Quality",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Global Shipping",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Timeless Design",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Ethical Production",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Designed with Purpose"
|
||||
description="We believe in less, but better. Our process balances artistic vision with sustainable, premium craftsmanship."
|
||||
metrics={[
|
||||
{
|
||||
value: "100%",
|
||||
title: "Premium Quality",
|
||||
},
|
||||
{
|
||||
value: "15+",
|
||||
title: "Artisanal Partners",
|
||||
},
|
||||
{
|
||||
value: "24h",
|
||||
title: "Support",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/carpenter-using-screwdriver-wood_23-2148643198.jpg?_wi=2"
|
||||
imageAlt="craftsmanship close up focus"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "LUXE",
|
||||
name: "Silk Minimal Scarf",
|
||||
price: "$120",
|
||||
rating: 5,
|
||||
reviewCount: "128",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/round-gold-podium-minimal-pedestal-product-display-background-3d-rendering_56104-1272.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "LUXE",
|
||||
name: "Leather Cardholder",
|
||||
price: "$85",
|
||||
rating: 5,
|
||||
reviewCount: "92",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-beauty-products-flowers_23-2149353144.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
brand: "LUXE",
|
||||
name: "Canvas Tote Bag",
|
||||
price: "$160",
|
||||
rating: 4,
|
||||
reviewCount: "75",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/apple-blue-table-isolated-orange_171337-13161.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
brand: "LUXE",
|
||||
name: "Gold Minimalist Ring",
|
||||
price: "$250",
|
||||
rating: 5,
|
||||
reviewCount: "156",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/serious-looking-young-female-picking-design-magazines-vintage-store-standing-stylish-brown-dress_197531-23028.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
brand: "LUXE",
|
||||
name: "Ceramic Tea Set",
|
||||
price: "$180",
|
||||
rating: 5,
|
||||
reviewCount: "48",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-strong-independent-successful-businesswoman-wearing-smart-casual-clothing-glasses-working-laptop-cafe-black-white-photo_627829-9836.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
brand: "LUXE",
|
||||
name: "Hand-dyed Throw",
|
||||
price: "$320",
|
||||
rating: 5,
|
||||
reviewCount: "34",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/apple-near-glass-with-juice-mirror-blue-table-isolated_171337-13154.jpg",
|
||||
},
|
||||
]}
|
||||
title="Featured Collections"
|
||||
description="Explore our core lineup, curated for the refined minimalist."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentySeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Premium Materials",
|
||||
descriptions: [
|
||||
"Sourced responsibly from the finest suppliers across the globe.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-abstract-art-cover-collection_23-2148978362.jpg",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Timeless Design",
|
||||
descriptions: [
|
||||
"Created to outlast seasonal trends and remain elegant for decades.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/leaf-shield-set-four_78370-9083.jpg",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Ethical Making",
|
||||
descriptions: [
|
||||
"Supporting artisans with fair wages and safe working conditions.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/premium-quality_23-2147502658.jpg",
|
||||
},
|
||||
]}
|
||||
title="Why Choose Us"
|
||||
description="Excellence in design and ethical standards drive our brand mission."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Alex B.",
|
||||
role: "Collector",
|
||||
company: "DesignCo",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gorgeous-smiling-blonde-fashion-model-sits-white-suit-soft-armchair_8353-5476.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Jamie D.",
|
||||
role: "Architect",
|
||||
company: "ArchStudio",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-blonde-businesswoman-smiling-happy-standing-city_839833-16454.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Riley P.",
|
||||
role: "Designer",
|
||||
company: "CreativeLab",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-lady-black-jacket-posing-isolated-background-happy-cheerful-woman-dark-suit-laughing-looking-into-camera_197531-18513.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Sam T.",
|
||||
role: "Director",
|
||||
company: "BrandFocus",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/thoughtful-woman-reading-book-christmas-decorated-home-holiday-concept-christmas-holidays-people-concept_1391-902.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Jordan M.",
|
||||
role: "Founder",
|
||||
company: "StyleHouse",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67131.jpg",
|
||||
},
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "5K+",
|
||||
label: "Happy Clients",
|
||||
},
|
||||
{
|
||||
value: "4.9/5",
|
||||
label: "Avg Rating",
|
||||
},
|
||||
{
|
||||
value: "95%",
|
||||
label: "Referrals",
|
||||
},
|
||||
]}
|
||||
title="Client Experiences"
|
||||
description="What our community says about their Luxe experience."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Do you ship worldwide?",
|
||||
content: "Yes, we ship to over 50 countries globally with tracking.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "How is the quality ensured?",
|
||||
content: "Every piece undergoes strict quality assurance before shipment.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Can I return products?",
|
||||
content: "We offer a 30-day return policy for unused items.",
|
||||
},
|
||||
]}
|
||||
title="Frequent Questions"
|
||||
description="Answers to commonly asked questions about our process."
|
||||
faqsAnimation="blur-reveal"
|
||||
mediaAnimation="blur-reveal"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/carpenter-using-screwdriver-wood_23-2148643198.jpg?_wi=3"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "120+",
|
||||
title: "Designs",
|
||||
description: "Unique curated items",
|
||||
icon: Star,
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "98%",
|
||||
title: "Satisfaction",
|
||||
description: "Customer approval rating",
|
||||
icon: Award,
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "50+",
|
||||
title: "Markets",
|
||||
description: "Global shipping reach",
|
||||
icon: Globe,
|
||||
},
|
||||
]}
|
||||
title="Impact by Numbers"
|
||||
description="Our reach and customer satisfaction growth."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Get in Touch"
|
||||
description="Have questions? Our support team is ready to assist you."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email Address",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "How can we help?",
|
||||
required: true,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/carpenter-using-screwdriver-wood_23-2148643198.jpg?_wi=4"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -445,36 +59,12 @@ export default function LandingPage() {
|
||||
imageSrc="http://img.b2bpic.net/free-photo/abstract-smooth-dark-blue-with-black-vignette-studio-well-use-as-backgroundbusiness-reportdigitalwebsite-templatebackdrop_1258-94419.jpg"
|
||||
logoText="LUXE"
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
{
|
||||
label: "Returns",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ title: "Company", items: [{ label: "About Us", href: "/about" }] },
|
||||
{ title: "Support", items: [{ label: "Contact", href: "/contact" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user