Fix sidebar on ios

diff --git a/src/librustdoc/html/static/main.js b/src/librustdoc/html/static/main.js
index e6cf27b2008bf9c77274da45cf1540917b0222e3..559f8494fc3c0a4d863022f1c14698fbc15e8876 100644 (file)
--- a/src/librustdoc/html/static/main.js
+++ b/src/librustdoc/html/static/main.js
@@ -109,24 +109,32 @@
     function showSidebar() {
         var elems = document.getElementsByClassName("sidebar-elems")[0];
         if (elems) {
-            elems.style.display = "block";
+            addClass(elems, "show-it");
         }
         var sidebar = document.getElementsByClassName('sidebar')[0];
-        sidebar.style.position = 'fixed';
-        sidebar.style.width = '100%';
-        sidebar.style.marginLeft = '0';
+        if (sidebar) {
+            addClass(sidebar, 'mobile');
+            var filler = document.getElementById("sidebar-filler");
+            if (!filler) {
+                var div = document.createElement("div");
+                div.id = "sidebar-filler";
+                sidebar.appendChild(div);
+            }
+        }
         document.getElementsByTagName("body")[0].style.marginTop = '45px';
     }
 
     function hideSidebar() {
         var elems = document.getElementsByClassName("sidebar-elems")[0];
         if (elems) {
-            elems.style.display = "";
+            removeClass(elems, "show-it");
         }
         var sidebar = document.getElementsByClassName('sidebar')[0];
-        sidebar.style.position = '';
-        sidebar.style.width = '';
-        sidebar.style.marginLeft = '';
+        removeClass(sidebar, 'mobile');
+        var filler = document.getElementById("sidebar-filler");
+        if (filler) {
+            filler.remove();
+        }
         document.getElementsByTagName("body")[0].style.marginTop = '';
     }
 
@@ -1859,7 +1867,7 @@
     if (sidebar_menu) {
         sidebar_menu.onclick = function() {
             var sidebar = document.getElementsByClassName('sidebar')[0];
-            if (sidebar.style.position === "fixed") {
+            if (hasClass(sidebar, "mobile") === true) {
                 hideSidebar();
             } else {
                 showSidebar();

diff --git a/src/librustdoc/html/static/rustdoc.css b/src/librustdoc/html/static/rustdoc.css
index e620abea2777b7189f81085026f121d282375441..b41874a56b8e722e357fb3dc67769f8c9cf3aee4 100644 (file)
--- a/src/librustdoc/html/static/rustdoc.css
+++ b/src/librustdoc/html/static/rustdoc.css
@@ -1020,6 +1020,33 @@ h4 > .important-traits {
        #titles {
                height: 50px;
        }
+
+       .sidebar.mobile {
+               position: fixed;
+               width: 100%;
+               margin-left: 0;
+               background-color: rgba(0,0,0,0);
+               height: 100%;
+       }
+
+       .show-it {
+               display: block;
+       }
+
+       /* Because of ios, we need to actually have a full height sidebar title so the
+        * actual sidebar can show up. But then we need to make it transparent so we don't
+        * hide content. The filler just allows to create the background for the sidebar
+        * title. But because of the absolute position, I had to lower the z-index.
+        */
+       #sidebar-filler {
+               position: fixed;
+               left: 45px;
+               width: calc(100% - 45px);
+               top: 0;
+               height: 45px;
+               z-index: -1;
+               border-bottom: 1px solid;
+       }
 }
 
 

diff --git a/src/librustdoc/html/static/styles/main.css b/src/librustdoc/html/static/styles/main.css
index c31808cfc0f6d96c1ae93bc3fa127460c4c1a760..c79413c0852cec3de8c876fd2361790c4db10ecd 100644 (file)
--- a/src/librustdoc/html/static/styles/main.css
+++ b/src/librustdoc/html/static/styles/main.css
@@ -191,7 +191,7 @@ a.test-arrow {
 
 #help > div {
        background: #e9e9e9;
-       border-color: #bfbfbf;;
+       border-color: #bfbfbf;
 }
 
 #help dt {
@@ -342,4 +342,9 @@ pre.ignore:hover, .information:hover + pre.ignore {
                background-color: #F1F1F1;
                border-right-color: #000;
        }
+
+       #sidebar-filler {
+               background-color: #F1F1F1;
+               border-bottom-color: #e0e0e0;
+       }
 }