Fix: Design-System-Regression v1102 — .hidden(!important) vs style.display app-weit

Rene: 'Tagebuch Kalenderansicht/Karte nicht mehr da' — Root-Cause: 459cd42
ersetzte style="display:none" durch class="hidden", aber die Show-Pfade
setzten weiter style.display. .hidden hat !important und gewinnt immer
(gleiche Klasse wie Filter-Panel-Hotfix v1242). Prod-Logs bewiesen: kein
einziger /diary/calendar- oder /locations-Request kam je an.

Unsichtbar seit v1102, jetzt per classList gefixt:
- diary: Stats-Bar mit View-Switcher (Liste/Medien/Kalender/Karte) + Medien-Grid neuer Eintrag
- health: KI-Tierarzt-Ergebnis erschien nie
- walks: Challenge-/Stamm-Gassi-Tabs leer
- welcome: iOS-Panel der Desktop-Install-Anleitung
- wiki: Fotos-Mod-Badge + Foto-Fallback (via app.js data-fb show-el/sibling-Handler)
- routes: Filter-Badge; breeder: Fotos-Section

Zweite Fehlerklasse aus demselben Sprint: doppelte class-Attribute
(class="x" id=… class="hidden") — Browser verwirft das zweite Attribut.
87 Vorkommen in 23 Dateien zusammengeführt; betroffene Show/Hide-Pfade
(ev-map, rk-mine/nearby-group, chat-partner-dot, eh-panel, zh-section)
auf classList umgestellt.
This commit is contained in:
rene 2026-06-07 15:09:43 +02:00
parent 5acbaaa97b
commit 178aef7fb0
32 changed files with 197 additions and 188 deletions

View file

