diff --git a/CHANGELOG b/CHANGELOG index a017fcd41a023ad949b050d22606c72fee2e1f98..93abec424d7cebed4f29049190fa62021d6c7705 100644 --- a/CHANGELOG +++ b/CHANGELOG @@ -62,6 +62,7 @@ v 7.8.0 - - - Added support for firing system hooks on group create/destroy and adding/removing users to group (Boyan Tabakov) + - Added persistent collapse button for left side nav bar (Jason Blanchard) v 7.7.2 - Update GitLab Shell to version 2.4.2 that fixes a bug when developers can push to protected branch diff --git a/app/assets/javascripts/sidebar.js.coffee b/app/assets/javascripts/sidebar.js.coffee index c084d730d628a937e56c6f1ea5d005b97798f849..5013bcdacd06a3feae7fc5e6bba8a09ed4a11e4b 100644 --- a/app/assets/javascripts/sidebar.js.coffee +++ b/app/assets/javascripts/sidebar.js.coffee @@ -24,3 +24,18 @@ $ -> $(window).resize -> responsive_resize() return + +$(document).on("click", '.toggle-nav-collapse', (e) -> + e.preventDefault() + collapsed = 'page-sidebar-collapsed' + expanded = 'page-sidebar-expanded' + + if $('.page-with-sidebar').hasClass(collapsed) + $('.page-with-sidebar').removeClass(collapsed).addClass(expanded) + $('.toggle-nav-collapse i').removeClass('fa-angle-right').addClass('fa-angle-left') + $.cookie("collapsed_nav", "false", { path: '/' }) + else + $('.page-with-sidebar').removeClass(expanded).addClass(collapsed) + $('.toggle-nav-collapse i').removeClass('fa-angle-left').addClass('fa-angle-right') + $.cookie("collapsed_nav", "true", { path: '/' }) +) diff --git a/app/assets/stylesheets/sections/nav_sidebar.scss b/app/assets/stylesheets/sections/nav_sidebar.scss index a61c053b8a9baa50ffb5a791454c35f06c116d98..b35043821dac05f926156b0b3614057bce0053f9 100644 --- a/app/assets/stylesheets/sections/nav_sidebar.scss +++ b/app/assets/stylesheets/sections/nav_sidebar.scss @@ -1,5 +1,3 @@ - - .page-with-sidebar { background: #F5F5F5; @@ -101,9 +99,7 @@ } @mixin expanded-sidebar { - .page-with-sidebar { - padding-left: $sidebar_width; - } + padding-left: $sidebar_width; .sidebar-wrapper { width: $sidebar_width; @@ -122,9 +118,7 @@ } @mixin folded-sidebar { - .page-with-sidebar { - padding-left: 50px; - } + padding-left: 50px; .sidebar-wrapper { width: 52px; @@ -150,10 +144,33 @@ } } +.collapse-nav a { + position: fixed; + bottom: 15px; + padding: 10px; + background: #DDD; +} + @media (max-width: $screen-md-max) { - @include folded-sidebar; + .page-sidebar-collapsed { + @include folded-sidebar; + } + + .page-sidebar-expanded { + @include folded-sidebar; + } + + .collapse-nav { + display: none; + } } @media(min-width: $screen-md-max) { - @include expanded-sidebar; + .page-sidebar-collapsed { + @include folded-sidebar; + } + + .page-sidebar-expanded { + @include expanded-sidebar; + } } diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index 1fbb44ee4422ca85bf1aa02b55e15e2b27670b4e..e45f4650309d3632eb1176d1dd6b877d7f0cabbc 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -315,4 +315,12 @@ module ApplicationHelper profile_key_path(key) end end + + def nav_sidebar_class + if nav_menu_collapsed? + "page-sidebar-collapsed" + else + "page-sidebar-expanded" + end + end end diff --git a/app/helpers/nav_helper.rb b/app/helpers/nav_helper.rb new file mode 100644 index 0000000000000000000000000000000000000000..2b03269800ec0091bf806d84aec751a30b12e044 --- /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 0000000000000000000000000000000000000000..b3b338b55bb6cba884bb8f7e8a8da9595309766e --- /dev/null +++ b/app/views/layouts/_collapse_button.html.haml @@ -0,0 +1,4 @@ +- if nav_menu_collapsed? + = link_to icon('angle-right'), '#', class: 'toggle-nav-collapse' +- else + = link_to icon('angle-left'), '#', class: 'toggle-nav-collapse' diff --git a/app/views/layouts/_page.html.haml b/app/views/layouts/_page.html.haml index 1263f44eca9699c899ef4537337ee6d2d91f7bcf..98a3d2278a329ba66e1b10325076cfe9b7a18392 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: nav_sidebar_class } = render "layouts/broadcast" .sidebar-wrapper = render(sidebar) + .collapse-nav + = render partial: 'layouts/collapse_button' .content-wrapper .container-fluid .content diff --git a/spec/helpers/nav_helper_spec.rb b/spec/helpers/nav_helper_spec.rb new file mode 100644 index 0000000000000000000000000000000000000000..e4d18d8bfc6f2421286ed9b7a37a382b41c8760d --- /dev/null +++ b/spec/helpers/nav_helper_spec.rb @@ -0,0 +1,25 @@ +require 'spec_helper' + +# Specs in this file have access to a helper object that includes +# the NavHelper. For example: +# +# describe NavHelper do +# describe "string concat" do +# it "concats two strings with spaces" do +# expect(helper.concat_strings("this","that")).to eq("this that") +# end +# end +# end +describe NavHelper do + describe '#nav_menu_collapsed?' do + it 'returns true when the nav is collapsed in the cookie' do + helper.request.cookies[:collapsed_nav] = 'true' + expect(helper.nav_menu_collapsed?).to eq true + end + + it 'returns false when the nav is not collapsed in the cookie' do + helper.request.cookies[:collapsed_nav] = 'false' + expect(helper.nav_menu_collapsed?).to eq false + end + end +end