Fix corner cases when dealing with mobile mode

This commit is contained in:
Michael Howell 2023-12-19 18:22:38 -07:00
parent 34984a6830
commit 9566db1e49
4 changed files with 45 additions and 17 deletions

View file

@ -1560,6 +1560,9 @@ a.tooltip:hover::after {
left: 8px;
z-index: 101;
}
.hide-sidebar .src #sidebar-button {
position: static;
}
#settings-menu > a, #help-button > a, #sidebar-button > a {
display: flex;
align-items: center;
@ -1896,6 +1899,12 @@ in src-script.js and main.js
.src .search-form {
margin-left: 40px;
}
.hide-sidebar .search-form {
margin-left: 32px;
}
.hide-sidebar .src .search-form {
margin-left: 0;
}
.sidebar.shown,
.src-sidebar-expanded .src .sidebar,
@ -2020,12 +2029,6 @@ in src-script.js and main.js
.src .src-sidebar-title {
padding-top: 0;
}
.hide-sidebar #sidebar-button {
position: static;
}
.src #sidebar-button {
position: fixed;
}
/* Position of the "[-]" element. */
details.toggle:not(.top-doc) > summary {

View file

@ -1519,18 +1519,14 @@ href="https://doc.rust-lang.org/${channel}/rustdoc/read-documentation/search.htm
// and it can be activated by resizing the sidebar into nothing.
const sidebarButton = document.getElementById("sidebar-button");
if (sidebarButton) {
if (document.querySelector(".rustdoc.src")) {
sidebarButton.addEventListener("click", e => {
sidebarButton.addEventListener("click", e => {
removeClass(document.documentElement, "hide-sidebar");
updateLocalStorage("hide-sidebar", "false");
if (document.querySelector(".rustdoc.src")) {
window.rustdocToggleSrcSidebar();
e.preventDefault();
});
} else {
sidebarButton.addEventListener("click", e => {
removeClass(document.documentElement, "hide-sidebar");
updateLocalStorage("hide-sidebar", "false");
e.preventDefault();
});
}
}
e.preventDefault();
});
}
// Pointer capture.

View file

@ -21,3 +21,31 @@ wait-for-css: ("#settings", {"display": "block"})
assert-property: ("#hide-sidebar", {"checked": "true"})
click: "#hide-sidebar"
wait-for-css: (".sidebar", {"display": "block"})
// Verify that hiding the sidebar hides the source sidebar
// and puts the button in static position mode on mobile
go-to: "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html"
set-window-size: (600, 600)
focus: "#settings-menu a"
press-key: "Enter"
wait-for-css: ("#settings", {"display": "block"})
wait-for-css: ("#sidebar-button", {"position": "fixed"})
store-position: ("#sidebar-button", {
"y": sidebar_button_y,
"x": sidebar_button_x,
})
assert-property: ("#hide-sidebar", {"checked": "false"})
click: "#hide-sidebar"
wait-for-css: (".sidebar", {"display": "none"})
wait-for-css: ("#sidebar-button", {"position": "static"})
assert-position: ("#sidebar-button", {
"y": |sidebar_button_y|,
"x": |sidebar_button_x|,
})
assert-property: ("#hide-sidebar", {"checked": "true"})
press-key: "Escape"
// Clicking the sidebar button should work, and implicitly re-enable
// the persistent navigation bar
wait-for-css: ("#settings", {"display": "none"})
click: "#sidebar-button"
wait-for-css: (".sidebar", {"display": "block"})

View file

@ -18,6 +18,7 @@
--code-attribute-color: #999;
--toggles-color: #999;
--toggle-filter: none;
--mobile-sidebar-menu-filter: none;
--search-input-focused-border-color: #66afe9;
--copy-path-button-color: #999;
--copy-path-img-filter: invert(50%);