Merge version_1 into main #1
202
src/app/page.tsx
202
src/app/page.tsx
@@ -33,17 +33,11 @@ export default function LandingPage() {
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Catalog",
|
||||
id: "products",
|
||||
},
|
||||
name: "Catalog", id: "products"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="Grayline"
|
||||
/>
|
||||
@@ -52,37 +46,24 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
variant: "sparkles-gradient"}}
|
||||
title="Grayline: Inspired Silhouettes"
|
||||
description="A collection of inspired silhouettes crafted from the finest fibers."
|
||||
buttons={[
|
||||
{
|
||||
text: "Shop Now",
|
||||
href: "#products",
|
||||
},
|
||||
text: "Shop Now", href: "#products"},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-female-friends-2000s-fashion-style-posing-together-with-camera_23-2149442899.jpg",
|
||||
imageAlt: "Streetwear vibe 1",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-female-friends-2000s-fashion-style-posing-together-with-camera_23-2149442899.jpg", imageAlt: "Streetwear vibe 1"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/paint-background-poster-dirty-spotted_1194-8092.jpg",
|
||||
imageAlt: "Streetwear vibe 2",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/paint-background-poster-dirty-spotted_1194-8092.jpg", imageAlt: "Streetwear vibe 2"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-female-friends-2000s-fashion-style-posing-together_23-2149442898.jpg",
|
||||
imageAlt: "Streetwear vibe 3",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-female-friends-2000s-fashion-style-posing-together_23-2149442898.jpg", imageAlt: "Streetwear vibe 3"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-african-american-woman-printed-tshirt-posed-indoor-steel-stairs_627829-2160.jpg",
|
||||
imageAlt: "Streetwear vibe 4",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-african-american-woman-printed-tshirt-posed-indoor-steel-stairs_627829-2160.jpg", imageAlt: "Streetwear vibe 4"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wavy-smoke-black-background_23-2148210927.jpg",
|
||||
imageAlt: "Streetwear vibe 5",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wavy-smoke-black-background_23-2148210927.jpg", imageAlt: "Streetwear vibe 5"},
|
||||
]}
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
@@ -95,19 +76,13 @@ export default function LandingPage() {
|
||||
metrics={[
|
||||
{
|
||||
icon: Sparkles,
|
||||
label: "Designs Crafted",
|
||||
value: "150+",
|
||||
},
|
||||
label: "Designs Crafted", value: "150+"},
|
||||
{
|
||||
icon: Shield,
|
||||
label: "Quality Grade",
|
||||
value: "A++",
|
||||
},
|
||||
label: "Quality Grade", value: "A++"},
|
||||
{
|
||||
icon: Star,
|
||||
label: "Happy Fans",
|
||||
value: "10K+",
|
||||
},
|
||||
label: "Happy Fans", value: "10K+"},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -120,23 +95,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Premium Fibers",
|
||||
description: "Ethically sourced materials designed for maximum comfort and longevity.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-touching-marble-bust_171337-16535.jpg",
|
||||
imageAlt: "Fiber detail",
|
||||
},
|
||||
title: "Premium Fibers", description: "Ethically sourced materials designed for maximum comfort and longevity.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-touching-marble-bust_171337-16535.jpg", imageAlt: "Fiber detail"},
|
||||
{
|
||||
title: "Modern Silhouettes",
|
||||
description: "Unique cuts that push the boundaries of streetwear.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pink-hair-girl-avantgarde-style-wearing-sunglasses_114579-17674.jpg",
|
||||
imageAlt: "Silhouette detail",
|
||||
},
|
||||
title: "Modern Silhouettes", description: "Unique cuts that push the boundaries of streetwear.", imageSrc: "http://img.b2bpic.net/free-photo/pink-hair-girl-avantgarde-style-wearing-sunglasses_114579-17674.jpg", imageAlt: "Silhouette detail"},
|
||||
{
|
||||
title: "Limited Drops",
|
||||
description: "Each piece is part of a curated, limited-release collection.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8q7h58",
|
||||
imageAlt: "Drop detail",
|
||||
},
|
||||
title: "Limited Drops", description: "Each piece is part of a curated, limited-release collection.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8q7h58", imageAlt: "Drop detail"},
|
||||
]}
|
||||
title="Redefining Drip"
|
||||
description="Exclusively crafted for the modern generation."
|
||||
@@ -145,52 +108,23 @@ export default function LandingPage() {
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Luxury Hoodie",
|
||||
price: "$150",
|
||||
variant: "Midnight",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/teenager-outside-enjoying-music-headphones-while-sitting-skateboard_23-2148758496.jpg",
|
||||
},
|
||||
id: "p1", name: "Luxury Hoodie", price: "$150", variant: "Midnight", imageSrc: "http://img.b2bpic.net/free-photo/teenager-outside-enjoying-music-headphones-while-sitting-skateboard_23-2148758496.jpg"},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Tech Joggers",
|
||||
price: "$120",
|
||||
variant: "Slate",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-holding-hand-forehead-orange-hoodie-looking-forgetful_176474-86783.jpg",
|
||||
},
|
||||
id: "p2", name: "Tech Joggers", price: "$120", variant: "Slate", imageSrc: "http://img.b2bpic.net/free-photo/female-holding-hand-forehead-orange-hoodie-looking-forgetful_176474-86783.jpg"},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Graphic Icon Tee",
|
||||
price: "$85",
|
||||
variant: "White",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=09auns",
|
||||
},
|
||||
id: "p3", name: "Graphic Icon Tee", price: "$85", variant: "White", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=09auns"},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Bomber Jacket",
|
||||
price: "$290",
|
||||
variant: "Black",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-k-pop-clothing-urban-scene_23-2149096946.jpg",
|
||||
},
|
||||
id: "p4", name: "Bomber Jacket", price: "$290", variant: "Black", imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-k-pop-clothing-urban-scene_23-2149096946.jpg"},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Chain Accessory",
|
||||
price: "$65",
|
||||
variant: "Silver",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-friends-posing-together_52683-88926.jpg",
|
||||
},
|
||||
id: "p5", name: "Chain Accessory", price: "$65", variant: "Silver", imageSrc: "http://img.b2bpic.net/free-photo/front-view-friends-posing-together_52683-88926.jpg"},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Designer Kicks",
|
||||
price: "$350",
|
||||
variant: "Neon Blue",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-posing-with-skateboard_23-2147995905.jpg",
|
||||
},
|
||||
id: "p6", name: "Designer Kicks", price: "$350", variant: "Neon Blue", imageSrc: "http://img.b2bpic.net/free-photo/young-man-posing-with-skateboard_23-2147995905.jpg"},
|
||||
]}
|
||||
title="Shop the Collection"
|
||||
description="Browse our latest high-end apparel."
|
||||
@@ -202,14 +136,7 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Vogue Street",
|
||||
"Hypebeast",
|
||||
"Highsnobiety",
|
||||
"Complex",
|
||||
"GQ Style",
|
||||
"The Drip Hub",
|
||||
"Urban Culture",
|
||||
]}
|
||||
"Vogue Street", "Hypebeast", "Highsnobiety", "Complex", "GQ Style", "The Drip Hub", "Urban Culture"]}
|
||||
title="Seen on the Streets"
|
||||
description="Featured in leading fashion circles."
|
||||
/>
|
||||
@@ -221,45 +148,15 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
title: "Amazing quality!",
|
||||
quote: "The fit is absolutely perfect, never seen anything like it.",
|
||||
name: "Alex R.",
|
||||
role: "Fashion Influencer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/african-american-woman-violet-dress-cap-posed-outdoor-sitting-bench-making-selfie-phone_627829-13729.jpg",
|
||||
},
|
||||
id: "t1", title: "Amazing quality!", quote: "The fit is absolutely perfect, never seen anything like it.", name: "Alex R.", role: "Fashion Influencer", imageSrc: "http://img.b2bpic.net/free-photo/african-american-woman-violet-dress-cap-posed-outdoor-sitting-bench-making-selfie-phone_627829-13729.jpg"},
|
||||
{
|
||||
id: "t2",
|
||||
title: "New favorite brand",
|
||||
quote: "Grayline defines the modern streetwear aesthetic.",
|
||||
name: "Jamie L.",
|
||||
role: "Designer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-african-american-man-posing-outside-black-hat-beige-coat-with-folder-hand_627829-5454.jpg",
|
||||
},
|
||||
id: "t2", title: "New favorite brand", quote: "Grayline defines the modern streetwear aesthetic.", name: "Jamie L.", role: "Designer", imageSrc: "http://img.b2bpic.net/free-photo/handsome-african-american-man-posing-outside-black-hat-beige-coat-with-folder-hand_627829-5454.jpg"},
|
||||
{
|
||||
id: "t3",
|
||||
title: "Insane drip",
|
||||
quote: "The textures and cuts are premium level.",
|
||||
name: "Casey P.",
|
||||
role: "Creator",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blogger-influencer-shooting-herself_1268-21898.jpg",
|
||||
},
|
||||
id: "t3", title: "Insane drip", quote: "The textures and cuts are premium level.", name: "Casey P.", role: "Creator", imageSrc: "http://img.b2bpic.net/free-photo/blogger-influencer-shooting-herself_1268-21898.jpg"},
|
||||
{
|
||||
id: "t4",
|
||||
title: "Worth every cent",
|
||||
quote: "Quality exceeds expectations, highly recommend.",
|
||||
name: "Jordan M.",
|
||||
role: "Model",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-people-2000s-fashion-style_23-2149442832.jpg",
|
||||
},
|
||||
id: "t4", title: "Worth every cent", quote: "Quality exceeds expectations, highly recommend.", name: "Jordan M.", role: "Model", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-people-2000s-fashion-style_23-2149442832.jpg"},
|
||||
{
|
||||
id: "t5",
|
||||
title: "Top tier apparel",
|
||||
quote: "Finally, streetwear that feels as good as it looks.",
|
||||
name: "Sam K.",
|
||||
role: "Photographer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-skateboard_23-2148937849.jpg",
|
||||
},
|
||||
id: "t5", title: "Top tier apparel", quote: "Finally, streetwear that feels as good as it looks.", name: "Sam K.", role: "Photographer", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-skateboard_23-2148937849.jpg"},
|
||||
]}
|
||||
title="What They Say"
|
||||
description="The community loves the Grayline aesthetic."
|
||||
@@ -271,20 +168,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "How long is shipping?",
|
||||
content: "Most orders are shipped within 48 hours.",
|
||||
},
|
||||
id: "f1", title: "How long is shipping?", content: "Most orders are shipped within 48 hours."},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Do you offer returns?",
|
||||
content: "Yes, within 30 days of purchase in original condition.",
|
||||
},
|
||||
id: "f2", title: "Do you offer returns?", content: "Yes, within 30 days of purchase in original condition."},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Where are you based?",
|
||||
content: "We operate from global creative hubs to serve you best.",
|
||||
},
|
||||
id: "f3", title: "Where are you based?", content: "We operate from global creative hubs to serve you best."},
|
||||
]}
|
||||
sideTitle="Grayline Questions"
|
||||
faqsAnimation="blur-reveal"
|
||||
@@ -293,10 +181,10 @@ export default function LandingPage() {
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
tag="Connect"
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
variant: "plain"}}
|
||||
title="Join the Drop List"
|
||||
description="Get exclusive early access to our limited collections."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/town-square_1359-1083.jpg"
|
||||
@@ -308,29 +196,19 @@ export default function LandingPage() {
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Shop",
|
||||
items: [
|
||||
title: "Shop", items: [
|
||||
{
|
||||
label: "All",
|
||||
href: "#products",
|
||||
},
|
||||
label: "All", href: "#products"},
|
||||
{
|
||||
label: "New Arrivals",
|
||||
href: "#",
|
||||
},
|
||||
label: "New Arrivals", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "Contact Us",
|
||||
href: "#contact",
|
||||
},
|
||||
label: "Contact Us", href: "#contact"},
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#",
|
||||
},
|
||||
label: "FAQ", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user