github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-05-29 01:31:35 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

FIX: Cleaned up horizontal nav scrolling so arrows show/hide properly (#30621)

Browse Source
This commit is contained in:
Ella E.
2025-01-07 18:07:44 -07:00
committed by GitHub
parent 4f9359d056
commit a88c86beef
1 changed files with 9 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
app/assets/javascripts/discourse/app/components/horizontal-overflow-nav.js
View File

@ -47,14 +47,21 @@ export default class HorizontalOverflowNav extends Component {
} }
watchScroll(element) { watchScroll(element) {
if (element.offsetWidth + element.scrollLeft === element.scrollWidth) { const { scrollWidth, scrollLeft, offsetWidth } = element;
// Check if the content overflows
this.hasScroll = scrollWidth > offsetWidth;
// Ensure the right arrow disappears only when fully scrolled
if (scrollWidth - scrollLeft - offsetWidth <= 2) {
this.hideRightScroll = true; this.hideRightScroll = true;
clearInterval(this.scrollInterval); clearInterval(this.scrollInterval);
} else { } else {
this.hideRightScroll = false; this.hideRightScroll = false;
} }
if (element.scrollLeft === 0) { // Ensure the left arrow disappears only when fully scrolled to the start
if (scrollLeft <= 2) {
this.hideLeftScroll = true; this.hideLeftScroll = true;
clearInterval(this.scrollInterval); clearInterval(this.scrollInterval);
} else { } else {