diff options
author | Ezekiel Kigbo <ekigbo@gitlab.com> | 2019-02-07 18:12:49 +1100 |
---|---|---|
committer | Ezekiel Kigbo <ekigbo@gitlab.com> | 2019-02-08 02:21:53 +1100 |
commit | befbadf4837726f630ca52805e3d3760553ba55c (patch) | |
tree | 5b14e7f76f21e0937827fa36d356bf7c0eb844e4 | |
parent | 45b3f347c3d2836621e712886169428f1b808f3a (diff) | |
download | gitlab-ce-fix/38010-sidebar-loads-and-collapses.tar.gz |
Added DESKTOP_BREAKPOINTS constantfix/38010-sidebar-loads-and-collapses
Chore: ensure sidebar-expanded-mobile toggles
Revert: toggleCollapseSidebar should not be called on xs breakpoints
-rw-r--r-- | app/assets/javascripts/contextual_sidebar.js | 6 |
1 files changed, 4 insertions, 2 deletions
diff --git a/app/assets/javascripts/contextual_sidebar.js b/app/assets/javascripts/contextual_sidebar.js index eb30d14b6cd..f59d953c2f1 100644 --- a/app/assets/javascripts/contextual_sidebar.js +++ b/app/assets/javascripts/contextual_sidebar.js @@ -4,6 +4,7 @@ import _ from 'underscore'; import bp from './breakpoints'; import { parseBoolean } from '~/lib/utils/common_utils'; +const DESKTOP_BREAKPOINTS = ['xl', 'lg']; export default class ContextualSidebar { constructor() { this.initDomElements(); @@ -29,7 +30,7 @@ export default class ContextualSidebar { document.addEventListener('click', e => { if ( !e.target.closest('.nav-sidebar') && - !ContextualSidebar.isDesktopBreakpoint(bp.getBreakpointSize()) + (bp.getBreakpointSize() === 'sm' || bp.getBreakpointSize() === 'md') ) { this.toggleCollapsedSidebar(true, true); } @@ -54,7 +55,7 @@ export default class ContextualSidebar { // TODO: use the breakpoints from breakpoints.js once they have been updated for bootstrap 4 // See related issue and discussion: https://gitlab.com/gitlab-org/gitlab-ce/issues/56745 - static isDesktopBreakpoint = (_bp = '') => ['xl', 'lg'].indexOf(_bp) > -1; + static isDesktopBreakpoint = (_bp = '') => DESKTOP_BREAKPOINTS.indexOf(_bp) > -1; static setCollapsedCookie(value) { if (bp.getBreakpointSize() !== 'lg') { return; @@ -70,6 +71,7 @@ export default class ContextualSidebar { toggleMobileCollapsedSidebar(collapsed) { this.$sidebar.toggleClass('sidebar-collapsed-mobile', collapsed); + this.$sidebar.toggleClass('sidebar-expanded-mobile', !collapsed); this.$sidebar.removeClass('sidebar-collapsed-desktop'); this.$page.toggleClass('page-with-icon-sidebar', true); this.$page.toggleClass('page-with-contextual-sidebar', false); |