osmosis-labs / osmosis

The AMM Laboratory
https://app.osmosis.zone
Apache License 2.0
889 stars 591 forks source link

Link with anchors don't scroll to correct position #646

Closed czarcas7ic closed 2 years ago

czarcas7ic commented 2 years ago

Issue

When linking to a specific subsection of the documentation, the link will take you slightly above the anchor which in turn changes the address to the subsection prior to the intended subsection.

Example:

Clicking this link:

https://osmosis-labs.github.io/osmosis/developing/network/join-testnet.html#prep-cosmovisor-for-v5

Takes you to slightly above that section which will then change the address bar to:

https://osmosis-labs.github.io/osmosis/developing/network/join-testnet.html#download-chain-data

Once the page is loaded and you select a subsection, the page will jump as intended.

Enabling smoothscroll exacerbates the issue (scrolls even higher above the intended subsection).

I believe Terra docs (the docs we based ours off of) fixed this issue by adding this to the config.js:

    [
      "script",
      {},
      `window.onload = function() {
        requestAnimationFrame(function() {
          if (location.hash) {
            const element = document.getElementById(location.hash.slice(1))

            if (element) {
              element.scrollIntoView()
            }
          }
        })
      }`,
    ],

They (Terra) must have added something else or we might have made some kind of breaking change because that alone does not fix it. When deleting this part of the code, using a link with an anchor will take you to the very top of the page, so the script is needed.

Any insight to fix this would be much appreciated!

czarcas7ic commented 2 years ago

Fixed