Skip to content

Add anchor-based deep linking and smooth scroll support to /cars Fleet Timeline #90

Description

@justin-phxm

Summary

Enable deep-linking for individual cars in the Fleet Timeline on /cars so users can navigate directly to a specific entry via URL hash and get smooth animated scrolling to the target card.

Problem

The Fleet Timeline currently does not fully support anchor-based navigation. Visiting a URL like /cars#schulich-elysia should reliably scroll to that car's timeline card, but this behavior is not implemented.

Proposed solution

  • Add stable anchor identifiers for each fleet timeline item (based on car ID and/or normalized car name).
  • Update timeline interactions so selecting/clicking a car updates the URL hash without a full page reload.
  • On page load (and hash changes), detect the hash and scroll to the matching timeline item.
  • Use smooth scroll animation for anchor navigation.
  • Ensure behavior works for direct navigation (opening URL in new tab), refreshes, and back/forward browser navigation.

Acceptance criteria

  • Navigating to /cars#<carID-or-name> scrolls to the matching car timeline entry.
  • Scroll behavior is smooth and visually consistent with current site animations.
  • Clicking/selecting a timeline item updates the URL hash correctly.
  • If no matching anchor exists, page behavior fails gracefully (no crash; optional fallback to top/default state).
  • Works across modern desktop and mobile browsers.

Notes

Fleet timeline showing car entries

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions