Update src/app/page.tsx

This commit is contained in:
2026-04-09 01:03:02 +00:00
parent 73cb498c00
commit a57374dbe3

View File

@@ -25,216 +25,101 @@ export default function LandingPage() {
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "Shop",
id: "products",
},
{
name: "About",
id: "about",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="T-Shirt Co."
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "hero" },
{ name: "Shop", id: "products" },
{ name: "About", id: "about" },
{ name: "Contact", id: "contact" },
]}
brandName="T-Shirt Co."
button={{ text: "Shop Now", href: "#products" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitDualMedia
background={{
variant: "gradient-bars",
}}
title="Wear Your Vibe"
description="Discover premium quality, graphic-forward t-shirts designed for the bold and the creative. Redefine your everyday style."
tag="New Collection Dropped"
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/happy-attractive-young-woman-sunglasses-sitting-skateboard-yellow-background_231208-7381.jpg",
imageAlt: "Fashion Model",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/shirt-mockup-concept-with-plain-clothing_23-2149448768.jpg",
imageAlt: "Fabric Texture",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/spring-wardrobe-switch-still-life_23-2150176657.jpg?_wi=1",
imageAlt: "Urban Tee Look",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/travel-still-life-pack-flat-lay_23-2148837336.jpg?_wi=1",
imageAlt: "Vintage Style",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/top-view-new-clothes-woman_23-2148302847.jpg?_wi=1",
imageAlt: "Abstract Tee",
},
]}
mediaAnimation="slide-up"
rating={5}
ratingText="5,000+ happy customers"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitDualMedia
background={{ variant: "gradient-bars" }}
title="Wear Your Vibe"
description="Discover premium quality, graphic-forward t-shirts designed for the bold and the creative. Redefine your everyday style."
tag="New Collection Dropped"
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/happy-attractive-young-woman-sunglasses-sitting-skateboard-yellow-background_231208-7381.jpg", imageAlt: "Fashion Model"},
{
imageSrc: "http://img.b2bpic.net/free-photo/shirt-mockup-concept-with-plain-clothing_23-2149448768.jpg", imageAlt: "Fabric Texture"}
]}
mediaAnimation="slide-up"
rating={5}
ratingText="5,000+ happy customers"
/>
</div>
<div id="products" data-section="products">
<ProductCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
products={[
{
id: "p1",
brand: "Brand",
name: "Urban Graphic Tee",
price: "$29",
rating: 5,
reviewCount: "120",
imageSrc: "http://img.b2bpic.net/free-photo/spring-wardrobe-switch-still-life_23-2150176657.jpg?_wi=2",
},
{
id: "p2",
brand: "Brand",
name: "Minimalist Essentials",
price: "$25",
rating: 5,
reviewCount: "95",
imageSrc: "http://img.b2bpic.net/free-photo/shirt-mockup-concept-with-plain-clothing_23-2149448760.jpg",
},
{
id: "p3",
brand: "Brand",
name: "Street Art Edition",
price: "$32",
rating: 4,
reviewCount: "88",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-taking-photo-with-smartphone_23-2150746437.jpg",
},
{
id: "p4",
brand: "Brand",
name: "Vintage Fade",
price: "$35",
rating: 5,
reviewCount: "150",
imageSrc: "http://img.b2bpic.net/free-photo/travel-still-life-pack-flat-lay_23-2148837336.jpg?_wi=2",
},
{
id: "p5",
brand: "Brand",
name: "Abstract Geometric",
price: "$29",
rating: 5,
reviewCount: "72",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-new-clothes-woman_23-2148302847.jpg?_wi=2",
},
{
id: "p6",
brand: "Brand",
name: "Midnight Crew",
price: "$29",
rating: 4,
reviewCount: "65",
imageSrc: "http://img.b2bpic.net/free-photo/composition-black-friday-elements-black-background_23-2148665517.jpg",
},
]}
title="Shop Our Best Sellers"
description="Our most popular designs, ready to wear."
/>
</div>
<div id="products" data-section="products">
<ProductCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
products={[
{ id: "p1", brand: "Brand", name: "Urban Graphic Tee", price: "$29", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/spring-wardrobe-switch-still-life_23-2150176657.jpg" },
{ id: "p2", brand: "Brand", name: "Minimalist Essentials", price: "$25", rating: 5, reviewCount: "95", imageSrc: "http://img.b2bpic.net/free-photo/shirt-mockup-concept-with-plain-clothing_23-2149448760.jpg" },
{ id: "p3", brand: "Brand", name: "Street Art Edition", price: "$32", rating: 4, reviewCount: "88", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-taking-photo-with-smartphone_23-2150746437.jpg" },
{ id: "p4", brand: "Brand", name: "Vintage Fade", price: "$35", rating: 5, reviewCount: "150", imageSrc: "http://img.b2bpic.net/free-photo/travel-still-life-pack-flat-lay_23-2148837336.jpg" },
{ id: "p5", brand: "Brand", name: "Abstract Geometric", price: "$29", rating: 5, reviewCount: "72", imageSrc: "http://img.b2bpic.net/free-photo/top-view-new-clothes-woman_23-2148302847.jpg" },
{ id: "p6", brand: "Brand", name: "Midnight Crew", price: "$29", rating: 4, reviewCount: "65", imageSrc: "http://img.b2bpic.net/free-photo/composition-black-friday-elements-black-background_23-2148665517.jpg" }
]}
title="Shop Our Best Sellers"
description="Our most popular designs, ready to wear."
/>
</div>
<div id="about" data-section="about">
<MediaAbout
useInvertedBackground={false}
title="Made for Creators"
description="We believe fashion is self-expression. Each shirt is designed in our studio with premium, sustainable cotton, screen-printed with artistic graphics that tell a story. We don't just make shirts; we make canvases."
tag="Our Philosophy"
imageSrc="http://img.b2bpic.net/free-photo/front-view-paint-brushes-dipped-paint_23-2148591291.jpg"
imageAlt="Production Workshop"
/>
</div>
<div id="about" data-section="about">
<MediaAbout
useInvertedBackground={false}
title="Made for Creators"
description="We believe fashion is self-expression. Each shirt is designed in our studio with premium, sustainable cotton, screen-printed with artistic graphics that tell a story. We don't just make shirts; we make canvases."
tag="Our Philosophy"
imageSrc="http://img.b2bpic.net/free-photo/front-view-paint-brushes-dipped-paint_23-2148591291.jpg"
imageAlt="Production Workshop"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwo
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "t1",
name: "Sarah J.",
role: "Creative",
testimonial: "The best fit I've found in years. Graphics don't fade!",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-woman-black-jacket-with-stylish-hairstyle-looking-camera-isolated-purple-background_291049-2380.jpg",
},
{
id: "t2",
name: "Mike K.",
role: "Designer",
testimonial: "Seriously premium quality. I own five, and they all feel like new.",
imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-hanging-glass-chair_1303-12357.jpg",
},
{
id: "t3",
name: "Emily R.",
role: "Artist",
testimonial: "Style, quality, and fast shipping. Can't recommend enough.",
imageSrc: "http://img.b2bpic.net/free-photo/positive-female-friends-shopping-together-shop-assistant-helping-customer-choose-cloth-medium-shot-fashion-store-retail-concept_74855-11918.jpg",
},
{
id: "t4",
name: "David L.",
role: "Developer",
testimonial: "Perfect minimalist design, great cotton. Super comfortable.",
imageSrc: "http://img.b2bpic.net/free-photo/selfie-cheerful-caucasian-fair-haired-woman-standing-near-rack-with-dresses-fashion-shop-looking-camera-smiling-boutique-customer-shop-assistant-concept_74855-11952.jpg",
},
{
id: "t5",
name: "Rachel P.",
role: "Photographer",
testimonial: "Finally, a brand that gets urban aesthetic right. Beautiful.",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-with-cigarette-brown-winter-head-blue-scarf_613910-331.jpg",
},
]}
title="Loved by You"
description="See why thousands trust our quality and style."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwo
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{ id: "t1", name: "Sarah J.", role: "Creative", testimonial: "The best fit I've found in years. Graphics don't fade!", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-woman-black-jacket-with-stylish-hairstyle-looking-camera-isolated-purple-background_291049-2380.jpg" },
{ id: "t2", name: "Mike K.", role: "Designer", testimonial: "Seriously premium quality. I own five, and they all feel like new.", imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-hanging-glass-chair_1303-12357.jpg" },
{ id: "t3", name: "Emily R.", role: "Artist", testimonial: "Style, quality, and fast shipping. Can't recommend enough.", imageSrc: "http://img.b2bpic.net/free-photo/positive-female-friends-shopping-together-shop-assistant-helping-customer-choose-cloth-medium-shot-fashion-store-retail-concept_74855-11918.jpg" },
{ id: "t4", name: "David L.", role: "Developer", testimonial: "Perfect minimalist design, great cotton. Super comfortable.", imageSrc: "http://img.b2bpic.net/free-photo/selfie-cheerful-caucasian-fair-haired-woman-standing-near-rack-with-dresses-fashion-shop-looking-camera-smiling-boutique-customer-shop-assistant-concept_74855-11952.jpg" },
{ id: "t5", name: "Rachel P.", role: "Photographer", testimonial: "Finally, a brand that gets urban aesthetic right. Beautiful.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-with-cigarette-brown-winter-head-blue-scarf_613910-331.jpg" }
]}
title="Loved by You"
description="See why thousands trust our quality and style."
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={false}
background={{
variant: "radial-gradient",
}}
tag="Newsletter"
title="Join the Crew"
description="Get exclusive access to new drops and creative updates."
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={false}
background={{ variant: "radial-gradient" }}
tag="Newsletter"
title="Join the Crew"
description="Get exclusive access to new drops and creative updates."
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="T-Shirt Co."
leftLink={{
text: "Privacy Policy",
href: "#",
}}
rightLink={{
text: "Terms of Service",
href: "#",
}}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="T-Shirt Co."
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Terms of Service", href: "#" }}
/>
</div>
</ReactLenis>
</ThemeProvider>
);