Andrew
2024-08-09 27a41abb62cc9005ed4234bdb02f38b6cfeedec3
refs
author Andrew <80933354+ndrooo@users.noreply.github.com>
Friday, August 9, 2024 01:07 +0000
committer GitHub <noreply@github.com>
Friday, August 9, 2024 01:07 +0000
commit27a41abb62cc9005ed4234bdb02f38b6cfeedec3
tree 072e73609639fd8b5b2d9be4e5e091a60228b39b tree | zip | gz
parent 12904ab7960edc3bedd77c65cf5e6a5d599d882d view | diff
feat(toc,explorer): add accessibility for toggle (#1327)

* Restore focus highlight on explorer toggle button.

Remove `unset: all` declaration causing `outline`
property to be unset. This allows the default
browser focus highlight to be shown.

* Fix semantics of expandable sections (explorer, toc).

This adds the appropriate aria attributes for the [disclosure pattern](https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/examples/disclosure-image-description/#javascriptandcsssourcecode) and uses `visibility: hidden` to remove the hidden elements from the focus order without disrupting the animations. Further work is needed on the tree view nodes.

* Run prettier for SCSS files.
6 files modified
43 ■■■■■ changed files
quartz/components/Explorer.tsx 2 ●●●●● diff | view | raw | blame | history
quartz/components/TableOfContents.tsx 8 ●●●● diff | view | raw | blame | history
quartz/components/scripts/explorer.inline.ts 4 ●●●● diff | view | raw | blame | history
quartz/components/scripts/toc.inline.ts 4 ●●●● diff | view | raw | blame | history
quartz/components/styles/explorer.scss 13 ●●●● diff | view | raw | blame | history
quartz/components/styles/toc.scss 12 ●●●●● diff | view | raw | blame | history