Merge version_1 into main #2
301
src/app/page.tsx
301
src/app/page.tsx
@@ -28,22 +28,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Our Story",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Our Story", id: "about" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
]}
|
||||
brandName="oser"
|
||||
/>
|
||||
@@ -52,100 +40,33 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardTestimonial
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Redefining Your Beauty Rituals."
|
||||
description="Experience premium, personalized skincare crafted for the modern individual. Quality, transparency, and elegance in every oser product."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Emma R.",
|
||||
handle: "@emmarstyle",
|
||||
testimonial: "The glow from oser products is unlike anything I've tried.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/adult-enjoying-cocktail_52683-107593.jpg",
|
||||
},
|
||||
{
|
||||
name: "Julian T.",
|
||||
handle: "@juliant_beauty",
|
||||
testimonial: "Finally, a brand that gets skincare right.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/person-using-eco-transport-new-york_23-2149219909.jpg",
|
||||
},
|
||||
{
|
||||
name: "Sarah L.",
|
||||
handle: "@sarahlux",
|
||||
testimonial: "oser completely transformed my daily routine.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pretty-black-woman-with-ideal-skin-beige-background_633478-2478.jpg",
|
||||
},
|
||||
{
|
||||
name: "Marcus W.",
|
||||
handle: "@marcusbeauty",
|
||||
testimonial: "Transparent ingredients and beautiful packaging.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-with-trendy-hairstyle_23-2149406009.jpg",
|
||||
},
|
||||
{
|
||||
name: "Chloe B.",
|
||||
handle: "@chloeb",
|
||||
testimonial: "Sophisticated, effective, and perfectly crafted.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-woman-evening-street_1303-3828.jpg",
|
||||
},
|
||||
{ name: "Emma R.", handle: "@emmarstyle", testimonial: "The glow from oser products is unlike anything I've tried.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/adult-enjoying-cocktail_52683-107593.jpg" },
|
||||
{ name: "Julian T.", handle: "@juliant_beauty", testimonial: "Finally, a brand that gets skincare right.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/person-using-eco-transport-new-york_23-2149219909.jpg" },
|
||||
{ name: "Sarah L.", handle: "@sarahlux", testimonial: "oser completely transformed my daily routine.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/pretty-black-woman-with-ideal-skin-beige-background_633478-2478.jpg" },
|
||||
{ name: "Marcus W.", handle: "@marcusbeauty", testimonial: "Transparent ingredients and beautiful packaging.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-with-trendy-hairstyle_23-2149406009.jpg" },
|
||||
{ name: "Chloe B.", handle: "@chloeb", testimonial: "Sophisticated, effective, and perfectly crafted.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/business-woman-evening-street_1303-3828.jpg" },
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Shop Collections",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307281.jpg?_wi=1"
|
||||
buttons={[{ text: "Shop Collections", href: "#products" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307281.jpg"
|
||||
imageAlt="oser skincare premium collection"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-stylish-businesswoman-with-laptop-coffee-thoughtfully-working-cafe-street_574295-4046.jpg",
|
||||
alt: "User avatar",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-female-photographer-exploring-city-with-her-camera_23-2149186643.jpg",
|
||||
alt: "User avatar",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-adult-cycling-work-city_23-2149488780.jpg",
|
||||
alt: "User avatar",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-view-black-woman-smile-camera_197531-33139.jpg",
|
||||
alt: "User avatar",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/woman-with-curly-hair-dressed-fashionable-clothes-round-spectacles-looks-away-considers-something_273609-55152.jpg",
|
||||
alt: "User avatar",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-stylish-businesswoman-with-laptop-coffee-thoughtfully-working-cafe-street_574295-4046.jpg", alt: "User avatar" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-female-photographer-exploring-city-with-her-camera_23-2149186643.jpg", alt: "User avatar" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-adult-cycling-work-city_23-2149488780.jpg", alt: "User avatar" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-view-black-woman-smile-camera_197531-33139.jpg", alt: "User avatar" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/woman-with-curly-hair-dressed-fashionable-clothes-round-spectacles-looks-away-considers-something_273609-55152.jpg", alt: "User avatar" },
|
||||
]}
|
||||
avatarText="Join 10,000+ beauty enthusiasts"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Sustainable Sourcing",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Clinically Proven",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Cruelty Free",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Vegan Friendly",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Custom Blended",
|
||||
},
|
||||
{ type: "text", text: "Sustainable Sourcing" },
|
||||
{ type: "text", text: "Clinically Proven" },
|
||||
{ type: "text", text: "Cruelty Free" },
|
||||
{ type: "text", text: "Vegan Friendly" },
|
||||
{ type: "text", text: "Custom Blended" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -157,20 +78,11 @@ export default function LandingPage() {
|
||||
title="Designed by You, Crafted by oser."
|
||||
description="We believe beauty isn't one-size-fits-all. Our mission is to provide you with the tools to build your perfect skincare regime."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Scientific Excellence",
|
||||
description: "Formulas designed by industry experts for real results.",
|
||||
},
|
||||
{
|
||||
title: "Premium Ingredients",
|
||||
description: "Sourced from the finest providers for absolute quality.",
|
||||
},
|
||||
{
|
||||
title: "Personalized Approach",
|
||||
description: "Your skincare, tailored exactly to your unique needs.",
|
||||
},
|
||||
{ title: "Scientific Excellence", description: "Formulas designed by industry experts for real results." },
|
||||
{ title: "Premium Ingredients", description: "Sourced from the finest providers for absolute quality." },
|
||||
{ title: "Personalized Approach", description: "Your skincare, tailored exactly to your unique needs." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-woman-holding-cup_23-2148903476.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-woman-holding-cup_23-2148903476.jpg"
|
||||
imageAlt="oser lab workspace"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
@@ -180,44 +92,15 @@ export default function LandingPage() {
|
||||
<ProductCardOne
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="blur-reveal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Luminous Serum",
|
||||
price: "$45",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-purple-tin-cans-with-copy-space_23-2148785262.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Daily Moisturizer",
|
||||
price: "$38",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/ecofriendly-beauty-product_23-2150669109.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Restorative Face Oil",
|
||||
price: "$52",
|
||||
imageSrc: "http://img.b2bpic.net/free-psd/candle-label-template-design_23-2151987827.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Refresh Gel Cleanser",
|
||||
price: "$29",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-cosmetics-containers-arrangement_23-2149270023.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Hydration Toner",
|
||||
price: "$32",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/clear-glass-spray-bottle-with-silver-pump-dispenser_9975-134428.jpg",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Night Recovery Cream",
|
||||
price: "$48",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/skin-regeneration-product-still-life_23-2151232254.jpg",
|
||||
},
|
||||
{ id: "1", name: "Luminous Serum", price: "$45", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-purple-tin-cans-with-copy-space_23-2148785262.jpg" },
|
||||
{ id: "2", name: "Daily Moisturizer", price: "$38", imageSrc: "http://img.b2bpic.net/free-photo/ecofriendly-beauty-product_23-2150669109.jpg" },
|
||||
{ id: "3", name: "Restorative Face Oil", price: "$52", imageSrc: "http://img.b2bpic.net/free-psd/candle-label-template-design_23-2151987827.jpg" },
|
||||
{ id: "4", name: "Refresh Gel Cleanser", price: "$29", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-cosmetics-containers-arrangement_23-2149270023.jpg" },
|
||||
{ id: "5", name: "Hydration Toner", price: "$32", imageSrc: "http://img.b2bpic.net/free-photo/clear-glass-spray-bottle-with-silver-pump-dispenser_9975-134428.jpg" },
|
||||
{ id: "6", name: "Night Recovery Cream", price: "$48", imageSrc: "http://img.b2bpic.net/free-photo/skin-regeneration-product-still-life_23-2151232254.jpg" },
|
||||
]}
|
||||
title="Elevated Essentials"
|
||||
description="Our curated selection of premium skincare products for every skin type."
|
||||
@@ -229,61 +112,11 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Emma R.",
|
||||
date: "Oct 2024",
|
||||
title: "Life Changing",
|
||||
quote: "The most sophisticated skincare range I've used.",
|
||||
tag: "Verified User",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/adult-enjoying-cocktail_52683-107593.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307281.jpg?_wi=2",
|
||||
imageAlt: "natural beauty portrait lifestyle",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Julian T.",
|
||||
date: "Sept 2024",
|
||||
title: "High Quality",
|
||||
quote: "Finally found products that genuinely work for my specific skin type.",
|
||||
tag: "Verified User",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/person-using-eco-transport-new-york_23-2149219909.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-holding-cup_23-2148903476.jpg?_wi=2",
|
||||
imageAlt: "natural beauty portrait lifestyle",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Sarah L.",
|
||||
date: "Aug 2024",
|
||||
title: "Absolute Luxury",
|
||||
quote: "Beautiful branding, even better results.",
|
||||
tag: "Verified User",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/pretty-black-woman-with-ideal-skin-beige-background_633478-2478.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-purple-tin-cans-with-copy-space_23-2148785262.jpg?_wi=2",
|
||||
imageAlt: "natural beauty portrait lifestyle",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Marcus W.",
|
||||
date: "July 2024",
|
||||
title: "Perfect Routine",
|
||||
quote: "Building my perfect routine with oser was seamless.",
|
||||
tag: "Verified User",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-with-trendy-hairstyle_23-2149406009.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/ecofriendly-beauty-product_23-2150669109.jpg?_wi=2",
|
||||
imageAlt: "natural beauty portrait lifestyle",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Chloe B.",
|
||||
date: "June 2024",
|
||||
title: "Radiant Skin",
|
||||
quote: "I get compliments on my skin every single day now.",
|
||||
tag: "Verified User",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/business-woman-evening-street_1303-3828.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-psd/candle-label-template-design_23-2151987827.jpg?_wi=2",
|
||||
imageAlt: "natural beauty portrait lifestyle",
|
||||
},
|
||||
{ id: "1", name: "Emma R.", date: "Oct 2024", title: "Life Changing", quote: "The most sophisticated skincare range I've used.", tag: "Verified User", avatarSrc: "http://img.b2bpic.net/free-photo/adult-enjoying-cocktail_52683-107593.jpg", imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307281.jpg", imageAlt: "natural beauty portrait lifestyle" },
|
||||
{ id: "2", name: "Julian T.", date: "Sept 2024", title: "High Quality", quote: "Finally found products that genuinely work for my specific skin type.", tag: "Verified User", avatarSrc: "http://img.b2bpic.net/free-photo/person-using-eco-transport-new-york_23-2149219909.jpg", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-holding-cup_23-2148903476.jpg", imageAlt: "natural beauty portrait lifestyle" },
|
||||
{ id: "3", name: "Sarah L.", date: "Aug 2024", title: "Absolute Luxury", quote: "Beautiful branding, even better results.", tag: "Verified User", avatarSrc: "http://img.b2bpic.net/free-photo/pretty-black-woman-with-ideal-skin-beige-background_633478-2478.jpg", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-purple-tin-cans-with-copy-space_23-2148785262.jpg", imageAlt: "natural beauty portrait lifestyle" },
|
||||
{ id: "4", name: "Marcus W.", date: "July 2024", title: "Perfect Routine", quote: "Building my perfect routine with oser was seamless.", tag: "Verified User", avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-with-trendy-hairstyle_23-2149406009.jpg", imageSrc: "http://img.b2bpic.net/free-photo/ecofriendly-beauty-product_23-2150669109.jpg", imageAlt: "natural beauty portrait lifestyle" },
|
||||
{ id: "5", name: "Chloe B.", date: "June 2024", title: "Radiant Skin", quote: "I get compliments on my skin every single day now.", tag: "Verified User", avatarSrc: "http://img.b2bpic.net/free-photo/business-woman-evening-street_1303-3828.jpg", imageSrc: "http://img.b2bpic.net/free-psd/candle-label-template-design_23-2151987827.jpg", imageAlt: "natural beauty portrait lifestyle" },
|
||||
]}
|
||||
title="Loved by Our Community"
|
||||
description="See why oser is the new standard in personalized beauty."
|
||||
@@ -293,9 +126,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
tag="Stay Updated"
|
||||
title="Join the oser Circle"
|
||||
description="Be the first to hear about new launches, expert tips, and exclusive offers."
|
||||
@@ -305,57 +136,9 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Shop",
|
||||
items: [
|
||||
{
|
||||
label: "All Products",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
label: "New Arrivals",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Skincare Sets",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Science",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Contact Us",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ title: "Shop", items: [{ label: "All Products", href: "#products" }, { label: "New Arrivals", href: "#" }, { label: "Skincare Sets", href: "#" }] },
|
||||
{ title: "Company", items: [{ label: "About Us", href: "#about" }, { label: "Science", href: "#" }, { label: "Careers", href: "#" }] },
|
||||
{ title: "Support", items: [{ label: "Contact Us", href: "#" }, { label: "FAQ", href: "#" }, { label: "Privacy", href: "#" }] },
|
||||
]}
|
||||
logoText="oser"
|
||||
copyrightText="© 2025 | oser Beauty"
|
||||
|
||||
Reference in New Issue
Block a user