Merge version_1 into main #1
293
src/app/page.tsx
293
src/app/page.tsx
@@ -1,270 +1,39 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import Link from 'next/link';
|
||||
|
||||
export default function Home() {
|
||||
const navItems = [{ name: 'Home', id: '/' }, { name: 'About', id: '/about' }, { name: 'Services', id: '/services' }, { name: 'Contact', id: '/contact' }];
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="rounded"
|
||||
contentWidth="mediumSmall"
|
||||
sizing="mediumSizeLargeTitles"
|
||||
background="aurora"
|
||||
cardStyle="glass-depth"
|
||||
primaryButtonStyle="primary-glow"
|
||||
secondaryButtonStyle="radial-glow"
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "/about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "/services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="ELEVATE"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCarouselLogo
|
||||
logoText="ELEVATE"
|
||||
description="Where Luxury Meets Purpose. We deliver exceptional quality, timeless design, and an experience that speaks for itself."
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore Collection",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
text: "Book a Consultation",
|
||||
href: "/contact",
|
||||
},
|
||||
]}
|
||||
slides={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-plants-deco_23-2149192230.jpg",
|
||||
imageAlt: "luxury lifestyle dark aesthetic",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-product-container-with-art-nouveau-inspired-sun-relief-background_23-2151420633.jpg",
|
||||
imageAlt: "Cosmetic product container with art nouveau inspired sun relief background",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-luxurious-golden-ring-with-basket_23-2150329682.jpg",
|
||||
imageAlt: "View of luxurious golden ring with basket",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-minimal-kitchen-objects_23-2148835348.jpg",
|
||||
imageAlt: "Abstract minimal kitchen objects",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blank-steel-tin-isolated-with-copy-space_1194-639087.jpg",
|
||||
imageAlt: "blank steel tin isolated with a copy space",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/minimalist-architectural-building-details_23-2151870865.jpg",
|
||||
imageAlt: "Minimalist architectural building details",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Crafted for Those Who Expect More"
|
||||
description="At ELEVATE, we believe luxury is not just a product — it’s a feeling. Every detail is thoughtfully designed to elevate your lifestyle."
|
||||
metrics={[
|
||||
{
|
||||
value: "100+",
|
||||
title: "Clients Served",
|
||||
},
|
||||
{
|
||||
value: "15",
|
||||
title: "Years Expertise",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/middle-aged-man-making-instruments-his-workshop-alone_23-2149018596.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
metricsAnimation="slide-up"
|
||||
imageAlt="craftsmanship luxury detail"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="offerings" data-section="offerings">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "ELEVATE",
|
||||
name: "Premium Consultation",
|
||||
price: "Request Quote",
|
||||
rating: 5,
|
||||
reviewCount: "50",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/everyday-bath-utensils-dark-marble-background_58702-17721.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "ELEVATE",
|
||||
name: "Exclusive Collection",
|
||||
price: "$2,500",
|
||||
rating: 5,
|
||||
reviewCount: "120",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-woman-wearing-stylish-fedora-hat_23-2150711574.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
brand: "ELEVATE",
|
||||
name: "Transformation Package",
|
||||
price: "$5,000",
|
||||
rating: 5,
|
||||
reviewCount: "85",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-minimal-concept_23-2148835346.jpg",
|
||||
},
|
||||
]}
|
||||
title="Our Offerings"
|
||||
description="Exclusivity and results tailored to your specific needs."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah J.",
|
||||
handle: "@sarahj",
|
||||
testimonial: "Absolutely stunning service. I felt like royalty.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-woman-luxury-hotel_641386-198.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Mark D.",
|
||||
handle: "@markd",
|
||||
testimonial: "Worth every dollar. The quality speaks for itself.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-cheerful-manager-sunny-day_1139-417.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Emily R.",
|
||||
handle: "@emilyr",
|
||||
testimonial: "A truly refined experience. Exceptional.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-using-mobile-phone-back-seat-car_53876-22944.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David K.",
|
||||
handle: "@davidk",
|
||||
testimonial: "Exceeded all expectations. Simply perfect.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/people-having-dinner-luxurious-restaurants_23-2151081913.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Lucy H.",
|
||||
handle: "@lucyh",
|
||||
testimonial: "Stellar attention to detail. Highly recommend.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/elegant-couple-draws-art-studio_1157-30469.jpg",
|
||||
},
|
||||
]}
|
||||
showRating={true}
|
||||
title="Client Reflections"
|
||||
description="Stories of those who value excellence."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact-cta" data-section="contact-cta">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
tag="Elevate Your Standard"
|
||||
title="Step Into Luxury Today"
|
||||
description="Your experience starts here."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Started",
|
||||
href: "/contact",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "/about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "/contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Twitter",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "LinkedIn",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="ELEVATE"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
<ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay navItems={navItems} brandName="ELEVATE" />
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCarouselLogo logoText="ELEVATE" description="Where Luxury Meets Purpose. We deliver exceptional quality, timeless design, and an experience that speaks for itself." buttons={[{ text: "Explore Collection", href: "/services" }, { text: "Book a Consultation", href: "/contact" }]} slides={[{ imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-plants-deco_23-2149192230.jpg", imageAlt: "luxury lifestyle dark aesthetic" }, { imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-product-container-with-art-nouveau-inspired-sun-relief-background_23-2151420633.jpg", imageAlt: "Cosmetic product container with art nouveau inspired sun relief background" }, { imageSrc: "http://img.b2bpic.net/free-photo/view-luxurious-golden-ring-with-basket_23-2150329682.jpg", imageAlt: "View of luxurious golden ring with basket" }, { imageSrc: "http://img.b2bpic.net/free-photo/abstract-minimal-kitchen-objects_23-2148835348.jpg", imageAlt: "Abstract minimal kitchen objects" }, { imageSrc: "http://img.b2bpic.net/free-photo/blank-steel-tin-isolated-with-copy-space_1194-639087.jpg", imageAlt: "blank steel tin isolated with a copy space" }, { imageSrc: "http://img.b2bpic.net/free-photo/minimalist-architectural-building-details_23-2151870865.jpg", imageAlt: "Minimalist architectural building details" }]} />
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout useInvertedBackground={false} title="Crafted for Those Who Expect More" description="At ELEVATE, we believe luxury is not just a product — it’s a feeling. Every detail is thoughtfully designed to elevate your lifestyle." metrics={[{ value: "100+", title: "Clients Served" }, { value: "15", title: "Years Expertise" }]} imageSrc="http://img.b2bpic.net/free-photo/middle-aged-man-making-instruments-his-workshop-alone_23-2149018596.jpg" mediaAnimation="blur-reveal" metricsAnimation="slide-up" imageAlt="craftsmanship luxury detail" />
|
||||
</div>
|
||||
<div id="offerings" data-section="offerings">
|
||||
<ProductCardTwo animationType="slide-up" textboxLayout="split" gridVariant="three-columns-all-equal-width" useInvertedBackground={true} products={[{ id: "p1", brand: "ELEVATE", name: "Premium Consultation", price: "Request Quote", rating: 5, reviewCount: "50", imageSrc: "http://img.b2bpic.net/free-photo/everyday-bath-utensils-dark-marble-background_58702-17721.jpg" }, { id: "p2", brand: "ELEVATE", name: "Exclusive Collection", price: "$2,500", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/view-woman-wearing-stylish-fedora-hat_23-2150711574.jpg" }, { id: "p3", brand: "ELEVATE", name: "Transformation Package", price: "$5,000", rating: 5, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/abstract-minimal-concept_23-2148835346.jpg" }]} title="Our Offerings" description="Exclusivity and results tailored to your specific needs." />
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen animationType="slide-up" textboxLayout="split" useInvertedBackground={false} testimonials={[{ id: "t1", name: "Sarah J.", handle: "@sarahj", testimonial: "Absolutely stunning service. I felt like royalty.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-woman-luxury-hotel_641386-198.jpg" }, { id: "t2", name: "Mark D.", handle: "@markd", testimonial: "Worth every dollar. The quality speaks for itself.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-cheerful-manager-sunny-day_1139-417.jpg" }, { id: "t3", name: "Emily R.", handle: "@emilyr", testimonial: "A truly refined experience. Exceptional.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-using-mobile-phone-back-seat-car_53876-22944.jpg" }, { id: "t4", name: "David K.", handle: "@davidk", testimonial: "Exceeded all expectations. Simply perfect.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/people-having-dinner-luxurious-restaurants_23-2151081913.jpg" }, { id: "t5", name: "Lucy H.", handle: "@lucyh", testimonial: "Stellar attention to detail. Highly recommend.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/elegant-couple-draws-art-studio_1157-30469.jpg" }]} showRating={true} title="Client Reflections" description="Stories of those who value excellence." />
|
||||
</div>
|
||||
<div id="contact-cta" data-section="contact-cta">
|
||||
<ContactCTA useInvertedBackground={true} background={{ variant: "sparkles-gradient" }} tag="Elevate Your Standard" title="Step Into Luxury Today" description="Your experience starts here." buttons={[{ text: "Get Started", href: "/contact" }]} />
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis columns={[{ items: [{ label: "About", href: "/about" }, { label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }] }, { items: [{ label: "Instagram", href: "#" }, { label: "Twitter", href: "#" }, { label: "LinkedIn", href: "#" }] }]} logoText="ELEVATE" />
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user