Skip to content

Use a different CSS class to mark TOC levels as visible #2163

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged

Conversation

gabalafou
Copy link
Collaborator

Fixes #2156.

The underlying issue was that the CSS class visible is targeted by Bootstrap and results in the following rule:

visibility: visible !important;

which gets applied to the ul elements in the secondary sidebar. This overrides the visibility: hidden rule set on the sidebar container element, making the links focusable via the tab key.

How to test

  1. On a desktop computer, go to a page in Read The Docs preview build. This page should have a right sidebar visible — i.e., the in-page table of contents.
  2. Click near the bottom of the article and repeatedly press the tab key to observe how it moves through the links in the secondary sidebar.
  3. Zoom the page, or narrow the width of your screen, until the secondary sidebar disappears.
  4. Again, click near the bottom article before the article footer (which has two links to the previous and next articles)
  5. Press the tab key and watch the focus move to those two previous/next footer links.
  6. Keep pressing the tab key and observe that it does not go through any of the links in the sidebar. (Before this PR, the tab key would take you through the links in the sidebar, even though those links were not visible.)

@gabalafou
Copy link
Collaborator Author

For reference, the PR that added the visible class to the ul elements in the page TOC:

@trallard trallard added kind: bug Something isn't working tag: component Issues or improvements associated with a given component in the theme labels Mar 12, 2025
@trallard trallard merged commit 71ecc96 into pydata:main Mar 25, 2025
31 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
kind: bug Something isn't working tag: component Issues or improvements associated with a given component in the theme
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Keyboard tabbing stops on hidden secondary sidebar elements (in page TOC/secondary sidebar)
3 participants