Feature: Hundepass — Ausweis integriert, Icons & Kontrast-Fix

- Ausweis-Button aus Profil-Ansicht entfernt; stattdessen "Ausweis öffnen"-Button im Hundepass-Modal-Footer
- Bearbeiten-Button in Gesundheits-Info von btn-link auf btn-secondary (besserer Kontrast)
- 7 fehlende Phosphor-Icons zum Sprite hinzugefügt: file-pdf, notebook, link, identification-card, wave-sine, list-checks, share-network
- Leere Sektionen (Impfungen, Medikamente) zeigen einladenden Empty-State mit Icon statt nacktem Text
This commit is contained in:
rene 2026-05-02 10:12:51 +02:00
parent 0d31d04275
commit fb1a9d27cd
2 changed files with 46 additions and 15 deletions

View file

@ -187,16 +187,10 @@ window.Page_dog_profile = (() => {
${!dog.is_guest ? `<button class="btn btn-primary w-full" id="dp-edit-btn">
Profil bearbeiten
</button>` : ''}
<div style="display:flex;gap:var(--space-2)">
<button class="btn btn-secondary" style="flex:1" id="dp-ausweis-btn">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#identification-card"></use></svg>
Ausweis
</button>
${!dog.is_guest ? `<button class="btn btn-secondary" style="flex:1" id="dp-share-btn">
${!dog.is_guest ? `<button class="btn btn-secondary w-full" id="dp-share-btn">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#share-network"></use></svg>
Teilen
</button>` : ''}
</div>
${!dog.is_guest ? `<button class="btn btn-secondary w-full" id="dp-passport-btn">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#notebook"></use></svg>
Hundepass
@ -262,10 +256,6 @@ window.Page_dog_profile = (() => {
_showChipEdit(dog);
});
document.getElementById('dp-ausweis-btn')?.addEventListener('click', () => {
_showAusweisModal(dog.id);
});
document.getElementById('dp-share-btn')?.addEventListener('click', () => {
_showShareModal(dog);
});
@ -1374,6 +1364,10 @@ window.Page_dog_profile = (() => {
footer: `
<div style="display:flex;gap:var(--space-2);flex-wrap:wrap;justify-content:flex-end">
<button class="btn btn-secondary" onclick="UI.modal.close()">Schließen</button>
<a class="btn btn-secondary" href="/ausweis/${dog.id}" target="_blank" rel="noopener">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#identification-card"></use></svg>
Ausweis öffnen
</a>
<button class="btn btn-secondary" id="pp-share-btn">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#link"></use></svg>
Link teilen
@ -1381,7 +1375,7 @@ window.Page_dog_profile = (() => {
<a class="btn btn-primary" id="pp-pdf-btn"
href="/api/passport/${dog.id}/pdf" target="_blank" download>
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#file-pdf"></use></svg>
PDF herunterladen
PDF
</a>
</div>`,
size: 'large',
@ -1427,7 +1421,10 @@ window.Page_dog_profile = (() => {
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#info"></use></svg>
Gesundheits-Info
</span>
<button class="btn btn-link btn-sm" id="pp-meta-edit-btn">Bearbeiten</button>
<button class="btn btn-secondary btn-sm" id="pp-meta-edit-btn">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#pencil-simple"></use></svg>
Bearbeiten
</button>
</div>
<div style="display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)">
<div>
@ -1464,7 +1461,10 @@ window.Page_dog_profile = (() => {
</div>
<div id="pp-vacc-list">
${vaccs.length === 0
? '<p style="color:var(--c-text-muted);font-size:var(--text-sm);margin:0">Keine Impfungen eingetragen.</p>'
? `<div style="text-align:center;padding:var(--space-4) var(--space-2);color:var(--c-text-muted)">
<svg class="ph-icon" style="width:32px;height:32px;margin-bottom:var(--space-2);opacity:.4" aria-hidden="true"><use href="/icons/phosphor.svg#syringe"></use></svg>
<p style="font-size:var(--text-sm);margin:0">Noch keine Impfungen eingetragen.<br>Klicke auf + Eintragen" um loszulegen.</p>
</div>`
: vaccs.map(v => `
<div class="pp-vacc-row" data-id="${v.id}"
style="display:flex;align-items:flex-start;gap:var(--space-3);
@ -1499,7 +1499,10 @@ window.Page_dog_profile = (() => {
</div>
<div id="pp-med-list">
${meds.length === 0
? '<p style="color:var(--c-text-muted);font-size:var(--text-sm);margin:0">Keine Medikamente eingetragen.</p>'
? `<div style="text-align:center;padding:var(--space-4) var(--space-2);color:var(--c-text-muted)">
<svg class="ph-icon" style="width:32px;height:32px;margin-bottom:var(--space-2);opacity:.4" aria-hidden="true"><use href="/icons/phosphor.svg#pill"></use></svg>
<p style="font-size:var(--text-sm);margin:0">Noch keine Medikamente eingetragen.<br>Klicke auf + Eintragen" um loszulegen.</p>
</div>`
: meds.map(m => `
<div class="pp-med-row" data-id="${m.id}"
style="display:flex;align-items:flex-start;gap:var(--space-3);