Merge version_1 into main #2
240
src/app/page.tsx
240
src/app/page.tsx
@@ -33,21 +33,13 @@ export default function LandingPage() {
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Collection",
|
||||
id: "products",
|
||||
},
|
||||
name: "Collection", id: "products"},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
name: "Testimonials", id: "testimonials"},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "faq",
|
||||
},
|
||||
name: "FAQ", id: "faq"},
|
||||
]}
|
||||
brandName="Lumina Skincare"
|
||||
/>
|
||||
@@ -56,72 +48,45 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
variant: "gradient-bars"}}
|
||||
title="Radiance Refined"
|
||||
description="Discover a new standard of clean, minimalist luxury skincare designed to rejuvenate your natural beauty with every application."
|
||||
kpis={[
|
||||
{
|
||||
value: "100%",
|
||||
label: "Natural Ingredients",
|
||||
},
|
||||
value: "100%", label: "Natural Ingredients"},
|
||||
{
|
||||
value: "24h",
|
||||
label: "Active Hydration",
|
||||
},
|
||||
value: "24h", label: "Active Hydration"},
|
||||
{
|
||||
value: "50k+",
|
||||
label: "Happy Customers",
|
||||
},
|
||||
value: "50k+", label: "Happy Customers"},
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/make-up-concept-with-foundation_23-2149030367.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/make-up-concept-with-foundation_23-2149030367.jpg"
|
||||
imageAlt="Luxurious skincare products on stone"
|
||||
mediaAnimation="blur-reveal"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-happy-fit-girl-sportswear-laughing_1153-7828.jpg",
|
||||
alt: "Happy woman with radiant skin",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-happy-fit-girl-sportswear-laughing_1153-7828.jpg", alt: "Happy woman with radiant skin"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/happy-serene-young-woman-with-beautiful-olive-skin-curly-hair-ideal-skin-brown-eyes-studio_633478-1098.jpg",
|
||||
alt: "Serene woman with clear complexion",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/happy-serene-young-woman-with-beautiful-olive-skin-curly-hair-ideal-skin-brown-eyes-studio_633478-1098.jpg", alt: "Serene woman with clear complexion"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/natural-beauty-portrait-beautiful-spa-woman-perfect-fresh-skin_1258-135256.jpg",
|
||||
alt: "Natural beauty spa model",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/natural-beauty-portrait-beautiful-spa-woman-perfect-fresh-skin_1258-135256.jpg", alt: "Natural beauty spa model"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-friendly-amazed-young-caucasian-female-stylish-top-with-open-shoulders-looking-with-happy-excited-smile-keeping-hands-her-chest-expressing-positive-attitude_343059-2985.jpg",
|
||||
alt: "Happy customer smiling",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-friendly-amazed-young-caucasian-female-stylish-top-with-open-shoulders-looking-with-happy-excited-smile-keeping-hands-her-chest-expressing-positive-attitude_343059-2985.jpg", alt: "Happy customer smiling"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-beautiful-woman-lying-bed-early-morning_176420-3629.jpg",
|
||||
alt: "Radiant woman in morning light",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/young-beautiful-woman-lying-bed-early-morning_176420-3629.jpg", alt: "Radiant woman in morning light"},
|
||||
]}
|
||||
avatarText="Join 50k+ radiant souls"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Cruelty-Free",
|
||||
},
|
||||
type: "text", text: "Cruelty-Free"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Sustainable Glass",
|
||||
},
|
||||
type: "text", text: "Sustainable Glass"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Dermatologist Approved",
|
||||
},
|
||||
type: "text", text: "Dermatologist Approved"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Ethically Sourced",
|
||||
},
|
||||
type: "text", text: "Ethically Sourced"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Clinical Efficacy",
|
||||
},
|
||||
type: "text", text: "Clinical Efficacy"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -134,7 +99,7 @@ export default function LandingPage() {
|
||||
description="At Lumina, we believe in the power of botanical purity balanced with clinical precision. Every product is ethically sourced and rigorously tested for maximum efficacy."
|
||||
subdescription="Our minimalist approach eliminates unnecessary chemicals, focusing instead on the nutrients your skin truly needs."
|
||||
icon={Sparkles}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/top-view-rosemary-coconut-orange-products_23-2148337505.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/top-view-rosemary-coconut-orange-products_23-2148337505.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
@@ -146,28 +111,13 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Vegan Formula",
|
||||
description: "100% cruelty-free ingredients.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Leaf,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/elegant-businessman-presenting-business-card_23-2148012931.jpg",
|
||||
imageAlt: "luxury gold brand logo",
|
||||
title: "Vegan Formula", description: "100% cruelty-free ingredients.", bentoComponent: "reveal-icon", icon: Leaf,
|
||||
},
|
||||
{
|
||||
title: "Recyclable Glass",
|
||||
description: "Sustainable packaging solutions.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Recycle,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/make-up-concept-with-foundation_23-2149030367.jpg?_wi=2",
|
||||
imageAlt: "luxury gold brand logo",
|
||||
title: "Recyclable Glass", description: "Sustainable packaging solutions.", bentoComponent: "reveal-icon", icon: Recycle,
|
||||
},
|
||||
{
|
||||
title: "Dermatologist Tested",
|
||||
description: "Clinical safety and efficacy.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: ShieldCheck,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-rosemary-coconut-orange-products_23-2148337505.jpg?_wi=2",
|
||||
imageAlt: "luxury gold brand logo",
|
||||
title: "Dermatologist Tested", description: "Clinical safety and efficacy.", bentoComponent: "reveal-icon", icon: ShieldCheck,
|
||||
},
|
||||
]}
|
||||
title="The Lumina Standard"
|
||||
@@ -183,41 +133,17 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Hydration Serum",
|
||||
price: "$85",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/nail-serum-with-plant_23-2149046487.jpg",
|
||||
},
|
||||
id: "1", name: "Hydration Serum", price: "$85", imageSrc: "http://img.b2bpic.net/free-photo/nail-serum-with-plant_23-2149046487.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Day Cream",
|
||||
price: "$65",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/ecofriendly-beauty-product_23-2150669117.jpg",
|
||||
},
|
||||
id: "2", name: "Day Cream", price: "$65", imageSrc: "http://img.b2bpic.net/free-photo/ecofriendly-beauty-product_23-2150669117.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Cleansing Oil",
|
||||
price: "$45",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-healthy-argan-oil-arrangement_23-2148989094.jpg",
|
||||
},
|
||||
id: "3", name: "Cleansing Oil", price: "$45", imageSrc: "http://img.b2bpic.net/free-photo/front-view-healthy-argan-oil-arrangement_23-2148989094.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Night Mask",
|
||||
price: "$95",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-skin-regeneration-products_23-2151242185.jpg",
|
||||
},
|
||||
id: "4", name: "Night Mask", price: "$95", imageSrc: "http://img.b2bpic.net/free-photo/close-up-skin-regeneration-products_23-2151242185.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Balancing Toner",
|
||||
price: "$50",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-assortment-cosmetic-products_23-2148619984.jpg",
|
||||
},
|
||||
id: "5", name: "Balancing Toner", price: "$50", imageSrc: "http://img.b2bpic.net/free-photo/top-view-assortment-cosmetic-products_23-2148619984.jpg"},
|
||||
{
|
||||
id: "6",
|
||||
name: "Radiance Eye Cream",
|
||||
price: "$70",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/composition-skin-beauty-products_23-2148761497.jpg",
|
||||
},
|
||||
id: "6", name: "Radiance Eye Cream", price: "$70", imageSrc: "http://img.b2bpic.net/free-photo/composition-skin-beauty-products_23-2148761497.jpg"},
|
||||
]}
|
||||
title="Shop the Collection"
|
||||
description="Explore our curated essentials."
|
||||
@@ -230,45 +156,15 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Life Changing",
|
||||
quote: "My skin has never felt this hydrated and soft.",
|
||||
name: "Sarah J.",
|
||||
role: "Creative Director",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-beautiful-blond-lady-white-dress-looking-camera-pretty-lady-posing-indoors_549566-350.jpg",
|
||||
},
|
||||
id: "1", title: "Life Changing", quote: "My skin has never felt this hydrated and soft.", name: "Sarah J.", role: "Creative Director", imageSrc: "http://img.b2bpic.net/free-photo/happy-beautiful-blond-lady-white-dress-looking-camera-pretty-lady-posing-indoors_549566-350.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
title: "Absolute Luxury",
|
||||
quote: "Finally found products that don't irritate my sensitive skin.",
|
||||
name: "Michael R.",
|
||||
role: "Architect",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/interested-lady-posing-with-smile-jocund-young-woman-expressing-happiness_197531-14036.jpg",
|
||||
},
|
||||
id: "2", title: "Absolute Luxury", quote: "Finally found products that don't irritate my sensitive skin.", name: "Michael R.", role: "Architect", imageSrc: "http://img.b2bpic.net/free-photo/interested-lady-posing-with-smile-jocund-young-woman-expressing-happiness_197531-14036.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
title: "Simply Radiant",
|
||||
quote: "The glow is real. I get compliments all the time.",
|
||||
name: "Emily K.",
|
||||
role: "Founder",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-happy-woman-posing_23-2148263495.jpg",
|
||||
},
|
||||
id: "3", title: "Simply Radiant", quote: "The glow is real. I get compliments all the time.", name: "Emily K.", role: "Founder", imageSrc: "http://img.b2bpic.net/free-photo/close-up-happy-woman-posing_23-2148263495.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
title: "Worth Every Cent",
|
||||
quote: "High-end results without the harsh chemical feel.",
|
||||
name: "David W.",
|
||||
role: "Executive",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/lovely-woman-holding-eyeshadow-palette_23-2148398709.jpg",
|
||||
},
|
||||
id: "4", title: "Worth Every Cent", quote: "High-end results without the harsh chemical feel.", name: "David W.", role: "Executive", imageSrc: "http://img.b2bpic.net/free-photo/lovely-woman-holding-eyeshadow-palette_23-2148398709.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
title: "Pure Magic",
|
||||
quote: "Clean ingredients, powerful results. Amazing.",
|
||||
name: "Sophia L.",
|
||||
role: "Consultant",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/summer-portrait-lovely-asian-woman-with-flower-hairs-posing-garden_273443-632.jpg",
|
||||
},
|
||||
id: "5", title: "Pure Magic", quote: "Clean ingredients, powerful results. Amazing.", name: "Sophia L.", role: "Consultant", imageSrc: "http://img.b2bpic.net/free-photo/summer-portrait-lovely-asian-woman-with-flower-hairs-posing-garden_273443-632.jpg"},
|
||||
]}
|
||||
title="Loved by Thousands"
|
||||
description="Hear what our radiant community has to say."
|
||||
@@ -280,14 +176,7 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Vogue",
|
||||
"Harper's Bazaar",
|
||||
"ELLE",
|
||||
"Cosmopolitan",
|
||||
"Allure",
|
||||
"Forbes",
|
||||
"Glamour",
|
||||
]}
|
||||
"Vogue", "Harper's Bazaar", "ELLE", "Cosmopolitan", "Allure", "Forbes", "Glamour"]}
|
||||
title="As Featured In"
|
||||
description="Recognized for our dedication to luxury and cleanliness."
|
||||
/>
|
||||
@@ -298,20 +187,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Are your products cruelty-free?",
|
||||
content: "Yes, we are 100% cruelty-free and vegan.",
|
||||
},
|
||||
id: "q1", title: "Are your products cruelty-free?", content: "Yes, we are 100% cruelty-free and vegan."},
|
||||
{
|
||||
id: "q2",
|
||||
title: "What is your return policy?",
|
||||
content: "We offer a 30-day money-back guarantee.",
|
||||
},
|
||||
id: "q2", title: "What is your return policy?", content: "We offer a 30-day money-back guarantee."},
|
||||
{
|
||||
id: "q3",
|
||||
title: "How long will my order take?",
|
||||
content: "Orders typically ship within 24 hours.",
|
||||
},
|
||||
id: "q3", title: "How long will my order take?", content: "Orders typically ship within 24 hours."},
|
||||
]}
|
||||
sideTitle="Questions?"
|
||||
sideDescription="We're here to help you choose the best products for your skin."
|
||||
@@ -323,8 +203,7 @@ export default function LandingPage() {
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
variant: "plain"}}
|
||||
title="Join Our Glow Circle"
|
||||
description="Sign up for exclusive offers and skincare tips."
|
||||
tag="Stay Connected"
|
||||
@@ -335,50 +214,31 @@ export default function LandingPage() {
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Shop",
|
||||
items: [
|
||||
title: "Shop", items: [
|
||||
{
|
||||
label: "All Products",
|
||||
href: "#",
|
||||
},
|
||||
label: "All Products", href: "#"},
|
||||
{
|
||||
label: "Serum",
|
||||
href: "#",
|
||||
},
|
||||
label: "Serum", href: "#"},
|
||||
{
|
||||
label: "Moisturizer",
|
||||
href: "#",
|
||||
},
|
||||
label: "Moisturizer", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#",
|
||||
},
|
||||
label: "FAQ", href: "#"},
|
||||
{
|
||||
label: "Shipping",
|
||||
href: "#",
|
||||
},
|
||||
label: "Shipping", href: "#"},
|
||||
{
|
||||
label: "Returns",
|
||||
href: "#",
|
||||
},
|
||||
label: "Returns", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
title: "Legal", items: [
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
label: "Privacy", href: "#"},
|
||||
{
|
||||
label: "Terms",
|
||||
href: "#",
|
||||
},
|
||||
label: "Terms", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user