Skip to content

UX: back to top button on Track Record page #61

Description

@simonives

Problem

The Track Record page is the longest page on the site. Users who reach the bottom have no mechanism to return to the top without scrolling, which is particularly burdensome on mobile.

Solution

Add a floating "back to top" button that:

  • Appears after the user scrolls past ~300px
  • Is positioned fixed, bottom-right
  • Uses the Aurum accent colour and the Φ mark or a simple up-arrow as its label
  • Has a descriptive aria-label="Back to top"
  • Disappears when the user is near the top of the page

Implement in JavaScript (inline at bottom of portfolio.html) with CSS in style-v2.css.

Acceptance criteria

  • Button appears and disappears at appropriate scroll positions
  • Clicking returns the user to the top of the page (smooth scroll, respecting prefers-reduced-motion)
  • Button is keyboard accessible and has a visible focus state
  • Does not overlap any content in a way that obscures text
  • Works in both light and dark mode

Metadata

Metadata

Assignees

No one assigned

    Labels

    P3 - MediumDo it, but not urgentlyenhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions