diff --git a/JoshHeaps.Net/wwwroot/css/casino/holdem.css b/JoshHeaps.Net/wwwroot/css/casino/holdem.css index 8d9ca2e..f90c42a 100644 --- a/JoshHeaps.Net/wwwroot/css/casino/holdem.css +++ b/JoshHeaps.Net/wwwroot/css/casino/holdem.css @@ -2140,11 +2140,10 @@ body.hasActionBar #toastHost { whole phone width to work with, so everything grows to thumb size — and every field goes to 16px, below which iOS zooms the page on focus and the dealer has to pinch back out mid-hand. */ - .seatEditorForm .seatNameInput, - .seatEditorForm .amountOverrideInput, - .seatEditorForm .chipCountInput, - .seatEditorForm .customFieldLabel, - .seatEditorForm .customFieldValue { + /* Every text or number field in the form, rather than a list of the ones that + existed when this was written. The stack field was added later and sat at 28px + next to its 44px neighbours precisely because it wasn't on that list. */ + .seatEditorForm input:not([type="checkbox"]):not([type="color"]) { font-size: 16px; min-height: 44px; padding: 0.4rem 0.6rem; @@ -2208,6 +2207,77 @@ body.hasActionBar #toastHost { margin-top: 0.4rem; } + /* The sidebar's own controls never got the touch pass the seat form did — these + are settings a dealer changes at the table, on the same phone. Written against + the panel rather than each field, so a setting added later inherits it. */ + .panelBody input:not([type="checkbox"]):not([type="color"]), + .subPanelBody input:not([type="checkbox"]):not([type="color"]), + .panelBody select { + font-size: 16px; + min-height: 44px; + padding: 0.4rem 0.6rem; + } + + .panelBody .holdemBtnSmall, + .handHistoryActions .holdemBtn { + min-height: 44px; + } + + /* Destructive and tiny is the worst combination: these delete a chip colour or a + custom field, and were 28px wide. */ + .removeChipColorBtn, + .removeFieldBtn { + min-width: 44px; + min-height: 44px; + } + + /* flex-shrink would take a stated width straight back off again in a row this + narrow, which is why it stayed 32px wide with the height applied. */ + .chipColorInput { + flex: none; + width: 44px; + height: 44px; + } + + /* A bare checkbox can't grow into a target, but the row it sits in can — the + label is what a tap actually lands on. */ + .panelBody .fieldRow { + min-height: 44px; + } + + /* A bare checkbox with no label box around it to grow. */ + #dedicatedDealerToggle { + width: 24px; + height: 24px; + } + + /* An underlined word is a 14px-tall target; give it room without making it look + like a button. */ + .linkBtn { + display: inline-flex; + align-items: center; + min-height: 44px; + padding: 0 0.4rem; + } + + /* The dealer button has to stay a 22px disc — it's a chip sitting on a seat, and + drawing it thumb-sized would swallow the puck. So the disc keeps its size and + an invisible pad around it takes the tap. It reaches outward, away from the + puck's own tap target, so pressing the seat still opens the seat. */ + .dealerChip::after { + content: ""; + position: absolute; + top: 50%; + left: 50%; + width: 44px; + height: 44px; + transform: translate(-50%, -50%); + } + + .dealerChip { + overflow: visible; + } + .toastAction { min-height: 44px; }