From 8a6e6e30413d01c33a68010242211c16e8c7c63d Mon Sep 17 00:00:00 2001 From: Janis Altherr Date: Fri, 17 Oct 2025 13:49:07 +0200 Subject: [PATCH 1/3] Fix wiki sidebar vertical scroll --- app/assets/javascripts/wikis/wikis.js | 12 ++++++++++ app/assets/stylesheets/page_bundles/wiki.scss | 22 ++++++++++++++++++- app/views/shared/wikis/_sidebar.html.haml | 1 + 3 files changed, 34 insertions(+), 1 deletion(-) diff --git a/app/assets/javascripts/wikis/wikis.js b/app/assets/javascripts/wikis/wikis.js index 36b59307893fc7..938499bbca17ba 100644 --- a/app/assets/javascripts/wikis/wikis.js +++ b/app/assets/javascripts/wikis/wikis.js @@ -19,6 +19,18 @@ export default class Wikis { .querySelector('.js-sidebar-wiki-toggle-open') ?.addEventListener('click', this.expandSidebar.bind(this)); + const stickyElement = document.querySelector('.sidebar-container'); + const sentinel = document.querySelector('.sentinel'); + + const observer = new IntersectionObserver( + ([entry]) => { + stickyElement.classList.toggle('scrolled', !entry.isIntersecting); + }, + { threshold: [0] }, + ); + + observer.observe(sentinel); + // Store pages visbility in localStorage const pagesToggle = document.querySelector('.js-wiki-expand-pages-list'); if (pagesToggle) { diff --git a/app/assets/stylesheets/page_bundles/wiki.scss b/app/assets/stylesheets/page_bundles/wiki.scss index fe0ee52a16ee5e..607e85f65b4f20 100644 --- a/app/assets/stylesheets/page_bundles/wiki.scss +++ b/app/assets/stylesheets/page_bundles/wiki.scss @@ -94,15 +94,34 @@ top: $calc-application-header-height; bottom: $calc-application-footer-height; z-index: 200; - overflow-y: auto; + overflow-y: hidden; overflow-x: hidden; -webkit-overflow-scrolling: touch; width: $wiki-sidebar-inner-width; position: relative; + max-height: $calc-application-viewport-height; + @apply gl-flex; + @apply gl-flex-col; + + &.scrolled { + max-height: none; + } + @include gl-container-width-up(lg) { @include wiki-sidebar-container-lg-mod; } + + .blocks-container { + @apply gl-flex; + @apply gl-flex-col; + overflow: hidden; + } + + .wiki-pages-list-container { + @apply gl-grow; + overflow-y: scroll; + } } li > .wiki-list { @@ -301,6 +320,7 @@ ul.wiki-pages-list.content-list { .wiki-sidebar { .sidebar-container { top: 0; + max-height: var(--panel-content-inner-height); /* This variable is subject to change */ } } } diff --git a/app/views/shared/wikis/_sidebar.html.haml b/app/views/shared/wikis/_sidebar.html.haml index f6c520756453f3..fe9324d33cde88 100644 --- a/app/views/shared/wikis/_sidebar.html.haml +++ b/app/views/shared/wikis/_sidebar.html.haml @@ -4,6 +4,7 @@ %aside.wiki-sidebar.js-wiki-sidebar.sidebar-collapsed{ data: { "offset-top" => "50", "spy" => "affix" }, 'aria-label': _('Wiki') } .sidebar-container + .sentinel - if @sidebar_error.present? = render 'shared/alert_info', body: s_('Wiki|The sidebar failed to load. You can reload the page to try again.') -- GitLab From e8cc130a8b116b61e5040d0968859669fb16ade3 Mon Sep 17 00:00:00 2001 From: Janis Altherr Date: Fri, 17 Oct 2025 15:38:35 +0200 Subject: [PATCH 2/3] Apply 3 suggestion(s) to 1 file(s) Co-authored-by: Sascha Eggenberger --- app/assets/stylesheets/page_bundles/wiki.scss | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/app/assets/stylesheets/page_bundles/wiki.scss b/app/assets/stylesheets/page_bundles/wiki.scss index 607e85f65b4f20..cd9ec6940256ab 100644 --- a/app/assets/stylesheets/page_bundles/wiki.scss +++ b/app/assets/stylesheets/page_bundles/wiki.scss @@ -94,8 +94,7 @@ top: $calc-application-header-height; bottom: $calc-application-footer-height; z-index: 200; - overflow-y: hidden; - overflow-x: hidden; + @apply gl-overflow-hidden; -webkit-overflow-scrolling: touch; width: $wiki-sidebar-inner-width; position: relative; @@ -115,12 +114,12 @@ .blocks-container { @apply gl-flex; @apply gl-flex-col; - overflow: hidden; + @apply gl-overflow-hidden; } .wiki-pages-list-container { @apply gl-grow; - overflow-y: scroll; + @apply gl-overflow-y-scroll; } } -- GitLab From a61830cfd3cd1526a5b41cd2702215715fe82f95 Mon Sep 17 00:00:00 2001 From: Janis Altherr Date: Wed, 22 Oct 2025 10:24:34 +0200 Subject: [PATCH 3/3] Address reviewer comments --- app/assets/stylesheets/page_bundles/wiki.scss | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/app/assets/stylesheets/page_bundles/wiki.scss b/app/assets/stylesheets/page_bundles/wiki.scss index cd9ec6940256ab..38342d85a794c8 100644 --- a/app/assets/stylesheets/page_bundles/wiki.scss +++ b/app/assets/stylesheets/page_bundles/wiki.scss @@ -115,11 +115,12 @@ @apply gl-flex; @apply gl-flex-col; @apply gl-overflow-hidden; + @apply gl-grow; } .wiki-pages-list-container { @apply gl-grow; - @apply gl-overflow-y-scroll; + @apply gl-overflow-y-auto; } } @@ -319,7 +320,7 @@ ul.wiki-pages-list.content-list { .wiki-sidebar { .sidebar-container { top: 0; - max-height: var(--panel-content-inner-height); /* This variable is subject to change */ + height: var(--panel-content-inner-height); /* This variable is subject to change */ } } } -- GitLab