From 721ae92b946d301b4b1ed305e8ca9a291b95a26a Mon Sep 17 00:00:00 2001 From: huyikai Date: Fri, 29 Dec 2023 16:35:22 +0800 Subject: [PATCH] Fix: Make the outline follow the page scroll This can be considered a user experience issue. When the page is exceptionally long with numerous anchor points, the height of the right outline may exceed the screen height, causing the activated anchor points to become invisible. This issue is evident on this page https://vitepress.dev/reference/site-config. After adjustments, the activated anchor within the outline will scroll along with the page, without affecting the separate scrolling of the outline --- src/client/theme-default/composables/outline.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/client/theme-default/composables/outline.ts b/src/client/theme-default/composables/outline.ts index d44e5074..3326b30d 100644 --- a/src/client/theme-default/composables/outline.ts +++ b/src/client/theme-default/composables/outline.ts @@ -183,6 +183,10 @@ export function useActiveAnchor( activeLink.classList.add('active') marker.value.style.top = activeLink.offsetTop + 33 + 'px' marker.value.style.opacity = '1' + activeLink.scrollIntoView({ + behavior: 'smooth', + block: 'center' + }) } else { marker.value.style.top = '33px' marker.value.style.opacity = '0'