rustdoc: sidebar usability improvements #98772
Conversation
rustbot
added
the
T-rustdoc
|
Some changes occurred in HTML/CSS themes. A change occurred in the Ayu theme. cc @Cldfire Some changes occurred in HTML/CSS/JS. cc @GuillaumeGomez, @Folyd, @jsha |
|
r? @jsha (rust-highfive has picked a reviewer for you, use r? to override) |
rust-highfive
added
the
S-waiting-on-review
This commit ports the scroll locking behavior from the source sidebar to the regular sidebar, and also fixes some bad behavior where opening a "mobile" sidebar, and growing the viewport so that the "desktop" mode without scroll locking is activated, could potentially leave the page stuck.
On desktop, if you open the source code sidebar, it stays open even when you move from page to page. It used to do the same thing on mobile, but I think that's stupid. Since the file list fills the entire screen on mobile, and you can't really do anything with the currently selected file other than dismiss the "sidebar" to look at it, it's safe to assume that anybody who clicks a file in that list probably wants the list to go away so they can see it.
This fixes the extremely poor accessibility of the old system, making it possible to navigate the sidebar by keyboard, and also implicitly gives the sidebar items the correct ARIA roles.
This fixes tab focus, so that you can open and close the sidebar from keyboard.
notriddle
force-pushed
the
notriddle/sidebar-fixes
branch
from
96cb877
to
5594341
Compare
| bottom: 0; | ||
| left: 0; | ||
| right: 0; | ||
| width: 100%; |
There was a problem hiding this comment.
Why do you need to set the width here? Also why all these changes?
There was a problem hiding this comment.
The essential problem here is that the sidebar toggle element for the source code view is a <div>, rather than a <button>. That's bad, because it won't get reported correctly by accessibility tools, and will also not have a tab position, so you can't get at it with a keyboard.
Fixing that involves making it a <button>, but keeping the appearance the same means having to reset all the default button styles.
|
You made a lot of different UI and behaviour changes into one PR, so it's a bit tricky in here. Could you split fixes and improvements please? Otherwise I took a quite look and noted a few things:
|
On the left is the "before." On the right is the "after." Could you create a screenshot illustrating the problem? Because, to me, these look indistinguishable. |
Do we want that on mobile? The desktop behavior shouldn't be changed by this pull request, but on mobile, the sidebar acts as a modal drawer, which normally prevents the content that it partially covers up from being interacted with. It's especially annoying because, if I reach the top or bottom of the drawer and try to scroll, the view underneath will scroll instead rather than generating the "bounce" indication that I've reached the end. |
|
Okay, I split it up into four separate pull requests, one for each feature. |
|
The job Click to see the possible cause of the failure (guessed by this bot) |
Look at the small arrows, on their left to be more precise 😉
Hum, that is a good point. I think you're right and we should indeed lock it then. |
…details, r=GuillaumeGomez rustdoc: use <details> tag for the source code sidebar This fixes the extremely poor accessibility of the old system, making it possible to navigate the sidebar by keyboard, and also implicitly gives the sidebar items the correct ARIA roles. Split out separately from rust-lang#98772
…details, r=GuillaumeGomez rustdoc: use <details> tag for the source code sidebar This fixes the extremely poor accessibility of the old system, making it possible to navigate the sidebar by keyboard, and also implicitly gives the sidebar items the correct ARIA roles. Split out separately from rust-lang#98772
…details, r=GuillaumeGomez rustdoc: use <details> tag for the source code sidebar This fixes the extremely poor accessibility of the old system, making it possible to navigate the sidebar by keyboard, and also implicitly gives the sidebar items the correct ARIA roles. Split out separately from rust-lang#98772
…ebar-button, r=GuillaumeGomez rustdoc: make source sidebar toggle a real button This fixes tab focus, so that you can open and close the sidebar from keyboard. This should cause no visible change in appearance at all. The only way you'd know anything different is if you tried to use keyboard controls to open the source code file navigation sidebar. Separated out from rust-lang#98772
…auto-close, r=GuillaumeGomez rustdoc: improve click behavior of the source code mobile full-screen "sidebar" On desktop, if you open the source code sidebar, it stays open even when you move from page to page. It used to do the same thing on mobile, but I think that's stupid. Since the file list fills the entire screen on mobile, and you can't really do anything with the currently selected file other than dismiss the "sidebar" to look at it, it's safe to assume that anybody who clicks a file in that list probably wants the list to go away so they can see it. Split out separately from rust-lang#98772
…scroll-lock, r=jsha rustdoc: improve scroll locking in the rustdoc mobile sidebars This PR prevents the main content area from scrolling while the mobile sidebar is open on documentation pages (porting the scroll locking behavior from the source sidebar to the regular sidebar), and also fixes some bad behavior where opening a "mobile" sidebar, and growing the viewport so that the "desktop" mode without scroll locking is activated, could potentially leave the page stuck. This does not affect the behavior on larger screens. Only small ones, where the sidebar covers up the main content. Split out from rust-lang#98772
<details>tag for the source sidebar directory tree.https://notriddle.com/notriddle-rustdoc-test/sidebar-fixes/std/