If you click a ToC item it doesn't scroll to the correct position, that's because the default behavior for anchor points is to scroll to top. To fix this create a method like this:
function scrollIntoView(id: string) {
const element = document.getElementById(id);
element?.scrollIntoView({
behavior: 'smooth',
inline: 'center',
block: 'center',
});
}
Change the anchor tag to a button add an on:click to call that with heading.id, and then text-align the button to left. Reason for button is accessibility. This fixes it.
If you click a ToC item it doesn't scroll to the correct position, that's because the default behavior for anchor points is to scroll to top. To fix this create a method like this:
Change the anchor tag to a button add an on:click to call that with heading.id, and then text-align the button to left. Reason for button is accessibility. This fixes it.