diff options
| author | Phil Hughes <me@iamphill.com> | 2016-06-13 15:58:09 +0100 |
|---|---|---|
| committer | Phil Hughes <me@iamphill.com> | 2016-06-13 15:58:09 +0100 |
| commit | 29130f37ad15bf5aa4ac2cf62d0ea8249218dcd6 (patch) | |
| tree | ed1d02403dbbc00b2b6489d463ea725bad2462ac | |
| parent | 5e955d2cba4b3f0508874ef49fa549a638d4944c (diff) | |
| download | gitlab-ce-29130f37ad15bf5aa4ac2cf62d0ea8249218dcd6.tar.gz | |
Hides the fade right unless requirednav-horizontal-alignment
| -rw-r--r-- | app/assets/javascripts/layout_nav.js.coffee | 44 | ||||
| -rw-r--r-- | app/assets/stylesheets/framework/nav.scss | 1 |
2 files changed, 31 insertions, 14 deletions
diff --git a/app/assets/javascripts/layout_nav.js.coffee b/app/assets/javascripts/layout_nav.js.coffee index 6adac6dac97..f02292dd4f3 100644 --- a/app/assets/javascripts/layout_nav.js.coffee +++ b/app/assets/javascripts/layout_nav.js.coffee @@ -1,14 +1,30 @@ -class @LayoutNav - $ -> - $('.fade-left').addClass('end-scroll') - $('.scrolling-tabs').on 'scroll', (event) -> - $this = $(this) - $el = $(event.target) - currentPosition = $this.scrollLeft() - size = bp.getBreakpointSize() - controlBtnWidth = $('.controls').width() - maxPosition = $this.get(0).scrollWidth - $this.parent().width() - maxPosition += controlBtnWidth if size isnt 'xs' and $('.nav-control').length - - $el.find('.fade-left').toggleClass('end-scroll', currentPosition is 0) - $el.find('.fade-right').toggleClass('end-scroll', currentPosition is maxPosition) +hideEndFade = ($scrollingTabs) -> + $scrollingTabs.each -> + $this = $(@) + + $this + .find('.fade-right') + .toggleClass('end-scroll', $this.width() is $this.prop('scrollWidth')) + +$ -> + $('.fade-left').addClass('end-scroll') + + hideEndFade($('.scrolling-tabs')) + + $(window) + .off 'resize.nav' + .on 'resize.nav', -> + hideEndFade($('.scrolling-tabs')) + + $('.scrolling-tabs').on 'scroll', (event) -> + $this = $(this) + $el = $(event.target) + currentPosition = $this.scrollLeft() + size = bp.getBreakpointSize() + controlBtnWidth = $('.controls').width() + maxPosition = ($this.get(0).scrollWidth - $this.parent().width()) - 1 + # maxPosition += controlBtnWidth if size isnt 'xs' and $('.nav-control').length + console.log maxPosition, currentPosition + + $el.find('.fade-left').toggleClass('end-scroll', currentPosition is 0) + $el.find('.fade-right').toggleClass('end-scroll', currentPosition is maxPosition) diff --git a/app/assets/stylesheets/framework/nav.scss b/app/assets/stylesheets/framework/nav.scss index 71fd75b61fa..1222dc9047a 100644 --- a/app/assets/stylesheets/framework/nav.scss +++ b/app/assets/stylesheets/framework/nav.scss @@ -283,6 +283,7 @@ position: absolute; top: 7px; right: 15px; + z-index: 2; li.active { font-weight: bold; |