Merge version_1 into main
Merge version_1 into main
This commit was merged in pull request #1.
This commit is contained in:
232
src/app/page.tsx
232
src/app/page.tsx
@@ -31,95 +31,43 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "New Arrivals",
|
||||
id: "#products",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "#faq",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
{ name: "New Arrivals", id: "#products" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "FAQ", id: "#faq" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="MODA"
|
||||
button={{ text: "Shop Now", href: "#products" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Define Your Style"
|
||||
description="Discover timeless apparel crafted for the modern individual. Quality, comfort, and unmatched design in every stitch."
|
||||
kpis={[
|
||||
{
|
||||
value: "100+",
|
||||
label: "Styles",
|
||||
},
|
||||
{
|
||||
value: "5k+",
|
||||
label: "Happy Fans",
|
||||
},
|
||||
{
|
||||
value: "Global",
|
||||
label: "Shipping",
|
||||
},
|
||||
{ value: "100+", label: "Styles" },
|
||||
{ value: "5k+", label: "Happy Fans" },
|
||||
{ value: "Global", label: "Shipping" },
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/beautiful-blonde-woman-blue-light_23-2149478937.jpg"
|
||||
imageAlt="Model wearing modern streetwear"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/front-view-man-woman-posing-with-transparent-fabric_23-2148239957.jpg",
|
||||
alt: "Customer A",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/surrealist-portrait-fashionable-woman_23-2149224671.jpg",
|
||||
alt: "Customer B",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/attractive-woman-yellow-summer-dress-with-short-hairstyle-interior-room-concrete-wall-background-posing-sunny-shadows_285396-10430.jpg",
|
||||
alt: "Customer C",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-posing-with-avantgarde-head-peice_23-2149020827.jpg",
|
||||
alt: "Customer D",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/pink-hair-girl-avantgarde-style-wearing-sunglasses_114579-19318.jpg",
|
||||
alt: "Customer E",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/front-view-man-woman-posing-with-transparent-fabric_23-2148239957.jpg", alt: "Customer A" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/surrealist-portrait-fashionable-woman_23-2149224671.jpg", alt: "Customer B" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/attractive-woman-yellow-summer-dress-with-short-hairstyle-interior-room-concrete-wall-background-posing-sunny-shadows_285396-10430.jpg", alt: "Customer C" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-posing-with-avantgarde-head-peice_23-2149020827.jpg", alt: "Customer D" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/pink-hair-girl-avantgarde-style-wearing-sunglasses_114579-19318.jpg", alt: "Customer E" },
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Sustainable",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Modern",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Premium",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Timeless",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Urban",
|
||||
},
|
||||
{ type: "text", text: "Sustainable" },
|
||||
{ type: "text", text: "Modern" },
|
||||
{ type: "text", text: "Premium" },
|
||||
{ type: "text", text: "Timeless" },
|
||||
{ type: "text", text: "Urban" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -131,42 +79,12 @@ export default function LandingPage() {
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Classic Hoodie",
|
||||
price: "$89",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-smiley-woman-moving-her-body_23-2149429032.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Denim Jacket",
|
||||
price: "$129",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/denim-jacket-with-80s-patch_23-2151991673.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Essential Tee",
|
||||
price: "$35",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-female-accessories-collage-with-hat-bag-fashion-glasses-mobile-phone-earphone-white-background_1428-641.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Urban Joggers",
|
||||
price: "$75",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-front-graffiti-wall_23-2147827459.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Slim Fit Denim",
|
||||
price: "$95",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fast-fashion-vs-slow-sustainable-fashion_23-2149133969.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Signature Scarf",
|
||||
price: "$45",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-natural-pigmented-cloth-with-copy-space_23-2148734458.jpg",
|
||||
},
|
||||
{ id: "p1", name: "Classic Hoodie", price: "$89", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-smiley-woman-moving-her-body_23-2149429032.jpg" },
|
||||
{ id: "p2", name: "Denim Jacket", price: "$129", imageSrc: "http://img.b2bpic.net/free-photo/denim-jacket-with-80s-patch_23-2151991673.jpg" },
|
||||
{ id: "p3", name: "Essential Tee", price: "$35", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-female-accessories-collage-with-hat-bag-fashion-glasses-mobile-phone-earphone-white-background_1428-641.jpg" },
|
||||
{ id: "p4", name: "Urban Joggers", price: "$75", imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-front-graffiti-wall_23-2147827459.jpg" },
|
||||
{ id: "p5", name: "Slim Fit Denim", price: "$95", imageSrc: "http://img.b2bpic.net/free-photo/fast-fashion-vs-slow-sustainable-fashion_23-2149133969.jpg" },
|
||||
{ id: "p6", name: "Signature Scarf", price: "$45", imageSrc: "http://img.b2bpic.net/free-photo/top-view-natural-pigmented-cloth-with-copy-space_23-2148734458.jpg" },
|
||||
]}
|
||||
title="Fresh Drops"
|
||||
description="Browse our latest collection designed for your everyday adventures."
|
||||
@@ -178,21 +96,9 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
title="Our Commitment to Quality"
|
||||
metrics={[
|
||||
{
|
||||
icon: ShieldCheck,
|
||||
label: "Ethical Sourcing",
|
||||
value: "100%",
|
||||
},
|
||||
{
|
||||
icon: Recycle,
|
||||
label: "Sustainable Materials",
|
||||
value: "85%",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
label: "Lifetime Durability",
|
||||
value: "Guaranteed",
|
||||
},
|
||||
{ icon: ShieldCheck, label: "Ethical Sourcing", value: "100%" },
|
||||
{ icon: Recycle, label: "Sustainable Materials", value: "85%" },
|
||||
{ icon: Award, label: "Lifetime Durability", value: "Guaranteed" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -205,26 +111,11 @@ export default function LandingPage() {
|
||||
rating={5}
|
||||
author="Alex Rivera"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/fashion-woman-casual-hipster-summer-clothes_158538-7806.jpg",
|
||||
alt: "Customer Alex",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-beautiful-smiling-brunette-model-dressed-summer-hipster-jacket-clothes_158538-1607.jpg",
|
||||
alt: "Customer Maria",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/shopping-day-international-girlfriends-women-city_1157-46776.jpg",
|
||||
alt: "Customer John",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-handsome-african-american-man-posing-outdoors-paris-happy-smile-fashion-style_1321-3388.jpg",
|
||||
alt: "Customer Sarah",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/stylish-woman-with-curly-hair-wears-trendy-sunglasses-jacket-trousers-carries-fabric-bag-has-glad-expression-poses-outdoors-near-urban-building-spends-free-time-city-people-style-concept_273609-59926.jpg",
|
||||
alt: "Customer Leo",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/fashion-woman-casual-hipster-summer-clothes_158538-7806.jpg", alt: "Customer Alex" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-beautiful-smiling-brunette-model-dressed-summer-hipster-jacket-clothes_158538-1607.jpg", alt: "Customer Maria" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/shopping-day-international-girlfriends-women-city_1157-46776.jpg", alt: "Customer John" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-handsome-african-american-man-posing-outdoors-paris-happy-smile-fashion-style_1321-3388.jpg", alt: "Customer Sarah" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/stylish-woman-with-curly-hair-wears-trendy-sunglasses-jacket-trousers-carries-fabric-bag-has-glad-expression-poses-outdoors-near-urban-building-spends-free-time-city-people-style-concept_273609-59926.jpg", alt: "Customer Leo" },
|
||||
]}
|
||||
ratingAnimation="blur-reveal"
|
||||
avatarsAnimation="slide-up"
|
||||
@@ -235,13 +126,7 @@ export default function LandingPage() {
|
||||
<SocialProofOne
|
||||
textboxLayout="split-description"
|
||||
useInvertedBackground={true}
|
||||
names={[
|
||||
"Vogue",
|
||||
"GQ Style",
|
||||
"Highsnobiety",
|
||||
"Complex",
|
||||
"Hypebeast",
|
||||
]}
|
||||
names={["Vogue", "GQ Style", "Highsnobiety", "Complex", "Hypebeast"]}
|
||||
title="As Seen In"
|
||||
description="Recognized by industry leaders for our commitment to design."
|
||||
/>
|
||||
@@ -251,21 +136,9 @@ export default function LandingPage() {
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "How long is shipping?",
|
||||
content: "Orders typically ship within 2-3 business days.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Do you offer returns?",
|
||||
content: "We offer a 30-day return policy on all unworn items.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Where are you based?",
|
||||
content: "We are based in New York and ship globally.",
|
||||
},
|
||||
{ id: "1", title: "How long is shipping?", content: "Orders typically ship within 2-3 business days." },
|
||||
{ id: "2", title: "Do you offer returns?", content: "We offer a 30-day return policy on all unworn items." },
|
||||
{ id: "3", title: "Where are you based?", content: "We are based in New York and ship globally." },
|
||||
]}
|
||||
sideTitle="Common Questions"
|
||||
sideDescription="Everything you need to know about your order, shipping, and returns."
|
||||
@@ -279,25 +152,10 @@ export default function LandingPage() {
|
||||
title="Get in Touch"
|
||||
description="Have questions about a collection or need sizing advice? Send us a message."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Your Email",
|
||||
required: true,
|
||||
},
|
||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "How can we help?",
|
||||
rows: 4,
|
||||
required: true,
|
||||
}}
|
||||
textarea={{ name: "message", placeholder: "How can we help?", rows: 4, required: true }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/high-fashion-look-glamor-closeup-portrait-beautiful-sexy-stylish-brunette-hipster-young-woman-model-white-coat-jacket-big-black-hat_158538-2842.jpg"
|
||||
imageAlt="High fashion look"
|
||||
/>
|
||||
@@ -306,14 +164,8 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="MODA"
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Terms of Service", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
Reference in New Issue
Block a user