Noissue - Fix broken layout from changeset 1940351cdb4c

static/scss/layout/_breadcrumbs.scss

Index: static/scss/layout/_breadcrumbs.scss
===================================================================
--- a/static/scss/layout/_breadcrumbs.scss
+++ b/static/scss/layout/_breadcrumbs.scss
@@ -12,17 +12,16 @@
 // GNU General Public License for more details.
 //
 // You should have received a copy of the GNU General Public License
 // along with acceptableads.org.  If not, see <http://www.gnu.org/licenses/>.
 
 #breadcrumbs
 {
   position: absolute;
-  z-index: 1;
   top: $lg;
   left: 0;
   width: 100%;
   text-transform: uppercase;
   color: $secondary-fg;
   background-color: $secondary-bg;
   font-size: $font-size-xs;
   font-weight: 400;
@@ -78,32 +77,43 @@
       color: $secondary-fg;
       font-weight: 300;
     }
   }
 }
 
 .js #breadcrumbs
 {
-  position: fixed;
+  z-index: 1;
 }
 
 @media(max-width: $sidebar-breakpoint-x - 1)
 {
   #breadcrumbs ol
   {
     padding: 0 $sm;
   }
+
+  html:not(.open-sidebar).mobile #breadcrumbs
+  {
+    position: fixed;
+    transition: transform 0.2s ease-in-out;
+  }
+
+  html:not(.open-sidebar).mobile.scrollDown #breadcrumbs
+  {
+    transform: translate(0,-$header-height);
+  }
 }
 
 // Fix breadcrumbs on desktops
 @media(min-width: $sidebar-breakpoint-x)
 {
   html[dir="ltr"] #breadcrumbs
   {
-    margin-left: $sidebar-width;
+    padding-left: $sidebar-width;
   }
 
   html[dir="rtl"] #breadcrumbs
   {
-    margin-right: $sidebar-width;
+    padding-right: $sidebar-width;
   }
 }