@ -745,7 +745,7 @@ window.Page_admin = (() => {
<div class="card p-4">
<p style="font-size:var(--text-sm);color:var(--c-text-secondary);margin:0;line-height:1.6">
<svg class="ph-icon" aria-hidden="true" class="text-primary">
<svg class="ph-icon text-primary" aria-hidden="true">
<use href="/icons/phosphor.svg#info"></use>
</svg>
Ersten Admin per SQL setzen:
@ -875,12 +875,12 @@ window.Page_admin = (() => {
<!-- Aktionen -->
<div style="display:flex;gap:var(--space-1);flex-shrink:0">
${u.is_banned
? `<button class="btn btn-sm btn-ghost adm-unban" data-uid="${u.id}" data-name="${UI.escape(u.name)}"
title="Sperre aufheben" class="text-success">
? `<button class="btn btn-sm btn-ghost adm-unban text-success" data-uid="${u.id}" data-name="${UI.escape(u.name)}"
title="Sperre aufheben">
<svg class="ph-icon"><use href="/icons/phosphor.svg#lock-open"></use></svg>
</button>`
: `<button class="btn btn-sm btn-ghost adm-ban" data-uid="${u.id}" data-name="${UI.escape(u.name)}"
title="Sperren" class="text-danger">
: `<button class="btn btn-sm btn-ghost adm-ban text-danger" data-uid="${u.id}" data-name="${UI.escape(u.name)}"
title="Sperren">
<svg class="ph-icon"><use href="/icons/phosphor.svg#lock"></use></svg>
</button>`
}
@ -895,9 +895,9 @@ window.Page_admin = (() => {
title="Abo-Stufe ändern">
<svg class="ph-icon"><use href="/icons/phosphor.svg#star"></use></svg>
</button>
<button class="btn btn-sm btn-ghost adm-delete" data-uid="${u.id}"
<button class="btn btn-sm btn-ghost adm-delete text-danger" data-uid="${u.id}"
data-name="${UI.escape(u.name)}" title="Löschen"
class="text-danger">
>
<svg class="ph-icon"><use href="/icons/phosphor.svg#trash"></use></svg>
</button>
` : ''}
@ -1108,9 +1108,9 @@ window.Page_admin = (() => {
<svg class="ph-icon"><use href="/icons/phosphor.svg#${r.resolved ? 'arrow-square-out' : 'check'}"></use></svg>
</button>
${!r.resolved ? `
<button class="btn btn-sm btn-ghost adm-del-content"
<button class="btn btn-sm btn-ghost adm-del-content text-danger"
data-type="${r.target_type}" data-id="${r.target_id}"
title="Inhalt löschen" class="text-danger">
title="Inhalt löschen">
<svg class="ph-icon"><use href="/icons/phosphor.svg#trash"></use></svg>
</button>` : ''}
</div>
@ -1193,13 +1193,13 @@ window.Page_admin = (() => {
data-locked="${t.is_locked}" title="${t.is_locked ? 'Entsperren' : 'Sperren'}">
<svg class="ph-icon"><use href="/icons/phosphor.svg#${t.is_locked ? 'lock-open' : 'lock'}"></use></svg>
</button>
<button class="btn btn-sm btn-ghost adm-del-thread" data-tid="${t.id}"
title="Löschen" class="text-danger">
<button class="btn btn-sm btn-ghost adm-del-thread text-danger" data-tid="${t.id}"
title="Löschen">
<svg class="ph-icon"><use href="/icons/phosphor.svg#trash"></use></svg>
</button>
` : `
<button class="btn btn-sm btn-ghost adm-restore-thread" data-tid="${t.id}"
title="Wiederherstellen" class="text-success">
<button class="btn btn-sm btn-ghost adm-restore-thread text-success" data-tid="${t.id}"
title="Wiederherstellen">
<svg class="ph-icon"><use href="/icons/phosphor.svg#arrow-square-out"></use></svg>
</button>
`}
@ -1712,7 +1712,7 @@ window.Page_admin = (() => {
<td class="adm-td">${z.website ? `<a href="${UI.escape(z.website)}" target="_blank" style="color:var(--c-primary);font-size:var(--text-xs)">Link</a>` : '—'}</td>
<td class="adm-td" style="text-align:right;white-space:nowrap">
<button class="btn btn-sm btn-primary adm-zuchter-approve" data-id="${z.id}" style="margin-right:4px"><svg class="ph-icon" style="width:14px;height:14px" aria-hidden="true"><use href="/icons/phosphor.svg#check"></use></svg> Freigeben</button>
<button class="btn btn-sm btn-ghost adm-zuchter-delete" data-id="${z.id}" class="text-danger"><svg class="ph-icon" style="width:14px;height:14px" aria-hidden="true"><use href="/icons/phosphor.svg#x"></use></svg></button>
<button class="btn btn-sm btn-ghost adm-zuchter-delete text-danger" data-id="${z.id}"><svg class="ph-icon" style="width:14px;height:14px" aria-hidden="true"><use href="/icons/phosphor.svg#x"></use></svg></button>
</td>
</tr>`).join('')}
</tbody></table></div></div>`;
@ -1747,8 +1747,8 @@ window.Page_admin = (() => {
opacity:.5;margin-bottom:var(--space-2)">
<div style="font-size:var(--text-xs);color:var(--c-text-muted);margin-bottom:var(--space-3)"> aktuelles Foto</div>` : ''}
<div class="flex-gap-2">
<button class="btn btn-sm btn-primary adm-foto-approve" data-id="${f.id}" class="flex-1"></button>
<button class="btn btn-sm btn-ghost adm-foto-reject" data-id="${f.id}" class="text-danger"></button>
<button class="btn btn-sm btn-primary adm-foto-approve flex-1" data-id="${f.id}"></button>
<button class="btn btn-sm btn-ghost adm-foto-reject text-danger" data-id="${f.id}"></button>
</div>
</div>`).join('')}
</div>`;
@ -1841,7 +1841,7 @@ window.Page_admin = (() => {
<button class="btn btn-sm btn-primary adm-poi-approve" data-id="${e.id}" style="margin-right:4px">
${UI.icon('check')}
</button>
<button class="btn btn-sm btn-ghost adm-poi-reject" data-id="${e.id}" class="text-danger">
<button class="btn btn-sm btn-ghost adm-poi-reject text-danger" data-id="${e.id}">
${UI.icon('x')}
</button>
</td>
@ -2024,9 +2024,9 @@ window.Page_admin = (() => {
data-uid="${a.user_id || a.id}" data-name="${UI.escape(a.name)}">
${UI.icon('check')} Freischalten
</button>
<button class="btn btn-sm btn-ghost adm-breeder-reject"
<button class="btn btn-sm btn-ghost adm-breeder-reject text-danger"
data-uid="${a.user_id || a.id}" data-name="${UI.escape(a.name)}"
class="text-danger">
>
${UI.icon('x')} Ablehnen
</button>
</div>
@ -2170,9 +2170,9 @@ window.Page_admin = (() => {
${b.verified_at ? new Date(b.verified_at).toLocaleDateString('de-DE') : '—'}
</td>
<td style="padding:var(--space-2) var(--space-3)">
<button class="btn btn-sm btn-ghost adm-breeder-tier-btn"
<button class="btn btn-sm btn-ghost adm-breeder-tier-btn text-xs"
data-uid="${b.id}" data-name="${UI.escape(b.name)}" data-tier="${UI.escape(b.subscription_tier || 'standard')}"
class="text-xs">
>
Abo
</button>
</td>
@ -2251,8 +2251,8 @@ window.Page_admin = (() => {
${UI.escape(j.trigger)}
</td>
<td class="adm-td text-right">
<button class="btn btn-sm btn-ghost adm-job-trigger adm-icon-btn" data-id="${UI.escape(j.id)}" data-name="${UI.escape(j.name)}"
title="Jetzt ausführen" class="text-primary">
<button class="btn btn-sm btn-ghost adm-job-trigger adm-icon-btn text-primary" data-id="${UI.escape(j.id)}" data-name="${UI.escape(j.name)}"
title="Jetzt ausführen">
${UI.icon('play')}
</button>
</td>
@ -3203,10 +3203,10 @@ window.Page_admin = (() => {
border:1.5px solid var(--c-border);border-radius:var(--radius-md);
background:var(--c-surface);color:var(--c-text);font-size:var(--text-sm)">
<div class="flex-1"></div>
<button class="btn btn-secondary btn-sm adm-hilfe-edit-cancel" data-id="${a.id}"
class="text-xs">Abbrechen</button>
<button class="btn btn-primary btn-sm adm-hilfe-edit-save" data-id="${a.id}"
class="text-xs">Speichern</button>
<button class="btn btn-secondary btn-sm adm-hilfe-edit-cancel text-xs" data-id="${a.id}"
>Abbrechen</button>
<button class="btn btn-primary btn-sm adm-hilfe-edit-save text-xs" data-id="${a.id}"
>Speichern</button>
</div>
</div>
</div>
@ -3839,8 +3839,8 @@ window.Page_admin = (() => {
</button>`);
}
if (inv.status === 'sent') {
actions.push(`<button class="btn btn-sm btn-ghost adm-inv-send" data-id="${inv.id}" data-num="${UI.escape(inv.invoice_number)}" title="Erneut senden"
class="text-muted">
actions.push(`<button class="btn btn-sm btn-ghost adm-inv-send text-muted" data-id="${inv.id}" data-num="${UI.escape(inv.invoice_number)}" title="Erneut senden"
>
${UI.icon('paper-plane-tilt')} Erneut senden
</button>`);
}
@ -3848,8 +3848,8 @@ window.Page_admin = (() => {
actions.push(`<button class="btn btn-sm btn-secondary adm-inv-pay" data-id="${inv.id}" data-amount="${inv.amount_gross}" title="Als bezahlt markieren">
${UI.icon('check-circle')} Bezahlt
</button>`);
actions.push(`<button class="btn btn-sm btn-ghost adm-inv-cancel" data-id="${inv.id}" data-num="${UI.escape(inv.invoice_number)}"
class="text-danger" title="Stornieren">
actions.push(`<button class="btn btn-sm btn-ghost adm-inv-cancel text-danger" data-id="${inv.id}" data-num="${UI.escape(inv.invoice_number)}"
title="Stornieren">
${UI.icon('x-circle')} Storno
</button>`);
}
@ -4067,7 +4067,7 @@ window.Page_admin = (() => {
footer: `
<div style="display:flex;flex-direction:column;gap:var(--space-2);width:100%">
${isLocked
? `<button class="btn btn-secondary" data-modal-close class="w-full">Schließen</button>`
? `<button class="btn btn-secondary w-full" data-modal-close>Schließen</button>`
: `<div style="display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2)">
<button class="btn btn-secondary" data-modal-close>Abbrechen</button>
<button class="btn btn-primary" form="${id}" type="submit" style="min-width:0">
@ -4112,8 +4112,8 @@ window.Page_admin = (() => {
itemEl.className = 'adm-inv-item-row';
itemEl.style.cssText = 'display:grid;grid-template-columns:1fr 60px 100px auto;gap:var(--space-2);align-items:center';
itemEl.innerHTML = `
<input class="form-control inv-item-desc" type="text" placeholder="Beschreibung *"
value="${UI.escape(desc)}" class="text-sm">
<input class="form-control inv-item-desc text-sm" type="text" placeholder="Beschreibung *"
value="${UI.escape(desc)}">
<input class="form-control inv-item-qty" type="number" min="1" value="${qty}"
style="font-size:var(--text-sm);text-align:right" title="Menge">
<input class="form-control inv-item-price" type="number" min="0" step="0.01" value="${price.toFixed(2)}"