Give undo and the card picker's buttons a fingertip to land on #98

2026-09-02T00:56:24-06:00

jheaps commented

2026-09-02 00:56:24 -06:00

The first thing the repaired audit from #97 found, run on a real touch context at 44px: three controls a dealer taps on a phone that are too small to tap.

control	size	what it does
`.actionUndo`	145×30	the "I recorded that wrong" pill
`#cardPickerClearBtn`	50×40	wipes a player's cards
`#cardPickerCloseBtn`	50×40	closes the picker

Undo is the worst of them. It is the control a dealer reaches for having just entered the wrong action with five people waiting, and it was fourteen pixels short of a fingertip. The picker's two are short for a specific reason: the touch rule that fixes every other small button on the page is scoped to .panelBody, and the picker is a sheet — it never reached them. One of the two is destructive.

All three now sit at 44px on touch. Nothing changes on a pointer device.

A thing I got wrong, and the measurement caught. I tried an invisible hit-area pad on undo first, to avoid spending bar height — the same trick the dealer puck uses. The measurement said it did nothing: the pill clips its overflow to keep a long label on one line, and giving it a positioning context made it clip the pad too. My comment had asserted the opposite. Growing the box is the honest fix, and it turned out to cost nothing anyway: the bar goes 138px → 152px and the felt stays at 366px, because it had slack against its 220px floor rather than sitting on it as I'd assumed in an earlier round.

Verification

Playwright MCP on hasTouch/isMobile contexts at 390×844 and 768×1024:

Undo now 145×44 drawn, 145×43 hittable, and still actually undoes — bettingOpen goes true → false on a tap.
Card picker buttons 50×44, picker audit clean.
Full audit at both sizes: 0 failures, 0 contrast offenders, 0 warnings, down from one failure mid-hand and two in the picker.
Felt height unchanged at 366px on the phone; no seat loses area.

Product suite unchanged at 387 tests, 0 failures — CSS only.

Stacked on fix/casino-holdem-audit-modal-blindspot.

🤖 Generated with Claude Code

https://claude.ai/code/session_015bnp7xKUPFFSpwkYNFaPgb

The first thing the repaired audit from #97 found, run on a real touch context at 44px: **three controls a dealer taps on a phone that are too small to tap.** | control | size | what it does | |---|---|---| | `.actionUndo` | **145×30** | the "I recorded that wrong" pill | | `#cardPickerClearBtn` | 50×40 | wipes a player's cards | | `#cardPickerCloseBtn` | 50×40 | closes the picker | Undo is the worst of them. It is the control a dealer reaches for having just entered the wrong action with five people waiting, and it was fourteen pixels short of a fingertip. The picker's two are short for a specific reason: the touch rule that fixes every other small button on the page is scoped to `.panelBody`, and the picker is a sheet — it never reached them. One of the two is destructive. All three now sit at 44px on touch. Nothing changes on a pointer device. **A thing I got wrong, and the measurement caught.** I tried an invisible hit-area pad on undo first, to avoid spending bar height — the same trick the dealer puck uses. The measurement said it did nothing: the pill clips its overflow to keep a long label on one line, and giving it a positioning context made it clip the pad too. My comment had asserted the opposite. Growing the box is the honest fix, and it turned out to cost nothing anyway: the bar goes 138px → 152px and **the felt stays at 366px**, because it had slack against its 220px floor rather than sitting on it as I'd assumed in an earlier round. **Verification** Playwright MCP on `hasTouch`/`isMobile` contexts at 390×844 and 768×1024: - Undo now **145×44 drawn, 145×43 hittable**, and still actually undoes — `bettingOpen` goes true → false on a tap. - Card picker buttons **50×44**, picker audit clean. - Full audit at both sizes: **0 failures, 0 contrast offenders, 0 warnings**, down from one failure mid-hand and two in the picker. - Felt height unchanged at 366px on the phone; no seat loses area. Product suite unchanged at 387 tests, 0 failures — CSS only. Stacked on `fix/casino-holdem-audit-modal-blindspot`. 🤖 Generated with [Claude Code](https://claude.com/claude-code) https://claude.ai/code/session_015bnp7xKUPFFSpwkYNFaPgb

jheaps added 1 commit 2026-09-02 00:56:24 -06:00

Give undo and the card picker's buttons a fingertip to land on 8a2fc3e540

The first thing the repaired audit found, run on a real touch context at 44px: three
controls a dealer taps on a phone that are too small to tap.

    .actionUndo             145x30   the "I recorded that wrong" pill
    #cardPickerClearBtn      50x40   wipes a player's cards
    #cardPickerCloseBtn      50x40   closes the picker

Undo is the worst of them. It is the control a dealer reaches for having just entered
the wrong action with five people waiting, and it was fourteen pixels short of a
fingertip. The picker's two are short because the touch rule that fixes every other
small button is scoped to .panelBody, and the picker is a sheet — it never reached
them. One of them is destructive.

All three now sit at 44px on touch. Nothing changes on a pointer device.

I tried an invisible hit-area pad on undo first, to avoid spending bar height, and the
measurement said it did nothing: the pill clips its overflow to keep a long label on
one line, and giving it a positioning context made it clip the pad too. Growing the
box is the honest fix, and it turned out to cost nothing anyway — the bar goes from
138px to 152px and the felt stays at 366px, because the felt had slack against its
220px floor rather than sitting on it as I had assumed.

Co-Authored-By: Claude Opus 5 <[email protected]>
Claude-Session: https://claude.ai/code/session_015bnp7xKUPFFSpwkYNFaPgb

jheaps closed this pull request

2026-09-02 09:58:03 -06:00

Pull request closed

Please reopen this pull request to perform a merge.

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: jheaps/JoshHeaps.Net#98