fix: update highlight position on scroll

src/component/Tutorial/TutorialHighlight.css

@@ -1,5 +1,5 @@
 #tutorial-highlight {
-  position: absolute;
+  position: fixed;
   border: 2px dotted var(--color-tutorial-highlight);
   z-index: 51;
   pointer-events: none;

src/component/Tutorial/TutorialHighlight.tsx

@@ -1,5 +1,5 @@
 import { content } from 'map:tutorial-content'
-import { Show, createEffect, createSignal } from 'solid-js'
+import { Show, createEffect, createSignal, onCleanup } from 'solid-js'
 import { useNavigation } from '../../context/Navigation.tsx'
 import { isDone } from './isDone.ts'
 
@@ -23,12 +23,47 @@ export const TutorialHighlight = () => {
 
 	createEffect(() => {
 		const highlight = currentTutorial()?.highlight
+
+		// Tutorial has no highlight
 		if (highlight === undefined) {
 			setHighlight(undefined)
 			return
 		}
+
+		// Find the element to highlight
 		const selector = highlight.map((title) => `[title="${title}"]`).join(' ')
-		setHighlight(document.querySelector(selector)?.getBoundingClientRect())
+		const target = document.querySelector(selector)
+
+		// Highlight the element (or remove the highlight if the element is not found)
+		const show = () => {
+			setHighlight(target?.getBoundingClientRect())
+		}
+		show()
+
+		if (target === null) return
+
+		// Update the highlight position when the content changes based on user interaction
+		const hide = () => {
+			setHighlight(undefined)
+		}
+
+		const onComplete = (timeout: number) => {
+			setTimeout(show, timeout)
+		}
+		const onTouchEnd = () => onComplete(1000)
+		const onWheelEnd = () => {
+			hide()
+			onComplete(250)
+		}
+		document.addEventListener('touchstart', hide, { passive: true })
+		document.addEventListener('touchend', onTouchEnd, { passive: true })
+		document.addEventListener('wheel', onWheelEnd, { passive: true })
+
+		onCleanup(() => {
+			document.removeEventListener('touchstart', hide)
+			document.removeEventListener('touchend', onTouchEnd)
+			document.removeEventListener('wheel', onWheelEnd)
+		})
 	})
 
 	return (