mirror of
https://github.com/rust-lang/rust.git
synced 2025-04-28 02:57:37 +00:00
Rollup merge of #91905 - GuillaumeGomez:source-code-page-sidebar, r=jsha
Fix source code page sidebar on mobile Current broken behaviour: https://user-images.githubusercontent.com/3050060/145984316-35c82353-5bab-4dc6-9ac6-63ea7e5c27d8.mp4 Fixed: https://user-images.githubusercontent.com/3050060/145984329-8be1127b-d707-424d-ac3c-c1fb3c48a093.mp4 r? `@jsha`
This commit is contained in:
commit
6132a2b55a
@ -373,7 +373,6 @@ nav.sub {
|
||||
|
||||
.source .sidebar.expanded {
|
||||
overflow-y: auto;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.source .sidebar.expanded > * {
|
||||
@ -1394,7 +1393,7 @@ pre.rust {
|
||||
z-index: 10;
|
||||
}
|
||||
#source-sidebar {
|
||||
width: 300px;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
overflow: auto;
|
||||
}
|
||||
@ -1711,6 +1710,10 @@ details.rustdoc-toggle[open] > summary.hideme::after {
|
||||
.rustdoc.source .sidebar {
|
||||
transition: width .5s;
|
||||
}
|
||||
|
||||
.source .sidebar.expanded {
|
||||
width: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 700px) {
|
||||
@ -1999,6 +2002,11 @@ details.rustdoc-toggle[open] > summary.hideme::after {
|
||||
.search-results div.desc, .search-results .result-description, .item-right {
|
||||
padding-left: 2em;
|
||||
}
|
||||
|
||||
.source .sidebar.expanded {
|
||||
max-width: 100vw;
|
||||
width: 100vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
32
src/test/rustdoc-gui/sidebar-source-code.goml
Normal file
32
src/test/rustdoc-gui/sidebar-source-code.goml
Normal file
@ -0,0 +1,32 @@
|
||||
// The goal of this test is to ensure that the sidebar is working as expected in the source
|
||||
// code pages.
|
||||
goto: file://|DOC_PATH|/src/test_docs/lib.rs.html
|
||||
// First: desktop mode.
|
||||
size: (1100, 800)
|
||||
// We check that the sidebar isn't expanded and has the expected width.
|
||||
assert-css: ("nav.sidebar", {"width": "50px"})
|
||||
// We now click on the button to expand the sidebar.
|
||||
click: (10, 10)
|
||||
// We wait for the sidebar to be expanded (there is a 0.5s animation).
|
||||
wait-for: 600
|
||||
assert-css: ("nav.sidebar.expanded", {"width": "300px"})
|
||||
// We collapse the sidebar.
|
||||
click: (10, 10)
|
||||
// We wait for the sidebar to be collapsed (there is a 0.5s animation).
|
||||
wait-for: 600
|
||||
// We ensure that the class has been removed.
|
||||
assert-false: "nav.sidebar.expanded"
|
||||
assert: "nav.sidebar"
|
||||
|
||||
// We now switch to mobile mode.
|
||||
size: (600, 600)
|
||||
// We check that the sidebar has the expected width (0 and 1px for the border).
|
||||
assert-css: ("nav.sidebar", {"width": "1px"})
|
||||
// We expand the sidebar.
|
||||
click: "#sidebar-toggle"
|
||||
assert-css: ("nav.sidebar.expanded", {"width": "600px"})
|
||||
// We collapse the sidebar.
|
||||
click: (10, 10)
|
||||
// We ensure that the class has been removed.
|
||||
assert-false: "nav.sidebar.expanded"
|
||||
assert: "nav.sidebar"
|
Loading…
Reference in New Issue
Block a user