Commit 46dd5fc4 authored by Dmitriy Zaporozhets's avatar Dmitriy Zaporozhets

Merge branch 'jasonblanchard-collapseable-nav' into 'master'

Collapseable sidebar

See merge request !1465
parents d35070ea 254a63dc
...@@ -62,6 +62,7 @@ v 7.8.0 ...@@ -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 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 v 7.7.2
- Update GitLab Shell to version 2.4.2 that fixes a bug when developers can push to protected branch - Update GitLab Shell to version 2.4.2 that fixes a bug when developers can push to protected branch
......
...@@ -24,3 +24,18 @@ $ -> ...@@ -24,3 +24,18 @@ $ ->
$(window).resize -> $(window).resize ->
responsive_resize() responsive_resize()
return 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: '/' })
)
.page-with-sidebar { .page-with-sidebar {
background: #F5F5F5; background: #F5F5F5;
...@@ -101,9 +99,7 @@ ...@@ -101,9 +99,7 @@
} }
@mixin expanded-sidebar { @mixin expanded-sidebar {
.page-with-sidebar {
padding-left: $sidebar_width; padding-left: $sidebar_width;
}
.sidebar-wrapper { .sidebar-wrapper {
width: $sidebar_width; width: $sidebar_width;
...@@ -122,9 +118,7 @@ ...@@ -122,9 +118,7 @@
} }
@mixin folded-sidebar { @mixin folded-sidebar {
.page-with-sidebar {
padding-left: 50px; padding-left: 50px;
}
.sidebar-wrapper { .sidebar-wrapper {
width: 52px; width: 52px;
...@@ -150,10 +144,33 @@ ...@@ -150,10 +144,33 @@
} }
} }
.collapse-nav a {
position: fixed;
bottom: 15px;
padding: 10px;
background: #DDD;
}
@media (max-width: $screen-md-max) { @media (max-width: $screen-md-max) {
.page-sidebar-collapsed {
@include folded-sidebar; @include folded-sidebar;
}
.page-sidebar-expanded {
@include folded-sidebar;
}
.collapse-nav {
display: none;
}
} }
@media(min-width: $screen-md-max) { @media(min-width: $screen-md-max) {
.page-sidebar-collapsed {
@include folded-sidebar;
}
.page-sidebar-expanded {
@include expanded-sidebar; @include expanded-sidebar;
}
} }
...@@ -315,4 +315,12 @@ module ApplicationHelper ...@@ -315,4 +315,12 @@ module ApplicationHelper
profile_key_path(key) profile_key_path(key)
end end
end end
def nav_sidebar_class
if nav_menu_collapsed?
"page-sidebar-collapsed"
else
"page-sidebar-expanded"
end
end
end end
module NavHelper
def nav_menu_collapsed?
cookies[:collapsed_nav] == 'true'
end
end
- if nav_menu_collapsed?
= link_to icon('angle-right'), '#', class: 'toggle-nav-collapse'
- else
= link_to icon('angle-left'), '#', class: 'toggle-nav-collapse'
- if defined?(sidebar) - if defined?(sidebar)
.page-with-sidebar .page-with-sidebar{ class: nav_sidebar_class }
= render "layouts/broadcast" = render "layouts/broadcast"
.sidebar-wrapper .sidebar-wrapper
= render(sidebar) = render(sidebar)
.collapse-nav
= render partial: 'layouts/collapse_button'
.content-wrapper .content-wrapper
.container-fluid .container-fluid
.content .content
......
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
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment