237 lines
7.2 KiB
TypeScript
237 lines
7.2 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
|
|
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
|
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import SplitAbout from '@/components/sections/about/SplitAbout';
|
|
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="rounded"
|
|
contentWidth="compact"
|
|
sizing="mediumLargeSizeLargeTitles"
|
|
background="fluid"
|
|
cardStyle="solid"
|
|
primaryButtonStyle="diagonal-gradient"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{
|
|
name: "Home",
|
|
id: "home",
|
|
},
|
|
{
|
|
name: "About",
|
|
id: "about",
|
|
},
|
|
{
|
|
name: "Features",
|
|
id: "features",
|
|
},
|
|
{
|
|
name: "Reviews",
|
|
id: "testimonials",
|
|
},
|
|
{
|
|
name: "Contact",
|
|
id: "contact",
|
|
},
|
|
]}
|
|
brandName="LUX"
|
|
/>
|
|
</div>
|
|
|
|
<div id="home" data-section="home">
|
|
<HeroBillboard
|
|
background={{
|
|
variant: "gradient-bars",
|
|
}}
|
|
title="Refined Excellence, Defined."
|
|
description="Experience the pinnacle of luxury craftsmanship designed exclusively for those who demand nothing less than perfection."
|
|
buttons={[
|
|
{
|
|
text: "Explore Collection",
|
|
href: "#features",
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/woman-doing-daily-activities-minimal-decorated-room_23-2150407588.jpg"
|
|
mediaAnimation="blur-reveal"
|
|
videoSrc="https://www.w3schools.com/tags/movie.mp4?_wi=1"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<SplitAbout
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
title="A Legacy of Distinction"
|
|
description="Our journey began with a single vision: to elevate everyday experiences into moments of pure luxury. We combine heritage techniques with modern refinement to curate collections that stand the test of time."
|
|
bulletPoints={[
|
|
{
|
|
title: "Unrivaled Craftsmanship",
|
|
description: "Every detail is meticulously curated to meet our highest standards.",
|
|
},
|
|
{
|
|
title: "Timeless Design",
|
|
description: "Aesthetic longevity ensures your investment remains beautiful for years.",
|
|
},
|
|
{
|
|
title: "Personalized Service",
|
|
description: "Our concierge team is dedicated to your complete satisfaction.",
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/black-man-chief-is-preparing-cake-molds-before-fill-them-with-batter-his-professional-artisan-confectionery_346278-681.jpg"
|
|
mediaAnimation="slide-up"
|
|
videoSrc="https://www.w3schools.com/tags/movie.mp4?_wi=2"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentyThree
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{
|
|
id: "f1",
|
|
title: "Handcrafted Excellence",
|
|
tags: [
|
|
"Premium",
|
|
],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/extreme-close-up-detail-bag_23-2148393471.jpg",
|
|
},
|
|
{
|
|
id: "f2",
|
|
title: "Global Sourcing",
|
|
tags: [
|
|
"Exclusive",
|
|
],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/woman-buying-stuff-decoration-store_1303-24638.jpg",
|
|
},
|
|
{
|
|
id: "f3",
|
|
title: "Sustainable Luxury",
|
|
tags: [
|
|
"Ethics",
|
|
],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/hand-touching-monstera-leaf_53876-127244.jpg",
|
|
},
|
|
]}
|
|
title="The LUX Difference"
|
|
description="Beyond just products, we offer an experience rooted in sophistication, comfort, and uncompromising quality."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFifteen
|
|
useInvertedBackground={false}
|
|
testimonial="The attention to detail is simply unmatched. It isn't just a product; it's an elevated lifestyle choice that I treasure daily."
|
|
rating={5}
|
|
author="Eleanor Vance"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/confident-beautiful-young-woman-portrait_23-2148148150.jpg",
|
|
alt: "Customer 1",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/confident-beautiful-young-woman-portrait_23-2148148150.jpg",
|
|
alt: "Customer 2",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/confident-beautiful-young-woman-portrait_23-2148148150.jpg",
|
|
alt: "Customer 3",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/confident-beautiful-young-woman-portrait_23-2148148150.jpg",
|
|
alt: "Customer 4",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/confident-beautiful-young-woman-portrait_23-2148148150.jpg",
|
|
alt: "Customer 5",
|
|
},
|
|
]}
|
|
ratingAnimation="blur-reveal"
|
|
avatarsAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
useInvertedBackground={true}
|
|
title="Begin Your Journey"
|
|
description="Connect with our concierge team to discuss your needs and discover bespoke options tailored to you."
|
|
inputs={[
|
|
{
|
|
name: "name",
|
|
type: "text",
|
|
placeholder: "Your Full Name",
|
|
required: true,
|
|
},
|
|
{
|
|
name: "email",
|
|
type: "email",
|
|
placeholder: "Your Email Address",
|
|
required: true,
|
|
},
|
|
]}
|
|
textarea={{
|
|
name: "message",
|
|
placeholder: "Tell us about your requirements",
|
|
rows: 4,
|
|
}}
|
|
imageSrc="http://img.b2bpic.net/free-photo/minimalist-office-interior-design_23-2151826267.jpg"
|
|
videoSrc="https://www.w3schools.com/tags/movie.mp4?_wi=3"
|
|
mediaAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseCard
|
|
logoText="LUX"
|
|
columns={[
|
|
{
|
|
title: "Company",
|
|
items: [
|
|
{
|
|
label: "About Us",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "Careers",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Support",
|
|
items: [
|
|
{
|
|
label: "Help Center",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "Contact",
|
|
href: "#contact",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|