thaider / Tweeki

MediaWiki skin based on Twitter's Bootstrap
http://tweeki.kollabor.at
Other
128 stars 31 forks source link

TOC links don't expand correctly with top nav #255

Closed mestela closed 1 year ago

mestela commented 1 year ago

Hi, I love the look and feel of tweeki, but noticed an issue with the dynamically expanding TOC and the top nav. If you follow this link for example:

https://www.tokeru.com/cgwiki/PopsSplitAvoid#Grid_noise

You'll see that it links to the right place, and the title is visible, which I've done by adding

.mw-headline {
    scroll-margin-top: 4rem;
}

To my tweeki.css. The TOC is incorrect though, it is highlighting the previous section. If you scroll down a little so that the 'Grid noise' title hits the top of the page under the top nav, then the TOC expands as expected.

Is there a way to apply a similar 'scroll-margin-top' fix to the TOC expand code, so the correct sections expand a little earlier, not just when they hit the top of the page underneath the top nav?

thaider commented 1 year ago

Should be fixed in latest master. In order to make it work, you should remove your custom stylings for .mw-headline and instead set the top padding for the content to the right value:

.with-navbar.with-navbar-fixed {
  padding-top: 4rem !important;
}

Some newly added javascript will read this value and use it as offset for the scrollspy feature that is responsible for expanding the toc at the correct position.

mestela commented 1 year ago

Oh awesome, thanks!