Keep a focused field's focus edge under the pointer
The hover rule's `:not(:has([data-md-field-control]:disabled))` weighs as much as its argument, so hover weighed (0,5,0) against focus's (0,2,0), and the error's hover (0,6,0) against the error's focus (0,4,0): a focused field with the pointer on it drew a 2px on-surface edge instead of primary, a field in error on-error-container instead of error, in both variants. A customizable select with its menu open lost the same way, since focus is then on an option in the top layer and only select.css's `:open` rule (0,3,1) draws the focus edge. M3 layers focus over hover. The disabled condition is now weightless inside `:where()`, still keeping hover off a disabled field, and the focus rule gains the field ancestor: focus (0,3,0) outweighs hover (0,2,0), the error's focus (0,4,0) the error's hover (0,3,0), and the open select both. An open select in error drew primary, not error, and now draws error. A browser test hovers and clicks an outlined, a filled and an invalid field and opens a select and a select in error, comparing each edge with its role; it fails without the change (the error select without select.css's rule). Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 5
parent
0641071a06
commit
029c78d301
@@ -35,6 +35,12 @@
|
||||
cut) with a width and height but no viewBox, and the package dropped the size, so they fitted
|
||||
only at exactly 24px and were cut off or misplaced at any other — the 20 cut every small button
|
||||
draws from included. Nothing to change.
|
||||
- **A focused text field keeps its focus edge under the pointer.** The hover rule outweighed focus,
|
||||
so a focused field the pointer rested on drew a 2px `on-surface` edge instead of `primary`, and
|
||||
a field in error `on-error-container` instead of `error` — in the filled variant too, and on a
|
||||
customizable `<x-select>` while its menu is open. An open select in error now draws `error`
|
||||
rather than `primary`. A test that read the hover colour off a focused field reads `primary`
|
||||
now.
|
||||
|
||||
## From 2.0.0 to 2.1.0
|
||||
|
||||
|
||||
Reference in New Issue
Block a user