- 4-step checkout (cart, account, shipping, payment) with Pinia store and route children - minimal cream sticky top bar (logo + stepper + back-to-shopping) replacing nav/footer in checkout - fixed cream action footer at viewport bottom for back/continue on every step - guest / sign-in / register tabs on account step + standalone /login and /register - src/api/auth.js stub matching expected backend contract - legal pages (/impressum, /datenschutz) and category landings (/pflege, /haushalt) - success page stacked CTAs (back-to-home primary, keep-shopping secondary) - footer logo size aligned with navbar; cream variant footer Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
1 line
7.1 KiB
JavaScript
1 line
7.1 KiB
JavaScript
import{A as e,B as t,C as n,G as r,T as i,c as a,ft as o,i as s,j as c,l,m as u,o as d,p as ee,r as f,s as p,u as m,ut as h,x as te}from"./runtime-core.esm-bundler-DTXUv7Wx.js";import{t as g}from"./runtime-dom.esm-bundler-BrsyFPJA.js";import{a as _}from"./vue-router-Cyqru1db.js";import{t as v}from"./Logo-xADhl1RY.js";import{t as y}from"./Icon-Dcq1PyHo.js";import{t as b}from"./IconButton-CwMUSZWU.js";import{t as x}from"./i18n-DhVF3Pwg.js";import{t as S}from"./LanguageSwitcher-yI_Qjz7Y.js";import{t as ne}from"./Search-CazbfuRB.js";import{r as C}from"./products-BqW5PUnm.js";import"./api-DlB23x7f.js";var w={class:`flex items-center gap-10 min-w-0`},T={class:`hidden md:flex items-center gap-7`},E=[`href`,`onClick`],D={class:`hidden md:flex items-center gap-4`},O={key:0,class:`flex items-center gap-6 mr-2`},k=[`href`,`onClick`],A=[`aria-label`],j={key:0,class:`md:hidden fixed bottom-5 left-5 z-40`,style:{"padding-bottom":`env(safe-area-inset-bottom)`}},M={key:1,class:`md:hidden fixed bottom-5 right-5 z-40 flex items-center gap-3`,style:{"padding-bottom":`env(safe-area-inset-bottom)`}},N={key:0,class:`fixed inset-0 z-50 bg-brand text-cream flex flex-col font-sans`},P={class:`flex items-center px-6 pt-6 pb-4`,style:{"padding-top":`calc(env(safe-area-inset-top) + 1.5rem)`}},F={class:`flex-1 flex flex-col justify-center px-8 gap-3 overflow-y-auto`},I=[`href`,`onClick`],L={class:`px-6 flex justify-center`,style:{"padding-bottom":`calc(env(safe-area-inset-bottom) + 6.5rem)`}},R={class:`fixed bottom-5 left-5 right-5 z-[60] flex items-center gap-3`,style:{"padding-bottom":`env(safe-area-inset-bottom)`}},z={class:`inline-flex items-center gap-3`},B={key:0,class:`min-w-[22px] h-[22px] px-2 rounded-full bg-brand text-accent text-[12px] font-bold flex items-center justify-center`},V={class:`shrink-0`},H={__name:`Navbar`,props:{variant:{type:String,default:`paper`,validator:e=>[`brand`,`cream`,`paper`].includes(e)},layout:{type:String,default:`standard`,validator:e=>[`standard`,`floating`].includes(e)},items:{type:Array,default:()=>[{key:`nav.shop`,href:`#`},{key:`nav.applications`,href:`#`},{key:`nav.about`,href:`#`},{key:`nav.contact`,href:`#`}]},secondaryItems:{type:Array,default:()=>[]},cartCount:{type:Number,default:0},floatOnMobile:{type:Boolean,default:!0},products:{type:Array,default:()=>C}},emits:[`cart`,`nav`,`select`],setup(C){let H=C,{t:U}=x(),W=t(!1),G=t(!1),K={brand:{bar:`bg-brand text-cream border-cream-line`,link:`text-cream hover:text-accent`,logo:`text-cream`,searchTrigger:`border border-cream-line bg-cream-wash text-cream/80 hover:text-accent`},cream:{bar:`bg-cream text-brand border-line`,link:`text-brand hover:text-brand-hover`,logo:`text-brand`,searchTrigger:`border border-line-strong bg-paper text-muted hover:text-brand`},paper:{bar:`bg-paper text-ink border-line`,link:`text-ink hover:text-brand`,logo:`text-brand`,searchTrigger:`border border-line bg-paper text-muted hover:text-brand`}},q=d(()=>K[H.variant]),J=d(()=>H.layout===`floating`?`sticky top-4 md:top-6 z-30 mx-4 md:mx-6 rounded-lg border shadow-md`:`sticky top-0 z-30 border-b`),Y=d(()=>H.layout===`floating`?`px-6 md:pl-4 md:pr-8 py-3 md:py-3.5`:`px-6 md:px-8 lg:px-10 py-5`),X=d(()=>H.layout===`floating`?`w-9 md:w-16 h-auto`:`w-12 md:w-24 h-auto`);function Z(e){return e.key?U(e.key):e.label}let re=d(()=>[...H.items,...H.secondaryItems]),Q=_();function $(e){if(!e||e===`#`)return!1;let t=Q.path,n=`${Q.path}${Q.hash||``}`;return e.startsWith(`#`)?Q.hash===e:e===t?!0:e===n}return e(W,e=>{typeof document>`u`||(document.documentElement.style.overflow=e?`hidden`:``)}),te(()=>{typeof document<`u`&&(document.documentElement.style.overflow=``)}),(e,t)=>(n(),m(`header`,{class:h([`font-sans`,J.value,q.value.bar])},[p(`div`,{class:h([Y.value,`flex items-center justify-between gap-6`])},[p(`div`,w,[p(`a`,{href:`/`,class:h([`block shrink-0 py-1`,q.value.logo]),"aria-label":`Kaiser Natron home`},[u(v,{class:h(X.value)},null,8,[`class`])],2),p(`nav`,T,[(n(!0),m(f,null,i(C.items,t=>(n(),m(`a`,{key:t.key||t.label,href:t.href||`#`,class:h([$(t.href)?`text-accent`:q.value.link,`text-[14px] font-medium tracking-label transition-colors duration-base`]),onClick:n=>e.$emit(`nav`,t)},o(Z(t)),11,E))),128))])]),p(`div`,D,[C.secondaryItems.length?(n(),m(`nav`,O,[(n(!0),m(f,null,i(C.secondaryItems,t=>(n(),m(`a`,{key:t.key||t.label,href:t.href||`#`,class:h([$(t.href)?`text-accent`:q.value.link,`text-[14px] font-medium tracking-label transition-colors duration-base`]),onClick:n=>e.$emit(`nav`,t)},o(Z(t)),11,k))),128))])):l(``,!0),p(`button`,{type:`button`,class:h([`inline-flex items-center gap-2 pl-3 pr-4 h-10 rounded-pill text-[13px] font-medium tracking-label transition-colors duration-base`,q.value.searchTrigger]),"aria-label":r(U)(`search.open`),onClick:t[0]||=e=>G.value=!0},[u(y,{name:`search`,size:16}),p(`span`,null,o(r(U)(`search.placeholder`)),1)],10,A),u(S,{tone:C.variant},null,8,[`tone`]),u(b,{icon:`cart`,variant:`accent`,size:`md`,count:C.cartCount,"aria-label":r(U)(`cart.open`),onClick:t[1]||=t=>e.$emit(`cart`)},null,8,[`count`,`aria-label`])])],2),C.floatOnMobile?(n(),m(`div`,j,[u(b,{icon:`search`,variant:`float`,size:`lg`,"icon-stroke-width":2,"aria-label":r(U)(`search.open`),onClick:t[2]||=e=>G.value=!0},null,8,[`aria-label`])])):l(``,!0),C.floatOnMobile?(n(),m(`div`,M,[u(b,{icon:`cart`,variant:`accent`,size:`lg`,shadow:`md`,count:C.cartCount,"aria-label":r(U)(`cart.open`),onClick:t[3]||=t=>e.$emit(`cart`)},null,8,[`count`,`aria-label`]),u(b,{icon:`menu`,variant:`float`,size:`lg`,"icon-size":24,"icon-stroke-width":2,"aria-label":r(U)(`menu.open`),onClick:t[4]||=e=>W.value=!0},null,8,[`aria-label`])])):l(``,!0),(n(),a(s,{to:`body`},[u(g,{"enter-active-class":`transition duration-slow ease-out`,"enter-from-class":`opacity-0 translate-y-2`,"enter-to-class":`opacity-100 translate-y-0`,"leave-active-class":`transition duration-base ease-out`,"leave-from-class":`opacity-100 translate-y-0`,"leave-to-class":`opacity-0 translate-y-2`},{default:c(()=>[W.value?(n(),m(`div`,N,[p(`div`,P,[u(v,{class:`w-12 h-auto text-cream`})]),p(`nav`,F,[(n(!0),m(f,null,i(re.value,t=>(n(),m(`a`,{key:t.key||t.label,href:t.href||`#`,class:h([`font-serif font-normal text-[clamp(2.25rem,9vw,3.5rem)] tracking-tight leading-[1.05] transition-colors duration-base`,$(t.href)?`text-accent`:`text-cream hover:text-accent`]),onClick:n=>{W.value=!1,e.$emit(`nav`,t)}},o(Z(t)),11,I))),128))]),p(`div`,L,[u(S,{tone:`brand`})]),p(`div`,R,[p(`button`,{type:`button`,class:`flex-1 min-w-0 inline-flex items-center justify-between px-6 py-4 rounded-pill bg-accent text-brand font-semibold tracking-label hover:bg-accent-soft transition-colors shadow-md`,onClick:t[5]||=t=>{W.value=!1,e.$emit(`cart`)}},[p(`span`,z,[u(y,{name:`cart`,size:20}),ee(` `+o(r(U)(`cart.label`)),1)]),C.cartCount>0?(n(),m(`span`,B,o(C.cartCount),1)):l(``,!0)]),p(`div`,V,[u(b,{icon:`close`,variant:`float`,size:`lg`,"icon-size":24,"icon-stroke-width":2,"aria-label":r(U)(`menu.close`),onClick:t[6]||=e=>W.value=!1},null,8,[`aria-label`])])])])):l(``,!0)]),_:1})])),u(ne,{modelValue:G.value,"onUpdate:modelValue":t[7]||=e=>G.value=e,products:C.products,tone:C.variant,onSelect:t[8]||=t=>e.$emit(`search`,t)},null,8,[`modelValue`,`products`,`tone`])],2))}};export{H as t}; |