From afc6ca7046a70d2c136dc58abdd4cc336f74be77 Mon Sep 17 00:00:00 2001 From: Eddy Date: Tue, 20 Oct 2026 19:25:15 +0200 Subject: [PATCH] =?UTF-8?q?Gro=C3=9Fe=20Kn=C3=B6pfe=20mit=20Symbol=20links?= =?UTF-8?q?b=C3=BCndig=20[deploy]?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Eddy: „im Auftrag … die Symbole alle linksbündig" — die farbigen Kreise stehen in einer Spalte, der Text beginnt immer an derselben Stelle. Gilt für alle Knöpfe mit Symbol; der kleine „Auswählen"-Knopf bleibt mittig. Im Android-Emulator angesehen, Eddy: „lass das mal so". Co-Authored-By: Claude Opus 5.5 --- README.md | 2 +- ROADMAP.md | 3 +++ app.css | 5 ++++- 3 files changed, 8 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 7d33720..423a6a6 100644 --- a/README.md +++ b/README.md @@ -20,7 +20,7 @@ Mobile Progressive Web App für die Baustellen-Doku — Foto-Upload, Sprach- und - ✅ Auftragsdetail mit Kunde, Adresse, Telefon (Click-to-Call) - ✅ **Neuer Auftrag** (FAB): Kunde per Suche/Zuletzt-verwendet wählen, dann **Ihr Zeichen** (Pflicht), **Auftragsbeschreibung** (optional), **Geplanter Liefertermin** (Datum + Uhrzeit) und Checkbox **Auftrag direkt freigeben**. Kunden-Defaults (Zahlungsbedingung/Zahlart, Ansprechpartner) werden übernommen. Bei „direkt freigeben" wird der Auftrag **ohne Position** validiert — die Leistungen kommen aus dem Stundenzettel. (Bis Bericht 1.3.1 hängte das Backend hier eine Std-Lohn-Zeile mit Menge 1 an; die verfälschte den Auftragswert, stand als offene Restmenge in der Lieferauflistung und im Kunden-PDF.) -**Aussehen:** Knöpfe tragen farbige Symbole statt Emojis (`icon()` in app.js, Material Icons; Farben je Symbol in app.css `.ikon-`) — Emojis erscheinen je nach Handy als Kästchen. Große Knöpfe: weißes Symbol im farbigen runden Feld; kleine Knöpfe: farbiges Symbol. Untere Leiste: farbiges Symbol über dem Wort. Überschriften fett in normaler Schreibweise, ohne Versalien und ohne Emoji (ROADMAP Punkt 12). +**Aussehen:** Knöpfe tragen farbige Symbole statt Emojis (`icon()` in app.js, Material Icons; Farben je Symbol in app.css `.ikon-`) — Emojis erscheinen je nach Handy als Kästchen. Große Knöpfe: weißes Symbol im farbigen runden Feld, linksbündig (Symbole in einer Spalte, Text darunter bündig); kleine Knöpfe: farbiges Symbol. Untere Leiste: farbiges Symbol über dem Wort. Überschriften fett in normaler Schreibweise, ohne Versalien und ohne Emoji (ROADMAP Punkt 12). **Foto- und Video-Upload** - ✅ Live-Kamera-Modal (getUserMedia): bleibt für Serien-Aufnahmen offen — Auslöser + Filmstreifen mit Upload-Status je Foto (💾 gesichert → ⏳ lädt hoch → ✓ fertig), Front-/Rückkamera-Umschaltung (nur bei zwei Kameras), Fehlschuss löschbar diff --git a/ROADMAP.md b/ROADMAP.md index 17cb383..67f9db7 100644 --- a/ROADMAP.md +++ b/ROADMAP.md @@ -73,6 +73,9 @@ Anlass: der 🔄-Wechselknopf erschien als blaues Kästchen („den hässlichen farbigen runden Feld (Kamera blau, Galerie grün, Sprachnotiz rot, Notizen gelb, Material orange, Bericht lila, Lieferungen türkis …), kleine Knöpfe ein farbiges Symbol (Teilen blau, Löschen rot, Stift/Blitz/Hilfe gelb, Download/Telefon grün). Farben je Symbol in `app.css` (`.ikon-`: `--ikon-farbe`, `--ikon-grund`). +- [x] ✅ 20.10.2026 (Eddy: „die Symbole alle linksbündig"): große Knöpfe mit Symbol **linksbündig** — die farbigen + Kreise stehen in einer Spalte, der Text beginnt immer an derselben Stelle (liest sich wie eine Liste). Gilt für + alle `.btn` mit Symbol; nur der kleine „Auswählen"-Knopf bleibt mittig. - [x] ✅ Untere Leiste wie in Handy-Apps: Symbol über dem Wort, farbig (Heute als Sonne), aktive Seite blau; das Zahnrad heißt jetzt „Einstellungen". - [x] ✅ Titel der Vollbild-Ansichten und Abschnitts-Überschriften ohne Emoji (reiner Text). - Bewusst gelassen: Zustandsanzeige 🟢/🟡/🔴 (Farbe ist dort die Aussage), Stempel im Skizzen-Editor (werden so ins Bild diff --git a/app.css b/app.css index 068ad93..ba369d5 100644 --- a/app.css +++ b/app.css @@ -196,7 +196,10 @@ body { „viel zu schlicht". Also: kleine Knoepfe = farbiges Symbol (--ikon-farbe), grosse Knoepfe = weisses Symbol im farbigen runden Feld (--ikon-grund). */ .ikon { color: var(--ikon-farbe, currentColor); } -.btn:has(> .ikon) { display: flex; align-items: center; justify-content: center; gap: 12px; } +/* Linksbuendig: Symbole stehen untereinander in einer Spalte, der Text beginnt immer an derselben + Stelle — liest sich wie eine Liste (Eddy 20.10.2026: „die Symbole alle linksbuendig") */ +.btn:has(> .ikon) { display: flex; align-items: center; justify-content: flex-start; gap: 14px; padding-left: 16px; text-align: left; } +.btn-small:has(> .ikon) { justify-content: center; padding-left: 10px; } /* kleiner Auswahl-Knopf bleibt mittig */ .btn > .ikon { flex: 0 0 auto; box-sizing: content-box;