diff options
| author | Runxi Yu <me@runxiyu.org> | 2025-02-17 19:58:44 +0800 |
|---|---|---|
| committer | Runxi Yu <me@runxiyu.org> | 2025-02-17 19:58:44 +0800 |
| commit | 8e447a55a8c62d00009d96eca4f5c8d2ab6f0113 (patch) | |
| tree | 17a572371bf297ee6d375fdd16eded9a766bf51b /static/style.css | |
| parent | go.mod: go-billy is now indirect (diff) | |
| download | forge-8e447a55a8c62d00009d96eca4f5c8d2ab6f0113.tar.gz forge-8e447a55a8c62d00009d96eca4f5c8d2ab6f0113.tar.zst forge-8e447a55a8c62d00009d96eca4f5c8d2ab6f0113.zip | |
style.css: :focus -> :focus-visible
Users who actually click on the header label won't get that focus
outline any more. It's still provided for keyboard users, for whom the
outline may be necessary for accessibility.
References: https://stackoverflow.com/questions/31402576
Diffstat (limited to '')
| -rw-r--r-- | static/style.css | 6 |
1 files changed, 3 insertions, 3 deletions
diff --git a/static/style.css b/static/style.css index 4f2ceab..765f37a 100644 --- a/static/style.css +++ b/static/style.css @@ -46,8 +46,8 @@ html, code, pre { opacity: 0; position: absolute; } -.toggle-table-off:focus + table > thead > tr > th > label, -.toggle-table-on:focus + table > thead > tr > th > label { +.toggle-table-off:focus-visible + table > thead > tr > th > label, +.toggle-table-on:focus-visible + table > thead > tr > th > label { outline: 1.5px var(--primary-color) solid; } .toggle-table-off + table > thead > tr > th, .toggle-table-on + table > thead > tr > th { @@ -203,7 +203,7 @@ pre.chunk { .toggle-on-content { display: none; } -.toggle-on-toggle:focus + .toggle-on-header, .toggle-off-toggle:focus + .toggle-off-header { +.toggle-on-toggle:focus-visible + .toggle-on-header, .toggle-off-toggle:focus-visible + .toggle-off-header { outline: 1.5px var(--primary-color) solid; } .toggle-on-toggle:checked + .toggle-on-header + .toggle-on-content { |