add base path + use relative links

This commit is contained in:
Felix Roos 2023-01-03 23:02:41 +01:00
parent 027c669ad7
commit 11d3251c67
9 changed files with 34 additions and 21 deletions

View file

@ -9,9 +9,10 @@ type Props = {
};
const { headings, githubEditUrl } = Astro.props as Props;
const currentPage = Astro.url.pathname;
---
<nav aria-labelledby="grid-right">
<TableOfContents client:media="(min-width: 50em)" headings={headings} />
<TableOfContents client:media="(min-width: 50em)" headings={headings} currentPage={currentPage} />
<MoreMenu editHref={githubEditUrl} />
</nav>

View file

@ -8,7 +8,10 @@ type ItemOffsets = {
topOffset: number;
};
const TableOfContents: FunctionalComponent<{ headings: MarkdownHeading[] }> = ({ headings = [] }) => {
const TableOfContents: FunctionalComponent<{ headings: MarkdownHeading[]; currentPage: string }> = ({
headings = [],
currentPage,
}) => {
const toc = useRef<any>();
const onThisPageID = 'on-this-page-heading';
const itemOffsets = useRef<ItemOffsets[]>([]);
@ -73,7 +76,7 @@ const TableOfContents: FunctionalComponent<{ headings: MarkdownHeading[] }> = ({
.map((heading) => (
<li className={`w-full`}>
<a
href={`#${heading.slug}`}
href={`${currentPage}#${heading.slug}`}
onClick={onLinkClick}
className={`py-0.5 block cursor-pointer w-full border-l-4 border-header hover:bg-header ${
['pl-4', 'pl-9', 'pl-12'][heading.depth - minDepth]