197 lines
12 KiB
TypeScript
197 lines
12 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
|
|
import HeroBillboardRotatedCarousel from "@/components/sections/hero/HeroBillboardRotatedCarousel";
|
|
import ProductCardThree from "@/components/sections/product/ProductCardThree";
|
|
import FeatureCardTwentyThree from "@/components/sections/feature/FeatureCardTwentyThree";
|
|
import AboutMetric from "@/components/sections/about/AboutMetric";
|
|
import TestimonialCardTwo from "@/components/sections/testimonial/TestimonialCardTwo";
|
|
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
|
|
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
|
|
import { Award, Globe, Heart, Newspaper, Sparkles, Users, Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="rounded"
|
|
contentWidth="small"
|
|
sizing="mediumLargeSizeMediumTitles"
|
|
background="circleGradient"
|
|
cardStyle="gradient-radial"
|
|
primaryButtonStyle="primary-glow"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="light"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{ name: "Highlights", id: "highlights" },
|
|
{ name: "Women", id: "women" },
|
|
{ name: "Men", id: "men" },
|
|
{ name: "Collections", id: "collections" },
|
|
{ name: "About", id: "about" }
|
|
]}
|
|
button={{ text: "Shop Now", href: "collections" }}
|
|
brandName="Saint Laurent"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardRotatedCarousel
|
|
title="Women's Summer 26"
|
|
description="Experience the pinnacle of luxury fashion with our exclusive summer collection. Curated designs that define elegance and sophistication."
|
|
tag="New Collection"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
background={{ variant: "plain" }}
|
|
buttons={[
|
|
{ text: "See More", href: "collections" },
|
|
{ text: "Shop Now", href: "collections" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
carouselItems={[
|
|
{ id: "1", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqOFoNHLwhf17DacD3pyzW1tzr/uploaded-1773321259355-s0pf5gwn.png", imageAlt: "Women's Summer 26 Campaign" },
|
|
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/dancing-blond-girl-long-red-dress-grey-background_613910-6984.jpg", imageAlt: "Luxury Women's Collection" },
|
|
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-studio-lights-background_158538-9609.jpg", imageAlt: "Premium Men's Collection" },
|
|
{ id: "4", imageSrc: "http://img.b2bpic.net/free-photo/close-up-legs-boots-stylish-woman-jacket-walking-against-wall-street_285396-8086.jpg", imageAlt: "Luxury Accessories" },
|
|
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/woman-hands-buttoning-cuff-shirt-soft-light-clothes-details_158595-7938.jpg", imageAlt: "Fine Craftsmanship" },
|
|
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/african-american-girl-sitting-rocking-chair-against-autumn-mood-decoration-fall-africa_627829-2436.jpg", imageAlt: "Heritage Collection" }
|
|
]}
|
|
autoPlay={true}
|
|
autoPlayInterval={4000}
|
|
ariaLabel="Women's Summer 26 Campaign Hero"
|
|
/>
|
|
</div>
|
|
|
|
<div id="collections" data-section="collections">
|
|
<ProductCardThree
|
|
title="Our Collections"
|
|
description="Explore our curated selection of luxury fashion pieces, each crafted with exceptional attention to detail and premium materials."
|
|
tag="Exclusive"
|
|
tagIcon={Award}
|
|
tagAnimation="blur-reveal"
|
|
buttons={[{ text: "View All", href: "#collections" }]}
|
|
buttonAnimation="slide-up"
|
|
products={[
|
|
{ id: "1", name: "Women's Summer Dress", price: "$1,240", imageSrc: "http://img.b2bpic.net/free-photo/dancing-blond-girl-long-red-dress-grey-background_613910-6984.jpg", imageAlt: "Elegant women's summer dress", initialQuantity: 1 },
|
|
{ id: "2", name: "Premium Men's Suit", price: "$2,850", imageSrc: "http://img.b2bpic.net/free-photo/portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-studio-lights-background_158538-9609.jpg", imageAlt: "Tailored premium men's suit", initialQuantity: 1 },
|
|
{ id: "3", name: "Luxury Leather Handbag", price: "$1,890", imageSrc: "http://img.b2bpic.net/free-photo/close-up-legs-boots-stylish-woman-jacket-walking-against-wall-street_285396-8086.jpg", imageAlt: "High-end leather handbag", initialQuantity: 1 }
|
|
]}
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentyThree
|
|
title="Why Choose Saint Laurent"
|
|
description="Discover what sets our brand apart in the world of luxury fashion."
|
|
tag="Premium Quality"
|
|
tagIcon={Zap}
|
|
tagAnimation="slide-up"
|
|
buttons={[{ text: "Learn More", href: "#about" }]}
|
|
buttonAnimation="blur-reveal"
|
|
features={[
|
|
{ id: "1", title: "Exceptional Craftsmanship", tags: ["Artisan", "Heritage"], imageSrc: "http://img.b2bpic.net/free-photo/woman-hands-buttoning-cuff-shirt-soft-light-clothes-details_158595-7938.jpg", imageAlt: "Fine craftsmanship detail" },
|
|
{ id: "2", title: "Rich Fashion Heritage", tags: ["Since 1961", "Legacy"], imageSrc: "http://img.b2bpic.net/free-photo/african-american-girl-sitting-rocking-chair-against-autumn-mood-decoration-fall-africa_627829-2436.jpg", imageAlt: "Brand heritage collection" },
|
|
{ id: "3", title: "Innovative Design", tags: ["Cutting Edge", "Modern"], imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-ribbon_23-2149247502.jpg", imageAlt: "Forward-thinking design" }
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<AboutMetric
|
|
title="Defining Luxury Fashion Since 1961. At Saint Laurent, we craft timeless pieces that celebrate individuality, elegance, and the art of refined living."
|
|
metrics={[
|
|
{ icon: Globe, label: "Global Presence", value: "80+" },
|
|
{ icon: Users, label: "Satisfied Customers", value: "2M+" },
|
|
{ icon: Award, label: "Fashion Awards", value: "150+" },
|
|
{ icon: Sparkles, label: "Years of Excellence", value: "60+" }
|
|
]}
|
|
metricsAnimation="slide-up"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwo
|
|
title="Loved by Fashion Icons"
|
|
description="Hear from our most devoted clients about their experience with Saint Laurent."
|
|
tag="Testimonials"
|
|
tagIcon={Heart}
|
|
tagAnimation="slide-up"
|
|
buttons={[{ text: "Share Your Story", href: "#contact" }]}
|
|
buttonAnimation="blur-reveal"
|
|
testimonials={[
|
|
{ id: "1", name: "Emma Richardson", role: "Fashion Editor", testimonial: "Saint Laurent represents the pinnacle of luxury. Every piece is a masterpiece of design and craftsmanship.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-corporate-woman-looks-dreamy-smiles-stands-outside-street-leans-her-head-hands-d_1258-123449.jpg", imageAlt: "Emma Richardson" },
|
|
{ id: "2", name: "Marcus Sterling", role: "Style Influencer", testimonial: "The attention to detail in every garment is unmatched. Saint Laurent is my go-to for timeless elegance.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-glad-pretty-woman-dark-sweater-standing-near-lamps_114579-81911.jpg", imageAlt: "Marcus Sterling" },
|
|
{ id: "3", name: "Victoria Laurent", role: "Creative Director", testimonial: "From concept to creation, Saint Laurent delivers excellence. A true fashion powerhouse.", imageSrc: "http://img.b2bpic.net/free-photo/positive-woman-with-short-hair-bright-lips-glasses-smiling-outside-trendy-lady-black-clothes-posing-stairs_197531-19325.jpg", imageAlt: "Victoria Laurent" },
|
|
{ id: "4", name: "Alexandre Dubois", role: "Luxury Collector", testimonial: "Investing in Saint Laurent is investing in heritage, quality, and timeless style.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-handsome-stylish-man-elegant-black-suit-dark-background_613910-14840.jpg", imageAlt: "Alexandre Dubois" }
|
|
]}
|
|
carouselMode="buttons"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="socialproof" data-section="socialproof">
|
|
<SocialProofOne
|
|
title="Featured In"
|
|
description="Recognized and celebrated by the world's most prestigious fashion publications."
|
|
tag="Press"
|
|
tagIcon={Newspaper}
|
|
tagAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
names={["Vogue", "Harper's Bazaar", "Elle", "GQ", "Women's Wear Daily", "Financial Times", "The New York Times", "Wall Street Journal"]}
|
|
logos={[
|
|
"http://img.b2bpic.net/free-photo/young-woman-blue-suit-posing-with-mirror-outdoors_23-2149445026.jpg", "http://img.b2bpic.net/free-photo/portrait-two-women-standing-outside-shop-holding-colorful-shopping-bags_23-2147968393.jpg", "http://img.b2bpic.net/free-psd/boutique-template-design_23-2151490763.jpg", "http://img.b2bpic.net/free-photo/portrait-handsome-fashion-stylish-hipster-businessman-model-dressed-elegant-brown-suit-glasses-near-dark-wall_158538-11228.jpg", "http://img.b2bpic.net/free-psd/poster-template-fashion-designer_23-2148979502.jpg", "http://img.b2bpic.net/free-vector/gradient-accounting-logo-with-tagline_23-2148828803.jpg", "http://img.b2bpic.net/free-vector/template-design-live-news_23-2148507594.jpg", "http://img.b2bpic.net/free-vector/business-growth-money-savings_24877-49779.jpg"
|
|
]}
|
|
speed={40}
|
|
showCard={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseReveal
|
|
columns={[
|
|
{
|
|
title: "Shop", items: [
|
|
{ label: "Women", href: "#women" },
|
|
{ label: "Men", href: "#men" },
|
|
{ label: "Accessories", href: "#collections" },
|
|
{ label: "Sale", href: "#collections" }
|
|
]
|
|
},
|
|
{
|
|
title: "About", items: [
|
|
{ label: "Our Story", href: "#about" },
|
|
{ label: "Craftsmanship", href: "#features" },
|
|
{ label: "Sustainability", href: "#" },
|
|
{ label: "Careers", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Service", items: [
|
|
{ label: "Customer Care", href: "#" },
|
|
{ label: "Shipping & Returns", href: "#" },
|
|
{ label: "Size Guide", href: "#" },
|
|
{ label: "Contact Us", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
copyrightText="© 2025 Saint Laurent. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |