Merge version_1 into main

Merge version_1 into main
This commit was merged in pull request #2.
This commit is contained in:
2026-05-14 10:49:25 +00:00

View File

@@ -29,386 +29,166 @@ export default function LandingPage() {
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "Features",
id: "features",
},
{
name: "Shop",
id: "products",
},
{
name: "Testimonials",
id: "testimonials",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="URBAN X"
/>
</div>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{ name: "Home", id: "hero" },
{ name: "Features", id: "features" },
{ name: "Shop", id: "products" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Contact", id: "contact" },
]}
brandName="URBAN X"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboard
background={{
variant: "plain",
}}
title="Redefining Urban Culture"
description="Premium streetwear designed for the modern lifestyle. Effortless style, unmatched quality."
buttons={[
{
text: "Shop New Arrivals",
href: "#products",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/disappointed-upset-seriouslooking-attractive-s-redhead-woman-red-knitted-dress-frowning-di_1258-142109.jpg?_wi=1"
mediaAnimation="slide-up"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/side-view-woman-single-s-day-banner_23-2149520244.jpg",
alt: "urban streetwear fashion",
},
{
src: "http://img.b2bpic.net/free-photo/shopping-discounts-concept-young-stylish-modern-girl-posing-with-credit-card-looking-happy-s_1258-120032.jpg",
alt: "street style photography",
},
{
src: "http://img.b2bpic.net/free-photo/be-classy-unique-different-icon_53876-21335.jpg",
alt: "modern urban fashion",
},
{
src: "http://img.b2bpic.net/free-photo/quotes-about-family-concept_23-2150038765.jpg",
alt: "urban style portrait",
},
{
src: "http://img.b2bpic.net/free-photo/portrait-young-beautiful-confident-blond-female-trendy-summer-black-oversize-clothes-sexy-carefree-woman-posing-near-white-brick-wall-studio-model-indoors_158538-27080.jpg",
alt: "streetwear influencer",
},
]}
avatarText="Join our community of 10k+ fashion forward individuals."
marqueeItems={[
{
type: "text",
text: "LIMITED DROPS",
},
{
type: "text",
text: "GLOBAL SHIPPING",
},
{
type: "text",
text: "PREMIUM COTTON",
},
{
type: "text",
text: "URBAN X EXCLUSIVE",
},
{
type: "text",
text: "SEASONAL TRENDS",
},
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboard
background={{ variant: "plain" }}
title="Redefining Urban Culture"
description="Premium streetwear designed for the modern lifestyle. Effortless style, unmatched quality."
buttons={[{ text: "Shop New Arrivals", href: "#products" }]}
imageSrc="http://img.b2bpic.net/free-photo/disappointed-upset-seriouslooking-attractive-s-redhead-woman-red-knitted-dress-frowning-di_1258-142109.jpg"
mediaAnimation="slide-up"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/side-view-woman-single-s-day-banner_23-2149520244.jpg", alt: "urban streetwear fashion" },
{ src: "http://img.b2bpic.net/free-photo/shopping-discounts-concept-young-stylish-modern-girl-posing-with-credit-card-looking-happy-s_1258-120032.jpg", alt: "street style photography" },
{ src: "http://img.b2bpic.net/free-photo/be-classy-unique-different-icon_53876-21335.jpg", alt: "modern urban fashion" },
{ src: "http://img.b2bpic.net/free-photo/quotes-about-family-concept_23-2150038765.jpg", alt: "urban style portrait" },
{ src: "http://img.b2bpic.net/free-photo/portrait-young-beautiful-confident-blond-female-trendy-summer-black-oversize-clothes-sexy-carefree-woman-posing-near-white-brick-wall-studio-model-indoors_158538-27080.jpg", alt: "streetwear influencer" },
]}
avatarText="Join our community of 10k+ fashion forward individuals."
marqueeItems={[
{ type: "text", text: "LIMITED DROPS" },
{ type: "text", text: "GLOBAL SHIPPING" },
{ type: "text", text: "PREMIUM COTTON" },
{ type: "text", text: "URBAN X EXCLUSIVE" },
{ type: "text", text: "SEASONAL TRENDS" },
]}
/>
</div>
<div id="features" data-section="features">
<FeatureBento
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={true}
features={[
{
bentoComponent: "reveal-icon",
title: "Premium Material",
description: "High-grade fabrics built to last.",
icon: Shield,
imageSrc: "http://img.b2bpic.net/free-vector/slow-fashion-badge-collection_23-2148816082.jpg",
imageAlt: "premium fabric icon outline",
},
{
bentoComponent: "reveal-icon",
title: "Sustainable",
description: "Ethical manufacturing for the future.",
icon: Leaf,
imageSrc: "http://img.b2bpic.net/free-photo/disappointed-upset-seriouslooking-attractive-s-redhead-woman-red-knitted-dress-frowning-di_1258-142109.jpg?_wi=2",
imageAlt: "premium fabric icon outline",
},
{
bentoComponent: "reveal-icon",
title: "Unique Design",
description: "Original patterns made in NYC.",
icon: PenTool,
imageSrc: "http://img.b2bpic.net/free-photo/sustainability-ecology-save-environment-concept_53876-120476.jpg",
imageAlt: "premium fabric icon outline",
},
]}
title="Why Urban X?"
description="We blend heritage quality with contemporary urban silhouettes."
/>
</div>
<div id="features" data-section="features">
<FeatureBento
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={true}
features={[
{
bentoComponent: "reveal-icon", title: "Premium Material", description: "High-grade fabrics built to last.", icon: Shield,
},
{
bentoComponent: "reveal-icon", title: "Sustainable", description: "Ethical manufacturing for the future.", icon: Leaf,
},
{
bentoComponent: "reveal-icon", title: "Unique Design", description: "Original patterns made in NYC.", icon: PenTool,
},
]}
title="Why Urban X?"
description="We blend heritage quality with contemporary urban silhouettes."
/>
</div>
<div id="products" data-section="products">
<ProductCardThree
animationType="slide-up"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Oversized Hoodie",
price: "$120",
imageSrc: "http://img.b2bpic.net/free-photo/young-lady-oversized-hoodie-pants-showing-size-sign-looking-confident-front-view_176474-58570.jpg",
},
{
id: "p2",
name: "Graphic Tee",
price: "$45",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=st7z2q",
},
{
id: "p3",
name: "Utility Cargo",
price: "$95",
imageSrc: "http://img.b2bpic.net/free-photo/happy-african-young-man-using-cell-phone-outdoors-autumn_171337-15965.jpg",
},
{
id: "p4",
name: "Bomber Jacket",
price: "$180",
imageSrc: "http://img.b2bpic.net/free-photo/happy-meeting-computer-suit-mood-success_1303-2944.jpg",
},
{
id: "p5",
name: "Street Sneakers",
price: "$150",
imageSrc: "http://img.b2bpic.net/free-photo/upperangle-cropped-shot-caucasian-woman-hands-sneakers-stand_197531-30260.jpg",
},
{
id: "p6",
name: "Logo Beanie",
price: "$30",
imageSrc: "http://img.b2bpic.net/free-photo/young-surfer-man-with-his-surfboard_273609-14208.jpg",
},
]}
title="Latest Collection"
description="Explore our core lineup for the season."
/>
</div>
<div id="products" data-section="products">
<ProductCardThree
animationType="slide-up"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
products={[
{ id: "p1", name: "Oversized Hoodie", price: "$120", imageSrc: "http://img.b2bpic.net/free-photo/young-lady-oversized-hoodie-pants-showing-size-sign-looking-confident-front-view_176474-58570.jpg" },
{ id: "p2", name: "Graphic Tee", price: "$45", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=st7z2q" },
{ id: "p3", name: "Utility Cargo", price: "$95", imageSrc: "http://img.b2bpic.net/free-photo/happy-african-young-man-using-cell-phone-outdoors-autumn_171337-15965.jpg" },
{ id: "p4", name: "Bomber Jacket", price: "$180", imageSrc: "http://img.b2bpic.net/free-photo/happy-meeting-computer-suit-mood-success_1303-2944.jpg" },
{ id: "p5", name: "Street Sneakers", price: "$150", imageSrc: "http://img.b2bpic.net/free-photo/upperangle-cropped-shot-caucasian-woman-hands-sneakers-stand_197531-30260.jpg" },
{ id: "p6", name: "Logo Beanie", price: "$30", imageSrc: "http://img.b2bpic.net/free-photo/young-surfer-man-with-his-surfboard_273609-14208.jpg" },
]}
title="Latest Collection"
description="Explore our core lineup for the season."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardEleven
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
metrics={[
{
id: "m1",
value: "10k+",
title: "Happy Customers",
description: "Across North America",
imageSrc: "http://img.b2bpic.net/free-photo/covid-19-global-economic-crisis_23-2148746588.jpg",
},
{
id: "m2",
value: "24h",
title: "Shipping",
description: "Same day dispatch",
imageSrc: "http://img.b2bpic.net/free-photo/chart-statistics-sign-front-side-with-white-background_187299-39803.jpg",
},
{
id: "m3",
value: "100%",
title: "Cotton",
description: "Sustainable sourced",
imageSrc: "http://img.b2bpic.net/free-photo/arrow-symbol-illustrated_23-2151909744.jpg",
},
]}
title="Our Impact"
description="Growing a community of urban style enthusiasts worldwide."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardEleven
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
metrics={[
{ id: "m1", value: "10k+", title: "Happy Customers", description: "Across North America", imageSrc: "http://img.b2bpic.net/free-photo/covid-19-global-economic-crisis_23-2148746588.jpg" },
{ id: "m2", value: "24h", title: "Shipping", description: "Same day dispatch", imageSrc: "http://img.b2bpic.net/free-photo/chart-statistics-sign-front-side-with-white-background_187299-39803.jpg" },
{ id: "m3", value: "100%", title: "Cotton", description: "Sustainable sourced", imageSrc: "http://img.b2bpic.net/free-photo/arrow-symbol-illustrated_23-2151909744.jpg" },
]}
title="Our Impact"
description="Growing a community of urban style enthusiasts worldwide."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTen
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "t1",
title: "Solid Quality",
quote: "The best hoodie I have owned.",
name: "Marcus A.",
role: "Designer",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-taking-selfie-mobile-phone-standing-street_23-2148148152.jpg",
},
{
id: "t2",
title: "Fast Shipping",
quote: "Ordered on Friday, here by Monday.",
name: "Elena K.",
role: "Student",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-redhead-girl-wearing-trendy-clothes-with-wireless-headphones-holding-takeaway-coffee-outside-cafe_613910-17706.jpg",
},
{
id: "t3",
title: "Great Fit",
quote: "Finally, oversized clothes that fit right.",
name: "Sam R.",
role: "Creative",
imageSrc: "http://img.b2bpic.net/free-photo/longhaired-brunette-woman-sunglasses-black-jacket-smiles-walks-outside-asian-tanned-lady-with-red-lips-poses-near-building_197531-27915.jpg",
},
{
id: "t4",
title: "Sustainable choice",
quote: "Love the ethical mission.",
name: "Jade D.",
role: "Artist",
imageSrc: "http://img.b2bpic.net/free-photo/teenage-street-artist-wears-hat-orange-t-shirt-chain-poses-against-graffiti-wall-has-discontent-expression_273609-47422.jpg",
},
{
id: "t5",
title: "Dope Style",
quote: "Unmatched aesthetic.",
name: "Leo B.",
role: "Athlete",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-looking-sky-through-sunglasses-sitting-motorbike_158595-3314.jpg",
},
]}
title="Customer Stories"
description="See why our community loves Urban X."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTen
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{ id: "t1", title: "Solid Quality", quote: "The best hoodie I have owned.", name: "Marcus A.", role: "Designer", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-taking-selfie-mobile-phone-standing-street_23-2148148152.jpg" },
{ id: "t2", title: "Fast Shipping", quote: "Ordered on Friday, here by Monday.", name: "Elena K.", role: "Student", imageSrc: "http://img.b2bpic.net/free-photo/portrait-redhead-girl-wearing-trendy-clothes-with-wireless-headphones-holding-takeaway-coffee-outside-cafe_613910-17706.jpg" },
{ id: "t3", title: "Great Fit", quote: "Finally, oversized clothes that fit right.", name: "Sam R.", role: "Creative", imageSrc: "http://img.b2bpic.net/free-photo/longhaired-brunette-woman-sunglasses-black-jacket-smiles-walks-outside-asian-tanned-lady-with-red-lips-poses-near-building_197531-27915.jpg" },
{ id: "t4", title: "Sustainable choice", quote: "Love the ethical mission.", name: "Jade D.", role: "Artist", imageSrc: "http://img.b2bpic.net/free-photo/teenage-street-artist-wears-hat-orange-t-shirt-chain-poses-against-graffiti-wall-has-discontent-expression_273609-47422.jpg" },
{ id: "t5", title: "Dope Style", quote: "Unmatched aesthetic.", name: "Leo B.", role: "Athlete", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-looking-sky-through-sunglasses-sitting-motorbike_158595-3314.jpg" },
]}
title="Customer Stories"
description="See why our community loves Urban X."
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
textboxLayout="split"
useInvertedBackground={true}
faqs={[
{
id: "f1",
title: "How is sizing?",
content: "Our clothes are oversized; order your regular size for the look.",
},
{
id: "f2",
title: "Can I return items?",
content: "Yes, we accept returns within 30 days.",
},
{
id: "f3",
title: "Shipping time?",
content: "Typically 3-5 business days.",
},
]}
title="Need Help?"
description="Common questions about our brand."
faqsAnimation="slide-up"
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
textboxLayout="split"
useInvertedBackground={true}
faqs={[
{ id: "f1", title: "How is sizing?", content: "Our clothes are oversized; order your regular size for the look." },
{ id: "f2", title: "Can I return items?", content: "Yes, we accept returns within 30 days." },
{ id: "f3", title: "Shipping time?", content: "Typically 3-5 business days." },
]}
title="Need Help?"
description="Common questions about our brand."
faqsAnimation="slide-up"
/>
</div>
<div id="blog" data-section="blog">
<BlogCardOne
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
title="Brand Insights"
description="Behind the scenes with our designers."
blogs={[
{
id: "b1",
category: "Style",
title: "Winter Trends",
excerpt: "What to wear this season.",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-laptop-surrounded-by-clothes_23-2148135518.jpg",
authorName: "Design Team",
authorAvatar: "http://img.b2bpic.net/free-photo/stylish-hipster-arab-man-guy-sunglasses-posed-outdoor-street-sunset-against-gray-wall_627829-2738.jpg",
date: "Oct 12",
},
{
id: "b2",
category: "Behind Scenes",
title: "How we make it",
excerpt: "The process of our production.",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-women-sweaters-jeans-posing-window-shadow_23-2149296209.jpg",
authorName: "Urban X",
authorAvatar: "http://img.b2bpic.net/free-photo/process-creating-stand-up-comedy_23-2151058849.jpg",
date: "Sep 28",
},
{
id: "b3",
category: "Lookbook",
title: "Autumn Lookbook",
excerpt: "Street style inspirations.",
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-posing-fast-fashion-concept_23-2150805278.jpg",
authorName: "Lookbook Team",
authorAvatar: "http://img.b2bpic.net/free-photo/young-handsome-african-american-man-posing-outdoors-paris-happy-smile-fashion-style-lights-evening-cafes_1321-2929.jpg",
date: "Sep 15",
},
]}
/>
</div>
<div id="blog" data-section="blog">
<BlogCardOne
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
title="Brand Insights"
description="Behind the scenes with our designers."
blogs={[
{ id: "b1", category: "Style", title: "Winter Trends", excerpt: "What to wear this season.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-laptop-surrounded-by-clothes_23-2148135518.jpg", authorName: "Design Team", authorAvatar: "http://img.b2bpic.net/free-photo/stylish-hipster-arab-man-guy-sunglasses-posed-outdoor-street-sunset-against-gray-wall_627829-2738.jpg", date: "Oct 12" },
{ id: "b2", category: "Behind Scenes", title: "How we make it", excerpt: "The process of our production.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-women-sweaters-jeans-posing-window-shadow_23-2149296209.jpg", authorName: "Urban X", authorAvatar: "http://img.b2bpic.net/free-photo/process-creating-stand-up-comedy_23-2151058849.jpg", date: "Sep 28" },
{ id: "b3", category: "Lookbook", title: "Autumn Lookbook", excerpt: "Street style inspirations.", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-posing-fast-fashion-concept_23-2150805278.jpg", authorName: "Lookbook Team", authorAvatar: "http://img.b2bpic.net/free-photo/young-handsome-african-american-man-posing-outdoors-paris-happy-smile-fashion-style-lights-evening-cafes_1321-2929.jpg", date: "Sep 15" },
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={true}
background={{
variant: "plain",
}}
tag="Get In Touch"
title="Ready to level up?"
description="Sign up for our newsletter to get early access to drops."
buttons={[
{
text: "Join Newsletter",
href: "#",
},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={true}
background={{ variant: "plain" }}
tag="Get In Touch"
title="Ready to level up?"
description="Sign up for our newsletter to get early access to drops."
buttons={[{ text: "Join Newsletter", href: "#" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="URBAN X"
columns={[
{
title: "Shop",
items: [
{
label: "Hoodies",
href: "#",
},
{
label: "Tees",
href: "#",
},
],
},
{
title: "Support",
items: [
{
label: "FAQ",
href: "#",
},
{
label: "Contact",
href: "#",
},
],
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="URBAN X"
columns={[
{ title: "Shop", items: [{ label: "Hoodies", href: "#" }, { label: "Tees", href: "#" }] },
{ title: "Support", items: [{ label: "FAQ", href: "#" }, { label: "Contact", href: "#" }] },
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);