From 178aef7fb00593624b7e054fe7781c279601be5f Mon Sep 17 00:00:00 2001 From: rene Date: Sun, 7 Jun 2026 15:09:43 +0200 Subject: [PATCH] =?UTF-8?q?Fix:=20Design-System-Regression=20v1102=20?= =?UTF-8?q?=E2=80=94=20.hidden(!important)=20vs=20style.display=20app-weit?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 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. --- VERSION | 2 +- backend/static/index.html | 24 ++++---- backend/static/js/app.js | 9 ++- backend/static/js/pages/admin.js | 68 +++++++++++------------ backend/static/js/pages/breeder-editor.js | 4 +- backend/static/js/pages/breeder.js | 1 + backend/static/js/pages/chat.js | 6 +- backend/static/js/pages/diary.js | 10 ++-- backend/static/js/pages/dog-profile.js | 32 +++++------ backend/static/js/pages/ernaehrung.js | 4 +- backend/static/js/pages/erste-hilfe.js | 8 +-- backend/static/js/pages/events.js | 12 ++-- backend/static/js/pages/forum.js | 8 +-- backend/static/js/pages/friends.js | 4 +- backend/static/js/pages/health.js | 11 ++-- backend/static/js/pages/jobs.js | 4 +- backend/static/js/pages/knigge.js | 6 +- backend/static/js/pages/laeufi.js | 10 ++-- backend/static/js/pages/litters.js | 20 +++---- backend/static/js/pages/moderation.js | 16 +++--- backend/static/js/pages/onboarding.js | 14 ++--- backend/static/js/pages/playdate.js | 2 +- backend/static/js/pages/poison.js | 10 ++-- backend/static/js/pages/routes.js | 22 ++++---- backend/static/js/pages/settings.js | 12 ++-- backend/static/js/pages/sitting.js | 2 +- backend/static/js/pages/walks.js | 7 ++- backend/static/js/pages/welcome.js | 10 ++-- backend/static/js/pages/wiki.js | 21 +++---- backend/static/js/pages/zuchthunde.js | 22 ++++---- backend/static/landing.html | 2 +- backend/static/sw.js | 2 +- 32 files changed, 197 insertions(+), 188 deletions(-) diff --git a/VERSION b/VERSION index f0acbc2..03ce6df 100644 --- a/VERSION +++ b/VERSION @@ -1 +1 @@ -1251 \ No newline at end of file +1252 \ No newline at end of file diff --git a/backend/static/index.html b/backend/static/index.html index 564c1cf..5a330e3 100644 --- a/backend/static/index.html +++ b/backend/static/index.html @@ -86,14 +86,14 @@ Ban Yaro - + - - - - - + + + + + @@ -612,11 +612,11 @@ - - - - - + + + + + @@ -626,7 +626,7 @@ - + diff --git a/backend/static/js/app.js b/backend/static/js/app.js index a0ce07b..9a5e14c 100644 --- a/backend/static/js/app.js +++ b/backend/static/js/app.js @@ -3,7 +3,7 @@ Router, State-Management, Navigation, Initialisierung. ============================================================ */ -const APP_VER = '1251'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen +const APP_VER = '1252'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen const APP_VERSION = '1.6.0'; // ← semantische Version, wird bei make release gesetzt window.APP_VER = APP_VER; // global verfügbar für andere Module (z.B. offline-indicator) window.APP_VERSION = APP_VERSION; @@ -469,12 +469,15 @@ const App = (() => { break; case 'sibling': el.style.display = 'none'; - if (el.nextElementSibling) el.nextElementSibling.style.display = 'flex'; + if (el.nextElementSibling) { + el.nextElementSibling.classList.remove('hidden'); // .hidden hat !important + el.nextElementSibling.style.display = 'flex'; + } break; case 'show-el': { el.style.display = 'none'; const t = el.dataset.fbEl && document.getElementById(el.dataset.fbEl); - if (t) t.style.display = 'flex'; + if (t) { t.classList.remove('hidden'); t.style.display = 'flex'; } // .hidden hat !important break; } case 'emoji': diff --git a/backend/static/js/pages/admin.js b/backend/static/js/pages/admin.js index 7ca761d..294b532 100644 --- a/backend/static/js/pages/admin.js +++ b/backend/static/js/pages/admin.js @@ -745,7 +745,7 @@ window.Page_admin = (() => {

-

