Merge version_1 into main #2
245
src/app/page.tsx
245
src/app/page.tsx
@@ -33,7 +33,7 @@ export default function HomePage() {
|
||||
borderRadius="rounded"
|
||||
contentWidth="smallMedium"
|
||||
sizing="medium"
|
||||
background="grid"
|
||||
background="circleGradient"
|
||||
cardStyle="subtle-shadow"
|
||||
primaryButtonStyle="shadow"
|
||||
secondaryButtonStyle="solid"
|
||||
@@ -50,9 +50,7 @@ export default function HomePage() {
|
||||
{ name: "About", id: "about" },
|
||||
]}
|
||||
button={{
|
||||
text: "Access Dashboard",
|
||||
href: "/ai-designer",
|
||||
}}
|
||||
text: "Access Dashboard", href: "/ai-designer"}}
|
||||
animateOnLoad={true}
|
||||
navItemClassName="text-sm font-medium uppercase tracking-wider"
|
||||
buttonClassName="px-6 py-2 bg-gradient-to-r from-red-700 to-red-900 hover:from-red-600 hover:to-red-800 transition-all"
|
||||
@@ -73,15 +71,11 @@ export default function HomePage() {
|
||||
{ text: "Explore Collection", href: "/shop" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
background={{ variant: "grid" }}
|
||||
background={{ variant: "animated-grid" }}
|
||||
dashboard={{
|
||||
title: "Design Studio Live",
|
||||
logoIcon: Sparkles,
|
||||
title: "Design Studio Live", logoIcon: Sparkles,
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/a-sleek-dark-ui-mockup-showcasing-an-ai--1772643789568-eac3e4bc.png",
|
||||
imageAlt: "AI Design Dashboard",
|
||||
searchPlaceholder: "Search custom designs...",
|
||||
sidebarItems: [
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/a-sleek-dark-ui-mockup-showcasing-an-ai--1772643789568-eac3e4bc.png", imageAlt: "AI Design Dashboard", searchPlaceholder: "Search custom designs...", sidebarItems: [
|
||||
{ icon: Home, active: true },
|
||||
{ icon: MessageSquareText, active: false },
|
||||
{ icon: Zap, active: false },
|
||||
@@ -93,38 +87,26 @@ export default function HomePage() {
|
||||
],
|
||||
stats: [
|
||||
{
|
||||
title: "Custom Designs",
|
||||
values: [1200, 2450, 3890],
|
||||
description: "Created today",
|
||||
},
|
||||
title: "Custom Designs", values: [1200, 2450, 3890],
|
||||
description: "Created today"},
|
||||
{
|
||||
title: "Stock Level",
|
||||
values: [45, 32, 18],
|
||||
description: "Remaining units",
|
||||
valueSuffix: "%",
|
||||
},
|
||||
title: "Stock Level", values: [45, 32, 18],
|
||||
description: "Remaining units", valueSuffix: "%"},
|
||||
{
|
||||
title: "Revenue",
|
||||
values: [18500, 24200, 31800],
|
||||
valuePrefix: "$",
|
||||
description: "Today's sales",
|
||||
},
|
||||
title: "Revenue", values: [18500, 24200, 31800],
|
||||
valuePrefix: "$", description: "Today's sales"},
|
||||
],
|
||||
chartTitle: "Design Trends",
|
||||
chartData: [
|
||||
chartTitle: "Design Trends", chartData: [
|
||||
{ value: 85 },
|
||||
{ value: 72 },
|
||||
{ value: 95 },
|
||||
{ value: 68 },
|
||||
{ value: 88 },
|
||||
],
|
||||
listTitle: "Recent Orders",
|
||||
listItems: [
|
||||
listTitle: "Recent Orders", listItems: [
|
||||
{
|
||||
icon: ShoppingBag,
|
||||
title: "Custom Hoodie Order",
|
||||
status: "Shipped",
|
||||
},
|
||||
title: "Custom Hoodie Order", status: "Shipped"},
|
||||
{ icon: Zap, title: "Limited Drop Launch", status: "Live" },
|
||||
{ icon: ShoppingBag, title: "Design Approved", status: "Ready" },
|
||||
],
|
||||
@@ -142,38 +124,20 @@ export default function HomePage() {
|
||||
tagAnimation="slide-up"
|
||||
features={[
|
||||
{
|
||||
id: "1",
|
||||
title: "AI-Generated Designs",
|
||||
author: "Real-time Suggestions",
|
||||
description:
|
||||
"Our AI analyzes trending gothic aesthetics and suggests designs automatically. Get fresh ideas instantly. Customize every element from color to pattern placement.",
|
||||
tags: ["AI", "Real-time", "Trending"],
|
||||
id: "1", title: "AI-Generated Designs", author: "Real-time Suggestions", description:
|
||||
"Our AI analyzes trending gothic aesthetics and suggests designs automatically. Get fresh ideas instantly. Customize every element from color to pattern placement.", tags: ["AI", "Real-time", "Trending"],
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/advanced-ai-fashion-design-tool-interfac-1772643789819-cb713762.png?_wi=1",
|
||||
imageAlt: "AI Design Tool Interface",
|
||||
},
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/advanced-ai-fashion-design-tool-interfac-1772643789819-cb713762.png", imageAlt: "AI Design Tool Interface"},
|
||||
{
|
||||
id: "2",
|
||||
title: "3D Mockup Preview",
|
||||
author: "Instant Visualization",
|
||||
description:
|
||||
"See your design on actual garments before ordering. Real-time 3D mockups on hoodies, t-shirts, and oversized tees. Adjust placement, scale, and effects instantly.",
|
||||
tags: ["3D", "Mockup", "Preview"],
|
||||
id: "2", title: "3D Mockup Preview", author: "Instant Visualization", description:
|
||||
"See your design on actual garments before ordering. Real-time 3D mockups on hoodies, t-shirts, and oversized tees. Adjust placement, scale, and effects instantly.", tags: ["3D", "Mockup", "Preview"],
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/high-fashion-model-wearing-oversized-bla-1772643788729-af8f20c7.png?_wi=1",
|
||||
imageAlt: "3D Mockup Preview",
|
||||
},
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/high-fashion-model-wearing-oversized-bla-1772643788729-af8f20c7.png", imageAlt: "3D Mockup Preview"},
|
||||
{
|
||||
id: "3",
|
||||
title: "Smart Print Optimization",
|
||||
author: "AI Technology",
|
||||
description:
|
||||
"AI automatically adjusts your design for perfect print placement. Avoid seams, optimize color registration, and ensure maximum impact on every garment.",
|
||||
tags: ["Print", "Optimization", "Quality"],
|
||||
id: "3", title: "Smart Print Optimization", author: "AI Technology", description:
|
||||
"AI automatically adjusts your design for perfect print placement. Avoid seams, optimize color registration, and ensure maximum impact on every garment.", tags: ["Print", "Optimization", "Quality"],
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/professional-model-wearing-black-oversiz-1772643789009-87045934.png?_wi=1",
|
||||
imageAlt: "Smart Print Optimization",
|
||||
},
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/professional-model-wearing-black-oversiz-1772643789009-87045934.png", imageAlt: "Smart Print Optimization"},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
@@ -200,71 +164,29 @@ export default function HomePage() {
|
||||
animationType="slide-up"
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "CRIMSON COLLECTIVE",
|
||||
name: "Obsidian Oversized Hoodie",
|
||||
price: "$89.99",
|
||||
rating: 5,
|
||||
reviewCount: "1.2k",
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/high-fashion-model-wearing-oversized-bla-1772643788729-af8f20c7.png?_wi=2",
|
||||
imageAlt: "Black gothic hoodie with crimson details",
|
||||
},
|
||||
id: "1", brand: "CRIMSON COLLECTIVE", name: "Obsidian Oversized Hoodie", price: "$89.99", rating: 5,
|
||||
reviewCount: "1.2k", imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/high-fashion-model-wearing-oversized-bla-1772643788729-af8f20c7.png", imageAlt: "Black gothic hoodie with crimson details"},
|
||||
{
|
||||
id: "2",
|
||||
brand: "CRIMSON COLLECTIVE",
|
||||
name: "Crimson Symbol Tee",
|
||||
price: "$49.99",
|
||||
rating: 5,
|
||||
reviewCount: "892",
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/model-in-dark-crimson-oversized-t-shirt--1772643789634-90988259.png?_wi=1",
|
||||
imageAlt: "Crimson red tee with gothic symbols",
|
||||
},
|
||||
id: "2", brand: "CRIMSON COLLECTIVE", name: "Crimson Symbol Tee", price: "$49.99", rating: 5,
|
||||
reviewCount: "892", imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/model-in-dark-crimson-oversized-t-shirt--1772643789634-90988259.png", imageAlt: "Crimson red tee with gothic symbols"},
|
||||
{
|
||||
id: "3",
|
||||
brand: "CRIMSON COLLECTIVE",
|
||||
name: "Midnight Gothic Oversized Shirt",
|
||||
price: "$79.99",
|
||||
rating: 5,
|
||||
reviewCount: "1.5k",
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/professional-model-wearing-black-oversiz-1772643789009-87045934.png?_wi=2",
|
||||
imageAlt: "Black oversized shirt with intricate red graphics",
|
||||
},
|
||||
id: "3", brand: "CRIMSON COLLECTIVE", name: "Midnight Gothic Oversized Shirt", price: "$79.99", rating: 5,
|
||||
reviewCount: "1.5k", imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/professional-model-wearing-black-oversiz-1772643789009-87045934.png", imageAlt: "Black oversized shirt with intricate red graphics"},
|
||||
{
|
||||
id: "4",
|
||||
brand: "CRIMSON COLLECTIVE",
|
||||
name: "Limited Drop Bundle",
|
||||
price: "$169.99",
|
||||
rating: 5,
|
||||
reviewCount: "2.3k",
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/flat-lay-photography-of-exclusive-gothic-1772643789892-725ac002.png?_wi=1",
|
||||
imageAlt: "Limited edition bundle with hoodie and tee",
|
||||
},
|
||||
id: "4", brand: "CRIMSON COLLECTIVE", name: "Limited Drop Bundle", price: "$169.99", rating: 5,
|
||||
reviewCount: "2.3k", imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/flat-lay-photography-of-exclusive-gothic-1772643789892-725ac002.png", imageAlt: "Limited edition bundle with hoodie and tee"},
|
||||
{
|
||||
id: "5",
|
||||
brand: "CRIMSON COLLECTIVE",
|
||||
name: "Signature Black Hoodie",
|
||||
price: "$94.99",
|
||||
rating: 5,
|
||||
reviewCount: "956",
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/high-fashion-model-wearing-oversized-bla-1772643788729-af8f20c7.png?_wi=3",
|
||||
imageAlt: "Signature black hoodie collection piece",
|
||||
},
|
||||
id: "5", brand: "CRIMSON COLLECTIVE", name: "Signature Black Hoodie", price: "$94.99", rating: 5,
|
||||
reviewCount: "956", imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/high-fashion-model-wearing-oversized-bla-1772643788729-af8f20c7.png", imageAlt: "Signature black hoodie collection piece"},
|
||||
{
|
||||
id: "6",
|
||||
brand: "CRIMSON COLLECTIVE",
|
||||
name: "Gothic Graphic Tee",
|
||||
price: "$54.99",
|
||||
rating: 5,
|
||||
reviewCount: "1.1k",
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/model-in-dark-crimson-oversized-t-shirt--1772643789634-90988259.png?_wi=2",
|
||||
imageAlt: "Gothic-inspired graphic tee with premium details",
|
||||
},
|
||||
id: "6", brand: "CRIMSON COLLECTIVE", name: "Gothic Graphic Tee", price: "$54.99", rating: 5,
|
||||
reviewCount: "1.1k", imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/model-in-dark-crimson-oversized-t-shirt--1772643789634-90988259.png", imageAlt: "Gothic-inspired graphic tee with premium details"},
|
||||
]}
|
||||
buttons={[{ text: "View All", href: "/shop" }]}
|
||||
buttonAnimation="slide-up"
|
||||
@@ -282,15 +204,7 @@ export default function HomePage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
names={[
|
||||
"HYPEBEAST",
|
||||
"Highsnobiety",
|
||||
"Hyperdenim",
|
||||
"StockX",
|
||||
"Grailed",
|
||||
"SSENSE",
|
||||
"Dover Street Market",
|
||||
"ComplexCon",
|
||||
]}
|
||||
"HYPEBEAST", "Highsnobiety", "Hyperdenim", "StockX", "Grailed", "SSENSE", "Dover Street Market", "ComplexCon"]}
|
||||
speed={50}
|
||||
showCard={true}
|
||||
/>
|
||||
@@ -310,65 +224,29 @@ export default function HomePage() {
|
||||
animationType="slide-up"
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Jordan Rivera",
|
||||
role: "Designer",
|
||||
company: "Creative Collective",
|
||||
rating: 5,
|
||||
id: "1", name: "Jordan Rivera", role: "Designer", company: "Creative Collective", rating: 5,
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/portrait-photo-of-confident-young-person-1772643789222-676167d6.png",
|
||||
imageAlt: "Jordan Rivera",
|
||||
},
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/portrait-photo-of-confident-young-person-1772643789222-676167d6.png", imageAlt: "Jordan Rivera"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Alex Chen",
|
||||
role: "Streetwear Influencer",
|
||||
company: "@AlexStreetStyle",
|
||||
rating: 5,
|
||||
id: "2", name: "Alex Chen", role: "Streetwear Influencer", company: "@AlexStreetStyle", rating: 5,
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/professional-portrait-of-person-with-edg-1772643789179-848fe9a1.png",
|
||||
imageAlt: "Alex Chen",
|
||||
},
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/professional-portrait-of-person-with-edg-1772643789179-848fe9a1.png", imageAlt: "Alex Chen"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Morgan Taylor",
|
||||
role: "Fashion Curator",
|
||||
company: "StyleHub",
|
||||
rating: 5,
|
||||
id: "3", name: "Morgan Taylor", role: "Fashion Curator", company: "StyleHub", rating: 5,
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/portrait-photo-of-confident-alternative--1772643789940-0a4f096a.png",
|
||||
imageAlt: "Morgan Taylor",
|
||||
},
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/portrait-photo-of-confident-alternative--1772643789940-0a4f096a.png", imageAlt: "Morgan Taylor"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Casey Parker",
|
||||
role: "Brand Ambassador",
|
||||
company: "Urban Fashion Collective",
|
||||
rating: 5,
|
||||
id: "4", name: "Casey Parker", role: "Brand Ambassador", company: "Urban Fashion Collective", rating: 5,
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/professional-headshot-of-person-with-bol-1772643789849-22473da0.png",
|
||||
imageAlt: "Casey Parker",
|
||||
},
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/professional-headshot-of-person-with-bol-1772643789849-22473da0.png", imageAlt: "Casey Parker"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Riley Martinez",
|
||||
role: "Content Creator",
|
||||
company: "@RileyVibe",
|
||||
rating: 5,
|
||||
id: "5", name: "Riley Martinez", role: "Content Creator", company: "@RileyVibe", rating: 5,
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/young-person-portrait-with-gothic-altern-1772643789699-ebc7d370.png",
|
||||
imageAlt: "Riley Martinez",
|
||||
},
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/young-person-portrait-with-gothic-altern-1772643789699-ebc7d370.png", imageAlt: "Riley Martinez"},
|
||||
{
|
||||
id: "6",
|
||||
name: "Sam Williams",
|
||||
role: "Fashion Designer",
|
||||
company: "Rebel Studios",
|
||||
rating: 5,
|
||||
id: "6", name: "Sam Williams", role: "Fashion Designer", company: "Rebel Studios", rating: 5,
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/professional-portrait-of-fashion-forward-1772643789026-d19eec8d.png",
|
||||
imageAlt: "Sam Williams",
|
||||
},
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUOVrBX43QkXa07neRkvIvcxmy/professional-portrait-of-fashion-forward-1772643789026-d19eec8d.png", imageAlt: "Sam Williams"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -379,8 +257,7 @@ export default function HomePage() {
|
||||
logoText="CRIMSON COLLECTIVE"
|
||||
columns={[
|
||||
{
|
||||
title: "Shop",
|
||||
items: [
|
||||
title: "Shop", items: [
|
||||
{ label: "All Products", href: "/shop" },
|
||||
{ label: "Limited Drops", href: "/drops" },
|
||||
{ label: "Collections", href: "/shop" },
|
||||
@@ -388,8 +265,7 @@ export default function HomePage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Manifesto", href: "#" },
|
||||
{ label: "Sustainability", href: "#" },
|
||||
@@ -397,8 +273,7 @@ export default function HomePage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Community",
|
||||
items: [
|
||||
title: "Community", items: [
|
||||
{ label: "Discord Server", href: "https://discord.com" },
|
||||
{ label: "Design Contests", href: "#" },
|
||||
{ label: "User Gallery", href: "#" },
|
||||
@@ -406,8 +281,7 @@ export default function HomePage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
title: "Support", items: [
|
||||
{ label: "Help Center", href: "/contact" },
|
||||
{ label: "Track Order", href: "#" },
|
||||
{ label: "Size Guide", href: "#" },
|
||||
@@ -415,8 +289,7 @@ export default function HomePage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
{ label: "Shipping Policy", href: "#" },
|
||||
|
||||
Reference in New Issue
Block a user