Skip to content

Commit

Permalink
Rollup merge of #103554 - notriddle:notriddle/summary-focus-visible, …
Browse files Browse the repository at this point in the history
…r=jsha

rustdoc: add visible focus outline to rustdoc-toggle

The change in opacity is inconsistent with most of rustdoc, which uses default browser styles for the focus outline. Unfortunately, just using the default focus outline here won't work, because it gets applied to the summary itself instead of the pseudo-element "real button."

Preview: https://notriddle.com/notriddle-rustdoc-demos/focus-outline/test_dingus/fn.test.html

## Screenshots

### light

![image](https://user-images.githubusercontent.com/1593513/197903818-61ce09e2-024e-4ca9-9aba-764039561d0a.png)

### dark

![image](https://user-images.githubusercontent.com/1593513/197903765-76e428ea-71e8-4724-ad21-7a4f9d923ea2.png)

### ayu

![image](https://user-images.githubusercontent.com/1593513/197903790-322e22ae-64b5-4138-b931-9ff3ff54f3b0.png)
  • Loading branch information
Dylan-DPC authored Oct 26, 2022
2 parents 709462b + b857138 commit 74a4c67
Showing 1 changed file with 9 additions and 0 deletions.
9 changes: 9 additions & 0 deletions src/librustdoc/html/static/css/rustdoc.css
Original file line number Diff line number Diff line change
Expand Up @@ -1585,6 +1585,15 @@ details.rustdoc-toggle > summary:hover::before {
opacity: 1;
}

details.rustdoc-toggle > summary:focus-visible::before {
/* The SVG is black, and gets turned white using a filter in the dark themes.
Do the same with the outline.
The dotted 1px style is copied from Firefox's focus ring style.
*/
outline: 1px dotted #000;
outline-offset: 1px;
}

details.rustdoc-toggle.top-doc > summary,
details.rustdoc-toggle.top-doc > summary::before,
details.rustdoc-toggle.non-exhaustive > summary,
Expand Down

0 comments on commit 74a4c67

Please sign in to comment.