Merge version_1 into main #2
307
src/app/page.tsx
307
src/app/page.tsx
@@ -17,225 +17,110 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="expand-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Peak"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Peak"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="Reach Your Peak."
|
||||
description="Premium performance footwear designed for the modern lifestyle. Elevate every step with Peak."
|
||||
buttons={[
|
||||
{
|
||||
text: "Shop Collection",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BfgkO2pi7NgDiwxgz4TxM9RAUf/a-high-end-professional-studio-photograp-1774885726901-a1817377.png"
|
||||
imageAlt="Peak Premium Athletic Shoe"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="Reach Your Peak."
|
||||
description="Premium performance footwear designed for the modern lifestyle. Elevate every step with Peak."
|
||||
buttons={[{ text: "Shop Collection", href: "#products" }]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BfgkO2pi7NgDiwxgz4TxM9RAUf/a-high-end-professional-studio-photograp-1774885726901-a1817377.png"
|
||||
imageAlt="Peak Premium Athletic Shoe"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Peak Essential",
|
||||
price: "$120",
|
||||
variant: "White/Blue",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BfgkO2pi7NgDiwxgz4TxM9RAUf/premium-leather-lifestyle-sneaker-white--1774885726513-285ad385.png",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Peak Velocity",
|
||||
price: "$150",
|
||||
variant: "Midnight Blue",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BfgkO2pi7NgDiwxgz4TxM9RAUf/performance-running-shoe-dark-blue-and-b-1774885727876-6eb200f9.png",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Peak Breeze",
|
||||
price: "$110",
|
||||
variant: "Silver/Gray",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BfgkO2pi7NgDiwxgz4TxM9RAUf/lightweight-mesh-trainer-gray-and-white--1774885726105-67645bb7.png",
|
||||
},
|
||||
]}
|
||||
title="Featured Collection"
|
||||
description="Hand-picked performance and lifestyle shoes crafted for quality and comfort."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "Peak Essential", price: "$120", variant: "White/Blue", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BfgkO2pi7NgDiwxgz4TxM9RAUf/premium-leather-lifestyle-sneaker-white--1774885726513-285ad385.png" },
|
||||
{ id: "p2", name: "Peak Velocity", price: "$150", variant: "Midnight Blue", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BfgkO2pi7NgDiwxgz4TxM9RAUf/performance-running-shoe-dark-blue-and-b-1774885727876-6eb200f9.png" },
|
||||
{ id: "p3", name: "Peak Breeze", price: "$110", variant: "Silver/Gray", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BfgkO2pi7NgDiwxgz4TxM9RAUf/lightweight-mesh-trainer-gray-and-white--1774885726105-67645bb7.png" }
|
||||
]}
|
||||
title="Featured Collection"
|
||||
description="Hand-picked performance and lifestyle shoes crafted for quality and comfort."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="Our Story"
|
||||
title="Crafted for Excellence"
|
||||
description="At Peak, we believe footwear should empower your movement, not restrict it. Every pair is designed with precision."
|
||||
subdescription="Innovation meets comfort in every stitch. Join the movement."
|
||||
icon={Sparkles}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BfgkO2pi7NgDiwxgz4TxM9RAUf/close-up-shot-of-athletic-shoe-sole-mate-1774885727177-7b34b5c8.png"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="Our Story"
|
||||
title="Crafted for Excellence"
|
||||
description="At Peak, we believe footwear should empower your movement, not restrict it. Every pair is designed with precision."
|
||||
subdescription="Innovation meets comfort in every stitch. Join the movement."
|
||||
icon={Sparkles}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BfgkO2pi7NgDiwxgz4TxM9RAUf/close-up-shot-of-athletic-shoe-sole-mate-1774885727177-7b34b5c8.png"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Johnson",
|
||||
role: "Runner",
|
||||
company: "Marathon Team",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/nice-i-friendly-outgoing-gorgeous-young-smiling-girl-showing-thumb-up-saying-yes-approving-liking-awesome-interesting-plan-grinning-accepting-terms-no-problems-standing-white-wall_176420-35585.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael Chen",
|
||||
role: "Athlete",
|
||||
company: "Pro Training",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/mixed-rae-african-american-woman-has-rest-her-workout-breathing-deep-body-parts_633478-2160.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily Davis",
|
||||
role: "Coach",
|
||||
company: "Peak Fit",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-handsome-young-man-sitting-cafe-with-mobile-phone-wearing-wireless-headphones_1258-245284.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David Kim",
|
||||
role: "Runner",
|
||||
company: "Casual Joggers",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-can-t-decide-which-shoes-buy_329181-8002.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Elena Rodriguez",
|
||||
role: "Triathlete",
|
||||
company: "Elite Gear",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/nice-i-friendly-outgoing-gorgeous-young-smiling-girl-showing-thumb-up-saying-yes-approving-liking-awesome-interesting-plan-grinning-accepting-terms-no-problems-standing-white-wall_176420-35585.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "10k+",
|
||||
label: "Happy Runners",
|
||||
},
|
||||
{
|
||||
value: "4.9/5",
|
||||
label: "Average Rating",
|
||||
},
|
||||
{
|
||||
value: "12",
|
||||
label: "Countries Served",
|
||||
},
|
||||
]}
|
||||
title="Trusted by Athletes"
|
||||
description="Hear what our community has to say about the Peak experience."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah Johnson", role: "Runner", company: "Marathon Team", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/nice-i-friendly-outgoing-gorgeous-young-smiling-girl-showing-thumb-up-saying-yes-approving-liking-awesome-interesting-plan-grinning-accepting-terms-no-problems-standing-white-wall_176420-35585.jpg" },
|
||||
{ id: "2", name: "Michael Chen", role: "Athlete", company: "Pro Training", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/mixed-rae-african-american-woman-has-rest-her-workout-breathing-deep-body-parts_633478-2160.jpg" },
|
||||
{ id: "3", name: "Emily Davis", role: "Coach", company: "Peak Fit", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-handsome-young-man-sitting-cafe-with-mobile-phone-wearing-wireless-headphones_1258-245284.jpg" },
|
||||
{ id: "4", name: "David Kim", role: "Runner", company: "Casual Joggers", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-can-t-decide-which-shoes-buy_329181-8002.jpg" },
|
||||
{ id: "5", name: "Elena Rodriguez", role: "Triathlete", company: "Elite Gear", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/nice-i-friendly-outgoing-gorgeous-young-smiling-girl-showing-thumb-up-saying-yes-approving-liking-awesome-interesting-plan-grinning-accepting-terms-no-problems-standing-white-wall_176420-35585.jpg" }
|
||||
]}
|
||||
kpiItems={[
|
||||
{ value: "10k+", label: "Happy Runners" },
|
||||
{ value: "4.9/5", label: "Average Rating" },
|
||||
{ value: "12", label: "Countries Served" }
|
||||
]}
|
||||
title="Trusted by Athletes"
|
||||
description="Hear what our community has to say about the Peak experience."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Support"
|
||||
title="Need Help With Sizing?"
|
||||
description="Our support team is always available to help you find the perfect pair."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Support",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Support"
|
||||
title="Need Help With Sizing?"
|
||||
description="Our support team is always available to help you find the perfect pair."
|
||||
buttons={[{ text: "Contact Support", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Shop",
|
||||
items: [
|
||||
{
|
||||
label: "All Shoes",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
label: "New Arrivals",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="Peak"
|
||||
copyrightText="© 2025 Peak Footwear. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{ title: "Shop", items: [{ label: "All Shoes", href: "#products" }, { label: "New Arrivals", href: "#" }] },
|
||||
{ title: "Company", items: [{ label: "About Us", href: "#about" }, { label: "Careers", href: "#" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }
|
||||
]}
|
||||
logoText="Peak"
|
||||
copyrightText="© 2025 Peak Footwear. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user