197 lines
9.6 KiB
TypeScript
197 lines
9.6 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
|
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="expand-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="soft"
|
|
contentWidth="mediumLarge"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="fluid"
|
|
cardStyle="glass-depth"
|
|
primaryButtonStyle="diagonal-gradient"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "hero"},
|
|
{
|
|
name: "Shop", id: "products"},
|
|
{
|
|
name: "About", id: "about"},
|
|
{
|
|
name: "Reviews", id: "testimonials"},
|
|
]}
|
|
brandName="Bold Balika"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitTestimonial
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "glowing-orb"}}
|
|
title="Unleash Your Bold"
|
|
description="Bold Balika: Where premium quality meets the baddie aesthetic. Stay glossy, stay confident."
|
|
testimonials={[
|
|
{
|
|
name: "Anya", handle: "@anya", testimonial: "Obsessed with these shades!", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/holographic-rainbow-background_23-2151834726.jpg?_wi=1", imageAlt: "holographic background beauty"},
|
|
{
|
|
name: "Meera", handle: "@meera", testimonial: "Total game changer.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/red-lipsticks-ai-generated_268835-11073.jpg?_wi=1", imageAlt: "luxury matte lipstick product"},
|
|
{
|
|
name: "Sara", handle: "@sara", testimonial: "Stays on all night!", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/top-view-makeup-desk-concept_23-2148697041.jpg?_wi=1", imageAlt: "lip gloss product display"},
|
|
{
|
|
name: "Chloe", handle: "@chloe", testimonial: "The glow is unreal.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/view-eyeshadow-palette-with-shades-cosmetic-powder_23-2150260929.jpg?_wi=1", imageAlt: "makeup kit professional"},
|
|
{
|
|
name: "Jia", handle: "@jia", testimonial: "My makeup bag staple.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/positive-carefree-teenage-girl-with-bun-hairstyle-looks-happily-away-wears-stylish-green-costume-white-boots-blue-eyeliner-feels-good-poses-against-grey-concrete-wall-urban-lifestyle-concept_273609-57790.jpg?_wi=1", imageAlt: "trendy girl with makeup"},
|
|
]}
|
|
buttons={[
|
|
{
|
|
text: "Shop Now", href: "#products"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/holographic-rainbow-background_23-2151834726.jpg?_wi=2"
|
|
mediaAnimation="blur-reveal"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/positive-carefree-teenage-girl-with-bun-hairstyle-looks-happily-away-wears-stylish-green-costume-white-boots-blue-eyeliner-feels-good-poses-against-grey-concrete-wall-urban-lifestyle-concept_273609-57790.jpg", alt: "User 1"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/female-model-with-fresh-daily-makeup_158538-10293.jpg", alt: "User 2"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/glow-glitter-portrait-beautiful-woman_23-2151934100.jpg", alt: "User 3"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/medium-shot-cool-girls-posing-together_23-2149451770.jpg", alt: "User 4"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/woman-portrait-with-bright-blue-lips_23-2151096473.jpg", alt: "User 5"},
|
|
]}
|
|
marqueeItems={[
|
|
{
|
|
type: "text", text: "Cruelty-Free"},
|
|
{
|
|
type: "text", text: "High Pigment"},
|
|
{
|
|
type: "text", text: "Glossy Finish"},
|
|
{
|
|
type: "text", text: "Trend-Forward"},
|
|
{
|
|
type: "text", text: "Baddie Approved"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardFour
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
useInvertedBackground={true}
|
|
products={[
|
|
{
|
|
id: "p1", name: "Glossy Pop Lipstick", price: "$19", variant: "Matte Finish", imageSrc: "http://img.b2bpic.net/free-photo/red-lipsticks-ai-generated_268835-11073.jpg?_wi=2"},
|
|
{
|
|
id: "p2", name: "Holographic Lip Gloss", price: "$15", variant: "High Shine", imageSrc: "http://img.b2bpic.net/free-photo/top-view-makeup-desk-concept_23-2148697041.jpg?_wi=2"},
|
|
{
|
|
id: "p3", name: "Baddie Combo Kit", price: "$45", variant: "Full Set", imageSrc: "http://img.b2bpic.net/free-photo/view-eyeshadow-palette-with-shades-cosmetic-powder_23-2150260929.jpg?_wi=2"},
|
|
{
|
|
id: "p4", name: "Skin-Dew Primer", price: "$22", variant: "Glowing", imageSrc: "http://img.b2bpic.net/free-photo/red-lipsticks-ai-generated_268835-11073.jpg?_wi=3"},
|
|
{
|
|
id: "p5", name: "Ultra Matte Liner", price: "$12", variant: "Waterproof", imageSrc: "http://img.b2bpic.net/free-photo/top-view-makeup-desk-concept_23-2148697041.jpg?_wi=3"},
|
|
{
|
|
id: "p6", name: "Shimmer Highlighter", price: "$20", variant: "Gold Glow", imageSrc: "http://img.b2bpic.net/free-photo/view-eyeshadow-palette-with-shades-cosmetic-powder_23-2150260929.jpg?_wi=3"},
|
|
]}
|
|
title="Trending Now"
|
|
description="Must-have items for your makeup stash."
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextSplitAbout
|
|
useInvertedBackground={false}
|
|
title="Bold Balika Vision"
|
|
description={[
|
|
"Empowering the next generation of bold, confident women to express themselves through unapologetic beauty.", "We believe in high-impact formulas and a vibe that refuses to be ignored."]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwo
|
|
textboxLayout="split"
|
|
useInvertedBackground={true}
|
|
animationType="blur-reveal"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Zara", role: "Influencer", testimonial: "These formulas are incredible.", imageSrc: "http://img.b2bpic.net/free-photo/positive-carefree-teenage-girl-with-bun-hairstyle-looks-happily-away-wears-stylish-green-costume-white-boots-blue-eyeliner-feels-good-poses-against-grey-concrete-wall-urban-lifestyle-concept_273609-57790.jpg?_wi=2"},
|
|
{
|
|
id: "2", name: "Priya", role: "Student", testimonial: "Perfect for my everyday look!", imageSrc: "http://img.b2bpic.net/free-photo/female-model-with-fresh-daily-makeup_158538-10293.jpg"},
|
|
{
|
|
id: "3", name: "Maya", role: "Artist", testimonial: "The color payoff is insane.", imageSrc: "http://img.b2bpic.net/free-photo/glow-glitter-portrait-beautiful-woman_23-2151934100.jpg"},
|
|
{
|
|
id: "4", name: "Riya", role: "Blogger", testimonial: "My new absolute favorite brand.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-cool-girls-posing-together_23-2149451770.jpg"},
|
|
{
|
|
id: "5", name: "Kiara", role: "Fan", testimonial: "Bold Balika never misses!", imageSrc: "http://img.b2bpic.net/free-photo/woman-portrait-with-bright-blue-lips_23-2151096473.jpg"},
|
|
]}
|
|
title="Community Love"
|
|
description="Don't just take our word for it."
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactText
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "rotated-rays-animated"}}
|
|
text="Join the Bold Balika Club for exclusive drops."
|
|
buttons={[
|
|
{
|
|
text: "Join Newsletter"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
imageSrc="http://img.b2bpic.net/free-photo/holographic-rainbow-background_23-2151834726.jpg?_wi=3"
|
|
logoText="Bold Balika"
|
|
columns={[
|
|
{
|
|
title: "Shop", items: [
|
|
{
|
|
label: "Lipsticks", href: "#"},
|
|
{
|
|
label: "Gloss", href: "#"},
|
|
],
|
|
},
|
|
{
|
|
title: "Support", items: [
|
|
{
|
|
label: "Contact", href: "#"},
|
|
{
|
|
label: "Shipping", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |