UX: Rechnungs-Modal Footer für Mobile, SW by-v1076

Footer-Layout neu strukturiert — kein Umbruch-Chaos mehr:
- Erste Zeile: Abbrechen | Speichern (Grid 1fr 1fr, gleich breit)
  oder bei sent/paid nur 'Schließen' volle Breite
- Zweite Zeile (wenn vorhanden): Stornieren als volle Breite,
  ghost-Style mit rotem Rand — destruktive Aktion klar getrennt
- Button-Text 'Änderungen speichern' → 'Speichern' (kein Abschneiden
  mehr auf iPhone)
This commit is contained in:
rene 2026-05-26 14:03:09 +02:00
parent c4a82e96fd
commit 280213c11d
5 changed files with 23 additions and 23 deletions

View file

@ -4046,20 +4046,20 @@ window.Page_admin = (() => {
</form>
`,
footer: `
<div style="display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);width:100%;flex-wrap:wrap">
<div>
${canCancel ? `
<button class="btn btn-ghost" id="${id}-cancel-invoice"
style="color:var(--c-danger);border:1px solid var(--c-danger)">
${UI.icon('x-circle')} Stornieren
</button>` : ''}
</div>
<div style="display:flex;gap:var(--space-2)">
<button class="btn btn-secondary" data-modal-close>${isLocked ? 'Schließen' : 'Abbrechen'}</button>
${!isLocked ? `<button class="btn btn-primary" form="${id}" type="submit">
${UI.icon('receipt')} ${isEdit ? 'Änderungen speichern' : 'Rechnung erstellen'}
<div style="display:flex;flex-direction:column;gap:var(--space-2);width:100%">
${isLocked
? `<button class="btn btn-secondary" data-modal-close style="width:100%">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">
${UI.icon('receipt')} ${isEdit ? 'Speichern' : 'Erstellen'}
</button>
</div>`}
${canCancel ? `
<button class="btn btn-ghost" id="${id}-cancel-invoice"
style="width:100%;color:var(--c-danger);border:1px solid var(--c-danger)">
${UI.icon('x-circle')} Rechnung stornieren
</button>` : ''}
</div>
</div>
`,
});