Feat: navigation au clavier entre slides (← →)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2026-02-19 12:41:50 +01:00
parent 8e01cbe611
commit d7dacd6b6c

View file

@ -1,5 +1,7 @@
<script> <script>
import { onMount } from 'svelte'
import { slides } from '@state/slides.svelte' import { slides } from '@state/slides.svelte'
import { slideTo } from '@router'
import Header from '@components/layout/Header.svelte' import Header from '@components/layout/Header.svelte'
import Cursor from '@components/layout/Cursor.svelte' import Cursor from '@components/layout/Cursor.svelte'
@ -30,6 +32,20 @@
const wrapperWidth = $derived(`${slides.all.length * 100}vw`) const wrapperWidth = $derived(`${slides.all.length * 100}vw`)
const wrapperTransform = $derived(`translateX(-${slides.activeIndex * 100}vw)`) const wrapperTransform = $derived(`translateX(-${slides.activeIndex * 100}vw)`)
onMount(() => {
const handleKeydown = (e) => {
if (e.key === 'ArrowRight') {
const next = slides.all[slides.activeIndex + 1]
if (next) slideTo(next.path)
} else if (e.key === 'ArrowLeft') {
const prev = slides.all[slides.activeIndex - 1]
if (prev) slideTo(prev.path)
}
}
window.addEventListener('keydown', handleKeydown)
return () => window.removeEventListener('keydown', handleKeydown)
})
</script> </script>
<div class="app"> <div class="app">