Compare commits
3 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| a903e5dddb | |||
| 65b96998ec | |||
| 970b0b0e2c |
216
src/app/page.tsx
216
src/app/page.tsx
@@ -32,78 +32,45 @@ export default function LandingPage() {
|
|||||||
<NavbarLayoutFloatingOverlay
|
<NavbarLayoutFloatingOverlay
|
||||||
navItems={[
|
navItems={[
|
||||||
{
|
{
|
||||||
name: "Home",
|
name: "Home", id: "#hero"},
|
||||||
id: "#hero",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "Cream",
|
name: "Cream", id: "#product"},
|
||||||
id: "#product",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "Ingredients",
|
name: "Ingredients", id: "#ingredients"},
|
||||||
id: "#ingredients",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "Reviews",
|
name: "Reviews", id: "#blog"},
|
||||||
id: "#blog",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "FAQ",
|
name: "FAQ", id: "#faq"},
|
||||||
id: "#faq",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "Contact",
|
name: "Contact", id: "#contact"},
|
||||||
id: "#contact",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
brandName="Lumière"
|
brandName="Forwin"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
<div id="hero" data-section="hero">
|
||||||
<HeroBillboardRotatedCarousel
|
<HeroBillboardRotatedCarousel
|
||||||
background={{
|
background={{
|
||||||
variant: "rotated-rays-animated",
|
variant: "rotated-rays-animated"}}
|
||||||
}}
|
|
||||||
title="Nourish Your Natural Glow"
|
title="Nourish Your Natural Glow"
|
||||||
description="Indulge in our premium face cream, designed to revitalize, hydrate, and restore your youthful radiance with every application."
|
description="Indulge in our premium face cream, designed to revitalize, hydrate, and restore your youthful radiance with every application."
|
||||||
buttons={[
|
buttons={[
|
||||||
{
|
{
|
||||||
text: "Buy Now",
|
text: "Buy Now", href: "#product"},
|
||||||
href: "#product",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
carouselItems={[
|
carouselItems={[
|
||||||
{
|
{
|
||||||
id: "1",
|
id: "1", imageSrc: "http://img.b2bpic.net/free-photo/top-view-body-cream-pink-white-background_23-2148241790.jpg", imageAlt: "Luxury product shot"},
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-body-cream-pink-white-background_23-2148241790.jpg",
|
|
||||||
imageAlt: "Luxury product shot",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "2",
|
id: "2", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-cream-container-plant_23-2148899420.jpg", imageAlt: "Texture close up"},
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-cream-container-plant_23-2148899420.jpg",
|
|
||||||
imageAlt: "Texture close up",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "3",
|
id: "3", imageSrc: "http://img.b2bpic.net/free-photo/heap-pink-flower-petals-near-bloom_23-2148071209.jpg", imageAlt: "Botanical aesthetic"},
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/heap-pink-flower-petals-near-bloom_23-2148071209.jpg",
|
|
||||||
imageAlt: "Botanical aesthetic",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "4",
|
id: "4", imageSrc: "http://img.b2bpic.net/free-photo/happy-girl-with-natural-radiant-skin-posing-camera_482257-74897.jpg?_wi=1", imageAlt: "Model glowing skin"},
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-girl-with-natural-radiant-skin-posing-camera_482257-74897.jpg?_wi=1",
|
|
||||||
imageAlt: "Model glowing skin",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "5",
|
id: "5", imageSrc: "http://img.b2bpic.net/free-photo/gua-sha-cotton-arrangement-view_23-2149357127.jpg?_wi=1", imageAlt: "Product collection"},
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/gua-sha-cotton-arrangement-view_23-2149357127.jpg?_wi=1",
|
|
||||||
imageAlt: "Product collection",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "6",
|
id: "6", imageSrc: "http://img.b2bpic.net/free-photo/close-up-beautiful-models-using-face-cream_23-2148313411.jpg", imageAlt: "Hydration application"},
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-beautiful-models-using-face-cream_23-2148313411.jpg",
|
|
||||||
imageAlt: "Hydration application",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -116,26 +83,11 @@ export default function LandingPage() {
|
|||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
products={[
|
products={[
|
||||||
{
|
{
|
||||||
id: "p1",
|
id: "p1", name: "Forwin Intense Cream", price: "$89", variant: "50ml", imageSrc: "http://img.b2bpic.net/free-photo/weed-leaves-oil-still-life_23-2151651027.jpg?_wi=1"},
|
||||||
name: "Lumière Intense Cream",
|
|
||||||
price: "$89",
|
|
||||||
variant: "50ml",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/weed-leaves-oil-still-life_23-2151651027.jpg?_wi=1",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "p2",
|
id: "p2", name: "Forwin Night Repair", price: "$95", variant: "50ml", imageSrc: "http://img.b2bpic.net/free-photo/weed-leaves-oil-still-life_23-2151651027.jpg?_wi=2"},
|
||||||
name: "Lumière Night Repair",
|
|
||||||
price: "$95",
|
|
||||||
variant: "50ml",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/weed-leaves-oil-still-life_23-2151651027.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "p3",
|
id: "p3", name: "Forwin Glow Serum", price: "$75", variant: "30ml", imageSrc: "http://img.b2bpic.net/free-photo/weed-leaves-oil-still-life_23-2151651027.jpg?_wi=3"},
|
||||||
name: "Lumière Glow Serum",
|
|
||||||
price: "$75",
|
|
||||||
variant: "30ml",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/weed-leaves-oil-still-life_23-2151651027.jpg?_wi=3",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
title="Our Signature Cream"
|
title="Our Signature Cream"
|
||||||
description="The ultimate nourishing face cream, crafted for luxurious daily care."
|
description="The ultimate nourishing face cream, crafted for luxurious daily care."
|
||||||
@@ -149,22 +101,13 @@ export default function LandingPage() {
|
|||||||
features={[
|
features={[
|
||||||
{
|
{
|
||||||
id: 1,
|
id: 1,
|
||||||
title: "Deep Hydration",
|
title: "Deep Hydration", description: "Lock in moisture for 24 hours.", imageSrc: "http://img.b2bpic.net/free-photo/beauty-treatments-portrait_23-2149163402.jpg?_wi=1"},
|
||||||
description: "Lock in moisture for 24 hours.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/beauty-treatments-portrait_23-2149163402.jpg?_wi=1",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: 2,
|
id: 2,
|
||||||
title: "Radiant Glow",
|
title: "Radiant Glow", description: "Boosts complexion clarity naturally.", imageSrc: "http://img.b2bpic.net/free-photo/bowls-with-leaves-salt-spa-concept_23-2148268454.jpg?_wi=1"},
|
||||||
description: "Boosts complexion clarity naturally.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/bowls-with-leaves-salt-spa-concept_23-2148268454.jpg?_wi=1",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: 3,
|
id: 3,
|
||||||
title: "Anti-Aging Effect",
|
title: "Anti-Aging Effect", description: "Targets fine lines and wrinkles effectively.", imageSrc: "http://img.b2bpic.net/free-photo/smiley-female-researcher-laboratory-with-test-tube-safety-glasses_23-2148816413.jpg"},
|
||||||
description: "Targets fine lines and wrinkles effectively.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-female-researcher-laboratory-with-test-tube-safety-glasses_23-2148816413.jpg",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
title="Why You'll Love It"
|
title="Why You'll Love It"
|
||||||
description="Premium ingredients meet advanced dermatological science."
|
description="Premium ingredients meet advanced dermatological science."
|
||||||
@@ -179,20 +122,11 @@ export default function LandingPage() {
|
|||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
features={[
|
features={[
|
||||||
{
|
{
|
||||||
title: "Hyaluronic Acid",
|
title: "Hyaluronic Acid", description: "Plumps and hydrates the skin deeply.", imageSrc: "http://img.b2bpic.net/free-photo/bowls-with-leaves-salt-spa-concept_23-2148268454.jpg?_wi=2"},
|
||||||
description: "Plumps and hydrates the skin deeply.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/bowls-with-leaves-salt-spa-concept_23-2148268454.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: "Golden Jojoba",
|
title: "Golden Jojoba", description: "Maintains elasticity and smooth texture.", imageSrc: "http://img.b2bpic.net/free-photo/bowls-with-leaves-salt-spa-concept_23-2148268454.jpg?_wi=3"},
|
||||||
description: "Maintains elasticity and smooth texture.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/bowls-with-leaves-salt-spa-concept_23-2148268454.jpg?_wi=3",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: "Vitamin E",
|
title: "Vitamin E", description: "Provides powerful antioxidant protection.", imageSrc: "http://img.b2bpic.net/free-photo/bowls-with-leaves-salt-spa-concept_23-2148268454.jpg?_wi=4"},
|
||||||
description: "Provides powerful antioxidant protection.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/bowls-with-leaves-salt-spa-concept_23-2148268454.jpg?_wi=4",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
title="Pure Ingredients"
|
title="Pure Ingredients"
|
||||||
description="Selected with care for the ultimate skin health."
|
description="Selected with care for the ultimate skin health."
|
||||||
@@ -206,26 +140,11 @@ export default function LandingPage() {
|
|||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
metrics={[
|
metrics={[
|
||||||
{
|
{
|
||||||
id: "m1",
|
id: "m1", value: "98%", title: "Hydration Boost", description: "Increased moisture retention.", imageSrc: "http://img.b2bpic.net/free-photo/beauty-treatments-portrait_23-2149163402.jpg?_wi=2"},
|
||||||
value: "98%",
|
|
||||||
title: "Hydration Boost",
|
|
||||||
description: "Increased moisture retention.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/beauty-treatments-portrait_23-2149163402.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "m2",
|
id: "m2", value: "92%", title: "Visible Glow", description: "Brighter, healthier looking skin.", imageSrc: "http://img.b2bpic.net/free-photo/beauty-treatments-portrait_23-2149163402.jpg?_wi=3"},
|
||||||
value: "92%",
|
|
||||||
title: "Visible Glow",
|
|
||||||
description: "Brighter, healthier looking skin.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/beauty-treatments-portrait_23-2149163402.jpg?_wi=3",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "m3",
|
id: "m3", value: "85%", title: "Smoother Texture", description: "Reduced appearance of fine lines.", imageSrc: "http://img.b2bpic.net/free-photo/beauty-treatments-portrait_23-2149163402.jpg?_wi=4"},
|
||||||
value: "85%",
|
|
||||||
title: "Smoother Texture",
|
|
||||||
description: "Reduced appearance of fine lines.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/beauty-treatments-portrait_23-2149163402.jpg?_wi=4",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
title="Proven Results"
|
title="Proven Results"
|
||||||
description="Clinical studies show incredible efficacy after 4 weeks."
|
description="Clinical studies show incredible efficacy after 4 weeks."
|
||||||
@@ -238,38 +157,14 @@ export default function LandingPage() {
|
|||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
title="Reviews & Insights"
|
title="Reviews & Insights"
|
||||||
description="See what others are saying about the Lumière effect."
|
description="See what others are saying about the Forwin effect."
|
||||||
blogs={[
|
blogs={[
|
||||||
{
|
{
|
||||||
id: "1",
|
id: "1", category: "Review", title: "Life Changing Cream!", excerpt: "My skin has never felt this soft.", imageSrc: "http://img.b2bpic.net/free-photo/happy-girl-with-natural-radiant-skin-posing-camera_482257-74897.jpg?_wi=2", authorName: "Jane D.", authorAvatar: "http://img.b2bpic.net/free-photo/happy-girl-with-natural-radiant-skin-posing-camera_482257-74897.jpg", date: "Oct 12"},
|
||||||
category: "Review",
|
|
||||||
title: "Life Changing Cream!",
|
|
||||||
excerpt: "My skin has never felt this soft.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-girl-with-natural-radiant-skin-posing-camera_482257-74897.jpg?_wi=2",
|
|
||||||
authorName: "Jane D.",
|
|
||||||
authorAvatar: "http://img.b2bpic.net/free-photo/happy-girl-with-natural-radiant-skin-posing-camera_482257-74897.jpg",
|
|
||||||
date: "Oct 12",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "2",
|
id: "2", category: "Review", title: "The Glow is Real", excerpt: "Visible results within a week.", imageSrc: "http://img.b2bpic.net/free-photo/happy-girl-with-natural-radiant-skin-posing-camera_482257-74897.jpg?_wi=3", authorName: "Sarah M.", authorAvatar: "http://img.b2bpic.net/free-photo/happy-girl-with-natural-radiant-skin-posing-camera_482257-74897.jpg", date: "Oct 10"},
|
||||||
category: "Review",
|
|
||||||
title: "The Glow is Real",
|
|
||||||
excerpt: "Visible results within a week.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-girl-with-natural-radiant-skin-posing-camera_482257-74897.jpg?_wi=3",
|
|
||||||
authorName: "Sarah M.",
|
|
||||||
authorAvatar: "http://img.b2bpic.net/free-photo/happy-girl-with-natural-radiant-skin-posing-camera_482257-74897.jpg",
|
|
||||||
date: "Oct 10",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "3",
|
id: "3", category: "Insight", title: "How to Use Forwin", excerpt: "Learn the best application techniques.", imageSrc: "http://img.b2bpic.net/free-photo/gua-sha-cotton-arrangement-view_23-2149357127.jpg?_wi=2", authorName: "Beauty Ed.", authorAvatar: "http://img.b2bpic.net/free-photo/happy-girl-with-natural-radiant-skin-posing-camera_482257-74897.jpg", date: "Oct 5"},
|
||||||
category: "Insight",
|
|
||||||
title: "How to Use Lumière",
|
|
||||||
excerpt: "Learn the best application techniques.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/gua-sha-cotton-arrangement-view_23-2149357127.jpg?_wi=2",
|
|
||||||
authorName: "Beauty Ed.",
|
|
||||||
authorAvatar: "http://img.b2bpic.net/free-photo/happy-girl-with-natural-radiant-skin-posing-camera_482257-74897.jpg",
|
|
||||||
date: "Oct 5",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -280,20 +175,11 @@ export default function LandingPage() {
|
|||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
faqs={[
|
faqs={[
|
||||||
{
|
{
|
||||||
id: "1",
|
id: "1", title: "Is it safe for sensitive skin?", content: "Yes, our formula is dermatologically tested."},
|
||||||
title: "Is it safe for sensitive skin?",
|
|
||||||
content: "Yes, our formula is dermatologically tested.",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "2",
|
id: "2", title: "Can I use it daily?", content: "Absolutely, recommended for morning and night."},
|
||||||
title: "Can I use it daily?",
|
|
||||||
content: "Absolutely, recommended for morning and night.",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
id: "3",
|
id: "3", title: "Does it contain fragrances?", content: "No, it's 100% fragrance-free."},
|
||||||
title: "Does it contain fragrances?",
|
|
||||||
content: "No, it's 100% fragrance-free.",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/friends-doing-their-nail-care-routine-together_23-2149297997.jpg"
|
imageSrc="http://img.b2bpic.net/free-photo/friends-doing-their-nail-care-routine-together_23-2149297997.jpg"
|
||||||
mediaAnimation="slide-up"
|
mediaAnimation="slide-up"
|
||||||
@@ -310,20 +196,12 @@ export default function LandingPage() {
|
|||||||
description="Have questions about your skincare journey? We are here to help."
|
description="Have questions about your skincare journey? We are here to help."
|
||||||
inputs={[
|
inputs={[
|
||||||
{
|
{
|
||||||
name: "name",
|
name: "name", type: "text", placeholder: "Your Name"},
|
||||||
type: "text",
|
|
||||||
placeholder: "Your Name",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: "email",
|
name: "email", type: "email", placeholder: "Your Email"},
|
||||||
type: "email",
|
|
||||||
placeholder: "Your Email",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
textarea={{
|
textarea={{
|
||||||
name: "message",
|
name: "message", placeholder: "How can we assist you?"}}
|
||||||
placeholder: "How can we assist you?",
|
|
||||||
}}
|
|
||||||
imageSrc="http://img.b2bpic.net/free-vector/gorgeous-watercolor-floral-wreath-with-colorful-flower_24100-1304.jpg"
|
imageSrc="http://img.b2bpic.net/free-vector/gorgeous-watercolor-floral-wreath-with-colorful-flower_24100-1304.jpg"
|
||||||
mediaAnimation="slide-up"
|
mediaAnimation="slide-up"
|
||||||
/>
|
/>
|
||||||
@@ -335,32 +213,24 @@ export default function LandingPage() {
|
|||||||
{
|
{
|
||||||
items: [
|
items: [
|
||||||
{
|
{
|
||||||
label: "About",
|
label: "About", href: "#"},
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: "Ingredients",
|
label: "Ingredients", href: "#"},
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
items: [
|
items: [
|
||||||
{
|
{
|
||||||
label: "Privacy Policy",
|
label: "Privacy Policy", href: "#"},
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: "Support",
|
label: "Support", href: "#"},
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
logoText="Lumière"
|
logoText="Forwin"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user