161 lines
7.2 KiB
TypeScript
161 lines
7.2 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
|
|
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
|
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
|
|
import MediaAbout from '@/components/sections/about/MediaAbout';
|
|
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="compact"
|
|
sizing="largeSmallSizeMediumTitles"
|
|
background="fluid"
|
|
cardStyle="glass-depth"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Collection", id: "products" },
|
|
{ name: "Testimonials", id: "testimonials" },
|
|
{ name: "Contact", id: "contact" },
|
|
]}
|
|
brandName="Essence"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitTestimonial
|
|
useInvertedBackground={true}
|
|
background={{ variant: "glowing-orb" }}
|
|
title="The Art of Essence"
|
|
description="Discover our signature collection of handcrafted fragrances designed to evoke memories and define your presence."
|
|
testimonials={[]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/perfume-bottle-nature_23-2151890527.jpg"
|
|
mediaAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MediaAbout
|
|
useInvertedBackground={false}
|
|
title="Mastery in Scent"
|
|
description="Our perfumers combine age-old traditions with modern innovation to create scents that tell a story. From rare blossoms to precious woods, each ingredient is sourced to ensure the highest quality in every bottle."
|
|
imageSrc="http://img.b2bpic.net/free-photo/high-angle-pink-cosmetic-containers_23-2149270057.jpg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwelve
|
|
animationType="blur-reveal"
|
|
textboxLayout="split"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{ id: "f1", label: "Natural", title: "Sustainably Sourced", items: ["Organic floral extracts", "Eco-friendly distillation", "Ethical harvesting"] },
|
|
{ id: "f2", label: "Craft", title: "Artisanal Blending", items: ["Hand-poured process", "Small batch quality", "Precision aging"] },
|
|
{ id: "f3", label: "Longevity", title: "Lasting Potency", items: ["Concentrated essence", "Complex base notes", "8+ hour stay"] },
|
|
]}
|
|
title="Why Choose Essence"
|
|
description="Our commitment to quality ensures your signature scent remains unforgettable."
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardTwo
|
|
animationType="scale-rotate"
|
|
textboxLayout="split"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{ id: "p1", brand: "Essence", name: "Midnight Bloom", price: "$120", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/black-white-beauty-product_23-2151307254.jpg" },
|
|
{ id: "p2", brand: "Essence", name: "Golden Horizon", price: "$140", rating: 5, reviewCount: "95", imageSrc: "http://img.b2bpic.net/free-photo/aesthetic-bottles-still-life-home-decor_53876-133314.jpg" },
|
|
{ id: "p3", brand: "Essence", name: "Velvet Wood", price: "$110", rating: 4, reviewCount: "80", imageSrc: "http://img.b2bpic.net/free-photo/elegant-vegan-alcohol-arrangement_23-2149337712.jpg" },
|
|
]}
|
|
title="Our Signature Collection"
|
|
description="Explore our curated fragrance profiles."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
animationType="depth-3d"
|
|
textboxLayout="split"
|
|
useInvertedBackground={true}
|
|
testimonials={[]}
|
|
kpiItems={[{ value: "5k+", label: "Satisfied Clients" }, { value: "12+", label: "Signature Scents" }, { value: "99%", label: "Ethical Sourcing" }]}
|
|
title="Loved by Connoisseurs"
|
|
description="Hear what the community says about their olfactory experiences."
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardEleven
|
|
animationType="blur-reveal"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{ id: "m1", value: "20+", title: "Botanical Sources", description: "Global origin ingredients.", imageSrc: "http://img.b2bpic.net/free-photo/abstract-space-wallpaper-background-dark-smoke-design_53876-133386.jpg" },
|
|
{ id: "m2", value: "500+", title: "Small Batch Runs", description: "Precision manufacturing.", imageSrc: "http://img.b2bpic.net/free-photo/flowers-row-testubes-with-different-colored-water-decoration-science-experiment-concept_53876-31955.jpg" },
|
|
{ id: "m3", value: "30%", title: "Essence Concentration", description: "Above industry standards.", imageSrc: "http://img.b2bpic.net/free-photo/abstract-violet-smoke-underwater_23-2148227005.jpg" },
|
|
]}
|
|
title="By the Numbers"
|
|
description="Excellence defined by data."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
textboxLayout="split"
|
|
useInvertedBackground={true}
|
|
faqs={[
|
|
{ id: "q1", title: "Are your fragrances vegan?", content: "Yes, we prioritize cruelty-free ingredients." },
|
|
{ id: "q2", title: "How long does the scent last?", content: "Our concentrated formulas typically last 8 to 10 hours." },
|
|
]}
|
|
title="Fragrance FAQs"
|
|
description="Answers to your burning questions."
|
|
faqsAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
useInvertedBackground={false}
|
|
background={{ variant: "sparkles-gradient" }}
|
|
tag="Keep in Touch"
|
|
title="Join our Newsletter"
|
|
description="Be the first to know about new seasonal releases."
|
|
mediaAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseCard
|
|
logoText="Essence"
|
|
columns={[
|
|
{ title: "Product", items: [{ label: "All Scents", href: "#products" }, { label: "New Arrivals", href: "#products" }] },
|
|
{ title: "Company", items: [{ label: "About Us", href: "#about" }, { label: "Career", href: "#" }] },
|
|
{ title: "Support", items: [{ label: "FAQs", href: "#faq" }, { label: "Contact", href: "#contact" }] },
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |