From b4b5ad39932b9f56a16e1d0a8c96f75b32e934fc Mon Sep 17 00:00:00 2001
From: Annabel Dunstone Gray <annabel.dunstone@gmail.com>
Date: Tue, 18 Jul 2017 11:40:42 -0500
Subject: Make sidebar accessible on mobile

---
 app/assets/stylesheets/new_sidebar.scss | 19 ++++++++++++++++---
 1 file changed, 16 insertions(+), 3 deletions(-)

(limited to 'app/assets/stylesheets/new_sidebar.scss')

diff --git a/app/assets/stylesheets/new_sidebar.scss b/app/assets/stylesheets/new_sidebar.scss
index eaf7daaa5cf..0ab5322a7a4 100644
--- a/app/assets/stylesheets/new_sidebar.scss
+++ b/app/assets/stylesheets/new_sidebar.scss
@@ -115,7 +115,7 @@ $new-sidebar-width: 220px;
   position: fixed;
   z-index: 400;
   width: $new-sidebar-width;
-  transition: width $sidebar-transition-duration;
+  transition: left $sidebar-transition-duration;
   top: 50px;
   bottom: 0;
   left: 0;
@@ -124,7 +124,7 @@ $new-sidebar-width: 220px;
   box-shadow: inset -2px 0 0 $border-color;
 
   &.nav-sidebar-expanded {
-    width: $new-sidebar-width;
+    left: 0;
   }
 
   a {
@@ -156,7 +156,7 @@ $new-sidebar-width: 220px;
   }
 
   @media (max-width: $screen-xs-max) {
-    width: 0;
+    left: (-$new-sidebar-width);
   }
 }
 
@@ -242,6 +242,19 @@ $new-sidebar-width: 220px;
   }
 }
 
+.mobile-overlay {
+  display: none;
+
+  &.mobile-nav-open {
+    display: block;
+    position: absolute;
+    background-color: $black-transparent;
+    height: 100%;
+    width: 100%;
+    z-index: 300;
+  }
+}
+
 
 // Make issue boards full-height now that sub-nav is gone
 
-- 
cgit v1.2.1