rene/banyaro
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

UX: Privater-Header — Zwingername als H2-Überschrift, Logo 48px, alle 3 Züchterseiten (SW by-v911)

Browse source
This commit is contained in:
rene 2026-05-13 19:54:30 +02:00
parent ccf5a8b7ba
commit ca9d9a05c5
7 changed files with 36 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

8
backend/static/index.html
View file

@ -591,10 +591,10 @@
<div id="modal-container"></div>
<!-- JS: Reihenfolge ist wichtig — erst Basis, dann Features -->
<script src="/js/api.js?v=910"></script>
<script src="/js/ui.js?v=910"></script>
<script src="/js/app.js?v=910"></script>
<script src="/js/worlds.js?v=910"></script>
<script src="/js/api.js?v=911"></script>
<script src="/js/ui.js?v=911"></script>
<script src="/js/app.js?v=911"></script>
<script src="/js/worlds.js?v=911"></script>
<!-- Feature-Seiten werden lazy geladen -->

2
backend/static/js/app.js
View file

@ -3,7 +3,7 @@
Router, State-Management, Navigation, Initialisierung.
============================================================ */
const APP_VER = '910'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const APP_VER = '911'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const APP_VERSION = '1.5.1'; // ← semantische Version, wird bei make release gesetzt
const IS_STAGING = location.hostname === 'staging.banyaro.app';
// Cache-Bust-Parameter nach Update-Reload sofort entfernen

17
backend/static/js/pages/laeufi.js
View file

