Nemcio/SCM-Manager
1
0
Fork 0
mirror of https://github.com/scm-manager/scm-manager.git synced 2026-01-22 15:32:16 +01:00
Code Issues Packages Projects Releases Activity

Mind offset for top navigation bar on scrolling

Browse Source 
This fixes the issue, that links to anchor tags in
markdown documents have been scrolled a bit too far,
so that the targeted element ended up below the
navigation bar. Now, the height of the navigation
bar is taken into account.

Pushed-by: Rene Pfeuffer<rene.pfeuffer@cloudogu.com>
Co-authored-by: Thomas Zerr<thomas.zerr@cloudogu.com>
Pushed-by: Thomas Zerr<thomas.zerr@cloudogu.com>
Co-authored-by: René Pfeuffer<rene.pfeuffer@cloudogu.com>
Committed-by: René Pfeuffer<rene.pfeuffer@cloudogu.com>
This commit is contained in:
Rene Pfeuffer
2024-03-14 15:05:11 +01:00
parent 8d12862ff8
commit c6126e4702
2 changed files with 7 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
gradle/changelog/mind_header_when_scrolling.yaml Normal file
View File

@@ -0,0 +1,2 @@
- type: fixed
description: The height of the navigation bar is now considered when scrolling to an element via anchor

7
scm-ui/ui-components/src/useScrollToElement.ts
View File

@@ -40,9 +40,12 @@ const useScrollToElement = (
} else {
tries++;
const element = contentRef.querySelector(elementSelector);
if (element && element.scrollIntoView) {
if (element) {
const headerElement = document.querySelector(".navbar-brand");
const margin = headerElement ? headerElement.getBoundingClientRect().height : 45;
clearInterval(intervalId);
element.scrollIntoView();
const y = element.getBoundingClientRect().top + window.pageYOffset - margin;
window.scrollTo({top: y});
}
}
}, 200);