prevent annoying sidebar scrolling glitch

site/src/routes/guide/_GuideContents.html

@@ -5,6 +5,7 @@
 	export let sections = [];
 	export let active_section = null;
 	export let show_contents;
+	export let prevent_sidebar_scroll = false;
 
 	onMount(() => {
 		//	------------------------------------------
@@ -42,8 +43,8 @@
 
 	afterUpdate(() => {
 		// bit of a hack — prevent sidebar scrolling if
-		// TOC is open on mobile
+		// TOC is open on mobile, or scroll came from within sidebar
-		if (show_contents && window.innerWidth < 832) return;
+		if (prevent_sidebar_scroll || show_contents && window.innerWidth < 832) return;
 
 		const active = ul.querySelector('.active');
 
@@ -97,7 +98,12 @@
 	.active           { color: var(--prime) }
 </style>
 
-<ul bind:this={ul} class="guide-toc">
+<ul
+	bind:this={ul}
+	class="guide-toc"
+	on:mouseenter="{() => prevent_sidebar_scroll = true}"
+	on:mouseleave="{() => prevent_sidebar_scroll = false}"
+>
 	{#each sections as section}
 		<li>
 			<a class="section" class:active="{section.slug === active_section}" href="guide#{section.slug}">