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 ToC preventing page scrolling beyond active heading when zoomed into page #23

Merged
merged 3 commits into from
Sep 13, 2022

Conversation

janosh
Copy link
Owner

@janosh janosh commented Sep 13, 2022

Closes #22.

@oskar-gmerek Could you try the code in this branch (e.g. by copy-pasting the Toc.svelte component into your node_modules) to see if it solves the first problem reported in #22.

…TocLi?.scrollIntoView()

latter scrolls entire viewport, former only scrolls within ToC component
also add props
- activeTocLi: HTMLLIElement | null = null
- tocItems: HTMLLIElement[] = []

rename prop activeTopOffset = 100 -> activeHeadingScrollOffset

rename CSS var --toc-max-width -> --toc-desktop-max-width

add CSS props
- `aside.toc > nav > ul > li`
  - `border-radius: var(--toc-li-border-radius, 2pt)`
  - `padding: var(--toc-li-padding, 2pt 4pt)`
- `aside.toc.mobile`
  - `bottom: var(--toc-mobile-bottom, 1em)`
  - `right: var(--toc-mobile-right, 1em)`
@oskar-gmerek
Copy link
Contributor

@janosh yes, that solving a problem 👍

@janosh
Copy link
Owner Author

janosh commented Sep 13, 2022

I also find out, that if I do not wrap with a fixed position wrapper, then svelte-toc prevents scrolling the page more than the height of the ToC component.

Does this PR also address your 2nd problem? I couldn't reproduce that one.

@janosh janosh merged commit 66c5c4a into main Sep 13, 2022
@janosh janosh deleted the fix-gh-22 branch September 13, 2022 19:42
@oskar-gmerek
Copy link
Contributor

Does this PR also address your 2nd problem? I couldn't reproduce that one.

Yes, thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Prevents scroll when using smart zoom on macOS
2 participants