${u.is_banned - ? `` - : `` } @@ -895,9 +895,9 @@ window.Page_admin = (() => { title="Abo-Stufe ändern"> - ` : ''} @@ -1108,9 +1108,9 @@ window.Page_admin = (() => { ${!r.resolved ? ` - ` : ''}
@@ -1193,13 +1193,13 @@ window.Page_admin = (() => { data-locked="${t.is_locked}" title="${t.is_locked ? 'Entsperren' : 'Sperren'}"> - ` : ` - `} @@ -1712,7 +1712,7 @@ window.Page_admin = (() => { ${z.website ? `Link` : '—'} - + `).join('')}
`; @@ -1747,8 +1747,8 @@ window.Page_admin = (() => { opacity:.5;margin-bottom:var(--space-2)">
↑ aktuelles Foto
` : ''}
- - + +
`).join('')} `; @@ -1841,7 +1841,7 @@ window.Page_admin = (() => { - @@ -2024,9 +2024,9 @@ window.Page_admin = (() => { data-uid="${a.user_id || a.id}" data-name="${UI.escape(a.name)}"> ${UI.icon('check')} Freischalten - @@ -2170,9 +2170,9 @@ window.Page_admin = (() => { ${b.verified_at ? new Date(b.verified_at).toLocaleDateString('de-DE') : '—'} - @@ -2251,8 +2251,8 @@ window.Page_admin = (() => { ${UI.escape(j.trigger)} - @@ -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)">
- - + + @@ -3839,8 +3839,8 @@ window.Page_admin = (() => { `); } if (inv.status === 'sent') { - actions.push(``); } @@ -3848,8 +3848,8 @@ window.Page_admin = (() => { actions.push(``); - actions.push(``); } @@ -4067,7 +4067,7 @@ window.Page_admin = (() => { footer: `
${isLocked - ? `` + ? `` : `
`; diff --git a/backend/static/js/pages/breeder.js b/backend/static/js/pages/breeder.js index fa6fd53..917bcaa 100644 --- a/backend/static/js/pages/breeder.js +++ b/backend/static/js/pages/breeder.js @@ -390,6 +390,7 @@ window.Page_breeder = (() => { `).join('')} `; + section.classList.remove('hidden'); // Template startet mit .hidden (!important) } catch (_) {} } diff --git a/backend/static/js/pages/chat.js b/backend/static/js/pages/chat.js index 10b64f5..3489a40 100644 --- a/backend/static/js/pages/chat.js +++ b/backend/static/js/pages/chat.js @@ -195,7 +195,7 @@ window.Page_chat = (() => { `}
?
- +
… @@ -265,7 +265,7 @@ window.Page_chat = (() => { const dotEl = document.getElementById('chat-partner-dot'); if (nameEl) nameEl.textContent = data.partner_name; if (avEl) avEl.textContent = (data.partner_name || '?')[0].toUpperCase(); - if (dotEl) dotEl.style.display = data.partner_online ? '' : 'none'; + if (dotEl) dotEl.classList.toggle('hidden', !data.partner_online); if (!data.messages.length) { el.innerHTML = ` @@ -304,7 +304,7 @@ window.Page_chat = (() => { // Online-Dot aktualisieren const dotEl = document.getElementById('chat-partner-dot'); - if (dotEl) dotEl.style.display = data.partner_online ? '' : 'none'; + if (dotEl) dotEl.classList.toggle('hidden', !data.partner_online); await API.chat.markRead(_convId).catch(() => {}); await _updateChatBadge(); diff --git a/backend/static/js/pages/diary.js b/backend/static/js/pages/diary.js index d06cc5e..f6d07e7 100644 --- a/backend/static/js/pages/diary.js +++ b/backend/static/js/pages/diary.js @@ -391,7 +391,7 @@ window.Page_diary = (() => { const bar = _container.querySelector('#diary-stats-bar'); if (!bar) return; const s = _totalStats; - if (!s && _entries.length === 0) { bar.style.display = 'none'; return; } + if (!s && _entries.length === 0) { bar.classList.add('hidden'); return; } const entries = s?.entries ?? _entries.length; const photos = s?.photos ?? _entries.reduce((n, e) => n + _allMedia(e).length, 0); const days = s?.days ?? new Set(_entries.map(e => e.datum).filter(Boolean)).size; @@ -425,7 +425,8 @@ window.Page_diary = (() => { `; - bar.style.display = 'flex'; + // .hidden hat !important → nur per classList togglen (style.display verliert immer) + bar.classList.remove('hidden'); bar.querySelectorAll('.diary-view-btn').forEach(btn => { btn.addEventListener('click', () => { @@ -1332,8 +1333,9 @@ window.Page_diary = (() => { function _renderNewGrid() { const grid = document.getElementById('diary-new-media-grid'); if (!grid) return; - if (_newFiles.length === 0) { grid.style.display = 'none'; grid.innerHTML = ''; return; } - grid.style.cssText = 'display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:8px;margin-bottom:8px'; + if (_newFiles.length === 0) { grid.classList.add('hidden'); grid.innerHTML = ''; return; } + // .hidden hat !important → classList togglen; Grid-Layout kommt aus .diary-media-grid + grid.classList.remove('hidden'); grid.innerHTML = _newFiles.map((f, i) => { const objUrl = URL.createObjectURL(f); const thumb = f.type === 'application/pdf' || f.name?.endsWith('.pdf') diff --git a/backend/static/js/pages/dog-profile.js b/backend/static/js/pages/dog-profile.js index 61d23a7..3db85a7 100644 --- a/backend/static/js/pages/dog-profile.js +++ b/backend/static/js/pages/dog-profile.js @@ -559,8 +559,8 @@ window.Page_dog_profile = (() => { value="${defaultUntil}" min="${today}"> - @@ -615,7 +615,7 @@ window.Page_dog_profile = (() => { `, footer: `
- +
`, }); @@ -672,7 +672,7 @@ window.Page_dog_profile = (() => { const footer = `
- ${hasPhoto ? `` : ''} + ${hasPhoto ? `` : ''}
${hasPhoto ? `` : ''} @@ -945,8 +945,8 @@ window.Page_dog_profile = (() => { `).join('')} @@ -322,14 +322,14 @@ window.Page_moderation = (() => {
${canAction ? (u.is_banned - ? `` - : ``) : '' diff --git a/backend/static/js/pages/onboarding.js b/backend/static/js/pages/onboarding.js index 5ba7638..fd065f6 100644 --- a/backend/static/js/pages/onboarding.js +++ b/backend/static/js/pages/onboarding.js @@ -163,11 +163,11 @@ window.Page_onboarding = (() => {
- -
@@ -255,14 +255,14 @@ window.Page_onboarding = (() => { -
-
@@ -317,12 +317,12 @@ window.Page_onboarding = (() => {
- ${dogName ? ` - diff --git a/backend/static/js/pages/playdate.js b/backend/static/js/pages/playdate.js index 1987eb1..fb21660 100644 --- a/backend/static/js/pages/playdate.js +++ b/backend/static/js/pages/playdate.js @@ -81,7 +81,7 @@ function _fmtDate(iso) {
-
+
@@ -215,7 +215,7 @@ window.Page_poison = (() => { ${r.beschreibung ? UI.escape(r.beschreibung.slice(0, 80)) + '
' : ''} 📍 ${distStr} entfernt
📅 ${_fmtDate(r.created_at)} - ${r.bestaetigt ? '
Bestätigt' : ''} + ${r.bestaetigt ? '
Bestätigt' : ''} `); marker.on('click', () => _openDetail(r)); @@ -276,7 +276,7 @@ window.Page_poison = (() => { ${typ.label} ${r.bestaetigt - ? ' Bestätigt' + ? ' Bestätigt' : ''} @@ -330,7 +330,7 @@ window.Page_poison = (() => { ${UI.icon(typ.icon)} ${typ.label} - ${r.bestaetigt ? ' Bestätigt' : ''} + ${r.bestaetigt ? ' Bestätigt' : ''}
${r.beschreibung @@ -347,7 +347,7 @@ window.Page_poison = (() => {
${!r.bestaetigt && _appState.user && !isOwnEntry - ? `` + ? `` : ''} ${isOwnEntry || isAdmin diff --git a/backend/static/js/pages/routes.js b/backend/static/js/pages/routes.js index 665d368..ac1d151 100644 --- a/backend/static/js/pages/routes.js +++ b/backend/static/js/pages/routes.js @@ -352,13 +352,13 @@ window.Page_routes = (() => {
-
+ -
+ -
+
Aktivität
Lädt…
@@ -1721,15 +1721,15 @@ window.Page_settings = (() => { ${profile?.rasse_text ? `
Rasse: ${UI.escape(profile.rasse_text)}
` : ''}
${rolle === 'breeder' && profile ? ` - ` : ''} ${rolle === 'admin' && !profile ? ` - ` : ''} ${rolle === 'admin' && profile ? ` - ` : ''} ${profile ? ` @@ -1991,8 +1991,8 @@ window.Page_settings = (() => { `, footer: `
- +
`, diff --git a/backend/static/js/pages/sitting.js b/backend/static/js/pages/sitting.js index 647cb3c..9942064 100644 --- a/backend/static/js/pages/sitting.js +++ b/backend/static/js/pages/sitting.js @@ -406,7 +406,7 @@ window.Page_sitting = (() => { `; const footer = `
- diff --git a/backend/static/js/pages/walks.js b/backend/static/js/pages/walks.js index 172fc50..c0885c8 100644 --- a/backend/static/js/pages/walks.js +++ b/backend/static/js/pages/walks.js @@ -202,9 +202,10 @@ window.Page_walks = (() => { _tab = tab; document.querySelectorAll('.by-tab').forEach(b => b.classList.toggle('active', b.dataset.tab === tab)); - document.querySelectorAll('.walks-tab-panel').forEach(p => p.style.display = 'none'); + // .hidden hat !important → nur per classList togglen (style.display verliert immer) + document.querySelectorAll('.walks-tab-panel').forEach(p => p.classList.add('hidden')); const panel = document.getElementById(`walks-tab-${tab}`); - if (panel) panel.style.display = ''; + if (panel) panel.classList.remove('hidden'); if (tab === 'challenge' && !_challengeData) _loadChallenge(); if (tab === 'stamm' && !_gassiZeiten.length) _loadGassiZeiten(); @@ -1058,7 +1059,7 @@ window.Page_walks = (() => { ${UI.icon('calendar')} ${_fmtDate(challenge.start_date)} – ${_fmtDate(challenge.end_date)}  ·  ${UI.icon('timer')} Noch ${dayLabel}
- ${canSubmit ? `` : ''} + ${canSubmit ? `` : ''} ${my_submission_id ? `${UI.icon('check')} Du hast bereits teilgenommen` : ''}
diff --git a/backend/static/js/pages/welcome.js b/backend/static/js/pages/welcome.js index fdcfa17..7df2d54 100644 --- a/backend/static/js/pages/welcome.js +++ b/backend/static/js/pages/welcome.js @@ -1098,7 +1098,7 @@ window.Page_welcome = (() => { style="flex:1;background:var(--c-primary);color:#fff;border:none"> Android -
@@ -1174,15 +1174,15 @@ window.Page_welcome = (() => { // Desktop-Tabs Android / iOS _container.querySelector('#inst-tab-android')?.addEventListener('click', () => { - _container.querySelector('#inst-panel-android').style.display = ''; - _container.querySelector('#inst-panel-ios').style.display = 'none'; + _container.querySelector('#inst-panel-android').classList.remove('hidden'); + _container.querySelector('#inst-panel-ios').classList.add('hidden'); _container.querySelector('#inst-tab-android').style.cssText += ';background:var(--c-primary);color:#fff;border:none'; _container.querySelector('#inst-tab-ios').className = 'btn btn-sm btn-ghost'; _container.querySelector('#inst-tab-ios').style.cssText = 'flex:1'; }); _container.querySelector('#inst-tab-ios')?.addEventListener('click', () => { - _container.querySelector('#inst-panel-android').style.display = 'none'; - _container.querySelector('#inst-panel-ios').style.display = ''; + _container.querySelector('#inst-panel-android').classList.add('hidden'); + _container.querySelector('#inst-panel-ios').classList.remove('hidden'); _container.querySelector('#inst-tab-ios').style.cssText += ';background:var(--c-primary);color:#fff;border:none'; _container.querySelector('#inst-tab-android').className = 'btn btn-sm btn-ghost'; _container.querySelector('#inst-tab-android').style.cssText = 'flex:1'; diff --git a/backend/static/js/pages/wiki.js b/backend/static/js/pages/wiki.js index 3dd80c4..3800921 100644 --- a/backend/static/js/pages/wiki.js +++ b/backend/static/js/pages/wiki.js @@ -156,7 +156,7 @@ window.Page_wiki = (() => { // Badge updaten const badge = document.getElementById('wiki-fotos-badge'); - if (badge) { badge.textContent = subs.length; badge.style.display = subs.length ? '' : 'none'; } + if (badge) { badge.textContent = subs.length; badge.classList.toggle('hidden', !subs.length); } if (!subs.length) { el.innerHTML = ` @@ -216,7 +216,7 @@ window.Page_wiki = (() => { const badge = document.getElementById('wiki-fotos-badge'); if (badge) { const n = Math.max(0, parseInt(badge.textContent || '0') - 1); - badge.textContent = n; badge.style.display = n ? '' : 'none'; + badge.textContent = n; badge.classList.toggle('hidden', !n); } } catch (e) { UI.toast(e.message, 'danger'); } } @@ -269,8 +269,8 @@ window.Page_wiki = (() => {
- @@ -669,7 +669,7 @@ window.Page_wiki = (() => {
- ` : ''; @@ -835,14 +835,14 @@ window.Page_wiki = (() => { ${berichteHtml}
${_appState.user - ? `` + ? `` : `

Anmelden, um einen Bericht zu schreiben.

` } ${_appState.user ? `
-
` : ''}`} @@ -878,7 +878,8 @@ window.Page_wiki = (() => { const idx = parseInt(btn.dataset.idx); mainImg.src = allFotos[idx].foto_url; mainImg.style.display = ''; - document.getElementById('wiki-photo-fallback').style.display = 'none'; + const fb = document.getElementById('wiki-photo-fallback'); + fb.classList.add('hidden'); fb.style.display = ''; strip.querySelectorAll('.wiki-gallery-thumb').forEach(b => b.classList.toggle('active', b === btn)); }); }); @@ -1255,7 +1256,7 @@ window.Page_wiki = (() => { ${UI.icon('house-line')} ${r.wohnung_geeignet ? 'Wohnung' : 'Haus'} ${UI.icon('users')} ${r.kinder_geeignet ? 'Kinderfreundlich' : 'Erfahrung nötig'}
- + `; @@ -1268,7 +1269,7 @@ window.Page_wiki = (() => {

Deine Top 3 Rassen

${cardsHtml}
- + `; diff --git a/backend/static/js/pages/zuchthunde.js b/backend/static/js/pages/zuchthunde.js index 16b2b1c..682abba 100644 --- a/backend/static/js/pages/zuchthunde.js +++ b/backend/static/js/pages/zuchthunde.js @@ -341,8 +341,8 @@ window.Page_zuchthunde = (() => { title="Bearbeiten"> ${UI.icon('pencil-simple')} - @@ -360,7 +360,7 @@ window.Page_zuchthunde = (() => { -
+ `; } @@ -379,7 +379,7 @@ window.Page_zuchthunde = (() => { function _closeSection(hundId) { const wrap = document.getElementById(`zh-section-${hundId}`); - if (wrap) wrap.style.display = 'none'; + if (wrap) wrap.classList.add('hidden'); // .hidden hat !important → nur classList _openSections[hundId] = null; _updateSectionButtons(hundId, null); } @@ -389,7 +389,7 @@ window.Page_zuchthunde = (() => { _updateSectionButtons(hundId, section); const wrap = document.getElementById(`zh-section-${hundId}`); if (!wrap) return; - wrap.style.display = ''; + wrap.classList.remove('hidden'); wrap.innerHTML = `

Lädt…

`; if (section === 'health') _loadHealthSection(hundId, wrap); if (section === 'genetic') _loadGeneticSection(hundId, wrap); @@ -427,8 +427,8 @@ window.Page_zuchthunde = (() => { ${t.untersuch_am ? `${_fmtDate(t.untersuch_am)}` : ''} ${t.labor ? `${UI.escape(t.labor)}` : ''} - + `).join('') : `

Noch keine Gesundheitstests eingetragen.

`; @@ -490,8 +490,8 @@ window.Page_zuchthunde = (() => { ${t.getestet_am ? `${_fmtDate(t.getestet_am)}` : ''} ${t.labor ? `${UI.escape(t.labor)}` : ''} - + `).join('') : `

Noch keine Gentests eingetragen.

`; @@ -555,8 +555,8 @@ window.Page_zuchthunde = (() => { ${t.richter ? `${UI.escape(t.richter)}` : ''} ${t.formwert ? `${UI.escape(t.formwert)}` : ''} - + `).join('') : `

Noch keine Titel eingetragen.

`; diff --git a/backend/static/landing.html b/backend/static/landing.html index 0d90995..f513edc 100644 --- a/backend/static/landing.html +++ b/backend/static/landing.html @@ -4,7 +4,7 @@ - + Ban Yaro — Die Hunde-App für Deutschland, Österreich & Schweiz diff --git a/backend/static/sw.js b/backend/static/sw.js index efc6f8a..d3a5f27 100644 --- a/backend/static/sw.js +++ b/backend/static/sw.js @@ -4,7 +4,7 @@ ============================================================ */ // ← EINZIGE Stelle für die Version — STATIC_ASSETS und CACHE_VERSION leiten sich ab -const VER = '1251'; +const VER = '1252'; const CACHE_VERSION = `by-v${VER}`; const CACHE_STATIC = `${CACHE_VERSION}-static`; const CACHE_TILES = 'ban-yaro-tiles-v1'; // bleibt über SW-Updates erhalten