fix: improve smooth scroll with ease-out deceleration
All checks were successful
build-website / build (push) Successful in 1m34s

- Changed from linear to ease-out cubic easing function
- Scroll now starts immediately at full speed (no initial delay)
- Gradually decelerates as it approaches the target anchor
- Provides more natural and responsive scrolling experience

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-09-19 12:31:56 +02:00
parent 753876b071
commit ed5bb6cc3f

View File

@@ -13,9 +13,9 @@ export const useSmoothScroll = () => {
window.removeEventListener('keydown', cancelScroll)
}
// Linear easing for constant-speed scrolling
const easeLinear = (t: number): number => {
return t
// Ease-out cubic: starts fast, slows down as it approaches target
const easeOutCubic = (t: number): number => {
return 1 - Math.pow(1 - t, 3)
}
const smoothScrollTo = (target: number | Element, duration: number = 800) => {
@@ -43,7 +43,7 @@ export const useSmoothScroll = () => {
if (startTime === null) startTime = currentTime
const timeElapsed = currentTime - startTime
const progress = Math.min(timeElapsed / duration, 1)
const easedProgress = easeLinear(progress)
const easedProgress = easeOutCubic(progress)
window.scrollTo(0, startPosition + distance * easedProgress)