app : scroll to top on slide change - closes #72
All checks were successful
Deploy / Deploy to Production (push) Successful in 22s

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2026-04-22 14:22:01 +02:00
parent 0ca55bed5d
commit 34bc05066f

View file

@ -1,5 +1,5 @@
<script> <script>
import { onMount } from 'svelte' import { onMount, untrack } from 'svelte'
import { slides } from '@state/slides.svelte' import { slides } from '@state/slides.svelte'
import { slideTo } from '@router' import { slideTo } from '@router'
@ -70,6 +70,19 @@
if (activeTemplate) document.body.dataset.template = activeTemplate if (activeTemplate) document.body.dataset.template = activeTemplate
}) })
// Scroll to top of the new slide's scrollable container on navigation.
$effect(() => {
const idx = slides.activeIndex
const all = untrack(() => slides.all)
if (all.length === 0) return
const rafId = requestAnimationFrame(() => {
const section = document.querySelector(`[data-slide="${all[idx]?.id}"]`)
section?.querySelector('.page-scrollable')?.scrollTo(0, 0)
})
return () => cancelAnimationFrame(rafId)
})
// Active la transition seulement après le premier paint à la bonne position. // Active la transition seulement après le premier paint à la bonne position.
// Double rAF : le premier laisse passer un paint avec le bon translateX, // Double rAF : le premier laisse passer un paint avec le bon translateX,
// le second active is-animated — évite l'animation parasite au chargement. // le second active is-animated — évite l'animation parasite au chargement.