The conditional section of index.ts when toc.sticky is enabled, which was added 3 years ago, seems to be out of date with the latest codebase.
|
/* sphinx-immaterial: sticky toc headings */ |
|
if (feature("toc.sticky")) { |
|
watchElementSize(document.body).pipe(distinctUntilKeyChanged("width"), |
|
debounceTime(0)).subscribe(() => { |
|
// The `position: sticky` CSS feature by itself is |
|
// sufficient to enable a single level of "sticky" headings. |
|
// To display multiple levels of sticky headings, it is |
|
// necessary to specify a `top` position for each nested |
|
// heading that is exactly the sum of the heights of the |
|
// ancestor headings. For fixed-height headings that can be |
|
// done statically, but this theme wraps long titles. |
|
// Therefore, we must use JavaScript to compute the |
|
// necessary top positions for each heading. |
|
const existingHeights = new Map<HTMLElement, {height: string, zindex: number}>() |
|
const heightProperty = "--md-nav__header-height" |
|
for (const link of getElements(".md-nav__link", el)) { |
|
const nav = link.nextElementSibling |
|
if (!(nav instanceof HTMLElement) || nav.tagName !== "NAV") { |
|
continue |
|
} |
|
let heightStr = "" |
|
let zindex = NaN |
|
const parentNav = nav.parentElement!.closest("nav") |
|
if (parentNav !== null) { |
|
const info = existingHeights.get(parentNav) |
|
if (info !== undefined) { |
|
heightStr = `${info.height} + ` |
|
zindex = info.zindex - 1 |
|
} |
|
} |
|
if (isNaN(zindex)) { |
|
zindex = 100 |
|
} |
|
heightStr += `${link.offsetHeight}px + 0.625em` |
|
link.classList.add("md-nav__sticky") |
|
link.style.setProperty("--md-nav__sticky-zindex", zindex.toString()) |
|
nav.style.setProperty(heightProperty, `calc(${heightStr})`) |
|
existingHeights.set(nav, {height: heightStr, zindex}) |
|
} |
|
}) |
|
} |
See the following example when toc.sticky and globaltoc_collapse are enabled - the TOC headers obscure their first child entirely (see "Officers" heading) and overlap the next header (see "Sets" heading):
Inspecting the TOC headers ("Officers", "Sets") and disabling the --md-nav__sticky-zindex and --md-nav__header-height properties set by lines 417 and 418 fixes the issue, even when scrolling:
Hence I'm guessing that removing lines 417 and 418 would be enough to fix this issue:
|
link.style.setProperty("--md-nav__sticky-zindex", zindex.toString()) |
|
nav.style.setProperty(heightProperty, `calc(${heightStr})`) |
The conditional section of
index.tswhentoc.stickyis enabled, which was added 3 years ago, seems to be out of date with the latest codebase.sphinx-immaterial/src/templates/assets/javascripts/components/toc/index.ts
Lines 382 to 422 in 12adf37
See the following example when
toc.stickyandglobaltoc_collapseare enabled - the TOC headers obscure their first child entirely (see "Officers" heading) and overlap the next header (see "Sets" heading):Inspecting the TOC headers ("Officers", "Sets") and disabling the
--md-nav__sticky-zindexand--md-nav__header-heightproperties set by lines 417 and 418 fixes the issue, even when scrolling:Hence I'm guessing that removing lines 417 and 418 would be enough to fix this issue:
sphinx-immaterial/src/templates/assets/javascripts/components/toc/index.ts
Lines 417 to 418 in 12adf37