183 lines
8.6 KiB
TypeScript
183 lines
8.6 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
|
|
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
|
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
|
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
|
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
|
import { CalendarDays, Heart, Leaf, Sparkles } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="icon-arrow"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="mediumLarge"
|
|
sizing="mediumLarge"
|
|
background="noiseDiagonalGradient"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="bold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "Community", id: "features" },
|
|
{ name: "Planner", id: "product" },
|
|
{ name: "Support", id: "contact" },
|
|
]}
|
|
brandName="Lumina"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitDualMedia
|
|
background={{ variant: "gradient-bars" }}
|
|
title="Empowering Your Feminine Growth"
|
|
description="The ultimate space for productivity, wellness, and self-development tailored for you."
|
|
tag="Welcome to Lumina"
|
|
mediaItems={[
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/breakfast-with-croissant-tea-cup_23-2148103419.jpg", imageAlt: "cozy aesthetic workspace pastel pink" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/person-holding-white-smartphone-screen-mockup_9975-133800.jpg", imageAlt: "minimalist mobile app interface design" }
|
|
]}
|
|
mediaAnimation="slide-up"
|
|
rating={5}
|
|
ratingText="Join 50,000+ girls"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TestimonialAboutCard
|
|
useInvertedBackground={false}
|
|
tag="Our Philosophy"
|
|
title="Designed for Your Daily Flow"
|
|
description="Lumina balances your productivity needs with holistic wellness, helping you achieve goals without burning out."
|
|
subdescription="Every feature is crafted to support your mental clarity, lifestyle habits, and personal evolution."
|
|
imageSrc="http://img.b2bpic.net/free-photo/composition-beautiful-mother-s-day-elements_23-2148888528.jpg"
|
|
mediaAnimation="blur-reveal"
|
|
imageAlt="feminine wellness lifestyle illustration"
|
|
icon={Leaf}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureBorderGlow
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{ icon: Sparkles, title: "Wellness Hub", description: "Personalized skincare and fitness routines for every body." },
|
|
{ icon: Heart, title: "Community Love", description: "Connect, share, and grow in a safe and supportive space." },
|
|
{ icon: CalendarDays, title: "Smart Planner", description: "Organize your life based on your energy and priorities." },
|
|
]}
|
|
title="Everything You Need to Bloom"
|
|
description="A comprehensive suite of tools built for your unique lifestyle."
|
|
/>
|
|
</div>
|
|
|
|
<div id="product" data-section="product">
|
|
<ProductCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{ id: "1", brand: "Lumina", name: "Self-Care Planner", price: "$12", rating: 5, reviewCount: "1.2k", imageSrc: "http://img.b2bpic.net/free-photo/modern-smartphone-with-blank-white-screen-light-glow_9975-134406.jpg", imageAlt: "minimalist mobile app interface design" },
|
|
{ id: "2", brand: "Lumina", name: "Growth Journal", price: "$15", rating: 5, reviewCount: "890", imageSrc: "http://img.b2bpic.net/free-photo/overhead-view-flower-shape-soap-candle-smartphone-decorated-with-petals_23-2147971463.jpg", imageAlt: "social media feed interface aesthetic" },
|
|
{ id: "3", brand: "Lumina", name: "Wellness Routine Kit", price: "$20", rating: 5, reviewCount: "2.1k", imageSrc: "http://img.b2bpic.net/free-photo/women-enjoying-mental-health_23-2151904408.jpg", imageAlt: "feminine wellness lifestyle illustration" },
|
|
]}
|
|
title="Your Daily Essentials"
|
|
description="Premium guides and trackers to enhance your self-development journey."
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardEleven
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{ id: "m1", value: "50k+", title: "Active Members", description: "Girls growing together", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-flowers-coffee-flat-lay_23-2148469830.jpg", imageAlt: "cozy aesthetic workspace pastel pink" },
|
|
{ id: "m2", value: "1M+", title: "Goals Met", description: "Dreams turning into reality", imageSrc: "http://img.b2bpic.net/free-vector/mobile-app-concept_52683-5724.jpg", imageAlt: "minimalist mobile app interface design" },
|
|
{ id: "m3", value: "200k", title: "Wellness Tasks", description: "Steps towards self-care", imageSrc: "http://img.b2bpic.net/free-vector/meditation-app-screens-collection_23-2148628455.jpg", imageAlt: "social media feed interface aesthetic" },
|
|
]}
|
|
title="Community Milestones"
|
|
description="Celebrating every step of our collective progress."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{ id: "t1", name: "Sarah", role: "Student", company: "Lumina User", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-attractive-emotional-girl-business-style-clothes-plain-white-background-office-audience_78826-2259.jpg", imageAlt: "young woman smiling professional portrait" },
|
|
{ id: "t2", name: "Layla", role: "Creative", company: "Lumina User", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-smiling-female-trendy-summer-pink-overalls-sexy-carefree-woman-posing-near-blue-wall-studio-with-two-horns-positive-model-having-fun-going-crazy-shows-peace-sign_158538-25175.jpg", imageAlt: "young woman smiling professional portrait" },
|
|
]}
|
|
title="Words from Our Community"
|
|
description="Hear how Lumina has transformed daily lives."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqDouble
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{ id: "f1", title: "Is it free to join?", content: "Yes, basic community access is free for everyone." },
|
|
{ id: "f2", title: "Can I customize the planner?", content: "Absolutely! The planner is designed to adapt to your energy levels." },
|
|
{ id: "f3", title: "Is dark mode available?", content: "Yes, we support a cozy dark mode for late-night scrolling." },
|
|
]}
|
|
title="Frequently Asked Questions"
|
|
description="Answers to your questions about Lumina."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
useInvertedBackground={false}
|
|
background={{ variant: "rotated-rays-static" }}
|
|
title="Start Your Bloom Today"
|
|
description="Sign up for early access to Lumina and be part of our growing community."
|
|
buttonText="Join Now"
|
|
tag="Get Started"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseCard
|
|
logoText="Lumina"
|
|
columns={[
|
|
{
|
|
title: "Platform", items: [
|
|
{ label: "Features", href: "#features" },
|
|
{ label: "Community", href: "#" },
|
|
],
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About", href: "#" },
|
|
{ label: "Privacy", href: "#" },
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |