Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(gatsby-remark-autolink-headers): use offsetY prop as scroll-margin-top #36961

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

sanginchun
Copy link

Description

There is an issue with the plugin (gatsby-remark-autolink-headers) when offsetY prop is passed.

On initial load of a page with hash (like #heading-1), scroll moves to the expected position (with offsetY calculated). But then if you click another link with hash in that page, offset is ignored.

I guess the reason of this behavior might be that it is changing scroll position programatically, in gatsby-browser.js and some script in gatsby-ssr.js.

So why not just use scroll-margin-top css property and default behavior of the browser?

I just added scroll-margin-top to the headings when offsetY is passed. Deleted gatsby-browser.js and just commented out the script code in gatsby-ssr.js because I wasn't sure if it's ok to delete the existing comments.

Please let me know if some changes has to be made.

Documentation

https://github.com/sanginchun/gatsby/tree/master/packages/gatsby-remark-autolink-headers

Related Issues

I think the unexpected behavior that I explained above is related to #26169

@gatsbot gatsbot bot added the status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer label Nov 4, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant