Commit b4db3888 authored by Fatih Acet's avatar Fatih Acet Committed by Rémy Coutable

Merge branch '23520-mr-sticky-tabs-overlap-discussion-from-anchor' into 'master'

Account for fixed position MR when scrolling to elements

This MR accounts for the new merge request fixed affix bar when scrolling to an element on the MR page.

The fixed MR tabs bar was not being taken into account when shifting permalink scroll targets so that they are unobscured by navigation elements.

Closes #23520

See merge request !7051
Signed-off-by: default avatarRémy Coutable <remy@rymai.me>
parent c8b9f7a4
...@@ -127,19 +127,30 @@ ...@@ -127,19 +127,30 @@
return $(document).off('scroll'); return $(document).off('scroll');
}; };
window.shiftWindow = function() {
return scrollBy(0, -100);
};
document.addEventListener("page:fetch", unbindEvents); document.addEventListener("page:fetch", unbindEvents);
window.addEventListener("hashchange", shiftWindow); // automatically adjust scroll position for hash urls taking the height of the navbar into account
// https://github.com/twitter/bootstrap/issues/1768
window.adjustScroll = function() {
var navbar = document.querySelector('.navbar-gitlab');
var subnav = document.querySelector('.layout-nav');
var fixedTabs = document.querySelector('.js-tabs-affix');
adjustment = 0;
if (navbar) adjustment -= navbar.offsetHeight;
if (subnav) adjustment -= subnav.offsetHeight;
if (fixedTabs) adjustment -= fixedTabs.offsetHeight;
return scrollBy(0, adjustment);
};
window.addEventListener("hashchange", adjustScroll);
window.onload = function() { window.onload = function () {
// Scroll the window to avoid the topnav bar // Scroll the window to avoid the topnav bar
// https://github.com/twitter/bootstrap/issues/1768 // https://github.com/twitter/bootstrap/issues/1768
if (location.hash) { if (location.hash) {
return setTimeout(shiftWindow, 100); return setTimeout(adjustScroll, 100);
} }
}; };
......
...@@ -129,7 +129,7 @@ ...@@ -129,7 +129,7 @@
MergeRequestTabs.prototype.scrollToElement = function(container) { MergeRequestTabs.prototype.scrollToElement = function(container) {
var $el, navBarHeight; var $el, navBarHeight;
if (window.location.hash) { if (window.location.hash) {
navBarHeight = $('.navbar-gitlab').outerHeight() + $('.layout-nav').outerHeight(); navBarHeight = $('.navbar-gitlab').outerHeight() + $('.layout-nav').outerHeight() + document.querySelector('.js-tabs-affix').offsetHeight;
$el = $(container + " " + window.location.hash + ":not(.match)"); $el = $(container + " " + window.location.hash + ":not(.match)");
if ($el.length) { if ($el.length) {
return $.scrollTo(container + " " + window.location.hash + ":not(.match)", { return $.scrollTo(container + " " + window.location.hash + ":not(.match)", {
......
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