Fix logo carousel snap at animation loop boundary (#165)

The `logo-scroll` keyframe translated by `-50%`, but flex `gap: 3rem`
means `2N` duplicated items have `2N - 1` gaps — so the track doesn't
split evenly at 50%. The seam between the two copies sits at
`50% + half a gap`. Adjusting to `calc(-50% - 1.5rem)` aligns the
animation endpoint with the start of the second copy, eliminating the
visible jump every 50 seconds.

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jonathan Hefner
2026-02-15 16:21:18 -06:00
committed by GitHub
Unverified
parent 492e1b7104
commit b7442eb9ac
+1 -1
View File
@@ -100,7 +100,7 @@ body:has(#enable-section-numbers) {
@keyframes logo-scroll {
from { transform: translateX(0); }
to { transform: translateX(-50%); }
to { transform: translateX(calc(-50% - 1.5rem)); }
}
@media (prefers-reduced-motion: reduce) {