Merge version_1 into main #1
359
src/app/page.tsx
359
src/app/page.tsx
@@ -28,267 +28,120 @@ export default function LandingPage() {
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Shop",
|
||||
id: "#products",
|
||||
},
|
||||
{
|
||||
name: "Best Sellers",
|
||||
id: "#best-sellers",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="CYBELE"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Shop", id: "#products" },
|
||||
{ name: "Best Sellers", id: "#best-sellers" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="CYBELE"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
title="Refine Your Beauty, Embody Your Confidence."
|
||||
description="Cybele Cosmetics brings you premium, long-lasting beauty essentials tailored for the elegant Lagos woman. Experience skincare and makeup designed to empower every look."
|
||||
tag="Luxury Defined"
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Your Glow",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-gua-sha-face-products_23-2149401501.jpg",
|
||||
imageAlt: "Luxury cosmetics model portrait",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/composition-natural-argan-oil-dropper_23-2149016644.jpg",
|
||||
imageAlt: "Premium beauty collection set",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/natural-argan-oil-dropper-composition_23-2149016650.jpg",
|
||||
imageAlt: "Natural argan oil dropper composition",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gua-sha-face-roller-red-flower-high-angle_23-2149357114.jpg",
|
||||
imageAlt: "Gua sha, face roller and red flower high angle",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-s-hands-holding-plant-with-dark-curtain_23-2149640628.jpg",
|
||||
imageAlt: "Woman's hands holding plant with dark curtain",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
ratingText="Rated 5/5 by beautiful women across Nigeria."
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{ variant: "plain" }}
|
||||
title="Refine Your Beauty, Embody Your Confidence."
|
||||
description="Cybele Cosmetics brings you premium, long-lasting beauty essentials tailored for the elegant Lagos woman. Experience skincare and makeup designed to empower every look."
|
||||
tag="Luxury Defined"
|
||||
buttons={[{ text: "Get Your Glow", href: "#products" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/top-view-gua-sha-face-products_23-2149401501.jpg", imageAlt: "Luxury cosmetics model portrait" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/composition-natural-argan-oil-dropper_23-2149016644.jpg", imageAlt: "Premium beauty collection set" }
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
ratingText="Rated 5/5 by beautiful women across Nigeria."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureHoverPattern
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
icon: Sparkles,
|
||||
title: "Radiant Finish",
|
||||
description: "Formula that delivers an all-day glow, perfect for the Lagos weather.",
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Premium Quality",
|
||||
description: "Ethically sourced ingredients that care for your skin while you look flawless.",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
title: "Designed for You",
|
||||
description: "Specially crafted shades and textures for bold, confident, elegant women.",
|
||||
},
|
||||
]}
|
||||
title="Why Cybele Cosmetics?"
|
||||
description="Designed with precision and passion for the unique Nigerian climate and skin types."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureHoverPattern
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ icon: Sparkles, title: "Radiant Finish", description: "Formula that delivers an all-day glow, perfect for the Lagos weather." },
|
||||
{ icon: Shield, title: "Premium Quality", description: "Ethically sourced ingredients that care for your skin while you look flawless." },
|
||||
{ icon: Award, title: "Designed for You", description: "Specially crafted shades and textures for bold, confident, elegant women." }
|
||||
]}
|
||||
title="Why Cybele Cosmetics?"
|
||||
description="Designed with precision and passion for the unique Nigerian climate and skin types."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Signature Lip Gloss",
|
||||
price: "₦8,500",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pink-cosmetic-containers-flowers_23-2149270088.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Velvet Matte Foundation",
|
||||
price: "₦15,000",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/foundation-dropper-bottle-with-reflection_23-2151968650.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Radiant Face Powder",
|
||||
price: "₦12,500",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/overhead-view-cosmetic-products-with-brushes-orange-backdrop_23-2147878896.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Essential Brush Kit",
|
||||
price: "₦18,000",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/model-career-kit-still-life_23-2150217983.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Hydrating Night Cream",
|
||||
price: "₦14,000",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-eucalyptus-with-beauty-products_23-2149440673.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Golden Eyeshadow Palette",
|
||||
price: "₦22,000",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-eyeshadow-palette-with-cosmetic-powder_23-2150260885.jpg",
|
||||
},
|
||||
]}
|
||||
title="Explore Our Essentials"
|
||||
description="Your journey to absolute elegance starts here."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "Signature Lip Gloss", price: "₦8,500", imageSrc: "http://img.b2bpic.net/free-photo/pink-cosmetic-containers-flowers_23-2149270088.jpg" },
|
||||
{ id: "p2", name: "Velvet Matte Foundation", price: "₦15,000", imageSrc: "http://img.b2bpic.net/free-photo/foundation-dropper-bottle-with-reflection_23-2151968650.jpg" },
|
||||
{ id: "p3", name: "Radiant Face Powder", price: "₦12,500", imageSrc: "http://img.b2bpic.net/free-photo/overhead-view-cosmetic-products-with-brushes-orange-backdrop_23-2147878896.jpg" }
|
||||
]}
|
||||
title="Explore Our Essentials"
|
||||
description="Your journey to absolute elegance starts here."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="The Cybele Story"
|
||||
description="Born in the heart of Lagos, Cybele Cosmetics was founded on the belief that beauty is an expression of confidence. We blend luxury craftsmanship with high-performance ingredients to help you look your best, everyday."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/high-angle-perfume-bottles-arrangement_23-2149234387.jpg"
|
||||
imageAlt="Our luxury cosmetics brand story"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="The Cybele Story"
|
||||
description="Born in the heart of Lagos, Cybele Cosmetics was founded on the belief that beauty is an expression of confidence. We blend luxury craftsmanship with high-performance ingredients to help you look your best, everyday."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/high-angle-perfume-bottles-arrangement_23-2149234387.jpg"
|
||||
imageAlt="Our luxury cosmetics brand story"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Adeola S.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-confident-businessman-wearing-glasses_158595-5356.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Chioma B.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-young-caucasian-browneyed-brunette-with-short-haircut-looks-camera-white-background-modern-lifestyle-concept_197531-31412.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Amaka O.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-talking-phone_23-2149684352.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Folake T.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashion-girl-standing-summer-city_1157-20652.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Nneka U.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-smiling-taking-selfie_176420-17794.jpg",
|
||||
},
|
||||
]}
|
||||
cardTitle="Trusted by Lagos Women"
|
||||
cardTag="Reviews"
|
||||
cardAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Adeola S.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-confident-businessman-wearing-glasses_158595-5356.jpg" },
|
||||
{ id: "t2", name: "Chioma B.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-young-caucasian-browneyed-brunette-with-short-haircut-looks-camera-white-background-modern-lifestyle-concept_197531-31412.jpg" }
|
||||
]}
|
||||
cardTitle="Trusted by Lagos Women"
|
||||
cardTag="Reviews"
|
||||
cardAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
names={[
|
||||
"Lagos Beauty News",
|
||||
"TrendSET",
|
||||
"Modern Lagos Woman",
|
||||
"Elite Beauty",
|
||||
"African Chic",
|
||||
"Vogue Nigeria",
|
||||
"Beauty Standard",
|
||||
]}
|
||||
title="As Seen In"
|
||||
description="Celebrating beauty with elegance across the continent."
|
||||
/>
|
||||
</div>
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
names={["Lagos Beauty News", "TrendSET"]}
|
||||
title="As Seen In"
|
||||
description="Celebrating beauty with elegance across the continent."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Exclusive Access"
|
||||
title="Join the Elite Circle"
|
||||
description="Subscribe to our newsletter for 10% off your first purchase and stay updated on limited collections."
|
||||
buttonText="Get Access"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Exclusive Access"
|
||||
title="Join the Elite Circle"
|
||||
description="Subscribe to our newsletter for 10% off your first purchase and stay updated on limited collections."
|
||||
buttonText="Get Access"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="CYBELE"
|
||||
columns={[
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Shipping Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Lagos Showroom",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Brand",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Best Sellers",
|
||||
href: "#best-sellers",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2024 Cybele Cosmetics Ltd. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="CYBELE"
|
||||
columns={[
|
||||
{ title: "Support", items: [{ label: "Shipping Policy", href: "#" }, { label: "FAQ", href: "#" }] },
|
||||
{ title: "Brand", items: [{ label: "About", href: "#about" }, { label: "Terms of Service", href: "#" }] }
|
||||
]}
|
||||
copyrightText="© 2024 Cybele Cosmetics Ltd. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user