Phase 9: Timeline mobile — seamless edge-to-edge carousel scroll #159
Description
Summary
Remove horizontal gap/padding on mobile timeline carousel so cards scroll seamlessly in and out off-screen.
Context
On mobile, the timeline carousel cards have x-gap causing visual breaks between cards. For a prettier scroll experience, cards should flow edge-to-edge — coming in and out off-screen without spacing. The carousel uses scroll-snap-type: x mandatory.
Implementation
- Remove horizontal gap from the carousel container in
WarTimeline.css - Ensure cards still snap correctly without the gap
- Cards should bleed off-screen edges for a seamless scroll feel
Key Files
src/components/h1/WarTimeline/WarTimeline.jsxsrc/components/h1/WarTimeline/WarTimeline.css