diff options
Diffstat (limited to 'src/components/blog/TOC.astro')
| -rw-r--r-- | src/components/blog/TOC.astro | 22 |
1 files changed, 22 insertions, 0 deletions
diff --git a/src/components/blog/TOC.astro b/src/components/blog/TOC.astro new file mode 100644 index 0000000..6649546 --- /dev/null +++ b/src/components/blog/TOC.astro @@ -0,0 +1,22 @@ +--- +import { generateToc } from "@/utils/generateToc"; +import type { MarkdownHeading } from "astro"; +import TOCHeading from "./TOCHeading.astro"; + +interface Props { + headings: MarkdownHeading[]; +} + +const { headings } = Astro.props; + +const toc = generateToc(headings); +--- + +<details open class="lg:sticky lg:top-12 lg:order-2 lg:-me-32 lg:basis-64"> + <summary class="title hover:marker:text-accent cursor-pointer text-lg">Table of Contents</summary> + <nav class="ms-4 lg:w-full"> + <ol class="mt-4"> + {toc.map((heading) => <TOCHeading heading={heading} />)} + </ol> + </nav> +</details> |