Compare commits
No commits in common. "d645c01323f444b43861e01f5b0c5b2a94d0af91" and "e0bb44b65af3cee51f331ed410ad92679773a3f3" have entirely different histories.
d645c01323
...
e0bb44b65a
|
|
@ -14,30 +14,9 @@
|
|||
"className": "h-12 bg-[#009b93] text-[#fff] gap-12",
|
||||
"speed": 24,
|
||||
"items": [
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "NEU: Overnight Oats – Sallys Nussecke 😍",
|
||||
"href": "/"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Versandkostenfrei ab 45 € 💛",
|
||||
"href": "/"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Gratis Geschenk ab 60 € Warenkorbwert 🎁",
|
||||
"href": "/"
|
||||
}
|
||||
}
|
||||
}
|
||||
{ "Link": { "config": { "label": "NEU: Overnight Oats – Sallys Nussecke 😍", "href": "/" } } },
|
||||
{ "Link": { "config": { "label": "Versandkostenfrei ab 45 € 💛", "href": "/" } } },
|
||||
{ "Link": { "config": { "label": "Gratis Geschenk ab 60 € Warenkorbwert 🎁", "href": "/" } } }
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
@ -47,130 +26,18 @@
|
|||
"config": {
|
||||
"className": "h-24 bg-white text-[#003F31] gap-12",
|
||||
"left": [
|
||||
{
|
||||
"Logo": {
|
||||
"config": {
|
||||
"src": "/3bear-logo.png",
|
||||
"alt": "MyShop",
|
||||
"className": "h-[150px] w-[180px]",
|
||||
"objectFit": "contain"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"VtMegaMenu": {
|
||||
"config": {
|
||||
"navLabel": {
|
||||
"text": "Shop",
|
||||
"className": "font-bold text-[1rem] text-[#003F31] flex items-center mr-8 gap-1 hover:text-[#009b93]",
|
||||
"isShowArrow": true
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Dropdown": {
|
||||
"config": {
|
||||
"trigger": {
|
||||
"text": "Über Uns",
|
||||
"className": "font-bold text-[1rem] text-[#003F31] flex items-center mr-8 gap-1 hover:text-[#009b93]",
|
||||
"isShowArrow": true
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"text": "Unser Unternehmen",
|
||||
"href": "/"
|
||||
},
|
||||
{
|
||||
"text": "Loren ipsum",
|
||||
"href": "/"
|
||||
},
|
||||
{
|
||||
"text": "Not a Link"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Dropdown": {
|
||||
"config": {
|
||||
"trigger": {
|
||||
"text": "Über unsere Produkte",
|
||||
"className": "font-bold text-[1rem] text-[#003F31] flex items-center mr-8 gap-1 hover:text-[#009b93]",
|
||||
"isShowArrow": true
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"text": "Unser Unternehmen",
|
||||
"href": "/"
|
||||
},
|
||||
{
|
||||
"text": "Loren ipsum",
|
||||
"href": "/"
|
||||
},
|
||||
{
|
||||
"text": "Not a Link"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Rezepte",
|
||||
"href": "/",
|
||||
"className": "font-bold text-[1rem] text-[#003F31] flex items-center mr-8 gap-1 hover:text-[#009b93]"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Triff Harry Kane",
|
||||
"href": "/",
|
||||
"className": "font-bold text-[1rem] text-[#003F31] flex items-center gap-1 hover:text-[#009b93]"
|
||||
}
|
||||
}
|
||||
}
|
||||
{ "Logo": { "config": { "src": "/3bear-logo.png", "alt": "MyShop", "className": "h-[150px] w-[180px]", "objectFit": "contain" } } },
|
||||
{ "VtMegaMenu": { "config": { "navLabel": { "text": "Shop", "className": "font-bold text-[1rem] text-[#003F31] flex items-center mr-8 gap-1 hover:text-[#009b93]", "isShowArrow": true } } } },
|
||||
{ "Dropdown": { "config": { "trigger": { "text": "Über Uns", "className": "font-bold text-[1rem] text-[#003F31] flex items-center mr-8 gap-1 hover:text-[#009b93]", "isShowArrow": true }, "items": [ { "text": "Unser Unternehmen", "href": "/" }, { "text": "Loren ipsum", "href": "/" }, { "text": "Not a Link" } ] } } },
|
||||
{ "Dropdown": { "config": { "trigger": { "text": "Über unsere Produkte", "className": "font-bold text-[1rem] text-[#003F31] flex items-center mr-8 gap-1 hover:text-[#009b93]", "isShowArrow": true }, "items": [ { "text": "Unser Unternehmen", "href": "/" }, { "text": "Loren ipsum", "href": "/" }, { "text": "Not a Link" } ] } } },
|
||||
{ "Link": { "config": { "label": "Rezepte", "href": "/", "className": "font-bold text-[1rem] text-[#003F31] flex items-center mr-8 gap-1 hover:text-[#009b93]" } } },
|
||||
{ "Link": { "config": { "label": "Triff Harry Kane", "href": "/", "className": "font-bold text-[1rem] text-[#003F31] flex items-center gap-1 hover:text-[#009b93]" } } }
|
||||
],
|
||||
"right": [
|
||||
{
|
||||
"VtCountryCodeSelect": {
|
||||
"config": {
|
||||
"trigger": {
|
||||
"className": "w-auto font-bold text-[13px] text-[#11314E] flex justify-start items-center gap-1 hover:text-[#009b93] bg-transparent shadow-none hover:bg-transparent",
|
||||
"isFlag": true,
|
||||
"isDisplayFullname": true
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Button": {
|
||||
"config": {
|
||||
"icon": "MagnifyingGlass",
|
||||
"className": "shadow-none"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"AccountButton": {
|
||||
"config": {
|
||||
"icon": "User",
|
||||
"className": " flex items-center gap-1 shadow-none"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"VtCartButton": {
|
||||
"config": {
|
||||
"icon": "ShoppingBag",
|
||||
"className": "shadow-none bg-transparent text-black w-[50px]"
|
||||
}
|
||||
}
|
||||
}
|
||||
{ "VtCountryCodeSelect": { "config": { "trigger": { "className": "w-auto font-bold text-[13px] text-[#11314E] flex justify-start items-center gap-1 hover:text-[#009b93] bg-transparent shadow-none hover:bg-transparent", "isFlag": true, "isDisplayFullname": true } } } },
|
||||
{ "Button": { "config": { "icon": "MagnifyingGlass", "className": "shadow-none" } } },
|
||||
{ "AccountButton": { "config": { "icon": "User", "className": " flex items-center gap-1 shadow-none" } } },
|
||||
{ "VtCartButton": { "config": { "icon": "ShoppingBag", "className": "shadow-none bg-transparent text-black w-[50px]" } } }
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
@ -178,9 +45,7 @@
|
|||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
"PropsChildren": {}
|
||||
},
|
||||
{ "PropsChildren": {} },
|
||||
{
|
||||
"Footer": {
|
||||
"config": {
|
||||
|
|
@ -189,122 +54,13 @@
|
|||
"centerClassName": "",
|
||||
"rightClassName": "flex gap-[10rem] mr-[80px]",
|
||||
"left": [
|
||||
{
|
||||
"VtFooterHero": {
|
||||
"config": {
|
||||
"logoClassName": "h-[100px] w-[200px]",
|
||||
"logoSrc": "/3bear-white-logo.avif",
|
||||
"logoAlt": "3Bear",
|
||||
"title": "Melde dich für unsere Oatnews an 💛",
|
||||
"email": {
|
||||
"emailInputClassName": "w-[300px] ml-8"
|
||||
},
|
||||
"socials": [
|
||||
{
|
||||
"icon": "Twitter",
|
||||
"href": "/",
|
||||
"className": "w-5 h-5 text-white"
|
||||
},
|
||||
{
|
||||
"icon": "Twitter",
|
||||
"href": "/",
|
||||
"className": "w-5 h-5 text-white"
|
||||
},
|
||||
{
|
||||
"icon": "Twitter",
|
||||
"href": "/",
|
||||
"className": "w-5 h-5 text-white"
|
||||
},
|
||||
{
|
||||
"icon": "Twitter",
|
||||
"href": "/",
|
||||
"className": "w-5 h-5 text-white"
|
||||
}
|
||||
],
|
||||
"socialsClassName": "ml-8 mt-10",
|
||||
"className": "",
|
||||
"ctaClassName": "ml-8",
|
||||
"titleClassName": "ml-8 text-white w-full",
|
||||
"descriptionClassName": "ml-8"
|
||||
}
|
||||
}
|
||||
}
|
||||
{ "VtFooterHero": { "config": { "logoClassName": "h-[100px] w-[200px]", "logoSrc": "/3bear-white-logo.avif", "logoAlt": "3Bear", "title": "Melde dich für unsere Oatnews an 💛", "email": { "emailInputClassName": "w-[300px] ml-8" }, "socials": [ { "icon": "Twitter", "href": "/", "className": "w-5 h-5 text-white" }, { "icon": "Twitter", "href": "/", "className": "w-5 h-5 text-white" }, { "icon": "Twitter", "href": "/", "className": "w-5 h-5 text-white" }, { "icon": "Twitter", "href": "/", "className": "w-5 h-5 text-white" } ], "socialsClassName": "ml-8 mt-10", "className": "", "ctaClassName": "ml-8", "titleClassName": "ml-8 text-white w-full", "descriptionClassName": "ml-8" } } }
|
||||
],
|
||||
"center": [],
|
||||
"right": [
|
||||
{
|
||||
"VtMenuItem": {
|
||||
"config": {
|
||||
"title": "Information",
|
||||
"className": "flex flex-col gap-y-2 text-[24px] font-semibold text-white hover:text-white",
|
||||
"itemClassName": "text-[1rem] font-[400] opacity-70 hover:text-white",
|
||||
"items": [
|
||||
{
|
||||
"text": "Über Uns",
|
||||
"href": "/"
|
||||
},
|
||||
{
|
||||
"text": "Placeholder",
|
||||
"href": "/categories/shoes"
|
||||
},
|
||||
{
|
||||
"text": "Placeholder",
|
||||
"href": "/categories/accessories"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"VtMenuItem": {
|
||||
"config": {
|
||||
"title": "Kundendienst",
|
||||
"className": "flex flex-col gap-y-2 text-[24px] font-semibold text-white hover:text-white",
|
||||
"itemClassName": "text-[1rem] font-[400] flex items-center opacity-70 hover:text-white",
|
||||
"items": [
|
||||
{
|
||||
"text": "Twitter",
|
||||
"href": "/"
|
||||
},
|
||||
{
|
||||
"text": "Facebook",
|
||||
"href": "/categories/shoes"
|
||||
},
|
||||
{
|
||||
"text": "Pinterest",
|
||||
"href": "/categories/accessories"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"VtMenuItem": {
|
||||
"config": {
|
||||
"title": "Weiteres",
|
||||
"className": "flex flex-col gap-y-2 text-[24px] font-semibold text-white",
|
||||
"itemClassName": "text-[1rem] font-[400] w-[150px] opacity-70 hover:text-white",
|
||||
"items": [
|
||||
{
|
||||
"text": "Karriere",
|
||||
"href": "/"
|
||||
},
|
||||
{
|
||||
"text": "Unser Team",
|
||||
"href": "/categories/shoes"
|
||||
},
|
||||
{
|
||||
"text": "B2B",
|
||||
"href": "/categories/accessories"
|
||||
},
|
||||
{
|
||||
"text": "Presse",
|
||||
"href": "/categories/accessories"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
{ "VtMenuItem": { "config": { "title": "Information", "className": "flex flex-col gap-y-2 text-[24px] font-semibold text-white hover:text-white", "itemClassName": "text-[1rem] font-[400] opacity-70 hover:text-white", "items": [ { "text": "Über Uns", "href": "/" }, { "text": "Placeholder", "href": "/categories/shoes" }, { "text": "Placeholder", "href": "/categories/accessories" } ] } } },
|
||||
{ "VtMenuItem": { "config": { "title": "Kundendienst", "className": "flex flex-col gap-y-2 text-[24px] font-semibold text-white hover:text-white", "itemClassName": "text-[1rem] font-[400] flex items-center opacity-70 hover:text-white", "items": [ { "text": "Twitter", "href": "/" }, { "text": "Facebook", "href": "/categories/shoes" }, { "text": "Pinterest", "href": "/categories/accessories" } ] } } },
|
||||
{ "VtMenuItem": { "config": { "title": "Weiteres", "className": "flex flex-col gap-y-2 text-[24px] font-semibold text-white", "itemClassName": "text-[1rem] font-[400] w-[150px] opacity-70 hover:text-white", "items": [ { "text": "Karriere", "href": "/" }, { "text": "Unser Team", "href": "/categories/shoes" }, { "text": "B2B", "href": "/categories/accessories" }, { "text": "Presse", "href": "/categories/accessories" } ] } } }
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
@ -317,22 +73,7 @@
|
|||
"left": [],
|
||||
"center": [],
|
||||
"right": [
|
||||
{
|
||||
"VtFooterBottom": {
|
||||
"config": {
|
||||
"className": " mr-[80px]",
|
||||
"icons": [
|
||||
"Mastercard",
|
||||
"PayPal",
|
||||
"Visa",
|
||||
"Mastercard",
|
||||
"Mastercard",
|
||||
"Mastercard",
|
||||
"Mastercard"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
{ "VtFooterBottom": { "config": { "className": " mr-[80px]", "icons": [ "Mastercard", "PayPal", "Visa", "Mastercard", "Mastercard", "Mastercard", "Mastercard" ] } } }
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
@ -344,31 +85,8 @@
|
|||
"Hero": {
|
||||
"config": {
|
||||
"className": "h-[35rem]",
|
||||
"ImageDisplayer": {
|
||||
"config": {
|
||||
"duration": 0,
|
||||
"images": [
|
||||
"./banner-hero.webp"
|
||||
],
|
||||
"links": [
|
||||
"/account"
|
||||
]
|
||||
}
|
||||
},
|
||||
"left": [
|
||||
{
|
||||
"VtCtaBanner": {
|
||||
"config": {
|
||||
"className": "left-[120px] top-[80px] relative w-full p-12 flex flex-col items-start justify-center text-left bg-transperant border-none shadow-none",
|
||||
"buttonTextClassName": "inline-flex items-center justify-center bg-[#FCEE56] hover:bg-[#FCEE56]/90 text-[#0D382E] px-8 py-3 rounded-full font-bold text-lg shadow-none border-none",
|
||||
"tagTextClassName": "text-[#0D382E] text-lg font-medium mb-2 bg-transparent",
|
||||
"tagText": "So einfach kann Frühstück sein – mit unseren leckeren Overnight Oats.",
|
||||
"titleText": "breakfast made easy.",
|
||||
"buttonText": "Jetzt entdecken"
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
"ImageDisplayer": { "config": { "duration": 0, "images": ["./banner-hero.webp"], "links": ["/account"] } },
|
||||
"left": [ { "VtCtaBanner": { "config": { "className": "left-[120px] top-[80px] relative w-full p-12 flex flex-col items-start justify-center text-left bg-transperant border-none shadow-none", "buttonTextClassName": "inline-flex items-center justify-center bg-[#FCEE56] hover:bg-[#FCEE56]/90 text-[#0D382E] px-8 py-3 rounded-full font-bold text-lg shadow-none border-none", "tagTextClassName": "text-[#0D382E] text-lg font-medium mb-2 bg-transparent", "tagText": "So einfach kann Frühstück sein – mit unseren leckeren Overnight Oats.", "titleText": "breakfast made easy.", "buttonText": "Jetzt entdecken" } } } ],
|
||||
"center": [],
|
||||
"right": []
|
||||
}
|
||||
|
|
@ -380,107 +98,26 @@
|
|||
"title": "best-seller",
|
||||
"styles": {
|
||||
"container": "content-container py-12 small:py-20",
|
||||
"header": {
|
||||
"container": "ml-16",
|
||||
"title": "text-2xl mb-12",
|
||||
"isShowViewAll": false
|
||||
},
|
||||
"header": { "container": "hidden", "title": "hidden", "isShowViewAll": false },
|
||||
"list": "grid grid-cols-2 small:grid-cols-3 gap-x-6 gap-y-24 small:gap-y-36",
|
||||
"productCard": {
|
||||
"badgeText": "Bestseller",
|
||||
"card": "relative flex flex-col items-center bg-transparent shadow-none border-none p-0",
|
||||
"badge": {
|
||||
"container": "absolute top-0 left-0 z-[1]",
|
||||
"text": "px-3 py-1 rounded-full bg-[#009b93] text-white text-[12px] font-semibold"
|
||||
},
|
||||
"thumbnail": {
|
||||
"className": "rounded-2xl bg-white h-[320px] object-contain shadow-none",
|
||||
"size": "full"
|
||||
},
|
||||
"badge": { "container": "absolute top-0 left-0 z-[1]", "text": "px-3 py-1 rounded-full bg-[#009b93] text-white text-[12px] font-semibold" },
|
||||
"thumbnail": { "className": "rounded-2xl bg-white h-[320px] object-contain shadow-none", "size": "full" },
|
||||
"content": "flex flex-col items-center justify-start text-center p-0 mt-6",
|
||||
"title": "text-[#003F31] text-[28px] font-semibold",
|
||||
"description": "order-3 text-[#003f31b3]",
|
||||
"price": "mt-2 text-[#0D382E] text-[24px] font-bold order-2 flex gap-2",
|
||||
"reviews": {
|
||||
"container": "mt-3 flex items-center gap-2 order-1",
|
||||
"stars": "flex gap-1",
|
||||
"star": "text-[#F59E0B] text-xl leading-none",
|
||||
"emptyStar": "text-[#F59E0B] text-xl opacity-30 leading-none",
|
||||
"text": "text-[#003F31] text-[14px]",
|
||||
"rating": 4.5,
|
||||
"count": 38
|
||||
},
|
||||
"button": {
|
||||
"addToCart": "hidden",
|
||||
"moreInfo": "hidden",
|
||||
"isShowIcon": false
|
||||
}
|
||||
"reviews": { "container": "mt-3 flex items-center gap-2 order-1", "stars": "flex gap-1", "star": "text-[#F59E0B] text-xl leading-none", "emptyStar": "text-[#F59E0B] text-xl opacity-30 leading-none", "text": "text-[#003F31] text-[14px]", "rating": 4.5, "count": 38 },
|
||||
"button": { "addToCart": "hidden", "moreInfo": "hidden", "isShowIcon": false }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"CartMismatchBanner": {
|
||||
"config": {
|
||||
"show": true
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"VtCategoryHighlight": {
|
||||
"config": {
|
||||
"title": "Oder lieber stöbern? Hier findest du sicher deine neuen Hafer-Favoriten.",
|
||||
"className": "content-container py-12 small:py-20",
|
||||
"gridClassName": "grid grid-cols-4 gap-6 w-full",
|
||||
"labelClassName": "absolute left-4 bottom-4 text-[#003F31] text-[18px] font-semibold",
|
||||
"items": [
|
||||
{
|
||||
"imageSrc": "/overnight-oat.webp",
|
||||
"href": "/categories/overnight-oats",
|
||||
"label": "Overnight Oats",
|
||||
"className": "bg-[#CFECD9] col-start-1 col-end-3 row-start-1 row-end-3",
|
||||
"imageClassName": "object-contain"
|
||||
},
|
||||
{
|
||||
"imageSrc": "/overnight-oat.webp",
|
||||
"href": "/categories/porridge",
|
||||
"label": "Porridge",
|
||||
"className": "bg-[#F9E0B0]",
|
||||
"imageClassName": "object-contain"
|
||||
},
|
||||
{
|
||||
"imageSrc": "/overnight-oat.webp",
|
||||
"href": "/categories/cereals",
|
||||
"label": "Cereals",
|
||||
"className": "bg-[#F59E0B]",
|
||||
"imageClassName": "object-contain"
|
||||
},
|
||||
{
|
||||
"imageSrc": "/overnight-oat.webp",
|
||||
"href": "/categories/granola",
|
||||
"label": "Granola",
|
||||
"className": "bg-[#A7D8F0]",
|
||||
"imageClassName": "object-contain"
|
||||
},
|
||||
{
|
||||
"imageSrc": "/overnight-oat.webp",
|
||||
"href": "/categories/oat-bars",
|
||||
"label": "Oat Bars",
|
||||
"className": "bg-[#EED7F2]",
|
||||
"imageClassName": "object-contain"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"FreeShippingPriceNudge": {
|
||||
"config": {
|
||||
"variant": "popup"
|
||||
}
|
||||
}
|
||||
}
|
||||
{ "CartMismatchBanner": { "config": { "show": true } } },
|
||||
{ "FreeShippingPriceNudge": { "config": { "variant": "popup" } } }
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -301,7 +301,6 @@
|
|||
"content": " flex flex-col flex-1",
|
||||
"title": "mt-2 text-[#1f3521] text-[22px] font-bold",
|
||||
"price": "mt-2 text-[#3B6F47] font-bold text-[20px] flex gap-3 flex-row-reverse justify-end",
|
||||
"description": "mt-2",
|
||||
"reviews": {
|
||||
"container": "mt-3 flex items-center gap-2",
|
||||
"stars": "flex gap-1",
|
||||
|
|
@ -320,34 +319,6 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"VtCategoryHighlight": {
|
||||
"config": {
|
||||
"title": "Oder lieber stöbern? Hier findest du sicher deine neuen Hafer-Favoriten.",
|
||||
"className": "content-container py-12 small:py-20",
|
||||
"gridClassName": "grid grid-cols-2 gap-6 w-full",
|
||||
"labelClassName": "absolute left-4 bottom-4 text-[#003F31] text-[18px] font-semibold",
|
||||
"items": [
|
||||
{
|
||||
"imageSrc": "/overnight-oat.webp",
|
||||
"href": "/categories/overnight-oats",
|
||||
"label": "Overnight Oats",
|
||||
"className": "bg-[#CFECD9] h-[250px]",
|
||||
"imageClassName": "object-contain"
|
||||
},
|
||||
{
|
||||
"headingLabel": "The Squatch Difference",
|
||||
"descriptionLabel": "Learn why men everywhere are loving Dr. Squatch.",
|
||||
"buttonLabel": "Learn more",
|
||||
"className": "flex-col bg-[#F9E0B0] p-6 justify-center",
|
||||
"headingClassName": "text-[#003F31] text-[28px] font-semibold",
|
||||
"descriptionClassName": "text-[#003f31b3]",
|
||||
"buttonClassName": "mt-4 text-[#003F31] text-[18px] font-semibold bg-orange-500 py-2 px-16 rounded text-white"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{ "CartMismatchBanner": { "config": { "show": true } } },
|
||||
{ "FreeShippingPriceNudge": { "config": { "variant": "popup" } } }
|
||||
],
|
||||
|
|
|
|||
|
|
@ -203,34 +203,6 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"VtCategoryHighlight": {
|
||||
"config": {
|
||||
"title": "Oder lieber stöbern? Hier findest du sicher deine neuen Hafer-Favoriten.",
|
||||
"className": "content-container py-12 small:py-20",
|
||||
"gridClassName": "grid grid-cols-2 gap-6 w-full",
|
||||
"labelClassName": "absolute left-4 bottom-4 text-[#003F31] text-[18px] font-semibold",
|
||||
"items": [
|
||||
{
|
||||
"imageSrc": "/overnight-oat.webp",
|
||||
"href": "/categories/overnight-oats",
|
||||
"label": "Overnight Oats",
|
||||
"className": "bg-[#CFECD9] h-[250px]",
|
||||
"imageClassName": "object-contain"
|
||||
},
|
||||
{
|
||||
"headingLabel": "The Squatch Difference",
|
||||
"descriptionLabel": "Learn why men everywhere are loving Dr. Squatch.",
|
||||
"buttonLabel": "Learn more",
|
||||
"className": "flex-col bg-[#F9E0B0] p-6 justify-center",
|
||||
"headingClassName": "text-[#003F31] text-[28px] font-semibold",
|
||||
"descriptionClassName": "text-[#003f31b3]",
|
||||
"buttonClassName": "mt-4 text-[#003F31] text-[18px] font-semibold bg-orange-500 py-2 px-16 rounded text-white"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"CartMismatchBanner": {
|
||||
"config": { "show": true }
|
||||
|
|
|
|||
|
|
@ -342,7 +342,6 @@
|
|||
"subtitle": "text-ui-fg-subtle text-[14px]",
|
||||
"content": "flex flex-col flex-1 justify-between p-4",
|
||||
"title": "text-ui-fg-subtle text-[18px]",
|
||||
"description": "mt-2 text-ui-fg-subtle text-[14px]",
|
||||
"price": "flex items-center gap-x-1 text-[#285A86] font-bold border-b pb-4",
|
||||
"button": {
|
||||
"addToCart": "w-fit h-[40px] bg-black text-white rounded-md",
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 195 KiB |
|
|
@ -1,86 +0,0 @@
|
|||
import { clx } from "@medusajs/ui"
|
||||
import LocalizedClientLink from "@modules/common/components/localized-client-link"
|
||||
import {
|
||||
LayoutComponentDefinition,
|
||||
LayoutContext,
|
||||
} from "@vibentec/component-map"
|
||||
|
||||
export default async function VtCategoryHighlight({
|
||||
nodes,
|
||||
context,
|
||||
}: {
|
||||
nodes: LayoutComponentDefinition
|
||||
context: LayoutContext
|
||||
}) {
|
||||
const props = nodes.config ?? {}
|
||||
|
||||
const title: string = props.title ?? ""
|
||||
const items = props.items ?? []
|
||||
|
||||
const classes = {
|
||||
container: props.className ?? "content-container py-12",
|
||||
title:
|
||||
props.titleClassName ?? "text-[#003F31] text-[28px] font-semibold mb-6",
|
||||
grid: props.gridClassName ?? "grid grid-cols-3 gap-6 w-full",
|
||||
tile:
|
||||
props.tileClassName ??
|
||||
"relative rounded-2xl overflow-hidden bg-white aspect-square w-full",
|
||||
label: props.labelClassName ?? "text-[#003F31] text-[18px] font-semibold",
|
||||
image: props.imageClassName ?? "w-full h-full object-contain",
|
||||
}
|
||||
|
||||
if (!items || items.length === 0) {
|
||||
return null
|
||||
}
|
||||
|
||||
const renderTile = (tile: any, idx: number) => {
|
||||
const imageEl = tile.imageSrc ? (
|
||||
<img
|
||||
src={tile.imageSrc}
|
||||
alt={tile.label ?? `category-${idx}`}
|
||||
className={clx(classes.image, tile.imageClassName)}
|
||||
/>
|
||||
) : (
|
||||
<div
|
||||
className={clx(
|
||||
"w-full h-full flex items-center justify-center",
|
||||
tile.className
|
||||
)}
|
||||
>
|
||||
<div className={clx(tile.headingClassName)}>{tile.headingLabel}</div>
|
||||
<div className={tile.descriptionClassName}>{tile.descriptionLabel}</div>
|
||||
<button className={tile.buttonClassName}>{tile.buttonLabel}</button>
|
||||
</div>
|
||||
)
|
||||
|
||||
const content = (
|
||||
<div className={clx("relative w-full h-full")}>
|
||||
{imageEl}
|
||||
{tile.label && <span className={classes.label}>{tile.label}</span>}
|
||||
</div>
|
||||
)
|
||||
|
||||
return tile.href ? (
|
||||
<LocalizedClientLink
|
||||
key={`tile-${idx}`}
|
||||
href={tile.href}
|
||||
className={clx("w-full h-full", tile.className)}
|
||||
>
|
||||
{content}
|
||||
</LocalizedClientLink>
|
||||
) : (
|
||||
<div className={clx(tile.className, "w-full h-full")} key={`tile-${idx}`}>
|
||||
{content}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<section className={classes.container}>
|
||||
{title && <h2 className={classes.title}>{title}</h2>}
|
||||
<div className={classes.grid}>
|
||||
{items.map((tile: any, idx: number) => renderTile(tile, idx))}
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -57,7 +57,7 @@ export default function ProductCard({
|
|||
const classes = {
|
||||
card: styles?.card ?? className ?? "",
|
||||
badge: {
|
||||
container: styles?.badge?.container ?? " pb-4",
|
||||
container: styles?.badge?.container ?? "p-4",
|
||||
text:
|
||||
styles?.badge?.text ??
|
||||
"z-20 px-3 py-1 border-[0.5px] rounded bg-[#c9e0f5] txt-compact-small-plus shadow-borders-base text-[#285A86] ",
|
||||
|
|
@ -68,9 +68,9 @@ export default function ProductCard({
|
|||
},
|
||||
subtitle: styles?.subtitle ?? "",
|
||||
content: styles?.content ?? "p-6 flex flex-col flex-1",
|
||||
title: styles?.title ?? "",
|
||||
price: styles?.price ?? "",
|
||||
description: styles?.description ?? "",
|
||||
title: styles?.title ?? "mt-2 text-ui-fg-base",
|
||||
price: styles?.price ?? "mt-2 flex items-baseline gap-2",
|
||||
description: styles?.description ?? "txt-small text-[#285A86] my-4",
|
||||
reviews: {
|
||||
container: styles?.reviews?.container ?? undefined,
|
||||
stars: styles?.reviews?.stars ?? "flex gap-1",
|
||||
|
|
@ -83,18 +83,15 @@ export default function ProductCard({
|
|||
count: styles?.reviews?.count,
|
||||
},
|
||||
button: {
|
||||
addToCart: styles?.button?.addToCart ?? "",
|
||||
moreInfo: styles?.button?.moreInfo ?? "",
|
||||
isShowIcon: styles?.button?.isShowIcon ?? false,
|
||||
addToCart: styles?.button?.addToCart ?? "flex-1",
|
||||
moreInfo: styles?.button?.moreInfo ?? "w-full",
|
||||
isShowIcon: styles?.button?.isShowIcon ?? true,
|
||||
},
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={clx(classes.card)}>
|
||||
<LocalizedClientLink
|
||||
href={`/products/${product.handle}`}
|
||||
className="block"
|
||||
>
|
||||
<LocalizedClientLink href={`/products/${product.handle}`} className="block">
|
||||
<div className="relative">
|
||||
{badgeText && (
|
||||
<div className={classes.badge.container}>
|
||||
|
|
@ -121,10 +118,7 @@ export default function ProductCard({
|
|||
</LocalizedClientLink>
|
||||
)}
|
||||
|
||||
<LocalizedClientLink
|
||||
href={`/products/${product.handle}`}
|
||||
className="block"
|
||||
>
|
||||
<LocalizedClientLink href={`/products/${product.handle}`} className="block">
|
||||
<Heading
|
||||
level="h3"
|
||||
className={classes.title}
|
||||
|
|
@ -134,11 +128,9 @@ export default function ProductCard({
|
|||
</Heading>
|
||||
</LocalizedClientLink>
|
||||
|
||||
{classes.price && (
|
||||
<div className={classes.price}>
|
||||
{cheapestPrice && <PreviewPrice price={cheapestPrice} />}
|
||||
</div>
|
||||
)}
|
||||
<div className={classes.price}>
|
||||
{cheapestPrice && <PreviewPrice price={cheapestPrice} />}
|
||||
</div>
|
||||
|
||||
{(classes.reviews.rating !== undefined ||
|
||||
classes.reviews.count !== undefined) && (
|
||||
|
|
@ -190,34 +182,25 @@ export default function ProductCard({
|
|||
</div>
|
||||
)}
|
||||
|
||||
{classes.description && (
|
||||
<Text className={clx(classes.description, "txt-small my-4")}>
|
||||
{description}
|
||||
</Text>
|
||||
)}
|
||||
<Text className={clx(classes.description, "txt-small my-4")}>{description}</Text>
|
||||
|
||||
<div className="flex gap-3 mt-auto">
|
||||
{classes.button?.addToCart && (
|
||||
<Button
|
||||
formAction={handleAddToCart}
|
||||
disabled={!inStock}
|
||||
variant="primary"
|
||||
className={classes.button.addToCart}
|
||||
>
|
||||
Add to cart {classes.button.isShowIcon && <Plus />}
|
||||
<Button
|
||||
formAction={handleAddToCart}
|
||||
disabled={!inStock}
|
||||
variant="primary"
|
||||
className={classes.button.addToCart}
|
||||
>
|
||||
Add to cart {classes.button.isShowIcon && <Plus />}
|
||||
</Button>
|
||||
<LocalizedClientLink
|
||||
href={`/products/${product.handle}`}
|
||||
className="flex-1"
|
||||
>
|
||||
<Button variant="secondary" className={classes.button.moreInfo}>
|
||||
More Info {classes.button.isShowIcon && <ChevronRight />}
|
||||
</Button>
|
||||
)}
|
||||
|
||||
{classes.button?.moreInfo && (
|
||||
<LocalizedClientLink
|
||||
href={`/products/${product.handle}`}
|
||||
className="flex-1"
|
||||
>
|
||||
<Button variant="secondary" className={classes.button.moreInfo}>
|
||||
More Info {classes.button.isShowIcon && <ChevronRight />}
|
||||
</Button>
|
||||
</LocalizedClientLink>
|
||||
)}
|
||||
</LocalizedClientLink>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -26,7 +26,6 @@ import Hero from "@modules/layout/templates/hero"
|
|||
import { VtCarousel } from "@modules/layout/templates/vt-carousel"
|
||||
import { VtCtaBanner } from "@modules/layout/templates/vt-cta-banner"
|
||||
import VtFeaturedProducts from "@modules/home/components/vt-featured-products"
|
||||
import VtCategoryHighlight from "@modules/home/components/vt-category-highlight"
|
||||
|
||||
type ComponentConfig = Record<string, any>
|
||||
|
||||
|
|
@ -102,7 +101,6 @@ export const componentMap: Record<string, ComponentRenderer> = {
|
|||
Footer: nodesContextRenderer(VtFooter),
|
||||
ImageDisplayer: nodesContextRenderer(VtCarousel),
|
||||
VtFeaturedProducts: nodesContextRenderer(VtFeaturedProducts),
|
||||
VtCategoryHighlight: nodesContextRenderer(VtCategoryHighlight),
|
||||
}
|
||||
|
||||
export type ComponentName = keyof typeof componentMap
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import fs from "fs"
|
|||
import path from "path"
|
||||
import { jsonFileNames } from "./devJsonFileNames"
|
||||
|
||||
const fileName = jsonFileNames.nam3Bear
|
||||
const fileName = jsonFileNames.namVibentec
|
||||
|
||||
async function readDesignFile() {
|
||||
const filePath = path.join(process.cwd(), "config", fileName)
|
||||
|
|
|
|||
Loading…
Reference in New Issue