diff options
| author | Guillaume Gomez <guillaume1.gomez@gmail.com> | 2017-12-06 00:42:33 +0100 |
|---|---|---|
| committer | Guillaume Gomez <guillaume1.gomez@gmail.com> | 2017-12-07 22:42:46 +0100 |
| commit | 71b70feb1ffaf98f4183fd94231ac3cc442651f0 (patch) | |
| tree | 8f82b5f7e037e95ad7c4289445d0a1c70d753f1b | |
| parent | 9c49f401fecd8c5ef42a33a070a61daa2b911b47 (diff) | |
| download | rust-71b70feb1ffaf98f4183fd94231ac3cc442651f0.tar.gz rust-71b70feb1ffaf98f4183fd94231ac3cc442651f0.zip | |
Greatly improve sidebar when width < 700px
| -rw-r--r-- | src/librustdoc/html/layout.rs | 1 | ||||
| -rw-r--r-- | src/librustdoc/html/render.rs | 7 | ||||
| -rw-r--r-- | src/librustdoc/html/static/main.js | 38 | ||||
| -rw-r--r-- | src/librustdoc/html/static/rustdoc.css | 29 |
4 files changed, 70 insertions, 5 deletions
diff --git a/src/librustdoc/html/layout.rs b/src/librustdoc/html/layout.rs index 8c14d1bbe8f..61de5f4bc4c 100644 --- a/src/librustdoc/html/layout.rs +++ b/src/librustdoc/html/layout.rs @@ -65,6 +65,7 @@ r##"<!DOCTYPE html> {before_content} <nav class="sidebar"> + <div class="sidebar-menu">☰</div> {logo} {sidebar} </nav> diff --git a/src/librustdoc/html/render.rs b/src/librustdoc/html/render.rs index 9dc01bb0916..d42faebd39e 100644 --- a/src/librustdoc/html/render.rs +++ b/src/librustdoc/html/render.rs @@ -3542,6 +3542,7 @@ impl<'a> fmt::Display for Sidebar<'a> { let cx = self.cx; let it = self.item; let parentlen = cx.current.len() - if it.is_mod() {1} else {0}; + let mut should_close = false; if it.is_struct() || it.is_trait() || it.is_primitive() || it.is_union() || it.is_enum() || it.is_mod() || it.is_typedef() @@ -3575,6 +3576,8 @@ impl<'a> fmt::Display for Sidebar<'a> { } } + write!(fmt, "<div class=\"sidebar-elems\">")?; + should_close = true; match it.inner { clean::StructItem(ref s) => sidebar_struct(fmt, it, s)?, clean::TraitItem(ref t) => sidebar_trait(fmt, it, t)?, @@ -3625,6 +3628,10 @@ impl<'a> fmt::Display for Sidebar<'a> { write!(fmt, "<script defer src=\"{path}sidebar-items.js\"></script>", path = relpath)?; } + if should_close { + // Closes sidebar-elems div. + write!(fmt, "</div>")?; + } Ok(()) } diff --git a/src/librustdoc/html/static/main.js b/src/librustdoc/html/static/main.js index bdd7b7dd0b7..0db739fe061 100644 --- a/src/librustdoc/html/static/main.js +++ b/src/librustdoc/html/static/main.js @@ -106,6 +106,24 @@ return (elem.offsetParent === null) } + function showSidebar() { + document.getElementsByClassName("sidebar-elems")[0].style.display = "block"; + var sidebar = document.getElementsByClassName('sidebar')[0]; + sidebar.style.position = 'fixed'; + sidebar.style.width = '100%'; + sidebar.style.marginLeft = '0'; + document.getElementsByTagName("body")[0].style.marginTop = '45px'; + } + + function hideSidebar() { + document.getElementsByClassName("sidebar-elems")[0].style.display = ""; + var sidebar = document.getElementsByClassName('sidebar')[0]; + sidebar.style.position = ''; + sidebar.style.width = ''; + sidebar.style.marginLeft = ''; + document.getElementsByTagName("body")[0].style.marginTop = ''; + } + // used for special search precedence var TY_PRIMITIVE = itemTypes.indexOf("primitive"); @@ -130,6 +148,8 @@ } function highlightSourceLines(ev) { + // If we're in mobile mode, we should add the sidebar in any case. + hideSidebar(); var search = document.getElementById("search"); var i, from, to, match = window.location.hash.match(/^#?(\d+)(?:-(\d+))?$/); if (match) { @@ -1459,7 +1479,7 @@ // delayed sidebar rendering. function initSidebarItems(items) { - var sidebar = document.getElementsByClassName('sidebar')[0]; + var sidebar = document.getElementsByClassName('sidebar-elems')[0]; var current = window.sidebarCurrent; function block(shortty, longty) { @@ -1829,6 +1849,22 @@ removeClass(search, "hidden"); search.innerHTML = '<h3 style="text-align: center;">Loading search results...</h3>'; } + + var sidebar_menu = document.getElementsByClassName("sidebar-menu")[0]; + if (sidebar_menu) { + sidebar_menu.onclick = function() { + var sidebar = document.getElementsByClassName('sidebar')[0]; + if (sidebar.style.position === "fixed") { + hideSidebar(); + } else { + showSidebar(); + } + }; + } + + window.onresize = function() { + hideSidebar(); + }; }()); // Sets the focus on the search bar at the top of the page diff --git a/src/librustdoc/html/static/rustdoc.css b/src/librustdoc/html/static/rustdoc.css index f32252b726c..af7374eb68b 100644 --- a/src/librustdoc/html/static/rustdoc.css +++ b/src/librustdoc/html/static/rustdoc.css @@ -263,6 +263,10 @@ nav.sub { width: 100%; } +.sidebar-menu { + display: none; +} + .content { padding: 15px 0; } @@ -823,7 +827,7 @@ span.since { position: static; } - .sidebar .location { + .sidebar > .location { float: right; margin: 0px; margin-top: 2px; @@ -843,16 +847,33 @@ span.since { margin-top: 5px; margin-bottom: 5px; float: left; + margin-left: 50px; } - nav.sub { - margin: 0 auto; + .sidebar-menu { + position: absolute; + font-size: 2rem; + cursor: pointer; + margin-top: 2px; + display: block; } - .sidebar .block { + .sidebar-elems { + background-color: #F1F1F1; + position: fixed; + z-index: 1; + left: 0; + top: 45px; + bottom: 0; + overflow-y: auto; + border-right: 1px solid #000; display: none; } + nav.sub { + margin: 0 auto; + } + .content { margin-left: 0px; } |