docusaurus icon indicating copy to clipboard operation
docusaurus copied to clipboard

Footnotes (when navigating from Footnotes section) are covered by navbar

Open josh-wong opened this issue 7 months ago • 0 comments

Have you read the Contributing Guidelines on issues?

Prerequisites

  • [x] I'm using the latest version of Docusaurus.
  • [x] I have tried the npm run clear or yarn clear command.
  • [x] I have tried rm -rf node_modules yarn.lock package-lock.json and re-installing packages.
  • [x] I have tried creating a repro with https://new.docusaurus.io.
  • [x] I have read the console error message carefully (if applicable).

Description

When a page has footnotes, if you click on a footnote in the Footnotes section of a page, it takes you to the part of the page where that footnote is location. However, the footnote is covered by the navbar when the navbar is static, which makes it difficult to see where the footnote is (requires scrolling up a little to see where the content being footnoted).

Reproducible demo

No response

Steps to reproduce

  1. Go to a page that has footnotes, and go to the Footnotes section that lists all footnotes on the page, which is typically at the bottom of the page.
  2. Click on the footnote that returns you to the content with the footnote earlier on the page.
  3. If the navbar is static, you will need to scroll up to see the footnote at the end of the text that includes the footnote.
  • If the navbar is not static (for example, if it disappears while you scroll), you can see the footnote without having to scroll up.

Expected behavior

The visitor should be able to see the footnote without having to scroll up after clicking the footnote link in the Footnotes section.

Actual behavior

When I click the link to go to the section where the footnote is being referenced, I can't see it until I scroll up, which is confusing.

Actual behavior when navbar is static (can see the footnote number)

https://github.com/user-attachments/assets/0600cc55-6e25-4df1-ae39-97fee5617d22

Actual behavior when navbar is hidden (can see the footnote number)

https://github.com/user-attachments/assets/9837f639-a7e3-4b2c-b69e-465a39af8233

Your environment

  • Public source code: https://github.com/scalar-labs/docs-scalardb
  • Public site URL: https://scalardb.scalar-labs.com/docs/latest
  • Docusaurus version used: Docusaurus 3.7 (also tested locally with Docusaurus 3.8)
  • Environment name and version (e.g. Chrome 89, Node.js 16.4): 21.7.0
  • Operating system and version (e.g. Ubuntu 20.04.2 LTS): macOS 15.5

Self-service

  • [ ] I'd be willing to fix this bug myself.

josh-wong avatar Jun 03 '25 09:06 josh-wong