[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