Merge version_1 into main

Merge version_1 into main
This commit was merged in pull request #2.
This commit is contained in:
2026-04-07 13:34:55 +00:00

View File

@@ -27,362 +27,157 @@ export default function LandingPage() {
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "Home",
id: "home",
},
{
name: "About",
id: "about",
},
{
name: "Products",
id: "products",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="Luminous"
/>
</div>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "home" },
{ name: "About", id: "about" },
{ name: "Products", id: "products" },
{ name: "Contact", id: "contact" },
]}
brandName="Luminous"
/>
</div>
<div id="home" data-section="home">
<HeroSplitDoubleCarousel
background={{
variant: "radial-gradient",
}}
title="Radiance Redefined"
description="Experience the intersection of science and nature. Our custom skincare formulations are designed to illuminate, protect, and revitalize your unique glow."
leftCarouselItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg?_wi=1",
imageAlt: "Luxurious Cream",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg?_wi=1",
imageAlt: "Clear Skin Focus",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg?_wi=2",
imageAlt: "Hydration Bottle",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg?_wi=2",
imageAlt: "Nature Ingredients",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg?_wi=3",
imageAlt: "Laboratory Research",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg?_wi=3",
imageAlt: "Fresh Face",
},
]}
rightCarouselItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg?_wi=4",
imageAlt: "Model Glow",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg?_wi=4",
imageAlt: "Serums",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg?_wi=5",
imageAlt: "Night Ritual",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg?_wi=5",
imageAlt: "Clean Beauty",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg?_wi=6",
imageAlt: "Face Massage",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg?_wi=6",
imageAlt: "Morning Ritual",
},
]}
buttons={[
{
text: "Shop Collections",
href: "#products",
},
]}
avatars={[
{
src: "http://img.b2bpic.net/free-photo/young-woman-beauty-portrait_23-2149400978.jpg",
alt: "User 1",
},
{
src: "http://img.b2bpic.net/free-photo/portrait-fashion-model-posing-photo-studio-sensitive-sensual-lady-with-long-brown-hair-hugging-herself_549566-813.jpg",
alt: "User 2",
},
{
src: "http://img.b2bpic.net/free-photo/portrait-plus-size-women-doing-their-beauty-regimen-skincare-routine_23-2150571327.jpg",
alt: "User 3",
},
{
src: "http://img.b2bpic.net/free-photo/portrait-mid-adult-businessman-with-interested-expression-touching-his-chin_1262-12850.jpg",
alt: "User 4",
},
{
src: "http://img.b2bpic.net/free-photo/gorgeous-ballet-dancer-ballerina-pointe-girl-by-window_1157-43902.jpg",
alt: "User 5",
},
]}
avatarText="Join 10,000+ radiant customers"
marqueeItems={[
{
type: "image",
src: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg",
alt: "Brand Partner",
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg",
alt: "Brand Partner",
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg",
alt: "Brand Partner",
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg",
alt: "Brand Partner",
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg",
alt: "Brand Partner",
},
]}
/>
</div>
<div id="home" data-section="home">
<HeroSplitDoubleCarousel
background={{ variant: "radial-gradient" }}
title="Radiance Redefined"
description="Experience the intersection of science and nature. Our custom skincare formulations are designed to illuminate, protect, and revitalize your unique glow."
leftCarouselItems={[
{ imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg", imageAlt: "Luxurious Cream" },
{ imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg", imageAlt: "Clear Skin Focus" },
{ imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg", imageAlt: "Hydration Bottle" },
{ imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg", imageAlt: "Nature Ingredients" },
{ imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg", imageAlt: "Laboratory Research" },
{ imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg", imageAlt: "Fresh Face" },
]}
rightCarouselItems={[
{ imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg", imageAlt: "Model Glow" },
{ imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg", imageAlt: "Serums" },
{ imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg", imageAlt: "Night Ritual" },
{ imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg", imageAlt: "Clean Beauty" },
{ imageSrc: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg", imageAlt: "Face Massage" },
{ imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg", imageAlt: "Morning Ritual" },
]}
buttons={[{ text: "Shop Collections", href: "#products" }]}
avatars={[
{ src: "http://img.b2bpic.net/free-photo/young-woman-beauty-portrait_23-2149400978.jpg", alt: "User 1" },
{ src: "http://img.b2bpic.net/free-photo/portrait-fashion-model-posing-photo-studio-sensitive-sensual-lady-with-long-brown-hair-hugging-herself_549566-813.jpg", alt: "User 2" },
{ src: "http://img.b2bpic.net/free-photo/portrait-plus-size-women-doing-their-beauty-regimen-skincare-routine_23-2150571327.jpg", alt: "User 3" },
{ src: "http://img.b2bpic.net/free-photo/portrait-mid-adult-businessman-with-interested-expression-touching-his-chin_1262-12850.jpg", alt: "User 4" },
{ src: "http://img.b2bpic.net/free-photo/gorgeous-ballet-dancer-ballerina-pointe-girl-by-window_1157-43902.jpg", alt: "User 5" },
]}
avatarText="Join 10,000+ radiant customers"
marqueeItems={[
{ type: "image", src: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg", alt: "Brand Partner" },
{ type: "image", src: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg", alt: "Brand Partner" },
{ type: "image", src: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg", alt: "Brand Partner" },
{ type: "image", src: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307225.jpg", alt: "Brand Partner" },
{ type: "image", src: "http://img.b2bpic.net/free-photo/beauty-woman-face-closeup-isolated-black-background-beautiful-model-girl-makeup-gorgeous-lady-with-perfect-skin_639032-159.jpg", alt: "Brand Partner" },
]}
/>
</div>
<div id="about" data-section="about">
<SplitAbout
textboxLayout="split"
useInvertedBackground={true}
title="The Science of Glow"
description="At Luminous, we believe skincare is a ritual, not a chore. We use pure, potent ingredients to create formulas that work deep within your skin layers to restore brightness and vitality."
bulletPoints={[
{
title: "Vegan Ingredients",
description: "100% plant-based components for conscious beauty.",
},
{
title: "Cruelty Free",
description: "No animal testing, ever.",
},
{
title: "Dermatologist Approved",
description: "Formulated by experts for maximum effectiveness.",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/woman-patient-medical-office-doctor-medical-mask-doctor-use-computer_1157-48564.jpg"
imageAlt="Laboratory research"
/>
</div>
<div id="about" data-section="about">
<SplitAbout
textboxLayout="split"
useInvertedBackground={true}
title="The Science of Glow"
description="At Luminous, we believe skincare is a ritual, not a chore. We use pure, potent ingredients to create formulas that work deep within your skin layers to restore brightness and vitality."
bulletPoints={[
{ title: "Vegan Ingredients", description: "100% plant-based components for conscious beauty." },
{ title: "Cruelty Free", description: "No animal testing, ever." },
{ title: "Dermatologist Approved", description: "Formulated by experts for maximum effectiveness." },
]}
imageSrc="http://img.b2bpic.net/free-photo/woman-patient-medical-office-doctor-medical-mask-doctor-use-computer_1157-48564.jpg"
imageAlt="Laboratory research"
/>
</div>
<div id="products" data-section="products">
<ProductCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Hydrating Serum",
price: "$85",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg?_wi=1",
imageAlt: "Serum Bottle",
},
{
id: "p2",
name: "Night Recovery Cream",
price: "$120",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg?_wi=2",
imageAlt: "Night Cream",
},
{
id: "p3",
name: "Gentle Cleanser",
price: "$45",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg?_wi=3",
imageAlt: "Cleanser",
},
{
id: "p4",
name: "Daily Sun Shield",
price: "$60",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg?_wi=4",
imageAlt: "Sun Shield",
},
{
id: "p5",
name: "Brightening Toner",
price: "$50",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg?_wi=5",
imageAlt: "Toner",
},
{
id: "p6",
name: "Eye Revive Gel",
price: "$70",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg?_wi=6",
imageAlt: "Eye Gel",
},
]}
title="Our Signature Ritual"
description="Explore our curated selection of high-performance skincare products."
/>
</div>
<div id="products" data-section="products">
<ProductCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
products={[
{ id: "p1", name: "Hydrating Serum", price: "$85", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg", imageAlt: "Serum Bottle" },
{ id: "p2", name: "Night Recovery Cream", price: "$120", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg", imageAlt: "Night Cream" },
{ id: "p3", name: "Gentle Cleanser", price: "$45", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg", imageAlt: "Cleanser" },
{ id: "p4", name: "Daily Sun Shield", price: "$60", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg", imageAlt: "Sun Shield" },
{ id: "p5", name: "Brightening Toner", price: "$50", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg", imageAlt: "Toner" },
{ id: "p6", name: "Eye Revive Gel", price: "$70", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286703.jpg", imageAlt: "Eye Gel" },
]}
title="Our Signature Ritual"
description="Explore our curated selection of high-performance skincare products."
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentyEight
textboxLayout="default"
useInvertedBackground={true}
features={[
{
id: "f1",
title: "Deep Hydration",
subtitle: "Lasts 24 hours",
category: "Moisture",
value: "98%",
},
{
id: "f2",
title: "Skin Brightening",
subtitle: "Visible in 2 weeks",
category: "Radiance",
value: "85%",
},
{
id: "f3",
title: "Elasticity Boost",
subtitle: "Targets fine lines",
category: "Anti-Aging",
value: "92%",
},
]}
title="Key Benefits"
description="Why choose Luminous for your skin journey?"
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentyEight
textboxLayout="default"
useInvertedBackground={true}
animationType="slide-up"
features={[
{ id: "f1", title: "Deep Hydration", subtitle: "Lasts 24 hours", category: "Moisture", value: "98%" },
{ id: "f2", title: "Skin Brightening", subtitle: "Visible in 2 weeks", category: "Radiance", value: "85%" },
{ id: "f3", title: "Elasticity Boost", subtitle: "Targets fine lines", category: "Anti-Aging", value: "92%" },
]}
title="Key Benefits"
description="Why choose Luminous for your skin journey?"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1",
name: "Sarah J.",
handle: "@sarahglowing",
testimonial: "My skin has never felt better! The hydrating serum is absolute perfection.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-beauty-portrait_23-2149400978.jpg",
},
{
id: "2",
name: "Elena M.",
handle: "@elena_skin",
testimonial: "Finally found products that don't cause breakouts. Truly life-changing.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-fashion-model-posing-photo-studio-sensitive-sensual-lady-with-long-brown-hair-hugging-herself_549566-813.jpg",
},
{
id: "3",
name: "Liam T.",
handle: "@liam_care",
testimonial: "I love the clean ingredients list. Feels great knowing what's on my face.",
rating: 4,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-plus-size-women-doing-their-beauty-regimen-skincare-routine_23-2150571327.jpg",
},
{
id: "4",
name: "Chloe R.",
handle: "@chloer",
testimonial: "The eye gel is my holy grail product now.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-mid-adult-businessman-with-interested-expression-touching-his-chin_1262-12850.jpg",
},
{
id: "5",
name: "Jason K.",
handle: "@jason_beauty",
testimonial: "Clean, effective, and elegant branding. A new staple in my routine.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/gorgeous-ballet-dancer-ballerina-pointe-girl-by-window_1157-43902.jpg",
},
]}
showRating={true}
title="Loved by Thousands"
description="Don't just take our word for it—listen to our glowing customers."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{ id: "1", name: "Sarah J.", handle: "@sarahglowing", testimonial: "My skin has never felt better! The hydrating serum is absolute perfection.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-woman-beauty-portrait_23-2149400978.jpg" },
{ id: "2", name: "Elena M.", handle: "@elena_skin", testimonial: "Finally found products that don't cause breakouts. Truly life-changing.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-fashion-model-posing-photo-studio-sensitive-sensual-lady-with-long-brown-hair-hugging-herself_549566-813.jpg" },
{ id: "3", name: "Liam T.", handle: "@liam_care", testimonial: "I love the clean ingredients list. Feels great knowing what's on my face.", rating: 4, imageSrc: "http://img.b2bpic.net/free-photo/portrait-plus-size-women-doing-their-beauty-regimen-skincare-routine_23-2150571327.jpg" },
{ id: "4", name: "Chloe R.", handle: "@chloer", testimonial: "The eye gel is my holy grail product now.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-mid-adult-businessman-with-interested-expression-touching-his-chin_1262-12850.jpg" },
{ id: "5", name: "Jason K.", handle: "@jason_beauty", testimonial: "Clean, effective, and elegant branding. A new staple in my routine.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/gorgeous-ballet-dancer-ballerina-pointe-girl-by-window_1157-43902.jpg" },
]}
showRating={true}
title="Loved by Thousands"
description="Don't just take our word for it—listen to our glowing customers."
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
useInvertedBackground={true}
faqs={[
{
id: "q1",
title: "Are products vegan?",
content: "Yes, all our ingredients are entirely plant-based and cruelty-free.",
},
{
id: "q2",
title: "How long until results?",
content: "You will notice a difference in skin texture within 2 weeks of consistent use.",
},
{
id: "q3",
title: "Shipping information?",
content: "We offer free shipping on all orders over $75 within the country.",
},
]}
sideTitle="Questions?"
sideDescription="We're here to help you understand our products and routines."
faqsAnimation="blur-reveal"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
useInvertedBackground={true}
faqs={[
{ id: "q1", title: "Are products vegan?", content: "Yes, all our ingredients are entirely plant-based and cruelty-free." },
{ id: "q2", title: "How long until results?", content: "You will notice a difference in skin texture within 2 weeks of consistent use." },
{ id: "q3", title: "Shipping information?", content: "We offer free shipping on all orders over $75 within the country." },
]}
sideTitle="Questions?"
sideDescription="We're here to help you understand our products and routines."
faqsAnimation="blur-reveal"
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={false}
background={{
variant: "plain",
}}
tag="Get Started"
title="Ready for your best skin?"
description="Sign up for our newsletter to get skincare tips and exclusive offers directly in your inbox."
buttons={[
{
text: "Join Newsletter",
},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={false}
background={{ variant: "plain" }}
tag="Get Started"
title="Ready for your best skin?"
description="Sign up for our newsletter to get skincare tips and exclusive offers directly in your inbox."
buttons={[{ text: "Join Newsletter" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Luminous"
copyrightText="© 2025 | Luminous Skincare"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Luminous"
copyrightText="© 2025 | Luminous Skincare"
/>
</div>
</ReactLenis>
</ThemeProvider>
);