fix(modal): give the close button a 44px touch target
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 18s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 10s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 12s
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 18s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 10s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 12s
The close button was 40px square: a 24px icon in 8px of padding. MOBILE.md sets 44px as the minimum, and the phone filter sheet journey, which checks every target in the sheet, has failed on it in the staging E2E gate since the sheet shipped. Measured on staging with the rule injected: the button is 44x44, nothing in the sheet is under 44, and the page does not overflow. Every Modal gets the same button, the compare page's school search included. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
19c574edb0
commit
27d83f9bd0
1 file changed
+4
@@ -79,7 +79,11 @@
|
||||
font-family: var(--font-display);
|
||||
}
|
||||
|
||||
/* 44px, the MOBILE.md touch-target minimum: the 24px icon and its padding
|
||||
came to 40, and the phone filter sheet journey caught it. */
|
||||
.closeButton {
|
||||
min-width: 2.75rem;
|
||||
min-height: 2.75rem;
|
||||
padding: 0.5rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
|
||||
Reference in new issue
Block a user