Merge branch 'collapseable-nav' of https://github.com/jasonblanchard/gitlabhq into jasonblanchard-collapseable-nav

5 files changed, 60 insertions, 2 deletions

diff --git a/app/assets/javascripts/sidebar.js.coffee b/app/assets/javascripts/sidebar.js.coffee
index c084d730d62..d1b165a2311 100644
--- a/app/assets/javascripts/sidebar.js.coffee
+++ b/app/assets/javascripts/sidebar.js.coffee
@@ -24,3 +24,13 @@ $ ->
 $(window).resize ->
   responsive_resize()
   return
+
+$(document).on("click", '.toggle-nav-collapse', (e) ->
+  e.preventDefault()
+  if $('.page-with-sidebar').hasClass('collapsed')
+    $('.page-with-sidebar').removeClass('collapsed')
+    $.cookie("collapsed_nav", "false", { path: '/' })
+  else
+    $('.page-with-sidebar').addClass('collapsed')
+    $.cookie("collapsed_nav", "true", { path: '/' })
+)
diff --git a/app/assets/stylesheets/sections/nav_sidebar.scss b/app/assets/stylesheets/sections/nav_sidebar.scss
index a61c053b8a9..0c278aec3f5 100644
--- a/app/assets/stylesheets/sections/nav_sidebar.scss
+++ b/app/assets/stylesheets/sections/nav_sidebar.scss
@@ -110,7 +110,7 @@
 
     .nav-sidebar {
       margin-top: 20px;
-      position: fixed;
+      position: relative;
       top: 45px;
       width: $sidebar_width;
     }
@@ -150,6 +150,37 @@
   }
 }
 
+.collapse-nav {
+  position: relative;
+  top: 50px;
+  width: 230px;
+  text-align: right;
+  padding-right: 21px;
+}
+
+.page-with-sidebar.collapsed {
+
+  .collapse-nav {
+    width: 53px;
+  }
+
+  padding-left: 50px;
+
+  .sidebar-wrapper {
+    width: 52px;
+    overflow-x: hidden;
+
+    .nav-sidebar {
+      width: 52px;
+    }
+    
+    .nav-sidebar li a > span {
+      display: none;
+    }
+  }
+}
+
+
 @media (max-width: $screen-md-max) {
   @include folded-sidebar;
 }
@@ -157,3 +188,9 @@
 @media(min-width: $screen-md-max) {
   @include expanded-sidebar;
 }
+
+@media (max-width: $screen-md-max) {
+  .collapse-nav {
+    display: none;
+  }
+}
diff --git a/app/helpers/nav_helper.rb b/app/helpers/nav_helper.rb
new file mode 100644
index 00000000000..2b03269800e
--- /dev/null
+++ b/app/helpers/nav_helper.rb
@@ -0,0 +1,5 @@
+module NavHelper
+  def nav_menu_collapsed?
+    cookies[:collapsed_nav] == 'true'
+  end
+end
diff --git a/app/views/layouts/_collapse_button.html.haml b/app/views/layouts/_collapse_button.html.haml
new file mode 100644
index 00000000000..52c19f1d99d
--- /dev/null
+++ b/app/views/layouts/_collapse_button.html.haml
@@ -0,0 +1,4 @@
+- if nav_menu_collapsed?
+  = link_to icon('plus-square'), '#', class: 'toggle-nav-collapse'
+- else
+  = link_to icon('minus-square'), '#', class: 'toggle-nav-collapse'
diff --git a/app/views/layouts/_page.html.haml b/app/views/layouts/_page.html.haml
index 1263f44eca9..e20aec89110 100644
--- a/app/views/layouts/_page.html.haml
+++ b/app/views/layouts/_page.html.haml
@@ -1,8 +1,10 @@
 - if defined?(sidebar)
-  .page-with-sidebar
+  .page-with-sidebar{:class => ("collapsed" if nav_menu_collapsed?)}
     = render "layouts/broadcast"
     .sidebar-wrapper
       = render(sidebar)
+      .collapse-nav
+        = render :partial => 'layouts/collapse_button'
     .content-wrapper
       .container-fluid
         .content