Skip to content

Conversation

@Shekhar0109
Copy link

Fixes

Fixes #4966 by @zackkrida

Description

This PR fixes a regression where the “Back to top” button overlapped the footer on Openverse pages.
Because the button used position: fixed and was placed outside the scroll container, it covered the footer content in both light and dark mode.

What was changed

  • Moved <VScrollButton /> inside the main-page container in both:
    • SearchLayout.vue
    • ContentLayout.vue
  • Changed the button’s CSS in VScrollButton.vue from position: fixed to position: sticky
  • Ensures the button scrolls naturally with page content and no longer overlaps footer controls

Testing Instructions

  1. Navigate to any search results page (or content page).
  2. Scroll down until the “Back to top” button appears.
  3. Continue scrolling to the footer.
  4. Verify that:
    • The button no longer overlaps or hides footer controls.
    • The button remains visible until reaching the footer area.
    • Clicking the button scrolls smoothly to the top.

Checklist

  • My pull request has a descriptive title.
  • My pull request targets the main branch.
  • My commit messages follow best practices.
  • My code follows the repository's style.
  • I updated relevant files in components and layouts.
  • I attempted running the project locally (not possible on my environment due to missing Docker).
  • The PR fixes the issue fully.

Developer Certificate of Origin
Version 1.1

Copyright (C) 2004, 2006 The Linux Foundation
Everyone is permitted to copy and distribute verbatim copies of this
license document, but changing it is not allowed.

Developer's Certificate of Origin 1.1

By making a contribution to this project, I certify that:

(a) The contribution was created in whole or in part by me and I
have the right to submit it under the open source license
indicated in the file; or

(b) The contribution is based upon previous work that, to the best
of my knowledge, is covered under an appropriate open source
license and I have the right under that license to submit that
work with modifications, whether created in whole or in part
by me, under the same open source license (unless I am
permitted to submit under a different license), as indicated
in the file; or

(c) The contribution was provided directly to me by some other
person who certified (a), (b) or (c) and I have not modified
it.

(d) I understand and agree that this project and the contribution
are public and that a record of the contribution (including all
personal information I submit with it, including my sign-off) is
maintained indefinitely and may be redistributed consistent with
this project or the open source license(s) involved.

@Shekhar0109 Shekhar0109 requested a review from a team as a code owner December 3, 2025 15:00
@Shekhar0109 Shekhar0109 requested review from dhruvkb and krysal December 3, 2025 15:00
@openverse-bot openverse-bot added 🧱 stack: frontend Related to the Nuxt frontend 🟨 priority: medium Not blocking but should be addressed soon 🛠 goal: fix Bug fix 🕹 aspect: interface Concerns end-users' experience with the software labels Dec 3, 2025
@openverse-bot openverse-bot moved this to 👀 Needs Review in Openverse PRs Dec 3, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

🕹 aspect: interface Concerns end-users' experience with the software 🛠 goal: fix Bug fix 🟨 priority: medium Not blocking but should be addressed soon 🧱 stack: frontend Related to the Nuxt frontend

Projects

Status: 👀 Needs Review

Development

Successfully merging this pull request may close these issues.

Regression: "Back to top" button covers footer

2 participants