UX: Breeder-Profil Back-FAB unten rechts + destroy() Hook in navigate() (SW by-v898)

This commit is contained in:
rene 2026-05-13 18:19:16 +02:00
parent 822af64704
commit c15f1b10d0
5 changed files with 34 additions and 17 deletions

View file

@ -27,16 +27,23 @@ window.Page_breeder = (() => {
}
container.innerHTML = `
<div style="padding:var(--space-3) var(--space-4) 0">
<button class="btn btn-ghost btn-sm" id="breeder-back-btn">
${UI.icon('arrow-left')} Zurück zur Wurfbörse
</button>
</div>
<div id="breeder-profile-body" style="padding:0 var(--space-4) var(--space-6);text-align:center">
<div id="breeder-profile-body" style="padding:var(--space-4) var(--space-4) calc(var(--space-16) + 24px)">
${UI.skeleton(3)}
</div>`;
</div>
<button id="breeder-back-fab" aria-label="Zurück zur Wurfbörse"
style="position:fixed;bottom:calc(var(--safe-bottom,0px) + 20px);right:20px;
width:54px;height:54px;border-radius:50%;background:var(--c-primary);
border:none;color:#fff;cursor:pointer;z-index:200;
display:flex;align-items:center;justify-content:center;
box-shadow:0 4px 18px rgba(196,132,58,.45);
transition:transform .12s,box-shadow .12s;
-webkit-tap-highlight-color:transparent">
<svg style="width:22px;height:22px" viewBox="0 0 256 256">
<use href="/icons/phosphor.svg#arrow-left"></use>
</svg>
</button>`;
document.getElementById('breeder-back-btn')
document.getElementById('breeder-back-fab')
?.addEventListener('click', () => App.navigate('wurfboerse'));
try {
@ -219,7 +226,10 @@ window.Page_breeder = (() => {
function refresh() {}
function onDogChange() {}
function destroy() {
document.getElementById('breeder-back-fab')?.remove();
}
return { init, refresh, onDogChange };
return { init, refresh, onDogChange, destroy };
})();