Skip to main content

focus_rule

Function focus_rule 

Source
pub fn focus_rule(selector: &str, depth: Depth, opts: &Emit) -> String
Expand description

The keyboard focus ring, placed by the depth it lands on.

One ring for the whole system, because a focus ring’s job is to be recognised and three apps having three of them is the failure. What varies is where it sits, and that comes off Depth rather than off a per- component choice: a well takes the ring inside its own edge, and anything standing proud of the page takes it outside.

outline rather than the composed box-shadow the invalid-field ring at [field_rules] uses, and deliberately the one place the two rings are built differently. A box-shadow ring has to restate the bevel beside it, because box-shadow is not additive and a lone ring silently drops the well out from under the element. That restatement is a second copy of the depth, living in a different function from the first, and it is exactly the duplication Depth exists to prevent. outline occupies its own property, so the bevel survives untouched and there is nothing to keep in agreement. They render the same: both are a flush ring one border-width wide.