refactor: update 3bear design json file
This commit is contained in:
parent
216a579564
commit
baaa0e9c62
|
|
@ -136,31 +136,13 @@
|
|||
],
|
||||
"right": [
|
||||
{
|
||||
"Dropdown": {
|
||||
"VtCountryCodeSelect": {
|
||||
"config": {
|
||||
"trigger": {
|
||||
"icon": "https://upload.wikimedia.org/wikipedia/commons/thumb/b/ba/Flag_of_Germany.svg/1200px-Flag_of_Germany.svg.png",
|
||||
"text": "Germany (EUR)",
|
||||
"className": "font-bold text-[1rem] text-[#003F31] flex items-center gap-1 hover:text-[#009b93]",
|
||||
"isShowArrow": true
|
||||
},
|
||||
"items": [
|
||||
{
|
||||
"icon": "https://upload.wikimedia.org/wikipedia/commons/thumb/b/ba/Flag_of_Germany.svg/1200px-Flag_of_Germany.svg.png",
|
||||
"text": "Germany (EUR)",
|
||||
"href": "/"
|
||||
},
|
||||
{
|
||||
"icon": "https://upload.wikimedia.org/wikipedia/commons/2/20/Flag_of_the_Netherlands.svg",
|
||||
"text": "Netherlands (EUR)",
|
||||
"href": "/"
|
||||
},
|
||||
{
|
||||
"icon": "https://cdn.shopify.com/s/files/1/0275/7784/3817/files/Australia_Flag.svg?v=1657674627",
|
||||
"text": "Australia (AUD)",
|
||||
"href": "/"
|
||||
}
|
||||
]
|
||||
"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
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -173,18 +155,18 @@
|
|||
}
|
||||
},
|
||||
{
|
||||
"Button": {
|
||||
"AccountButton": {
|
||||
"config": {
|
||||
"icon": "User",
|
||||
"className": "shadow-none"
|
||||
"className": " flex items-center gap-1 shadow-none"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"VtCartButton": {
|
||||
"config": {
|
||||
"variant": "shoppingBagbutton",
|
||||
"className": "shadow-none"
|
||||
"icon": "ShoppingBag",
|
||||
"className": "shadow-none bg-transparent text-black w-[50px]"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -215,388 +197,158 @@
|
|||
{
|
||||
"Footer": {
|
||||
"config": {
|
||||
"className": "content-container flex w-full bg-[#003f31]",
|
||||
"children": [
|
||||
"className": "content-container flex w-full bg-[#003f31] text-white border justify-between pb-8 pt-14",
|
||||
"leftClassName": "flex-col ml-3",
|
||||
"centerClassName": "",
|
||||
"rightClassName": "flex gap-[12rem] mr-[100px]",
|
||||
"left": [
|
||||
{
|
||||
"Section": {
|
||||
"Image": {
|
||||
"config": {
|
||||
"className": "grid grid-cols-2 w-full py-[40px]"
|
||||
"src": "/3bear-white-logo.avif",
|
||||
"alt": "MyShop",
|
||||
"className": "h-full w-[150px] ml-10 pb-6",
|
||||
"objectFit": "contain"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Text": {
|
||||
"config": {
|
||||
"label": "Melde dich für unsere Oatnews an 💛",
|
||||
"className": "flex flex-col gap-y-2 ml-10 w-full text-[24px] font-semibold text-white"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Input": {
|
||||
"config": {
|
||||
"placeholder": "E-mail",
|
||||
"className": "w-[350px] mt-6 border border-gray-200 bg-transparent rounded-md h-[48px] px-[16px] text-[16px] leading-[125%] text-white flex font-bold ml-10"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"VtSocialLinks": {
|
||||
"config": {
|
||||
"className": "flex items-center gap-1 ml-6 mt-8"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"Section": {
|
||||
"Button": {
|
||||
"config": {
|
||||
"className": "flex mr-8 gap-1 w-full flex-col gap-6"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"Image": {
|
||||
"config": {
|
||||
"src": "/3bear-white-logo.avif",
|
||||
"alt": "B Corp Logo",
|
||||
"className": "w-[150px] h-[108px]"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Text": {
|
||||
"config": {
|
||||
"label": "Melde dich für unsere Oatnews an 💛",
|
||||
"className": "text-[26px] leading-[125%] text-white flex font-bold"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Section": {
|
||||
"config": {
|
||||
"className": "flex w-full flex gap-6"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"Input": {
|
||||
"config": {
|
||||
"placeholder": "E-mail",
|
||||
"className": "w-[50%] border border-gray-200 bg-transparent rounded-md h-[48px] px-[16px] text-[16px] leading-[125%] text-white flex font-bold"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
"Section": {
|
||||
"config": {
|
||||
"className": "flex w-full flex"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"Button": {
|
||||
"config": {
|
||||
"icon": "Twitter",
|
||||
"className": "text-white flex justify-start gap-1 shadow-none w-[50px] bg-transparent hover:bg-transparent"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Button": {
|
||||
"config": {
|
||||
"icon": "Twitter",
|
||||
"className": "text-white flex justify-start gap-1 shadow-none w-[50px] bg-transparent hover:bg-transparent"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Button": {
|
||||
"config": {
|
||||
"icon": "Twitter",
|
||||
"className": "text-white flex justify-start gap-1 shadow-none w-[50px] bg-transparent hover:bg-transparent"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Button": {
|
||||
"config": {
|
||||
"icon": "Twitter",
|
||||
"className": "text-white flex justify-start gap-1 shadow-none w-[50px] bg-transparent hover:bg-transparent"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Button": {
|
||||
"config": {
|
||||
"icon": "Twitter",
|
||||
"className": "text-white flex justify-start gap-1 shadow-none w-[50px] bg-transparent hover:bg-transparent"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
"icon": "Twitter",
|
||||
"iconClassName": "text-white",
|
||||
"className": "w-[48px] h-[48px] shadow-none hover:bg-transparent bg-transparent text-white rounded-md flex items-center justify-center"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Section": {
|
||||
"Button": {
|
||||
"config": {
|
||||
"className": "flex mr-8 gap-1 w-full gap-6"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"Section": {
|
||||
"config": {
|
||||
"className": "flex mr-8 gap-1 w-full flex-col gap-6"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Weiteres",
|
||||
"href": "/",
|
||||
"className": "text-[16px] leading-[125%] text-white flex hover:text-white font-bold"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "FAQ",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[160%] text-white flex mr-8 gap-1 hover:bg-transparent hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Track My Order",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Store policies",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Contact us",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Placeholder",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Placeholder",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Placeholder",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Placeholder",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
"Section": {
|
||||
"config": {
|
||||
"className": "flex mr-8 gap-1 w-full flex-col gap-6"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Kundendienst",
|
||||
"href": "/",
|
||||
"className": "text-[16px] leading-[125%] text-white flex hover:text-white font-bold"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "FAQ",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[160%] text-white flex mr-8 gap-1 hover:bg-transparent hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Track My Order",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Store policies",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Contact us",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Placeholder",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Placeholder",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Placeholder",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Placeholder",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
"Section": {
|
||||
"config": {
|
||||
"className": "flex mr-8 gap-1 w-full flex-col gap-6"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Info",
|
||||
"href": "/",
|
||||
"className": "text-[16px] leading-[125%] text-white flex hover:text-white font-bold"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "FAQ",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[160%] text-white flex mr-8 gap-1 hover:bg-transparent hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Track My Order",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Store policies",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Contact us",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Placeholder",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Placeholder",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Placeholder",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Link": {
|
||||
"config": {
|
||||
"label": "Placeholder",
|
||||
"href": "/",
|
||||
"className": "text-[14px] leading-[125%] text-white flex hover:text-white font-extralight"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
"icon": "Twitter",
|
||||
"iconClassName": "text-white",
|
||||
"className": "w-[48px] h-[48px] shadow-none hover:bg-transparent bg-transparent text-white rounded-md flex items-center justify-center"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Button": {
|
||||
"config": {
|
||||
"icon": "Twitter",
|
||||
"iconClassName": "text-white",
|
||||
"className": "w-[48px] h-[48px] shadow-none hover:bg-transparent bg-transparent text-white rounded-md flex items-center justify-center"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"Button": {
|
||||
"config": {
|
||||
"icon": "Twitter",
|
||||
"iconClassName": "text-white",
|
||||
"className": "w-[48px] h-[48px] shadow-none hover:bg-transparent bg-transparent text-white rounded-md flex items-center justify-center"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
],
|
||||
"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"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue