Merge pull request docker#11381 from ingshtrom/11366-sidebar-formatting-fix

fix the background color of the sidebar on 'medium' sized devices

Author: usha-mandya

_scss/_mobile.scss

@@ -61,6 +61,7 @@
         position: fixed;
         width: 100%;
         z-index: 100;
+        background-color: $bg-sidebar;
     }
     .main-content {
         padding: 22px 35px 25px 30px;
@@ -117,16 +118,10 @@
     .header {
         height: 100px;
     }
-    .nav-secondary-tabs,
-    .nav-secondary {
-        background-color: $black;
-    }
-    .nav-secondary input[type=search] {
-        background: rgb(78, 77, 77) url(/images/search.png) no-repeat 10px 9px;
-    }
+    /*.nav-secondary-tabs,
     .nav-sidebar a {
         color: #a8a8a8;
-    }
+    }*/
     .tabs {
         float: left;
         margin: 0;
@@ -147,8 +142,8 @@
     }
     .sidebar,
     .sidebar-home {
-        background-color: #15212e;
-        border-right: 1px solid rgba(204,204,204,0.29);
+        background-color: $bg-sidebar;
+        /*border-right: 1px solid rgba(204,204,204,0.29);*/
         top: 51px;
         left: 0;
         display: block;
@@ -236,23 +231,18 @@
     .nav-secondary-tabs {
         height: 100px;
     }
-    .nav-secondary {
-        background: $black;
-        height: 100px;
-    }
     .content {
         padding: 120px 20px;
     }
     .main-content {
         padding: 0 10px;
     }
-    .nav-sidebar a {
+    /*.nav-sidebar a {
         color: #a8a8a8;
-    }
+    }*/
     .sidebar,
     .sidebar-home {
-        background-color: #15212e;
-        border-right: 1px solid rgba(204,204,204,0.29);
+        background-color: $bg-sidebar;
         top: 51px;
         left: 0;
         display: block;
@@ -310,15 +300,8 @@
     .toc-nav a {
         font-size: 11px;
     }
-}
-
-/* Portrait */
-@media only screen
-  and (min-device-width: 768px)
-  and (max-device-width: 1024px)
-  and (orientation: portrait) {
-    .nav-secondary input[type=search] {
-        background: rgba(255, 255, 255, 0.17) url(/images/search.png) no-repeat 10px 9px;
+    .sidebar {
+        background-color: $bg-sidebar;
     }
 }
 
@@ -337,9 +320,6 @@
     .sidebar, .sidebar.affix {
         width: 270px;
     }
-    .nav-secondary input[type=search] {
-        background: rgba(255, 255, 255, 0.17) url(/images/search.png) no-repeat 10px 9px;
-    }
 }
 
 .navbar-toggle {
@@ -358,8 +338,8 @@
 
 @media (max-width: 1024px) {
     .nav-secondary-tabs.affix-top {
-        // background-color: $bg-secondary;
-        background-color: rgba(0,0,0,.05);
+        /*background-color: $bg-secondary;
+        background-color: rgba(0,0,0,.05); */
         position: fixed;
         top: 0;
     }

_scss/_night-mode.scss

@@ -55,6 +55,7 @@ body.night {
     .nav-secondary .search-form input[type=search]:focus {
         background: rgba(255, 255, 255, 0.17) url(/images/search.png) no-repeat 10px 9px !important;
     }
+    .sidebar,
     .sidebar-home,
     #sidebar-wrapper,
     #sidebar-wrapper-home,