Skip to content

Commit 1b7ea6d

Browse files
GuillaumeGomezGuillaumeGomez
authored
Rollup merge of rust-lang#46526 - GuillaumeGomez:mobile-sidebar, r=QuietMisdreavus
Greatly improve sidebar when width < 700px Fixes rust-lang#36531. r? @QuietMisdreavus A few screenshots: <img width="1440" alt="screen shot 2017-12-06 at 00 41 36" src="https://user-images.githubusercontent.com/3050060/33636875-6ad8b1a6-da1e-11e7-8d5b-d6d530ea5258.png"> <img width="1440" alt="screen shot 2017-12-06 at 00 41 40" src="https://user-images.githubusercontent.com/3050060/33636876-6af58196-da1e-11e7-82ab-b82768958037.png">
2 parents 14f2bc0 + 423e5ac commit 1b7ea6d

File tree

4 files changed

+76
-5
lines changed

4 files changed

+76
-5
lines changed

‎src/librustdoc/html/layout.rs

+1
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,7 @@ r##"<!DOCTYPE html>
6565
{before_content}
6666
6767
<nav class="sidebar">
68+
<div class="sidebar-menu">&#9776;</div>
6869
{logo}
6970
{sidebar}
7071
</nav>

‎src/librustdoc/html/render.rs

+7
Original file line numberDiff line numberDiff line change
@@ -3542,6 +3542,7 @@ impl<'a> fmt::Display for Sidebar<'a> {
35423542
let cx = self.cx;
35433543
let it = self.item;
35443544
let parentlen = cx.current.len() - if it.is_mod() {1} else {0};
3545+
let mut should_close = false;
35453546

35463547
if it.is_struct() || it.is_trait() || it.is_primitive() || it.is_union()
35473548
|| it.is_enum() || it.is_mod() || it.is_typedef()
@@ -3575,6 +3576,8 @@ impl<'a> fmt::Display for Sidebar<'a> {
35753576
}
35763577
}
35773578

3579+
write!(fmt, "<div class=\"sidebar-elems\">")?;
3580+
should_close = true;
35783581
match it.inner {
35793582
clean::StructItem(ref s) => sidebar_struct(fmt, it, s)?,
35803583
clean::TraitItem(ref t) => sidebar_trait(fmt, it, t)?,
@@ -3625,6 +3628,10 @@ impl<'a> fmt::Display for Sidebar<'a> {
36253628
write!(fmt, "<script defer src=\"{path}sidebar-items.js\"></script>",
36263629
path = relpath)?;
36273630
}
3631+
if should_close {
3632+
// Closes sidebar-elems div.
3633+
write!(fmt, "</div>")?;
3634+
}
36283635

36293636
Ok(())
36303637
}

‎src/librustdoc/html/static/main.js

+43-1
Original file line numberDiff line numberDiff line change
@@ -106,6 +106,30 @@
106106
return (elem.offsetParent === null)
107107
}
108108

109+
function showSidebar() {
110+
var elems = document.getElementsByClassName("sidebar-elems")[0];
111+
if (elems) {
112+
elems.style.display = "block";
113+
}
114+
var sidebar = document.getElementsByClassName('sidebar')[0];
115+
sidebar.style.position = 'fixed';
116+
sidebar.style.width = '100%';
117+
sidebar.style.marginLeft = '0';
118+
document.getElementsByTagName("body")[0].style.marginTop = '45px';
119+
}
120+
121+
function hideSidebar() {
122+
var elems = document.getElementsByClassName("sidebar-elems")[0];
123+
if (elems) {
124+
elems.style.display = "";
125+
}
126+
var sidebar = document.getElementsByClassName('sidebar')[0];
127+
sidebar.style.position = '';
128+
sidebar.style.width = '';
129+
sidebar.style.marginLeft = '';
130+
document.getElementsByTagName("body")[0].style.marginTop = '';
131+
}
132+
109133
// used for special search precedence
110134
var TY_PRIMITIVE = itemTypes.indexOf("primitive");
111135

@@ -130,6 +154,8 @@
130154
}
131155

132156
function highlightSourceLines(ev) {
157+
// If we're in mobile mode, we should add the sidebar in any case.
158+
hideSidebar();
133159
var search = document.getElementById("search");
134160
var i, from, to, match = window.location.hash.match(/^#?(\d+)(?:-(\d+))?$/);
135161
if (match) {
@@ -1459,7 +1485,7 @@
14591485

14601486
// delayed sidebar rendering.
14611487
function initSidebarItems(items) {
1462-
var sidebar = document.getElementsByClassName('sidebar')[0];
1488+
var sidebar = document.getElementsByClassName('sidebar-elems')[0];
14631489
var current = window.sidebarCurrent;
14641490

14651491
function block(shortty, longty) {
@@ -1829,6 +1855,22 @@
18291855
removeClass(search, "hidden");
18301856
search.innerHTML = '<h3 style="text-align: center;">Loading search results...</h3>';
18311857
}
1858+
1859+
var sidebar_menu = document.getElementsByClassName("sidebar-menu")[0];
1860+
if (sidebar_menu) {
1861+
sidebar_menu.onclick = function() {
1862+
var sidebar = document.getElementsByClassName('sidebar')[0];
1863+
if (sidebar.style.position === "fixed") {
1864+
hideSidebar();
1865+
} else {
1866+
showSidebar();
1867+
}
1868+
};
1869+
}
1870+
1871+
window.onresize = function() {
1872+
hideSidebar();
1873+
};
18321874
}());
18331875

18341876
// Sets the focus on the search bar at the top of the page

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

+25-4
Original file line numberDiff line numberDiff line change
@@ -263,6 +263,10 @@ nav.sub {
263263
width: 100%;
264264
}
265265

266+
.sidebar-menu {
267+
display: none;
268+
}
269+
266270
.content {
267271
padding: 15px 0;
268272
}
@@ -820,7 +824,7 @@ span.since {
820824
position: static;
821825
}
822826

823-
.sidebar .location {
827+
.sidebar > .location {
824828
float: right;
825829
margin: 0px;
826830
margin-top: 2px;
@@ -840,16 +844,33 @@ span.since {
840844
margin-top: 5px;
841845
margin-bottom: 5px;
842846
float: left;
847+
margin-left: 50px;
843848
}
844849

845-
nav.sub {
846-
margin: 0 auto;
850+
.sidebar-menu {
851+
position: absolute;
852+
font-size: 2rem;
853+
cursor: pointer;
854+
margin-top: 2px;
855+
display: block;
847856
}
848857

849-
.sidebar .block {
858+
.sidebar-elems {
859+
background-color: #F1F1F1;
860+
position: fixed;
861+
z-index: 1;
862+
left: 0;
863+
top: 45px;
864+
bottom: 0;
865+
overflow-y: auto;
866+
border-right: 1px solid #000;
850867
display: none;
851868
}
852869

870+
nav.sub {
871+
margin: 0 auto;
872+
}
873+
853874
.content {
854875
margin-left: 0px;
855876
}

0 commit comments

Comments
 (0)