From 91d14b33bbfae2a9432ac246f7948661adbed9cc Mon Sep 17 00:00:00 2001 From: iris Date: Mon, 3 Aug 2026 17:34:48 +0200 Subject: [PATCH 1/3] client: fix picker remove-row label clipping (#73) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit .picker-count inherited the generic button's 12px/16px padding, which left ~16px of content width per grid cell — enough for a single digit but not the two-character "-1".."-5" remove labels added in #72, which overflowed into the neighbouring cell and got visually clipped by its opaque background. Tightened to horizontal-only padding (12px 4px), leaving vertical spacing/centering untouched. --- client/src/styles.css | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/client/src/styles.css b/client/src/styles.css index 2565ac5..d254665 100644 --- a/client/src/styles.css +++ b/client/src/styles.css @@ -211,6 +211,13 @@ button.danger { background: #5a2a2a; border-color: #7a3a3a; color: #fff; } } .picker-count { height: 64px; + /* #73: the default button padding (12px 16px) leaves ~16px of content + width per cell in this 5-column grid — workable for a single digit + ("1".."5") but not the two-character "−1".."−5" remove-row labels, + which overflowed into the next cell and got visually clipped by its + opaque background. Horizontal-only override keeps the existing + vertical spacing/centering, just frees up room sideways. */ + padding: 12px 4px; font-size: 26px; font-weight: 800; } From e0bcfad7849f6c3f759951834f4ea912944996e9 Mon Sep 17 00:00:00 2001 From: iris Date: Mon, 3 Aug 2026 17:38:08 +0200 Subject: [PATCH 2/3] client: switch picker padding to em units, not fixed px MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Per feedback on #74 — fixed-px padding would silently need re-tuning again if .picker-count's font-size ever changes. em is relative to this rule's own font-size, so the fix scales with it automatically. --- client/src/styles.css | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/client/src/styles.css b/client/src/styles.css index d254665..edd9ac9 100644 --- a/client/src/styles.css +++ b/client/src/styles.css @@ -215,9 +215,11 @@ button.danger { background: #5a2a2a; border-color: #7a3a3a; color: #fff; } width per cell in this 5-column grid — workable for a single digit ("1".."5") but not the two-character "−1".."−5" remove-row labels, which overflowed into the next cell and got visually clipped by its - opaque background. Horizontal-only override keeps the existing - vertical spacing/centering, just frees up room sideways. */ - padding: 12px 4px; + opaque background. `em` (relative to this rule's own font-size, + not a fixed px) so the fix keeps working if font-size ever changes + instead of quietly re-breaking — mara's ask on the PR. Horizontal- + only, vertical spacing/centering untouched. */ + padding: 0.46em 0.15em; font-size: 26px; font-weight: 800; } From b945099a854a385d4c12ca77de980b1f5c069b00 Mon Sep 17 00:00:00 2001 From: iris Date: Mon, 3 Aug 2026 17:43:10 +0200 Subject: [PATCH 3/3] client: size picker-count buttons from content, not a fixed height MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The fixed height: 64px had the same fragility the padding fix in the previous commit addressed, just on the other axis. Dropped it — height now comes from line-height + padding like any normal button. min-height: 44px keeps the established touch-target floor (matches .qty-btn's documented minimum elsewhere in this file) without pinning an exact number. --- client/src/styles.css | 17 ++++++++++++----- 1 file changed, 12 insertions(+), 5 deletions(-) diff --git a/client/src/styles.css b/client/src/styles.css index edd9ac9..530fcb5 100644 --- a/client/src/styles.css +++ b/client/src/styles.css @@ -210,15 +210,22 @@ button.danger { background: #5a2a2a; border-color: #7a3a3a; color: #fff; } gap: 8px; } .picker-count { - height: 64px; /* #73: the default button padding (12px 16px) leaves ~16px of content width per cell in this 5-column grid — workable for a single digit ("1".."5") but not the two-character "−1".."−5" remove-row labels, which overflowed into the next cell and got visually clipped by its - opaque background. `em` (relative to this rule's own font-size, - not a fixed px) so the fix keeps working if font-size ever changes - instead of quietly re-breaking — mara's ask on the PR. Horizontal- - only, vertical spacing/centering untouched. */ + opaque background. `em` padding (relative to this rule's own + font-size) rather than fixed px, so it keeps working if font-size + changes instead of quietly re-breaking. + mara: "why is the popup not just sized to match the children + directly?" — right question, the old fixed `height: 64px` was the + same fragility as the old fixed padding, just on the other axis. + Dropped it: height now comes from content (line-height) + this + padding, same as any normal button. `min-height` keeps it a floor + rather than a ceiling — this file's `.qty-btn` already documents + 44px as the minimum touch target elsewhere, so that's the number + to protect, not a target to hit exactly. */ + min-height: 44px; padding: 0.46em 0.15em; font-size: 26px; font-weight: 800;