Files
Vula Builder 29db55fe1b Deploy
2026-07-27 17:10:19 +00:00

539 lines
20 KiB
JSON

{
"projectName": "Urban Threads",
"businessType": "",
"industry": "",
"tone": "",
"tier": 3,
"generatedAt": "2026-07-27T16:33:37.962Z",
"sections": [
{
"name": "HeroSection",
"importPath": "@/components/sections/HeroSection",
"position": 0,
"role": "hero",
"hasImage": true,
"hasForm": false,
"itemCount": -1,
"layout": "flex-row",
"headings": [
"{d.title}"
],
"buttonLabels": [],
"people": [],
"allText": [
"use client",
"next/image",
"@/hooks/useVulaContent",
"hero_banners",
"flex justify-center py-16",
"w-8 h-8 rounded-full border-2 border-current border-t-transparent animate-spin",
"hero",
"relative overflow-hidden bg-gray-900 text-white",
"relative min-h-[480px] flex items-center",
"object-cover opacity-40",
"relative z-10 max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 py-24",
"text-4xl sm:text-5xl font-bold mb-4 max-w-2xl",
"text-xl text-gray-200 mb-8 max-w-xl",
"inline-flex items-center px-8 py-3 bg-white text-gray-900 font-bold rounded-full hover:bg-gray-100 transition-colors"
],
"cmsCollection": "hero_banners"
},
{
"name": "BrandStorySection",
"importPath": "@/components/sections/BrandStorySection",
"position": 1,
"role": "about",
"hasImage": true,
"hasForm": false,
"itemCount": 6,
"layout": "flex-row",
"headings": [
"Where Soweto Meets the Runway"
],
"buttonLabels": [],
"people": [],
"allText": [
"next/image",
"brandstory",
"our-story",
"min-h-[70vh] bg-white",
"flex flex-col md:flex-row",
"w-full md:w-1/2 bg-[#18181b] p-10 md:p-16 flex items-center",
"max-w-lg",
"text-4xl md:text-5xl font-black uppercase text-white mb-8",
"Where Soweto Meets the Runway",
"space-y-4 text-white/80 text-base leading-relaxed",
"Founded in 2020, Urban Threads was born in the Mofolo workshops of Soweto. \n Our master tailor, Thabo Molefe, spent 15 years apprenticing under the late \n MaLindi Nkosi, a legend in South African garment-making, before launching \n his own label. Every piece we drop begins with hand-blocked Swiss-Vlisco \n wax prints sourced directly from Accra, Ghana — not mass-produced Chinese \n imitations.",
"We collaborate with 18 local seamstresses in Diepkloof, paying 40% above \n the Soweto garment district average, and invest half our profits into a \n sewing co-op for young women in Orlando East. The result: limited-edition \n hoodies, caps, and tees that fuse traditional African patterns with \n instant streetwear credibility — bold, unapologetic, and made with \n purpose.",
"mt-6 text-[#d4af37] font-bold uppercase tracking-wide",
"— Authenticity Is Our Only Print",
"w-full md:w-1/2 relative min-h-[400px] md:min-h-[70vh]",
"absolute inset-0 border-l-2 border-[#d4af37]",
"Urban Threads artisan workshop in Soweto",
"(max-width: 768px) 100vw, 50vw",
"object-cover"
]
},
{
"name": "FeaturedProductsSection",
"importPath": "@/components/sections/FeaturedProductsSection",
"position": 2,
"role": "services",
"hasImage": false,
"hasForm": false,
"itemCount": 11,
"layout": "grid",
"headings": [
"Featured Products"
],
"buttonLabels": [],
"people": [],
"allText": [
"use client",
"@/hooks/useFeaturedProducts",
"next/link",
"lucide-react",
"@/hooks/useMedusaCart",
"KSh",
"py-20",
"container mx-auto px-4",
"grid grid-cols-2 md:grid-cols-4 gap-6",
"aspect-square rounded-xl bg-muted animate-pulse",
"featuredproducts",
"flex items-center justify-between mb-10",
"text-xs uppercase tracking-widest text-primary font-semibold mb-1",
"Curated for You",
"text-3xl font-bold text-foreground",
"Featured Products",
"text-sm font-semibold text-primary hover:underline underline-offset-4",
"View all →",
"group bg-card rounded-xl overflow-hidden border border-border hover:shadow-md transition-all",
"block",
"relative aspect-square bg-muted",
"w-full h-full object-cover group-hover:scale-105 transition-transform duration-500",
"w-full h-full flex items-center justify-center",
"h-8 w-8 text-muted-foreground/30",
"p-4",
"text-sm font-semibold text-foreground line-clamp-2 mb-1 hover:text-primary transition-colors",
"text-sm font-bold text-primary mb-3",
"cart-drawer-open",
"w-full text-xs bg-primary/10 text-primary hover:bg-primary hover:text-primary-foreground py-2 rounded-lg transition-colors font-medium disabled:opacity-40",
"Add to Cart"
]
},
{
"name": "NewArrivalsSection",
"importPath": "@/components/sections/NewArrivalsSection",
"position": 3,
"role": "unknown",
"hasImage": true,
"hasForm": false,
"itemCount": -1,
"layout": "grid",
"headings": [
"FRESH DROPS",
"{d.title}"
],
"buttonLabels": [
"ADD TO CART"
],
"people": [],
"allText": [
"use client",
"@/hooks/useVulaContent",
"@/components/ui/Card",
"@/components/ui/Button",
"next/image",
"product_carousels",
"flex justify-center py-16",
"w-8 h-8 rounded-full border-2 border-current border-t-transparent animate-spin",
"new-arrivals",
"newarrivals",
"bg-[#18181b] py-20",
"container mx-auto px-4",
"font-['Archivo_Black'] uppercase text-4xl md:text-5xl text-[#d4af37] mb-12 tracking-tight",
"FRESH DROPS",
"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6",
"border-3 border-[#d4af37] bg-black rounded-none shadow-[6px_6px_0_0_#d4af37] overflow-hidden group",
"relative aspect-[3/4] overflow-hidden",
"object-cover transition-transform duration-500 group-hover:scale-105",
"(max-width: 768px) 100vw, 33vw",
"p-4 space-y-2",
"text-white font-bold uppercase tracking-wider text-lg",
"text-gray-400 text-sm",
"text-[#d4af37] font-bold text-xl",
"p-4 pt-0",
"default",
"w-full bg-[#d4af37] text-black hover:bg-[#b8961e] font-bold uppercase tracking-widest",
"ADD TO CART"
],
"cmsCollection": "product_carousels"
},
{
"name": "MostPopularSection",
"importPath": "@/components/sections/MostPopularSection",
"position": 4,
"role": "unknown",
"hasImage": false,
"hasForm": false,
"itemCount": 12,
"layout": "grid",
"headings": [
"Most Popular"
],
"buttonLabels": [],
"people": [],
"allText": [
"use client",
"react",
"@/hooks/useMedusaCart",
"@/hooks/useMedusaProducts",
"next/link",
"lucide-react",
"KSh",
"py-20",
"container mx-auto px-4",
"grid grid-cols-2 md:grid-cols-4 gap-6",
"aspect-square rounded-xl bg-muted animate-pulse",
"mostpopular",
"flex items-center justify-between mb-10",
"flex items-center gap-3",
"h-6 w-6 text-primary",
"text-xs uppercase tracking-widest text-primary font-semibold mb-1",
"Best Sellers",
"text-3xl font-bold text-foreground",
"Most Popular",
"text-sm font-semibold text-primary hover:underline underline-offset-4 hidden md:inline-flex items-center gap-1",
"View all →",
"grid grid-cols-2 lg:grid-cols-4 gap-6",
"group bg-card rounded-xl overflow-hidden border border-border hover:shadow-md transition-all relative",
"absolute top-2 left-2 z-10 bg-primary text-primary-foreground text-xs font-semibold px-2 py-0.5 rounded-full",
"Best Seller",
"block overflow-hidden",
"relative aspect-square bg-muted",
"w-full h-full object-cover group-hover:scale-105 transition-transform duration-300",
"w-full h-full flex items-center justify-center",
"h-8 w-8 text-muted-foreground/30",
"p-4",
"text-sm font-semibold text-foreground line-clamp-2 mb-1 hover:text-primary transition-colors",
"text-sm font-bold text-primary mb-3",
"cart-drawer-open",
"w-full text-xs bg-primary/10 text-primary hover:bg-primary hover:text-primary-foreground py-2 rounded-lg transition-colors font-medium disabled:opacity-40",
"Add to Cart"
]
},
{
"name": "AdvertBannerSection",
"importPath": "@/components/sections/AdvertBannerSection",
"position": 5,
"role": "hero",
"hasImage": true,
"hasForm": false,
"itemCount": 4,
"layout": "flex-row",
"headings": [
"{headline}"
],
"buttonLabels": [],
"people": [],
"allText": [
"next/image",
"next/link",
"@/lib/cms",
"relative w-full overflow-hidden rounded-2xl my-8 mx-auto max-w-7xl px-4",
"relative h-64 md:h-80 w-full",
"object-cover rounded-2xl",
"absolute inset-0 bg-black/45 rounded-2xl",
"absolute inset-0 flex flex-col items-center justify-center text-center px-6 gap-3",
"text-2xl md:text-4xl font-bold text-white drop-shadow",
"text-sm md:text-base text-white/90",
"mt-2 inline-block bg-white text-black font-semibold px-6 py-2 rounded-full hover:bg-primary hover:text-white transition-colors text-sm",
"flex flex-col items-center justify-center gap-3 py-16 px-6 text-center bg-primary/10 rounded-2xl",
"text-2xl md:text-3xl font-bold",
"text-muted-foreground",
"inline-block bg-primary text-white font-semibold px-6 py-2 rounded-full hover:bg-primary/80 transition-colors text-sm"
]
},
{
"name": "CampaignsSection",
"importPath": "@/components/sections/CampaignsSection",
"position": 6,
"role": "cms-campaigns",
"hasImage": true,
"hasForm": false,
"itemCount": -1,
"layout": "grid",
"headings": [
"DROPS",
"{d.title}"
],
"buttonLabels": [],
"people": [],
"allText": [
"use client",
"react",
"@/hooks/useVulaContent",
"@/components/ui/Card",
"@/components/ui/Button",
"next/image",
"campaigns",
"DROP LIVE",
"flex justify-center py-16",
"w-8 h-8 rounded-full border-2 border-current border-t-transparent animate-spin",
"drops",
"bg-[#18181b] py-20",
"container mx-auto px-4",
"font-['Archivo_Black'] uppercase text-4xl md:text-5xl text-[#d4af37] mb-12 tracking-tight",
"DROPS",
"grid grid-cols-1 lg:grid-cols-2 gap-8",
"border-3 border-[#d4af37] bg-black rounded-none shadow-[6px_6px_0_0_#d4af37] overflow-hidden",
"relative h-64",
"object-cover",
"(max-width: 768px) 100vw, 50vw",
"absolute top-4 right-4 bg-[#d4af37] text-black px-3 py-1 font-bold text-xs uppercase tracking-widest",
"p-6 space-y-4",
"font-['Archivo_Black'] text-2xl text-white uppercase tracking-tight",
"text-[#d4af37] text-sm uppercase tracking-widest",
"text-gray-300 text-sm",
"outline",
"border-[#d4af37] text-[#d4af37] hover:bg-[#d4af37] hover:text-black font-bold uppercase tracking-widest"
],
"cmsCollection": "campaigns"
},
{
"name": "GallerySection",
"importPath": "@/components/sections/GallerySection",
"position": 7,
"role": "gallery",
"hasImage": true,
"hasForm": false,
"itemCount": -1,
"layout": "grid",
"headings": [
"LOOKBOOK",
"{d.title}"
],
"buttonLabels": [],
"people": [],
"allText": [
"use client",
"@/hooks/useVulaContent",
"@/components/ui/Card",
"next/image",
"gallery",
"flex justify-center py-16",
"w-8 h-8 rounded-full border-2 border-current border-t-transparent animate-spin",
"lookbook",
"bg-white py-20",
"container mx-auto px-4",
"font-['Archivo_Black'] uppercase text-4xl md:text-5xl text-[#18181b] mb-12 tracking-tight",
"LOOKBOOK",
"grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4",
"border-3 border-[#18181b] rounded-none shadow-[4px_4px_0_0_#18181b] overflow-hidden group cursor-pointer",
"relative aspect-square overflow-hidden",
"object-cover transition-transform duration-500 group-hover:scale-105",
"(max-width: 768px) 50vw, 25vw",
"absolute inset-0 bg-gradient-to-t from-black/70 via-transparent to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end p-4",
"p-0",
"text-white font-bold text-sm uppercase tracking-wider",
"text-gray-200 text-xs mt-1"
],
"cmsCollection": "gallery"
},
{
"name": "BrandCarouselSection",
"importPath": "@/components/sections/BrandCarouselSection",
"position": 8,
"role": "partners",
"hasImage": true,
"hasForm": false,
"itemCount": 4,
"layout": "flex-row",
"headings": [
"Shop by Collection"
],
"buttonLabels": [],
"people": [],
"allText": [
"use client",
"react",
"next/link",
"next/image",
"py-10 px-4",
"max-w-7xl mx-auto",
"text-xl font-bold mb-5",
"Shop by Collection",
"flex gap-4 overflow-x-auto pb-3 scrollbar-hide snap-x snap-mandatory",
"flex-none snap-start w-36 group",
"relative h-36 w-36 rounded-2xl overflow-hidden bg-muted mb-2 group-hover:shadow-md transition-shadow",
"object-cover group-hover:scale-105 transition-transform duration-300",
"w-full h-full flex items-center justify-center text-3xl font-bold text-primary/30 uppercase",
"text-xs font-medium text-center line-clamp-2 group-hover:text-primary transition-colors"
]
},
{
"name": "ProductCarouselSection",
"importPath": "@/components/sections/ProductCarouselSection",
"position": 9,
"role": "services",
"hasImage": true,
"hasForm": false,
"itemCount": 4,
"layout": "flex-row",
"headings": [
"{section.title}"
],
"buttonLabels": [],
"people": [],
"allText": [
"next/image",
"next/link",
"@/lib/cms",
"KSh",
"x-publishable-api-key",
"py-8 px-4",
"max-w-7xl mx-auto",
"text-xl font-bold mb-5",
"flex gap-4 overflow-x-auto pb-3 scrollbar-hide snap-x snap-mandatory",
"flex-none snap-start w-44 group",
"relative h-44 w-44 rounded-xl overflow-hidden bg-muted mb-2 group-hover:shadow-md transition-shadow",
"object-cover group-hover:scale-105 transition-transform duration-300",
"w-full h-full flex items-center justify-center text-muted-foreground text-xs",
"No image",
"text-xs font-medium line-clamp-2 group-hover:text-primary transition-colors mb-1",
"text-xs font-bold text-primary"
]
},
{
"name": "JoinMovementSection",
"importPath": "@/components/sections/JoinMovementSection",
"position": 10,
"role": "unknown",
"hasImage": false,
"hasForm": true,
"itemCount": 5,
"layout": "flex-row",
"headings": [],
"buttonLabels": [],
"people": [],
"allText": [
"use client",
"react",
"@/components/ui/Button",
"@/components/ui/Input",
"lucide-react",
"joinmovement",
"join-us",
"relative bg-[#18181b] text-white py-24 px-6 overflow-hidden",
"absolute top-0 left-0 right-0 h-2 bg-[#d4af37]",
"max-w-4xl mx-auto text-center relative z-10",
"inline-block text-[#d4af37] text-sm tracking-[0.3em] uppercase mb-4",
"Limited Drops // Exclusive Access",
"text-4xl md:text-6xl lg:text-7xl font-bold uppercase leading-tight",
"Stay",
"text-[#d4af37]",
"Fresh",
"mt-6 text-lg md:text-xl text-zinc-300 max-w-2xl mx-auto font-light",
"Join the Urban Threads movement — early access to every limited drop,\n exclusive content drops, and invites to Soweto pop-up events.",
"mt-10 inline-flex items-center gap-3 px-6 py-4 bg-[#d4af37]/10 border border-[#d4af37] rounded-lg",
"w-5 h-5 text-[#d4af37]",
"text-[#d4af37] font-semibold",
"You're on the list — check your inbox soon.",
"mt-10 flex flex-col sm:flex-row gap-4 max-w-lg mx-auto",
"flex-1",
"email",
"Enter your email",
"h-14 text-lg bg-zinc-800 border-zinc-600 text-white placeholder:text-zinc-400 focus:border-[#d4af37]",
"submit",
"lg",
"h-14 bg-[#d4af37] text-[#18181b] hover:bg-[#c49a2f] font-bold uppercase tracking-wider",
"Join Now",
"ml-2 w-5 h-5",
"mt-6 text-sm text-zinc-500",
"No spam, no fluff. Only real drops and culture updates.",
"absolute bottom-0 left-0 right-0 h-2 bg-[#d4af37]"
]
},
{
"name": "ContactSection",
"importPath": "@/components/sections/ContactSection",
"position": 11,
"role": "contact",
"hasImage": false,
"hasForm": true,
"itemCount": -1,
"layout": "grid",
"headings": [
"Connect with the movement",
"Pop-up Shop Hours",
"Message sent!",
"Send a message"
],
"buttonLabels": [],
"people": [],
"allText": [
"use client",
"react",
"@/hooks/useVulaContent",
"@/components/ui/Button",
"@/components/ui/Input",
"lucide-react",
"business_hours",
"flex justify-center py-16 bg-[#18181b]",
"w-8 h-8 rounded-full border-2 border-[#d4af37] border-t-transparent animate-spin",
"contact",
"bg-[#18181b] text-white py-24 px-6",
"absolute top-0 left-0 right-0 h-2 bg-[#d4af37]",
"max-w-6xl mx-auto",
"grid grid-cols-1 lg:grid-cols-2 gap-16",
"text-[#d4af37] text-sm tracking-[0.3em] uppercase",
"Hit Us Up",
"text-4xl md:text-5xl font-bold uppercase mt-4 leading-tight",
"Connect with the movement",
"mt-8 space-y-2",
"text-xl font-semibold text-[#d4af37]",
"Pop-up Shop Hours",
"flex justify-between border-b border-zinc-700 pb-2",
"font-medium",
"text-zinc-300",
"Closed",
"text-xs text-zinc-500 ml-2",
"mt-10 space-y-4",
"flex items-center gap-3",
"w-5 h-5 text-[#d4af37] shrink-0",
"854 Mofolo Central, Soweto, Johannesburg, 1804",
"+27 11 234 5678",
"hello@urbanthreads.co.za",
"_blank",
"noopener noreferrer",
"flex items-center gap-3 text-[#25D366] hover:text-green-400 transition-colors",
"w-5 h-5",
"WhatsApp Us",
"mt-8 flex gap-6",
"text-zinc-400 hover:text-[#d4af37] transition-colors",
"w-6 h-6",
"bg-zinc-900 p-8 rounded-xl border border-zinc-700",
"h-full flex items-center justify-center",
"text-center",
"w-12 h-12 mx-auto text-[#d4af37]",
"text-2xl font-bold mt-4",
"Message sent!",
"text-zinc-400 mt-2",
"We'll get back to you within 24 hours.",
"text-2xl font-bold mb-6 uppercase",
"Send a message"
],
"cmsCollection": "business_hours"
}
],
"navigationLinks": [
"Urban Threads",
"Home",
"Featured Products",
"Brand Story",
"Campaigns",
"Gallery",
"Contact",
"Products"
]
}