@ -33,17 +33,17 @@ window.Page_laeufi = (() => {
// Grundstruktur
// ----------------------------------------------------------
function _privateHeader() {
const zwinger = _breederInfo?.zwingername || '';
const zwinger = _breederInfo?.zwingername || 'Mein Zwinger';
const logoUrl = _breederInfo?.logo_url || null;
const logoHtml = logoUrl
? `<img src="${UI.esc(logoUrl)}" alt="Logo"
style="width:40px;height:40px;border-radius:50%;object-fit:cover;
style="width:48px;height:48px;border-radius:50%;object-fit:cover;
border:2px solid rgba(196,132,58,.5);flex-shrink:0"
onerror="this.style.display='none'">`
: `<div style="width:40px;height:40px;border-radius:50%;background:rgba(196,132,58,.15);
border:2px solid rgba(196,132,58,.3);display:flex;align-items:center;
: `<div style="width:48px;height:48px;border-radius:50%;background:rgba(196,132,58,.15);
border:2px solid rgba(196,132,58,.4);display:flex;align-items:center;
justify-content:center;flex-shrink:0">
<svg style="width:20px;height:20px;color:var(--c-primary)" viewBox="0 0 256 256">
<svg style="width:24px;height:24px;color:var(--c-primary)" viewBox="0 0 256 256">
<use href="/icons/phosphor.svg#paw-print"></use>
</svg>
</div>`;
@ -54,9 +54,10 @@ window.Page_laeufi = (() => {
display:flex;align-items:center;gap:var(--space-3)">
${logoHtml}
<div style="flex:1;min-width:0">
${zwinger ? `<div style="font-size:var(--text-sm);font-weight:700;color:rgba(255,255,255,.9);
white-space:nowrap;overflow:hidden;text-overflow:ellipsis">${UI.esc(zwinger)}</div>` : ''}
<div style="display:flex;align-items:center;gap:var(--space-2);margin-top:1px">
<h2 style="margin:0 0 2px;font-size:var(--text-lg);font-weight:700;
color:rgba(255,255,255,.95);white-space:nowrap;overflow:hidden;
text-overflow:ellipsis;line-height:1.2">${UI.esc(zwinger)}</h2>
<div style="display:flex;align-items:center;gap:var(--space-2)">
<svg style="width:11px;height:11px;color:var(--c-primary);flex-shrink:0" viewBox="0 0 256 256">
<use href="/icons/phosphor.svg#lock-key"></use>
</svg>

17
backend/static/js/pages/litters.js
View file

@ -98,17 +98,17 @@ window.Page_litters = (() => {
// Grundstruktur rendern
// ----------------------------------------------------------
function _privateHeader() {
const zwinger = _breederInfo?.zwingername || '';
const zwinger = _breederInfo?.zwingername || 'Mein Zwinger';
const logoUrl = _breederInfo?.logo_url || null;
const logoHtml = logoUrl
? `<img src="${_esc(logoUrl)}" alt="Logo"
style="width:40px;height:40px;border-radius:50%;object-fit:cover;
style="width:48px;height:48px;border-radius:50%;object-fit:cover;
border:2px solid rgba(196,132,58,.5);flex-shrink:0"
onerror="this.style.display='none'">`
: `<div style="width:40px;height:40px;border-radius:50%;background:rgba(196,132,58,.15);
border:2px solid rgba(196,132,58,.3);display:flex;align-items:center;
: `<div style="width:48px;height:48px;border-radius:50%;background:rgba(196,132,58,.15);
border:2px solid rgba(196,132,58,.4);display:flex;align-items:center;
justify-content:center;flex-shrink:0">
<svg style="width:20px;height:20px;color:var(--c-primary)" viewBox="0 0 256 256">
<svg style="width:24px;height:24px;color:var(--c-primary)" viewBox="0 0 256 256">
<use href="/icons/phosphor.svg#paw-print"></use>
</svg>
</div>`;
@ -119,9 +119,10 @@ window.Page_litters = (() => {
display:flex;align-items:center;gap:var(--space-3)">
${logoHtml}
<div style="flex:1;min-width:0">
${zwinger ? `<div style="font-size:var(--text-sm);font-weight:700;color:rgba(255,255,255,.9);
white-space:nowrap;overflow:hidden;text-overflow:ellipsis">${_esc(zwinger)}</div>` : ''}
<div style="display:flex;align-items:center;gap:var(--space-2);margin-top:1px">
<h2 style="margin:0 0 2px;font-size:var(--text-lg);font-weight:700;
color:rgba(255,255,255,.95);white-space:nowrap;overflow:hidden;
text-overflow:ellipsis;line-height:1.2">${_esc(zwinger)}</h2>
<div style="display:flex;align-items:center;gap:var(--space-2)">
<svg style="width:11px;height:11px;color:var(--c-primary);flex-shrink:0" viewBox="0 0 256 256">
<use href="/icons/phosphor.svg#lock-key"></use>
</svg>

21
backend/static/js/pages/zuchthunde.js
View file

@ -100,30 +100,31 @@ window.Page_zuchthunde = (() => {
// Grundstruktur
// ----------------------------------------------------------
function _privateHeader() {
const zwinger = _breederInfo?.zwingername || '';
const logoUrl = _breederInfo?.logo_url || null;
const zwinger = _breederInfo?.zwingername || 'Mein Zwinger';
const logoUrl = _breederInfo?.logo_url || null;
const logoHtml = logoUrl
? `<img src="${_esc(logoUrl)}" alt="Logo"
style="width:40px;height:40px;border-radius:50%;object-fit:cover;
style="width:48px;height:48px;border-radius:50%;object-fit:cover;
border:2px solid rgba(196,132,58,.5);flex-shrink:0"
onerror="this.style.display='none'">`
: `<div style="width:40px;height:40px;border-radius:50%;background:rgba(196,132,58,.15);
border:2px solid rgba(196,132,58,.3);display:flex;align-items:center;
: `<div style="width:48px;height:48px;border-radius:50%;background:rgba(196,132,58,.15);
border:2px solid rgba(196,132,58,.4);display:flex;align-items:center;
justify-content:center;flex-shrink:0">
<svg style="width:20px;height:20px;color:var(--c-primary)" viewBox="0 0 256 256">
<svg style="width:24px;height:24px;color:var(--c-primary)" viewBox="0 0 256 256">
<use href="/icons/phosphor.svg#paw-print"></use>
</svg>
</div>`;
return `
<div style="background:linear-gradient(135deg,#1a1208,#2d1f0e);
<div id="breeder-private-header" style="background:linear-gradient(135deg,#1a1208,#2d1f0e);
border-bottom:1px solid rgba(196,132,58,.25);
padding:var(--space-3) var(--space-4);
display:flex;align-items:center;gap:var(--space-3)">
${logoHtml}
<div style="flex:1;min-width:0">
${zwinger ? `<div style="font-size:var(--text-sm);font-weight:700;color:rgba(255,255,255,.9);
white-space:nowrap;overflow:hidden;text-overflow:ellipsis">${_esc(zwinger)}</div>` : ''}
<div style="display:flex;align-items:center;gap:var(--space-2);margin-top:1px">
<h2 style="margin:0 0 2px;font-size:var(--text-lg);font-weight:700;
color:rgba(255,255,255,.95);white-space:nowrap;overflow:hidden;
text-overflow:ellipsis;line-height:1.2">${_esc(zwinger)}</h2>
<div style="display:flex;align-items:center;gap:var(--space-2)">
<svg style="width:11px;height:11px;color:var(--c-primary);flex-shrink:0" viewBox="0 0 256 256">
<use href="/icons/phosphor.svg#lock-key"></use>
</svg>

2
backend/static/sw.js
View file

@ -3,7 +3,7 @@
Offline-Cache + Push Notifications + Tile-Cache
============================================================ */
const CACHE_VERSION = 'by-v910';
const CACHE_VERSION = 'by-v911';
const CACHE_STATIC = `${CACHE_VERSION}-static`;
const CACHE_TILES = 'ban-yaro-tiles-v1'; // bleibt über SW-Updates erhalten
const CACHE_API = 'ban-yaro-api-v1'; // API-Response-Cache