Files
cb5fdd29-588a-4c44-aee4-8cf…/src/app/page.tsx
2026-05-15 12:12:21 +00:00

404 lines
13 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import { Sparkles } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-shift"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="small"
sizing="mediumLargeSizeMediumTitles"
background="noise"
cardStyle="soft-shadow"
primaryButtonStyle="shadow"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "About",
id: "about",
},
{
name: "Products",
id: "products",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="Alya'an"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{
variant: "gradient-bars",
}}
title="Timeless Elegance in Every Bottle"
description="Discover Alya'an Perfume—where tradition meets contemporary luxury. Each scent is a masterpiece designed to define your presence."
kpis={[
{
value: "20+",
label: "Exclusive Scents",
},
{
value: "100%",
label: "Pure Essence",
},
{
value: "Award",
label: "Luxury Craft",
},
]}
enableKpiAnimation={true}
buttons={[
{
text: "Explore Scents",
href: "#products",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/cupcake-still-life_23-2148097711.jpg?_wi=1"
mediaAnimation="blur-reveal"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/elegant-vegan-alcohol-arrangement_23-2149337694.jpg",
alt: "Elegant vegan alcohol arrangement",
},
{
src: "http://img.b2bpic.net/free-photo/pink-orchid-girly-arrangement_23-2148229212.jpg",
alt: "Pink orchid next to girly arrangement",
},
{
src: "http://img.b2bpic.net/free-photo/luxurious-lifestyle-concept-table_23-2148229220.jpg",
alt: "Luxurious lifestyle concept on table",
},
{
src: "http://img.b2bpic.net/free-photo/women-s-day-still-life-with-makeup-jewelry_23-2149263175.jpg",
alt: "Women's day still life with makeup and jewelry",
},
{
src: "http://img.b2bpic.net/free-photo/minimal-beauty-products-composition_23-2148961351.jpg",
alt: "Minimal beauty products composition",
},
]}
avatarText="Join 500+ perfume enthusiasts"
marqueeItems={[
{
type: "text",
text: "Sustainable Sourcing",
},
{
type: "text",
text: "Artisan Crafted",
},
{
type: "text",
text: "Rare Botanicals",
},
{
type: "text",
text: "Enduring Elegance",
},
{
type: "text",
text: "Global Inspiration",
},
]}
/>
</div>
<div id="about" data-section="about">
<TestimonialAboutCard
useInvertedBackground={false}
tag="Our Heritage"
title="The Art of Scent"
description="Alya'an Perfume is born from a desire to encapsulate emotions and memories into liquid form. Our perfumers meticulously blend rare botanical extracts to ensure every fragrance tells a story of sophistication."
subdescription="Crafted with passion, worn with distinction."
icon={Sparkles}
imageSrc="http://img.b2bpic.net/free-photo/woman-preparing-foam-barbershop_23-2147737003.jpg?_wi=1"
mediaAnimation="slide-up"
/>
</div>
<div id="features" data-section="features">
<FeatureCardNine
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "Rare Ingredients",
description: "Sourced from the finest landscapes globally.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/assortment-dry-tea-golden-vintage-mini-plates-tea-types-background_114579-8067.jpg",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/soap-making-ingredients-close-up_23-2148897599.jpg",
},
imageSrc: "http://img.b2bpic.net/free-photo/cupcake-still-life_23-2148097711.jpg?_wi=2",
imageAlt: "perfume ingredients floral essences",
},
{
title: "Artisan Craft",
description: "Hand-blended by master perfumers.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-product-container-with-art-nouveau-inspired-sun-relief-background_23-2151420646.jpg",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307252.jpg",
},
imageSrc: "http://img.b2bpic.net/free-photo/woman-preparing-foam-barbershop_23-2147737003.jpg?_wi=2",
imageAlt: "perfume ingredients floral essences",
},
{
title: "Lasting Impression",
description: "Long-wearing concentrations for enduring elegance.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/still-life-beauty-products-based-regenerative-agriculture_23-2150721383.jpg",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/bright-hearts_1048-4221.jpg",
},
imageSrc: "http://img.b2bpic.net/free-photo/close-up-perfume-floating-water_23-2150963092.jpg?_wi=1",
imageAlt: "perfume ingredients floral essences",
},
]}
showStepNumbers={true}
title="Defining Moments"
description="Why choose Alya'an? We believe in artistry that transcends the mundane."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardEleven
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{
id: "m1",
value: "15",
title: "Master Blends",
description: "Curated collections.",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-perfume-floating-water_23-2150963092.jpg?_wi=2",
},
{
id: "m2",
value: "5k+",
title: "Happy Clients",
description: "Distinguished patrons.",
imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307222.jpg",
},
{
id: "m3",
value: "12",
title: "Countries",
description: "Global inspiration.",
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-male-self-care-setting-still-life_23-2150326577.jpg",
},
]}
title="Quality in Numbers"
description="Our commitment to excellence quantified."
/>
</div>
<div id="products" data-section="products">
<ProductCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Midnight Bloom",
price: "Luxury",
imageSrc: "http://img.b2bpic.net/free-photo/valentines-day-still-life-design_23-2149246381.jpg",
},
{
id: "p2",
name: "Golden Oud",
price: "Luxury",
imageSrc: "http://img.b2bpic.net/free-photo/glass-perfume-bottle-minimal-beauty-product-packaging-with-design-space_53876-126578.jpg",
},
{
id: "p3",
name: "Azure Musk",
price: "Luxury",
imageSrc: "http://img.b2bpic.net/free-photo/wet-daisies-close-up_23-2148151447.jpg",
},
{
id: "p4",
name: "Royal Amber",
price: "Luxury",
imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-product-container-with-art-nouveau-inspired-sun-relief-background_23-2151420673.jpg",
},
{
id: "p5",
name: "Velvet Rose",
price: "Luxury",
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-bottle-fan-yellow-background_23-2148306729.jpg",
},
{
id: "p6",
name: "Sandalwood Noir",
price: "Luxury",
imageSrc: "http://img.b2bpic.net/free-photo/bottle-serum-based-soil-ingredients_23-2150756826.jpg",
},
]}
title="Signature Collections"
description="Explore our curated selection of luxury fragrances."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTen
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "t1",
title: "Exceptional",
quote: "The most exquisite scent I have ever worn.",
name: "Aisha K.",
role: "Collector",
imageSrc: "http://img.b2bpic.net/free-photo/holidays-spring-party-concept-portrait-tender-lovely-blond-woman-white-dress-dancing-joyfully-with-two-macarons-smiling-happy-eating-delicious-dessert-tasty-food-pink-background_1258-93862.jpg",
},
{
id: "t2",
title: "Refined",
quote: "Alya'an redefined my daily presence.",
name: "Omar F.",
role: "Businessman",
imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-item-with-marijuana-leaves_23-2151336393.jpg",
},
{
id: "t3",
title: "Elegant",
quote: "Pure perfection in a bottle.",
name: "Sara M.",
role: "Architect",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-male-dancer-listening-music-headphones-with-copy-space_23-2148417988.jpg",
},
{
id: "t4",
title: "Sophisticated",
quote: "I get asked about my perfume daily.",
name: "Youssef Z.",
role: "Designer",
imageSrc: "http://img.b2bpic.net/free-photo/young-cheerful-girl-soft-colored-sweater-white-background-holds-small-cute-gift-boxes_343596-8024.jpg",
},
{
id: "t5",
title: "Unrivaled",
quote: "Quality that speaks for itself.",
name: "Leila B.",
role: "Artisan",
imageSrc: "http://img.b2bpic.net/free-photo/man-s-accessories-wooden-surface_8353-10515.jpg",
},
]}
title="Loved by Aficionados"
description="Hear what our distinguished clients say."
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
useInvertedBackground={false}
faqs={[
{
id: "f1",
title: "What makes our perfume unique?",
content: "We use 100% natural essences sourced from heritage farms.",
},
{
id: "f2",
title: "Are these fragrances long-lasting?",
content: "Yes, our high-concentration blends ensure endurance throughout the day.",
},
{
id: "f3",
title: "How should I store my perfume?",
content: "Keep in a cool, dry place away from direct sunlight.",
},
]}
sideTitle="Expert Guidance"
sideDescription="Common queries regarding our fragrances."
faqsAnimation="blur-reveal"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={false}
background={{
variant: "gradient-bars",
}}
tag="Get in Touch"
title="Join Our Journey"
description="Sign up for updates on our latest scent releases and exclusive boutique events."
imageSrc="http://img.b2bpic.net/free-photo/beautiful-woman-shopping-organic-products_23-2148672816.jpg"
mediaAnimation="blur-reveal"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{
items: [
{
label: "Home",
href: "#hero",
},
{
label: "About",
href: "#about",
},
],
},
{
items: [
{
label: "Products",
href: "#products",
},
{
label: "Privacy",
href: "#",
},
],
},
]}
logoText="Alya'an"
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}