a5b4951720
Applies to navbar mobile search + menu and the search overlay close — one step lighter than brand so shadow-lg actually reads. Clear pill label trimmed to just 'Clear' / 'Löschen'.
1 line
5.3 KiB
JavaScript
1 line
5.3 KiB
JavaScript
import{C as e,L as t,O as n,P as r,c as i,k as a,l as o,m as s,o as c,p as l,r as u,s as d,tt as f,u as p,x as m}from"./runtime-core.esm-bundler-CjdnoyKJ.js";import{t as h}from"./runtime-dom.esm-bundler-CDZvOKZN.js";import{a as g,n as ee,t as _}from"./vue-router-BrNWkU63.js";import{t as v}from"./_plugin-vue_export-helper-CXTkFu_Z.js";import{t as y}from"./Logo-Iem0n9fv.js";import{t as b}from"./Icon-BaDkTwYL.js";import{t as x}from"./i18n-vEEJS20H.js";import{t as S}from"./LanguageSwitcher-DU98YiGa.js";var C={class:`h-screen flex bg-surface text-ink overflow-hidden`},w={class:`hidden lg:flex w-[260px] shrink-0 border-r border-line bg-paper flex-col`},T={class:`px-6 py-6 border-b border-line`},E={class:`eyebrow mt-3`},D={class:`flex-1 overflow-y-auto px-3 py-5 space-y-6`},O={class:`eyebrow px-3 mb-2`},k={class:`flex flex-col gap-0.5`},A={class:`px-6 py-4 border-t border-line`},j={class:`flex-1 overflow-y-auto pb-20 lg:pb-0`},M=[`aria-expanded`],N={class:`flex flex-col min-w-0`},P={class:`eyebrow`},F={class:`truncate text-[15px] font-semibold text-ink`},I={class:`inline-flex items-center justify-center w-10 h-10 rounded-pill bg-brand-wash text-brand shrink-0`},L=[`aria-label`],te={class:`shrink-0 flex items-center justify-between px-5 pt-3 pb-3 border-b border-line`},R={class:`flex flex-col`},z={class:`eyebrow`},B={class:`text-[15px] font-semibold`},V=[`aria-label`],H={class:`flex-1 overflow-y-auto px-3 py-4 space-y-6`},U={class:`eyebrow px-3 mb-2`},W={class:`flex flex-col gap-0.5`},G={class:`px-3 pt-3 border-t border-line`},K=v({__name:`DesignLayout`,setup(v){let{t:K}=x(),q=g(),J=c(()=>[{title:K(`ds.sidebar.brand`),items:[{name:`ds-logo`,label:K(`ds.nav.logo`)}]},{title:K(`ds.sidebar.tokens`),items:[{name:`ds-colors`,label:K(`ds.nav.colors`)},{name:`ds-typography`,label:K(`ds.nav.typography`)},{name:`ds-radii`,label:K(`ds.nav.radii`)},{name:`ds-shadows`,label:K(`ds.nav.shadows`)}]},{title:K(`ds.sidebar.components`),items:[{name:`ds-icons`,label:K(`ds.nav.icons`)},{name:`ds-buttons`,label:K(`ds.nav.buttons`)},{name:`ds-badges`,label:K(`ds.nav.badges`)},{name:`ds-inputs`,label:K(`ds.nav.inputs`)},{name:`ds-cards`,label:K(`ds.nav.cards`)},{name:`ds-products`,label:K(`ds.nav.products`)},{name:`ds-hero`,label:K(`ds.nav.hero`)},{name:`ds-navbar`,label:K(`ds.nav.navbar`)},{name:`ds-search`,label:K(`ds.nav.search`)},{name:`ds-language`,label:K(`ds.nav.language`)}]}]),Y=c(()=>J.value.flatMap(e=>e.items)),X=c(()=>{let e=Y.value.find(e=>e.name===q.name);return e?e.label:K(`ds.eyebrow.designSystem`)}),Z=r(!1);function Q(){Z.value=!0}function $(){Z.value=!1}return n(()=>q.name,$),(n,r)=>(m(),p(`div`,C,[d(`aside`,w,[d(`div`,T,[s(t(_),{to:`/`,class:`block text-brand`,"aria-label":`Kaiser Natron home`},{default:a(()=>[s(y,{class:`w-16 h-auto`})]),_:1}),d(`p`,E,f(t(K)(`ds.eyebrow.designSystem`)),1)]),d(`nav`,D,[(m(!0),p(u,null,e(J.value,n=>(m(),p(`div`,{key:n.title},[d(`p`,O,f(n.title),1),d(`div`,k,[(m(!0),p(u,null,e(n.items,e=>(m(),i(t(_),{key:e.name,to:{name:e.name},class:`px-3 py-2 rounded-sm text-[14px] font-medium text-muted hover:text-brand hover:bg-brand-wash transition-colors`,"active-class":`!text-brand !bg-brand-soft-wash`},{default:a(()=>[l(f(e.label),1)]),_:2},1032,[`to`]))),128))])]))),128))]),d(`div`,A,[s(t(_),{to:`/`,class:`text-[13px] text-muted hover:text-brand transition-colors`},{default:a(()=>[l(f(t(K)(`ds.sidebar.back`)),1)]),_:1})])]),d(`main`,j,[s(t(ee))]),d(`button`,{type:`button`,class:`lg:hidden fixed bottom-0 inset-x-0 z-40 flex items-center justify-between gap-3 px-5 py-3 bg-paper border-t border-line text-left shadow-[0_-4px_16px_rgba(28,58,40,0.06)]`,"aria-expanded":Z.value,"aria-controls":`ds-mobile-sheet`,onClick:Q},[d(`span`,N,[d(`span`,P,f(t(K)(`ds.mobile.currentPage`)),1),d(`span`,F,f(X.value),1)]),d(`span`,I,[s(b,{name:`chevron-up`,size:20,label:t(K)(`ds.mobile.selectPage`)},null,8,[`label`])])],8,M),s(h,{name:`ds-backdrop`},{default:a(()=>[Z.value?(m(),p(`div`,{key:0,class:`lg:hidden fixed inset-0 z-50 bg-ink/40`,onClick:$})):o(``,!0)]),_:1}),s(h,{name:`ds-sheet`},{default:a(()=>[Z.value?(m(),p(`aside`,{key:0,id:`ds-mobile-sheet`,role:`dialog`,"aria-modal":`true`,"aria-label":t(K)(`ds.mobile.selectPage`),class:`lg:hidden fixed bottom-0 inset-x-0 z-50 h-[50svh] bg-paper border-t border-line rounded-t-xl flex flex-col shadow-[0_-12px_32px_rgba(28,58,40,0.18)]`},[d(`div`,te,[d(`span`,R,[d(`span`,z,f(t(K)(`ds.eyebrow.designSystem`)),1),d(`span`,B,f(t(K)(`ds.mobile.selectPage`)),1)]),d(`button`,{type:`button`,class:`inline-flex items-center justify-center w-9 h-9 rounded-pill hover:bg-brand-wash text-muted hover:text-brand transition-colors`,"aria-label":t(K)(`menu.close`),onClick:$},[s(b,{name:`close`,size:22})],8,V)]),d(`nav`,H,[(m(!0),p(u,null,e(J.value,n=>(m(),p(`div`,{key:n.title},[d(`p`,U,f(n.title),1),d(`div`,W,[(m(!0),p(u,null,e(n.items,e=>(m(),i(t(_),{key:e.name,to:{name:e.name},class:`px-3 py-2.5 rounded-sm text-[15px] font-medium text-muted hover:text-brand hover:bg-brand-wash transition-colors`,"active-class":`!text-brand !bg-brand-soft-wash`},{default:a(()=>[l(f(e.label),1)]),_:2},1032,[`to`]))),128))])]))),128)),d(`div`,G,[s(t(_),{to:`/`,class:`inline-block text-[14px] text-muted hover:text-brand transition-colors`},{default:a(()=>[l(f(t(K)(`ds.sidebar.back`)),1)]),_:1})])])],8,L)):o(``,!0)]),_:1}),s(S,{floating:``})]))}},[[`__scopeId`,`data-v-8f281349`]]);export{K as default}; |