Skip to content

Commit 35a53b2

Browse files
authored
Rollup merge of rust-lang#93067 - jsha:fix-scroll-padding-top, r=GuillaumeGomez
rustdoc mobile: fix scroll offset when jumping to internal id Followup to rust-lang#92692. The semantics of `scroll-margin-top` are a little surprising - the attribute needs to be applied to the element that gets scrolled into the viewport, not the scrolling element. This fixes an issue where clicking on a method (or other item) from the sidebar takes you to a scroll position where the topbar covers up the method name. I'm interested in ideas for how to test this with browser-ui-test, but I think it doesn't yet have what I need. What I need is an assert that `<element>.getBoundingClientRect().y` is > 45. Demo: https://rustdoc.crud.net/jsha/fix-scroll-padding-top/std/string/struct.String.html#method.extend_from_within r? `@GuillaumeGomez`
2 parents dc393b2 + 801ac0e commit 35a53b2

File tree

2 files changed

+14
-1
lines changed

2 files changed

+14
-1
lines changed

src/librustdoc/html/static/css/rustdoc.css

+8-1
Original file line numberDiff line numberDiff line change
@@ -1735,12 +1735,19 @@ details.rustdoc-toggle[open] > summary.hideme::after {
17351735
}
17361736

17371737
@media (max-width: 700px) {
1738+
/* When linking to an item with an `id` (for instance, by clicking a link in the sidebar,
1739+
or visiting a URL with a fragment like `#method.new`, we don't want the item to be obscured
1740+
by the topbar. Anything with an `id` gets scroll-margin-top equal to .mobile-topbar's size.
1741+
*/
1742+
*[id] {
1743+
scroll-margin-top: 45px;
1744+
}
1745+
17381746
.rustdoc {
17391747
padding-top: 0px;
17401748
/* Sidebar should overlay main content, rather than pushing main content to the right.
17411749
Turn off `display: flex` on the body element. */
17421750
display: block;
1743-
scroll-margin-top: 45px;
17441751
}
17451752

17461753
main {

src/test/rustdoc-gui/sidebar-mobile.goml

+6
Original file line numberDiff line numberDiff line change
@@ -29,3 +29,9 @@ assert-css: (".sidebar", {"display": "block", "left": "-1000px"})
2929

3030
// Check that the topbar is visible
3131
assert-property: (".mobile-topbar", {"clientHeight": "45"})
32+
33+
// Check that clicking an element from the sidebar scrolls to the right place
34+
// so the target is not obscured by the topbar.
35+
click: ".sidebar-menu-toggle"
36+
click: ".sidebar-links a"
37+
assert-position: ("#method\.must_use", {"y": 45})

0 commit comments

Comments
 (0)