Scarriffle/Vorrania
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web: Produktformular-Feinschliff (Barcode-Buttons, Foto-Entfernen, Typ-Abstand)

Browse Source 
- Barcode-Zeile: Eingabefeld fuellt die Breite, die beiden Knoepfe (Nachschlagen
  + Vergleichen) stehen nebeneinander statt gestapelt – keine Luecke mehr rechts.
- Foto: "Entfernen" ist jetzt ein normaler Button wie "Foto machen"/"Galerie"
  (gleiche Hoehe/Ausrichtung) statt reiner Text.
- Umschalter "Typ"/"Verwaltung": Abstand zwischen Beschriftung und Segmenten.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Scarriffle
2026-07-26 21:23:36 +02:00
parent 40e12a574e
commit 41e8cce612
2 changed files with 12 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
web/src/styles.css
View File

@@ -212,8 +212,9 @@ input::placeholder { color: var(--muted); opacity: 0.7; }
.produkt-kopf { flex-direction: column-reverse; align-items: center; }
}
/* Zwei gestapelte Knoepfe neben einem Eingabefeld. */
.knopf-spalte { display: flex; flex-direction: column; gap: var(--sp-2); flex: 0 0 auto; }
/* Knoepfe neben dem Barcode-Feld: nebeneinander, mit Umbruch auf schmalen
Fenstern. Das Eingabefeld daneben fuellt die restliche Breite. */
.knopf-spalte { display: flex; flex-flow: row wrap; gap: var(--sp-2); flex: 0 0 auto; }
.knopf-spalte .btn { justify-content: center; white-space: nowrap; }
/* Gegenueberstellung mit Open Food Facts */
@@ -912,8 +913,12 @@ tr.row-active { background: var(--surface-2); }
.segmented button + button { border-left: 1px solid var(--border); }
.segmented button.active { background: var(--accent); color: #fff; }
.segmented button:disabled { cursor: default; opacity: 0.6; }
/* Beschriftung (z.B. „Typ") neben einem Umschalter mit etwas Abstand statt
direkt daneben geklebt. */
.seg-label { display: flex; align-items: center; gap: var(--sp-3); }
.seg-label .segmented { margin-top: 0; }
/* Artikelfoto mit Aufnahme-/Galerie-Knöpfen */
.produkt-foto { display: flex; flex-direction: column; gap: var(--sp-2); align-items: center; }
.foto-knoepfe { display: flex; flex-wrap: wrap; gap: var(--sp-1); justify-content: center; }
.foto-knoepfe { display: flex; flex-wrap: wrap; gap: var(--sp-1); justify-content: center; align-items: center; }
.foto-knoepfe .btn { cursor: pointer; }