bender/74794f27-0a34-4e01-8569-63dfbedc50da
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-05-11 12:22:26 +00:00
parent 4a999beb06
commit a33961b3c2
1 changed files with 146 additions and 335 deletions
Download Patch File Download Diff File Expand all files Collapse all files

481
src/app/page.tsx
View File

@@ -29,350 +29,161 @@ export default function LandingPage() {
headingFontWeight="medium" headingFontWeight="medium"
> >
<ReactLenis root> <ReactLenis root>
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarStyleFullscreen <NavbarStyleFullscreen
navItems={[ navItems={[
{ { name: "Vault", id: "#vault" },
name: "Vault", { name: "Philosophy", id: "#vibe-check" },
id: "#vault", { name: "Blog", id: "#lab" },
}, { name: "Contact", id: "#contact" },
{ ]}
name: "Philosophy", brandName="DROP_01"
id: "#vibe-check", />
}, </div>
{
name: "Blog",
id: "#lab",
},
{
name: "Contact",
id: "#contact",
},
]}
brandName="DROP_01"
/>
</div>
<div id="hero" data-section="hero"> <div id="hero" data-section="hero">
<HeroOverlayTestimonial <HeroOverlayTestimonial
title="WE DON'T FIT THE MOLD. WE BREAK IT." title="WE DON'T FIT THE MOLD. WE BREAK IT."
description="Premium streetwear for the generation that refuses to be labeled. Ethically made. Locally inspired. Globally loud." description="Premium streetwear for the generation that refuses to be labeled. Ethically made. Locally inspired. Globally loud."
testimonials={[ testimonials={[
{ { name: "Sarah", handle: "@sarah_street", testimonial: "Fits like nothing else I own.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/vertical-grayscale-shot-small-bird-sitting-ventilation-system-wall-with-writings_181624-58322.jpg", imageAlt: "urban grainy cctv footage" },
name: "Sarah", { name: "Mike", handle: "@mike_tech", testimonial: "Durable as hell. Built for the city.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/father-walking-with-his-two-kids-night-city_1353-146.jpg", imageAlt: "urban grainy cctv footage" },
handle: "@sarah_street", { name: "Jules", handle: "@jules_fit", testimonial: "This design is completely unique.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-stretching-night-city_23-2149285662.jpg", imageAlt: "urban grainy cctv footage" },
testimonial: "Fits like nothing else I own.", { name: "Kev", handle: "@kev_core", testimonial: "The fabric quality is industry-leading.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-man-posing_23-2148916390.jpg", imageAlt: "urban grainy cctv footage" },
rating: 5, { name: "Luna", handle: "@luna_wear", testimonial: "Finally, streetwear with a real voice.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-city-night_23-2149024755.jpg", imageAlt: "urban grainy cctv footage" }
imageSrc: "http://img.b2bpic.net/free-photo/vertical-grayscale-shot-small-bird-sitting-ventilation-system-wall-with-writings_181624-58322.jpg?_wi=1", ]}
imageAlt: "urban grainy cctv footage", buttons={[{ text: "DROP 01: ACCESS NOW", href: "#vault" }]}
}, imageSrc="http://img.b2bpic.net/free-photo/vertical-grayscale-shot-small-bird-sitting-ventilation-system-wall-with-writings_181624-58322.jpg"
{ avatars={[
name: "Mike", { src: "http://img.b2bpic.net/free-photo/abstract-glimmers-light-flares_23-2151871966.jpg", alt: "Abstract glimmers" },
handle: "@mike_tech", { src: "http://img.b2bpic.net/free-photo/charming-woman-enjoying-beverage-street_23-2147765451.jpg", alt: "Charming woman" },
testimonial: "Durable as hell. Built for the city.", { src: "http://img.b2bpic.net/free-photo/outdoors-abstract-shadow-daylight_23-2149080269.jpg", alt: "Outdoors shadow" },
rating: 5, { src: "http://img.b2bpic.net/free-photo/close-up-view-small-traffic-lights-road_1150-20122.jpg", alt: "Traffic lights" },
imageSrc: "http://img.b2bpic.net/free-photo/father-walking-with-his-two-kids-night-city_1353-146.jpg?_wi=1", { src: "http://img.b2bpic.net/free-photo/young-person-getting-ready-doing-sport-night_23-2149287995.jpg", alt: "Sport at night" }
imageAlt: "urban grainy cctv footage", ]}
}, />
{ </div>
name: "Jules",
handle: "@jules_fit",
testimonial: "This design is completely unique.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/woman-stretching-night-city_23-2149285662.jpg?_wi=1",
imageAlt: "urban grainy cctv footage",
},
{
name: "Kev",
handle: "@kev_core",
testimonial: "The fabric quality is industry-leading.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-man-posing_23-2148916390.jpg?_wi=1",
imageAlt: "urban grainy cctv footage",
},
{
name: "Luna",
handle: "@luna_wear",
testimonial: "Finally, streetwear with a real voice.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-city-night_23-2149024755.jpg?_wi=1",
imageAlt: "urban grainy cctv footage",
},
]}
buttons={[
{
text: "DROP 01: ACCESS NOW",
href: "#vault",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/vertical-grayscale-shot-small-bird-sitting-ventilation-system-wall-with-writings_181624-58322.jpg?_wi=2"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/abstract-glimmers-light-flares_23-2151871966.jpg",
alt: "Abstract glimmers",
},
{
src: "http://img.b2bpic.net/free-photo/charming-woman-enjoying-beverage-street_23-2147765451.jpg",
alt: "Charming woman",
},
{
src: "http://img.b2bpic.net/free-photo/outdoors-abstract-shadow-daylight_23-2149080269.jpg",
alt: "Outdoors shadow",
},
{
src: "http://img.b2bpic.net/free-photo/close-up-view-small-traffic-lights-road_1150-20122.jpg",
alt: "Traffic lights",
},
{
src: "http://img.b2bpic.net/free-photo/young-person-getting-ready-doing-sport-night_23-2149287995.jpg",
alt: "Sport at night",
},
]}
/>
</div>
<div id="about" data-section="about"> <div id="about" data-section="about">
<MediaAbout <MediaAbout
useInvertedBackground={false} useInvertedBackground={false}
title="THE ESSENCE" title="THE ESSENCE"
description="We are architects of identity. Every thread, every stitch is a calculated step away from mass-produced banality." description="We are architects of identity. Every thread, every stitch is a calculated step away from mass-produced banality."
imageSrc="http://img.b2bpic.net/free-photo/beautiful-brunette-posing-black-staircase_1157-17446.jpg" imageSrc="http://img.b2bpic.net/free-photo/beautiful-brunette-posing-black-staircase_1157-17446.jpg"
/> />
</div> </div>
<div id="vault" data-section="vault"> <div id="vault" data-section="vault">
<ProductCardFour <ProductCardFour
animationType="slide-up" animationType="slide-up"
textboxLayout="default" textboxLayout="default"
gridVariant="asymmetric-60-wide-40-narrow" gridVariant="asymmetric-60-wide-40-narrow"
useInvertedBackground={true} useInvertedBackground={true}
products={[ products={[
{ { id: "1", name: "Ghost-Tech Hoodie", price: "$120", variant: "Oversized", imageSrc: "http://img.b2bpic.net/free-photo/father-walking-with-his-two-kids-night-city_1353-146.jpg" },
id: "1", { id: "2", name: "Midnight Cargo", price: "$145", variant: "Blackout", imageSrc: "http://img.b2bpic.net/free-photo/woman-stretching-night-city_23-2149285662.jpg" },
name: "Ghost-Tech Hoodie", { id: "3", name: "Urban Grid Tee", price: "$45", variant: "Raw Cotton", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-man-posing_23-2148916390.jpg" },
price: "$120", { id: "4", name: "Rooftop Jacket", price: "$210", variant: "Tech-Shell", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-city-night_23-2149024755.jpg" },
variant: "Oversized", { id: "5", name: "Sticker Pack", price: "$15", variant: "Die-Cut", imageSrc: "http://img.b2bpic.net/free-photo/interested-african-american-woman-trench-coat-looking-camera-front-view-curious-black-girl-standing-bricked-background_197531-28937.jpg" },
imageSrc: "http://img.b2bpic.net/free-photo/father-walking-with-his-two-kids-night-city_1353-146.jpg?_wi=2", { id: "6", name: "Alley Runner", price: "$95", variant: "Grey/Lime", imageSrc: "http://img.b2bpic.net/free-photo/portrait-pink-haired-girl-standing-tunnel-looking-camera_114579-92558.jpg" }
}, ]}
{ title="THE LATEST DROPS"
id: "2", description="Engineered for the urban struggle."
name: "Midnight Cargo", />
price: "$145", </div>
variant: "Blackout",
imageSrc: "http://img.b2bpic.net/free-photo/woman-stretching-night-city_23-2149285662.jpg?_wi=2",
},
{
id: "3",
name: "Urban Grid Tee",
price: "$45",
variant: "Raw Cotton",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-man-posing_23-2148916390.jpg?_wi=2",
},
{
id: "4",
name: "Rooftop Jacket",
price: "$210",
variant: "Tech-Shell",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-city-night_23-2149024755.jpg?_wi=2",
},
{
id: "5",
name: "Sticker Pack",
price: "$15",
variant: "Die-Cut",
imageSrc: "http://img.b2bpic.net/free-photo/interested-african-american-woman-trench-coat-looking-camera-front-view-curious-black-girl-standing-bricked-background_197531-28937.jpg",
},
{
id: "6",
name: "Alley Runner",
price: "$95",
variant: "Grey/Lime",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-pink-haired-girl-standing-tunnel-looking-camera_114579-92558.jpg",
},
]}
title="THE LATEST DROPS"
description="Engineered for the urban struggle."
/>
</div>
<div id="vibe-check" data-section="vibe-check"> <div id="vibe-check" data-section="vibe-check">
<FeatureCardTwentySeven <FeatureCardTwentySeven
textboxLayout="split" animationType="slide-up"
useInvertedBackground={false} textboxLayout="split"
features={[ useInvertedBackground={false}
{ features={[
id: "f1", { id: "f1", title: "Raw Authenticity", descriptions: ["Design driven by pure, unfiltered expression."], imageSrc: "http://img.b2bpic.net/free-photo/girl-with-dreadlocks-walking-night-street-city_627829-9562.jpg" },
title: "Raw Authenticity", { id: "f2", title: "Locally Sourced", descriptions: ["Ethically manufactured with low carbon footprint."], imageSrc: "http://img.b2bpic.net/free-photo/young-woman-sweater_1153-3091.jpg" },
descriptions: [ { id: "f3", title: "Globally Loud", descriptions: ["Built to be seen in the darkest city corners."], imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-posing-indoors_23-2149735221.jpg" }
"Design driven by pure, unfiltered expression.", ]}
], title="YOUR STYLE. YOUR RULES. OUR FABRIC."
imageSrc: "http://img.b2bpic.net/free-photo/girl-with-dreadlocks-walking-night-street-city_627829-9562.jpg", description="We aren't just selling clothes; we’re curating an identity. No filters. No apologies. Just the rawest versions of ourselves."
}, />
{ </div>
id: "f2",
title: "Locally Sourced",
descriptions: [
"Ethically manufactured with low carbon footprint.",
],
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-sweater_1153-3091.jpg",
},
{
id: "f3",
title: "Globally Loud",
descriptions: [
"Built to be seen in the darkest city corners.",
],
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-posing-indoors_23-2149735221.jpg",
},
]}
title="YOUR STYLE. YOUR RULES. OUR FABRIC."
description="We aren't just selling clothes; we’re curating an identity. No filters. No apologies. Just the rawest versions of ourselves."
/>
</div>
<div id="testimonials" data-section="testimonials"> <div id="testimonials" data-section="testimonials">
<TestimonialCardTwelve <TestimonialCardTwelve
useInvertedBackground={true} useInvertedBackground={true}
testimonials={[ testimonials={[
{ { id: "t1", name: "Alex", imageSrc: "http://img.b2bpic.net/free-photo/man-urban_1321-54.jpg" },
id: "t1", { id: "t2", name: "Sam", imageSrc: "http://img.b2bpic.net/free-photo/african-american-man-model-park_1303-10362.jpg" },
name: "Alex", { id: "t3", name: "Chris", imageSrc: "http://img.b2bpic.net/free-photo/portrait-charming-woman-looking-camera_197531-33313.jpg" },
imageSrc: "http://img.b2bpic.net/free-photo/man-urban_1321-54.jpg", { id: "t4", name: "Taylor", imageSrc: "http://img.b2bpic.net/free-photo/young-man-new-york-city-daytime_23-2149488505.jpg" },
}, { id: "t5", name: "Jordan", imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-with-afro-dreadlocks_23-2149462105.jpg" }
{ ]}
id: "t2", cardTitle="WHAT THEY SAY"
name: "Sam", cardAnimation="slide-up"
imageSrc: "http://img.b2bpic.net/free-photo/african-american-man-model-park_1303-10362.jpg", cardTag="REVIEWS"
}, />
{ </div>
id: "t3",
name: "Chris",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-charming-woman-looking-camera_197531-33313.jpg",
},
{
id: "t4",
name: "Taylor",
imageSrc: "http://img.b2bpic.net/free-photo/young-man-new-york-city-daytime_23-2149488505.jpg",
},
{
id: "t5",
name: "Jordan",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-with-afro-dreadlocks_23-2149462105.jpg",
},
]}
cardTitle="WHAT THEY SAY"
cardAnimation="slide-up"
cardTag="REVIEWS"
/>
</div>
<div id="metrics" data-section="metrics"> <div id="metrics" data-section="metrics">
<MetricCardThree <MetricCardThree
animationType="depth-3d" animationType="depth-3d"
textboxLayout="split" textboxLayout="split"
useInvertedBackground={false} useInvertedBackground={false}
metrics={[ metrics={[
{ { id: "m1", icon: Users, title: "Rebels Joined", value: "10k+" },
id: "m1", { id: "m2", icon: Globe, title: "Countries Shipped", value: "45" },
icon: Users, { id: "m3", icon: Award, title: "Drops Executed", value: "12" }
title: "Rebels Joined", ]}
value: "10k+", title="BY THE NUMBERS"
}, description="Evidence of the revolution."
{ />
id: "m2", </div>
icon: Globe,
title: "Countries Shipped",
value: "45",
},
{
id: "m3",
icon: Award,
title: "Drops Executed",
value: "12",
},
]}
title="BY THE NUMBERS"
description="Evidence of the revolution."
/>
</div>
<div id="lab" data-section="lab"> <div id="lab" data-section="lab">
<FaqBase <FaqBase
textboxLayout="split" textboxLayout="split"
useInvertedBackground={true} useInvertedBackground={true}
faqs={[ faqs={[
{ { id: "q1", title: "Where are you based?", content: "We operate from a secret lab in the heart of the concrete jungle." },
id: "q1", { id: "q2", title: "Do you ship worldwide?", content: "Yes, we ship to every corner where rebellion is needed." },
title: "Where are you based?", { id: "q3", title: "Can I track my gear?", content: "Yes, once you drop, we provide the coordinates." }
content: "We operate from a secret lab in the heart of the concrete jungle.", ]}
}, title="THE LAB // MANIFESTO"
{ description="Common questions from the midnight wanderers."
id: "q2", faqsAnimation="slide-up"
title: "Do you ship worldwide?", />
content: "Yes, we ship to every corner where rebellion is needed.", </div>
},
{
id: "q3",
title: "Can I track my gear?",
content: "Yes, once you drop, we provide the coordinates.",
},
]}
title="THE LAB // MANIFESTO"
description="Common questions from the midnight wanderers."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact"> <div id="contact" data-section="contact">
<ContactCenter <ContactCenter
useInvertedBackground={false} useInvertedBackground={false}
background={{ background={{ variant: "sparkles-gradient" }}
variant: "sparkles-gradient", tag="EARLY ACCESS"
}} title="DON'T BE A STRANGER."
tag="EARLY ACCESS" description="Drop your email to get first dibs on the next drop."
title="DON'T BE A STRANGER." />
description="Drop your email to get first dibs on the next drop." </div>
/>
</div>
<div id="footer" data-section="footer"> <div id="footer" data-section="footer">
<FooterBaseReveal <FooterBaseReveal
logoText="DROP_01" logoText="DROP_01"
columns={[ columns={[
{ {
title: "NAVIGATE", title: "NAVIGATE", items: [
items: [ { label: "The Lab (Blog)", href: "#lab" },
{ { label: "Track Your Gear", href: "#" },
label: "The Lab (Blog)", { label: "Manifesto", href: "#" }
href: "#lab", ]
}, },
{ {
label: "Track Your Gear", title: "SOCIAL", items: [
href: "#", { label: "Twitter", href: "#" },
}, { label: "Instagram", href: "#" }
{ ]
label: "Manifesto", }
href: "#", ]}
}, />
], </div>
},
{
title: "SOCIAL",
items: [
{
label: "Twitter",
href: "#",
},
{
label: "Instagram",
href: "#",
},
],
},
]}
/>
</div>
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );
} }