diff options
author | Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com> | 2016-01-17 20:01:35 +0300 |
---|---|---|
committer | Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com> | 2016-01-17 20:01:35 +0300 |
commit | a6e073fa9b0d78181609962b269f8d9d240f99ac (patch) | |
tree | c237e7177b30b05f3ad73ecc4b26de97b36a50ec | |
parent | 6754caed3c28e47269d4605f325040339fab1cab (diff) | |
parent | 7b143a81f38364a90a7e3b86ad461549898245f1 (diff) |
Merge branch 'issue-page-keeps-jumping-up' into 'master'
Issue page keeps jumping up
This happens when the discussion side is smaller than the sidebar and the sidebar will need to scroll. When this happens I calculate the height of the two and see if the discussion panel is smaller and make them the same height and add a class `no-affix` which makes the sidebar relative positioning so it won't stick to the top.
See merge request !2417
-rw-r--r-- | app/assets/javascripts/issue.js.coffee | 16 | ||||
-rw-r--r-- | app/assets/javascripts/merge_request.js.coffee | 16 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/issuable.scss | 5 |
3 files changed, 36 insertions, 1 deletions
diff --git a/app/assets/javascripts/issue.js.coffee b/app/assets/javascripts/issue.js.coffee index 0d26c58a81d..cbc70cd846c 100644 --- a/app/assets/javascripts/issue.js.coffee +++ b/app/assets/javascripts/issue.js.coffee @@ -6,11 +6,25 @@ class @Issue constructor: -> # Prevent duplicate event bindings @disableTaskList() - + @fixAffixScroll() if $('a.btn-close').length @initTaskList() @initIssueBtnEventListeners() + fixAffixScroll: -> + fixAffix = -> + $discussion = $('.issuable-discussion') + $sidebar = $('.issuable-sidebar') + if $sidebar.hasClass('no-affix') + $sidebar.removeClass(['affix-top','affix']) + discussionHeight = $discussion.height() + sidebarHeight = $sidebar.height() + if sidebarHeight > discussionHeight + $discussion.height(sidebarHeight + 50) + $sidebar.addClass('no-affix') + $(window).on('resize', fixAffix) + fixAffix() + initTaskList: -> $('.detail-page-description .js-task-list-container').taskList('enable') $(document).on 'tasklist:changed', '.detail-page-description .js-task-list-container', @updateTaskList diff --git a/app/assets/javascripts/merge_request.js.coffee b/app/assets/javascripts/merge_request.js.coffee index 1f46e331427..6af5a48a0bb 100644 --- a/app/assets/javascripts/merge_request.js.coffee +++ b/app/assets/javascripts/merge_request.js.coffee @@ -15,6 +15,8 @@ class @MergeRequest this.$('.show-all-commits').on 'click', => this.showAllCommits() + @fixAffixScroll(); + @initTabs() # Prevent duplicate event bindings @@ -28,6 +30,20 @@ class @MergeRequest $: (selector) -> this.$el.find(selector) + fixAffixScroll: -> + fixAffix = -> + $discussion = $('.issuable-discussion') + $sidebar = $('.issuable-sidebar') + if $sidebar.hasClass('no-affix') + $sidebar.removeClass(['affix-top','affix']) + discussionHeight = $discussion.height() + sidebarHeight = $sidebar.height() + if sidebarHeight > discussionHeight + $discussion.height(sidebarHeight + 50) + $sidebar.addClass('no-affix') + $(window).on('resize', fixAffix) + fixAffix() + initTabs: -> if @opts.action != 'new' # `MergeRequests#new` has no tab-persisting or lazy-loading behavior diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss index eae3590a189..977ada0ff38 100644 --- a/app/assets/stylesheets/pages/issuable.scss +++ b/app/assets/stylesheets/pages/issuable.scss @@ -20,6 +20,11 @@ position: fixed; top: 70px; margin-right: 35px; + + &.no-affix { + position: relative; + top: 0; + } } } } |