CSS: 'Max. Aufrufe' field styled inconsistently with the other compose fields #23

Closed
opened 2026-06-17 13:19:03 +00:00 by mAi · 2 comments
Collaborator

What

m: the „Max. Aufrufe“ field looks different from the other compose fields — align its styling so it matches.

Likely cause: when max-views became a card-level option (#18) the field was moved/restructured and didn't pick up the same input/label styling (width, padding, border, label spacing) as the neighbouring fields (e.g. „Gültig bis“, recipient/sender, message). Possibly also its wrapper grid/alignment differs.

Fix

Make the „Max. Aufrufe“ field visually consistent with the other compose fields — same input styling, label treatment, width/alignment, and spacing. Pair it cleanly with „Gültig bis“ if they sit together (consistent row, equal heights — same spirit as #13's gültig-bis/max-aufrufe alignment fix). CSS/markup only (web/static/style.css + maybe web/templates/compose.html).

Constraints

Mobile-first; no regression to #13/#20 spacing fixes or #18 behaviour. German + Umlaute.

DoD

  • „Max. Aufrufe“ field matches the other compose fields' styling + alignment on mobile + desktop. build green; commit references this issue. otto-head merges + deploys.
## What m: the **„Max. Aufrufe“** field looks different from the other compose fields — align its styling so it matches. Likely cause: when max-views became a card-level option (#18) the field was moved/restructured and didn't pick up the same input/label styling (width, padding, border, label spacing) as the neighbouring fields (e.g. „Gültig bis“, recipient/sender, message). Possibly also its wrapper grid/alignment differs. ## Fix Make the „Max. Aufrufe“ field visually consistent with the other compose fields — same input styling, label treatment, width/alignment, and spacing. Pair it cleanly with „Gültig bis“ if they sit together (consistent row, equal heights — same spirit as #13's gültig-bis/max-aufrufe alignment fix). CSS/markup only (`web/static/style.css` + maybe `web/templates/compose.html`). ## Constraints Mobile-first; no regression to #13/#20 spacing fixes or #18 behaviour. German + Umlaute. ## DoD - „Max. Aufrufe“ field matches the other compose fields' styling + alignment on mobile + desktop. build green; commit references this issue. otto-head merges + deploys.
mAi self-assigned this 2026-06-17 13:19:03 +00:00
Author
Collaborator

#23 erledigt — „Max. Aufrufe“ jetzt einheitlich gestylt

Ursache: Das Feld „Max. Aufrufe“ ist ein input[type="number"] (seit #18 als kartenweite Option). Die Eingabefeld-Styles in style.css deckten aber nur text / password / textarea (Zeile 180) sowie separat date (Zeile 421) ab — number fiel komplett auf Browser-Defaults zurück (andere Border, Padding, Breite, Focus-Ring). Daher sah es als einziges Compose-Feld anders aus.

Fix: Alle einzeiligen Text-Controls in eine Basis-Regel zusammengeführt — text, password, number, date, textarea teilen sich jetzt dieselbe Box (Breite 100 %, Border, Padding 0.75rem 0.85rem, gleicher Focus-Ring). Den doppelten input[type="date"]-Block samt veraltetem „side by side“-Kommentar entfernt.

Ergebnis: „Max. Aufrufe“ passt jetzt visuell exakt zu „Gültig bis“ und den übrigen Feldern — Mobile + Desktop. Keine Regression zu #13/#20-Spacing oder #18-Verhalten (reine CSS-Konsolidierung). .slug-field-Override bleibt unberührt (höhere Spezifität).

Nur CSS, go build ./... grün.

Commit: 8bd69801ca

## #23 erledigt — „Max. Aufrufe“ jetzt einheitlich gestylt **Ursache:** Das Feld „Max. Aufrufe“ ist ein `input[type="number"]` (seit #18 als kartenweite Option). Die Eingabefeld-Styles in `style.css` deckten aber nur `text` / `password` / `textarea` (Zeile 180) sowie separat `date` (Zeile 421) ab — `number` fiel komplett auf Browser-Defaults zurück (andere Border, Padding, Breite, Focus-Ring). Daher sah es als einziges Compose-Feld anders aus. **Fix:** Alle einzeiligen Text-Controls in **eine** Basis-Regel zusammengeführt — `text`, `password`, `number`, `date`, `textarea` teilen sich jetzt dieselbe Box (Breite 100 %, Border, Padding `0.75rem 0.85rem`, gleicher Focus-Ring). Den doppelten `input[type="date"]`-Block samt veraltetem „side by side“-Kommentar entfernt. Ergebnis: „Max. Aufrufe“ passt jetzt visuell exakt zu „Gültig bis“ und den übrigen Feldern — Mobile + Desktop. Keine Regression zu #13/#20-Spacing oder #18-Verhalten (reine CSS-Konsolidierung). `.slug-field`-Override bleibt unberührt (höhere Spezifität). Nur CSS, `go build ./...` grün. Commit: https://mgit.msbls.de/m/postcards/commit/8bd69801cab775a5727639c8ed212ac4e0eddeae
Author
Collaborator

Live on sendmy.cards (merge 7ffdf2d)

Shipped in the compose styling block (#23 field consistency, #24 Farbwelt→Farbschema + smaller equal tiles, #25 darker field text). CSS/copy only, build green. Verified: Farbschema label live, Farbwelt gone. Please eyeball spacing/contrast. Not closing — m closes.

## ✅ Live on sendmy.cards (merge `7ffdf2d`) Shipped in the compose styling block (#23 field consistency, #24 Farbwelt→Farbschema + smaller equal tiles, #25 darker field text). CSS/copy only, build green. Verified: Farbschema label live, Farbwelt gone. Please eyeball spacing/contrast. Not closing — m closes.
mAi closed this issue 2026-06-23 15:48:04 +00:00
Sign in to join this conversation.
No Label
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: m/postcards#23
No description provided.