diff options
author | Annabel Dunstone <annabel.dunstone@gmail.com> | 2016-05-26 01:12:39 +0300 |
---|---|---|
committer | Annabel Dunstone <annabel.dunstone@gmail.com> | 2016-05-26 01:14:28 +0300 |
commit | ec6d456b5023b4a0700a4c9ad8a17ed64b0470e6 (patch) | |
tree | 4a229382623b6a92b034341be13412ea04a23bb1 /app | |
parent | 79f890ca8549132699bc8169eff73b5c7ff25699 (diff) |
Change to xs breakpoint, layout_nav updates
Diffstat (limited to 'app')
-rw-r--r-- | app/assets/javascripts/layout_nav.js.coffee | 17 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/nav.scss | 5 |
2 files changed, 11 insertions, 11 deletions
diff --git a/app/assets/javascripts/layout_nav.js.coffee b/app/assets/javascripts/layout_nav.js.coffee index 3c39ec32f26..6adac6dac97 100644 --- a/app/assets/javascripts/layout_nav.js.coffee +++ b/app/assets/javascripts/layout_nav.js.coffee @@ -1,13 +1,14 @@ class @LayoutNav $ -> $('.fade-left').addClass('end-scroll') - $('.scrolling-tabs').scroll (event) -> - el = $(event.target) - currentPosition = $(this).scrollLeft() - mobileScreenWidth = 480 + $('.scrolling-tabs').on 'scroll', (event) -> + $this = $(this) + $el = $(event.target) + currentPosition = $this.scrollLeft() + size = bp.getBreakpointSize() controlBtnWidth = $('.controls').width() - maxPosition = $(this)[0].scrollWidth - $(this).parent().width() - maxPosition += controlBtnWidth if $('.nav-control').length and $(window).width() > mobileScreenWidth + 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) + $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 fdd60d85db8..adfe5540704 100644 --- a/app/assets/stylesheets/framework/nav.scss +++ b/app/assets/stylesheets/framework/nav.scss @@ -2,7 +2,7 @@ visibility: visible; opacity: 1; position: absolute; - bottom: 16px; + bottom: 12px; width: 43px; height: 30px; transition-duration: .3s; @@ -240,7 +240,7 @@ float: right; padding: 7px 0 0; - @media (max-width: $screen-xs-min) { + @media (max-width: $screen-xs-max) { display: none; } @@ -310,7 +310,6 @@ .nav-control { .fade-right { - right: 58px; @media (min-width: $screen-xs-max) { right: 67px; |