Web: Mindestbestaende in festen Spalten, Detail-Spalten verschiebbar

Die Eingabefelder auf der Mindestbestaende-Seite standen je Zeile woanders. Die
Zeile war ein .field-inline, und dort waechst sowohl der Name als auch das
Eingabefeld (.field-inline > input { flex: 1 1 auto }) - beide teilten sich den
Restplatz, also verschob ein laengerer Name das Feld nach rechts und machte es
schmaler. Jetzt ist die Zeile ein Raster mit festen Spalten (Name, Menge,
Einheit, Bestand, Ort, Loeschen); ohne Adminrechte bleiben die letzten beiden
Zellen leer, damit die Zeilen trotzdem fluchten. Schmale Fenster stellen den
Namen ueber die volle Breite.

Die "Details"-Spalte liess sich nicht verschieben: sie war fixed und hatte
zusaetzlich einen leeren Kopf - es gab also nichts zu greifen. Sie ist jetzt
frei und traegt einen sichtbaren Titel. Dasselbe fuer die gleichartigen
Link-Spalten in der Einzelstueck- und der Chargenliste ("Artikel",
"Aufteilen"). Sortieren bleibt dort aus, weil toggleSort ohne sortValue
ohnehin aussteigt. Bild- und Auswahlspalten bleiben fest - die haben keinen
sinnvollen Titel und gehoeren an den Anfang.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Scarriffle
2026-08-16 10:36:48 +02:00
co-authored by Claude Opus 5
parent e00eef275c
commit 01c93d8b2c
5 changed files with 38 additions and 13 deletions
+20
View File
@@ -328,6 +328,26 @@ td .field-inline { margin-bottom: 0; flex-wrap: wrap; }
132px machte schmale Spalten (z.B. "Einheit") unnoetig breit. */
td select { width: auto; min-width: 0; max-width: 100%; }
/* Button-Paare (z.B. Speichern/Abbrechen) gleich breit halten. */
/* Mindestbestände: eine Zeile je Eintrag in FESTEN Spalten.
Vorher lag hier ein .field-inline – dort wachsen Name und Eingabefeld beide
(.field-inline > input { flex: 1 1 auto }) und teilen sich den Restplatz.
Die Felder standen dadurch je nach Namenslänge woanders. */
.min-zeile {
display: grid;
grid-template-columns: minmax(0, 1fr) 110px 150px 150px 160px 36px;
gap: var(--sp-2);
align-items: center;
}
.min-zeile > * { min-width: 0; }
.min-zeile input, .min-zeile select { margin-top: 0; width: 100%; min-width: 0; }
.min-zeile .bestand { text-align: right; }
/* Schmal: Name über die volle Breite, darunter die Felder nebeneinander. */
@media (max-width: 900px) {
.min-zeile { grid-template-columns: 1fr 1fr 1fr 36px; }
.min-zeile > .name { grid-column: 1 / -1; }
.min-zeile .bestand { text-align: left; }
}
.btn-pair { display: flex; gap: var(--sp-2); flex-wrap: wrap; justify-content: flex-end; }
.btn-pair .btn { flex: 1 1 auto; min-width: 104px; justify-content: center; }