Update src/app/page.tsx
This commit is contained in:
140
src/app/page.tsx
140
src/app/page.tsx
@@ -3,70 +3,51 @@
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
|
||||
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="soft"
|
||||
contentWidth="mediumLarge"
|
||||
sizing="mediumLargeSizeLargeTitles"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-depth"
|
||||
background="none"
|
||||
cardStyle="solid"
|
||||
primaryButtonStyle="flat"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="medium"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Shop", id: "products" },
|
||||
{ name: "Our Story", id: "about" },
|
||||
{ name: "Newsletter", id: "contact" }
|
||||
{ name: "New Arrivals", id: "products" },
|
||||
{ name: "Featured", id: "features" },
|
||||
{ name: "Values", id: "about" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="VOXE"
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
button={{ text: "Shop Now", href: "#products" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardTestimonial
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Walk in every story"
|
||||
description="VOXE represents the pinnacle of craftsmanship, where every step defines your legacy. Discover the art of modern footwear."
|
||||
testimonials={[
|
||||
{ name: "Eleanor Vance", handle: "@evance", testimonial: "The most comfortable luxury shoe I've ever owned. Pure art.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-engraving-art-tools_23-2149186782.jpg?_wi=1", imageAlt: "luxury shoe fashion photography" },
|
||||
{ name: "Julian Thorne", handle: "@jthorne", testimonial: "VOXE defines elegance. Exquisite leather craftsmanship.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/shoes_1303-3607.jpg?_wi=1", imageAlt: "luxury mens oxford shoes studio" },
|
||||
{ name: "Sophia Moretti", handle: "@smoretti", testimonial: "A timeless piece for my collection. Absolutely stunning.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/handsome-brunette-girl-wear-black-red-high-heels-sitting-posing-chair-studio-against-dark-brick-wall-studio-model-portrait_627829-7841.jpg?_wi=1", imageAlt: "luxury women's leather heels studio" },
|
||||
{ name: "Marcus Aurelius", handle: "@maurelius", testimonial: "Sophistication in every detail. Unmatched quality.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/boots-woman-autumnal-forest_329181-17144.jpg?_wi=1", imageAlt: "designer leather boots studio shot" },
|
||||
{ name: "Diana Prince", handle: "@dprince", testimonial: "VOXE shoes are simply transformative. A must-have.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-smiling-sitting-floor-white-wall_176420-8546.jpg?_wi=1", imageAlt: "luxury loafers tan leather" }
|
||||
]}
|
||||
buttons={[{ text: "Shop Men", href: "#products" }, { text: "Shop Women", href: "#products" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-engraving-art-tools_23-2149186782.jpg?_wi=2"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/shoes_1303-3607.jpg", alt: "Customer 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/handsome-brunette-girl-wear-black-red-high-heels-sitting-posing-chair-studio-against-dark-brick-wall-studio-model-portrait_627829-7841.jpg", alt: "Customer 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/boots-woman-autumnal-forest_329181-17144.jpg", alt: "Customer 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-beautiful-girl-smiling-sitting-floor-white-wall_176420-8546.jpg", alt: "Customer 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/groom-wedding-shoes_1303-10490.jpg", alt: "Customer 5" }
|
||||
]}
|
||||
marqueeItems={[
|
||||
{ type: "text", text: "Handcrafted Excellence" },
|
||||
{ type: "text", text: "Sustainable Sourcing" },
|
||||
{ type: "text", text: "Timeless Design" },
|
||||
{ type: "text", text: "Global Heritage" },
|
||||
{ type: "text", text: "Uncompromising Quality" }
|
||||
]}
|
||||
useInvertedBackground={true}
|
||||
title="Wear your story"
|
||||
description="Gender-inclusive fashion crafted for every soul. Discover timeless silhouettes in obsidian, amber, and cream."
|
||||
buttons={[{ text: "Explore Collection", href: "#products" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/fashion-portrait-young-stylish-man-woman-standing-together-studio-background_158595-6547.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -74,60 +55,73 @@ export default function LandingPage() {
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
title="New Arrivals"
|
||||
description="Our latest gender-inclusive essentials in our signature obsidian and amber-tan palettes."
|
||||
products={[
|
||||
{ id: "1", name: "The Obsidian Oxford", price: "$850", imageSrc: "http://img.b2bpic.net/free-photo/shoes_1303-3607.jpg?_wi=2" },
|
||||
{ id: "2", name: "Amber Grace Heels", price: "$720", imageSrc: "http://img.b2bpic.net/free-photo/handsome-brunette-girl-wear-black-red-high-heels-sitting-posing-chair-studio-against-dark-brick-wall-studio-model-portrait_627829-7841.jpg?_wi=2" },
|
||||
{ id: "3", name: "Heritage Leather Boot", price: "$950", imageSrc: "http://img.b2bpic.net/free-photo/boots-woman-autumnal-forest_329181-17144.jpg?_wi=2" },
|
||||
{ id: "4", name: "Velvet Loafer", price: "$680", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-smiling-sitting-floor-white-wall_176420-8546.jpg?_wi=2" },
|
||||
{ id: "5", name: "Modern Derby", price: "$790", imageSrc: "http://img.b2bpic.net/free-photo/groom-wedding-shoes_1303-10490.jpg" },
|
||||
{ id: "6", name: "Elegance Stiletto", price: "$880", imageSrc: "http://img.b2bpic.net/free-photo/luxury-fashion-woman-accessories-golden-heeled-shoes-little-evening-purse-elegant-style-vintage-style-sandals-footwear_285396-7262.jpg" }
|
||||
{ id: "1", name: "Obsidian Oversized Tee", price: "$120", imageSrc: "http://img.b2bpic.net/free-photo/black-t-shirt-front-view_125540-1533.jpg" },
|
||||
{ id: "2", name: "Linen Cream Trousers", price: "$240", imageSrc: "http://img.b2bpic.net/free-photo/beige-trousers-studio_125540-1540.jpg" },
|
||||
{ id: "3", name: "Amber-Tan Knit", price: "$310", imageSrc: "http://img.b2bpic.net/free-photo/tan-sweater-studio_125540-1545.jpg" },
|
||||
{ id: "4", name: "Off-White Utility Jacket", price: "$450", imageSrc: "http://img.b2bpic.net/free-photo/white-utility-jacket_125540-1550.jpg" }
|
||||
]}
|
||||
title="Iconic Collections"
|
||||
description="Discover our signature footwear, crafted to last a lifetime."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyThree
|
||||
animationType="slide-up"
|
||||
title="Featured Collection"
|
||||
description="Timeless staples for the modern individual."
|
||||
features={[
|
||||
{ id: "f1", title: "The Obsidian Edit", tags: ["Sustainable", "Luxury"], imageSrc: "http://img.b2bpic.net/free-photo/fashionable-man-woman-studio_125540-1600.jpg" },
|
||||
{ id: "f2", title: "Amber-Tan Basics", tags: ["Organic", "Essential"], imageSrc: "http://img.b2bpic.net/free-photo/model-wearing-tan-clothing_125540-1605.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="trending" data-section="trending">
|
||||
<TestimonialCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
title="Trending Now"
|
||||
testimonials={[]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="A Legacy of Craftsmanship"
|
||||
description="VOXE was founded on the belief that luxury should be felt in every step. We source only the finest leathers, ensuring our shoes age with grace and integrity."
|
||||
title="Our Brand Values"
|
||||
description="VOXE is committed to sustainability, inclusivity, and uncompromising craftsmanship. We believe fashion is a story that should be worn with pride by everyone."
|
||||
metrics={[
|
||||
{ value: "120+", title: "Years of Tradition" },
|
||||
{ value: "24h", title: "Craftsmanship Per Shoe" },
|
||||
{ value: "100%", title: "Ethical Sourcing" }
|
||||
{ value: "100%", title: "Ethical" },
|
||||
{ value: "Global", title: "Inclusive" },
|
||||
{ value: "Timeless", title: "Design" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/bootmaker-workshop-making-shoes_171337-12278.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-fashion-fabric-textiles_125540-1700.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Join the VOXE Circle"
|
||||
description="Sign up for early access to our limited collections and receive an exclusive 10% incentive on your first pair."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Your Email", required: true }
|
||||
]}
|
||||
mediaPosition="left"
|
||||
buttonText="Subscribe & Save 10%"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/bootmaker-workshop-making-shoes_171337-12278.jpg?_wi=2"
|
||||
<ContactCTA
|
||||
tag="Newsletter"
|
||||
title="Stay connected"
|
||||
description="Join our community for early access to new collections and exclusive updates."
|
||||
buttons={[{ text: "Sign Up", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
<FooterLogoEmphasis
|
||||
logoText="VOXE"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Terms of Service", href: "#" }}
|
||||
columns={[
|
||||
{ items: [{ label: "Shop" }, { label: "Journal" }] },
|
||||
{ items: [{ label: "Support" }, { label: "Contact" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user