summaryrefslogtreecommitdiff
path: root/src/components/blog/TOCHeading.astro
blob: b9dd486a69270b1ba70bf401021e34507d4719fb (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
---
import type { TocItem } from "@/utils/generateToc";

interface Props {
	heading: TocItem;
}

const {
	heading: { children, depth, slug, text },
} = Astro.props;
---

<li class={`${depth > 2 ? "ms-2" : ""}`}>
	<a
		class={`line-clamp-2 hover:text-accent ${depth <= 2 ? "mt-3" : "mt-2 text-xs"}`}
		href={`#${slug}`}><span aria-hidden="true" class="me-0.5">#</span>{text}</a
	>
	{
		!!children.length && (
			<ol>
				{children.map((subheading) => (
					<Astro.self heading={subheading} />
				))}
			</ol>
		)
	}
</li>