wholetrans/docs-matrix-spec
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Improve the JS script to highlight the current ToC entry (#1991)

Browse source 
The code relied on an IntersectionOberver, so the ToC was only updated when a heading was in the viewport.
It meant that if we jumped to a part of the text that has no heading, the ToC would still point to the old entry.

The new code looks for the correct heading when the view is scrolled so the correct entry is always selected.

Signed-off-by: Kévin Commaille <zecakeh@tedomum.fr>
This commit is contained in:
Kévin Commaille 2024-11-12 23:53:46 +01:00 • committed by GitHub
parent 9799b892de
commit b1f66d1b71
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 128 additions and 121 deletions
Download patch file Download diff file Expand all files Collapse all files

13
layouts/partials/hooks/body-end.html
View file

@ -2,16 +2,9 @@
This template is included at the end of each page's `<body>`.
We're using it here to:
1) include the JS that generates the table of contents. It would be better
to generate the table of contents as part of the Hugo build process, but
that doesn't work nicely with the way we want to author client-server modules
as separate files.
2) highlight and scroll the ToC in the sidebar to match the place we are at
in the document.
We're using it here to highlight and scroll the ToC in the sidebar to match
the place we are at in the document.
*/}}
<script defer language="javascript" type="text/javascript" src="{{ "js/toc.js" | urlize | relURL }}"></script>
<script defer language="javascript" type="text/javascript" src="{{ "js/toc.js" | relURL }}"></script>