[openstreetmap/openstreetmap-website] Improve visibility of element navigation by moving it above content (PR #6865)
Arpan Mukherjee
notifications at github.com
Thu Mar 5 12:18:34 UTC 2026
### Description
This change improves the visibility of the element navigation bar in the sidebar.
Previously, the navigation (`Node / History / Versions`) appeared after the element content (tags, changeset details, etc.), which meant users often had to scroll to access it when elements had many tags.
This PR moves the navigation `<nav>` block directly below the sidebar header and applies Bootstrap utility classes to keep it visible while scrolling.
Changes made:
* Reordered the HTML layout so the navigation appears above the element content.
* Added Bootstrap utility classes (`sticky-top`, `bg-body`, `border-bottom`, `pb-2`, `z-1`) so the navigation remains visible while scrolling.
Files modified:
* `app/views/elements/show.html.erb`
* `app/views/old_elements/index.html.erb`
* `app/views/old_elements/_actions.html.erb`
This improves usability when browsing elements with long tag lists or version histories.
### How has this been tested?
Tested locally using the development environment with Docker.
Steps:
1. Started the Rails server locally.
2. Created a test node in the Rails console.
3. Added many tags to the node to create a long scrollable sidebar.
4. Verified that the navigation bar now appears directly below the element title and remains visible while scrolling.
Test pages checked:
* `/node/:id`
* `/node/:id/history`
* `/node/:id/:version`
<img width="349" height="631" alt="image" src="https://github.com/user-attachments/assets/c8b3c7a6-6322-4dd9-9a55-acbca0fdf085" />
You can view, comment on, or merge this pull request online at:
https://github.com/openstreetmap/openstreetmap-website/pull/6865
-- Commit Summary --
* Improve visibility of element navigation by moving it above content and making it sticky
-- File Changes --
M app/views/elements/show.html.erb (28)
M app/views/old_elements/_actions.html.erb (28)
M app/views/old_elements/index.html.erb (43)
-- Patch Links --
https://github.com/openstreetmap/openstreetmap-website/pull/6865.patch
https://github.com/openstreetmap/openstreetmap-website/pull/6865.diff
--
Reply to this email directly or view it on GitHub:
https://github.com/openstreetmap/openstreetmap-website/pull/6865
You are receiving this because you are subscribed to this thread.
Message ID: <openstreetmap/openstreetmap-website/pull/6865 at github.com>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20260305/94c6fc5e/attachment-0001.htm>
More information about the rails-dev
mailing list