Plan — Scroll to Top
Intent
As a user scrolling through the proposal, I need a quick way to get back to the top without manually scrolling. One tap, smooth ride up.
Scope
What
- Fixed-position arrow button, bottom-right corner
- Hidden when at the top of the page
- Fades in after scrolling down ~200px
- Smooth scroll to top on click
- Mobile: thumb-reachable position (bottom-right, 24px from edges)
- Desktop: same position, slightly larger
Approach
Implementation
- HTML: single
<button> with up-arrow character (▲ or ↑)
- CSS: fixed position, dark background, accent border, rounded, transition for opacity
- JS: scroll event listener with throttle, toggle visibility class based on scrollY
- Click handler:
window.scrollTo({ top: 0, behavior: 'smooth' })
- No frameworks. Vanilla HTML/CSS/JS.
Constraints
- Must not interfere with comment forms or tab bar
- z-index below modals but above content
- Must work on all 5 tabs