Browse Source

fix toc to highlight the correct header on click (#5765)

* fix toc to highlight the correct header on click

* fix case for when the toc has only a few headings
main
Alex Visan 2 years ago
committed by GitHub
parent
commit
d0f94d15eb
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
  1. 4
      src/components/Layout/useTocHighlight.tsx

4
src/components/Layout/useTocHighlight.tsx

@ -4,7 +4,7 @@
import {useState, useRef, useEffect} from 'react';
const TOP_OFFSET = 75;
const TOP_OFFSET = 85;
export function getHeaderAnchors(): HTMLAnchorElement[] {
return Array.prototype.filter.call(
@ -32,7 +32,7 @@ export function useTocHighlight() {
const scrollPosition = window.scrollY + window.innerHeight;
const headersAnchors = getHeaderAnchors();
if (scrollPosition >= 0 && pageHeight - scrollPosition <= TOP_OFFSET) {
if (scrollPosition >= 0 && pageHeight - scrollPosition <= 0) {
// Scrolled to bottom of page.
setCurrentIndex(headersAnchors.length - 1);
return;

Loading…
Cancel
Save