Remove TOC

4 files changed, 6 insertions, 96 deletions

diff --git a/src/components/blog/TOC.astro b/src/components/blog/TOC.astro
deleted file mode 100644
index 2a45124..0000000
--- a/src/components/blog/TOC.astro
+++ /dev/null
@@ -1,22 +0,0 @@
----
-import type { MarkdownHeading } from "astro";
-import { generateToc } from "@/utils/generateToc";
-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>
diff --git a/src/components/blog/TOCHeading.astro b/src/components/blog/TOCHeading.astro
deleted file mode 100644
index b9dd486..0000000
--- a/src/components/blog/TOCHeading.astro
+++ /dev/null
@@ -1,27 +0,0 @@
----
-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>
diff --git a/src/layouts/BlogPost.astro b/src/layouts/BlogPost.astro
index 888e7a2..9c60900 100644
--- a/src/layouts/BlogPost.astro
+++ b/src/layouts/BlogPost.astro
@@ -2,7 +2,6 @@
 import { type CollectionEntry, render } from "astro:content";
 
 import Masthead from "@/components/blog/Masthead.astro";
-import TOC from "@/components/blog/TOC.astro";
 import WebMentions from "@/components/blog/webmentions/index.astro";
 
 import BaseLayout from "./Base.astro";
@@ -15,7 +14,7 @@ const { post } = Astro.props;
 const { ogImage, title, description, updatedDate, publishDate } = post.data;
 const socialImage = ogImage ?? `/og-image/${post.id}.png`;
 const articleDate = updatedDate?.toISOString() ?? publishDate.toISOString();
-const { headings, remarkPluginFrontmatter } = await render(post);
+const { remarkPluginFrontmatter } = await render(post);
 const readingTime: string = remarkPluginFrontmatter.readingTime;
 ---
 
@@ -29,14 +28,11 @@ const readingTime: string = remarkPluginFrontmatter.readingTime;
 >
 	<article class="grow break-words" data-pagefind-body>
 		<div id="blog-hero" class="mb-12"><Masthead content={post} readingTime={readingTime} /></div>
-		<div class="flex flex-col gap-10 lg:flex-row lg:items-start">
-			{!!headings.length && <TOC headings={headings} />}
-			<div
-				class="prose prose-sm prose-headings:font-semibold prose-headings:text-accent-2 prose-headings:before:absolute prose-headings:before:-ms-4 prose-headings:before:text-gray-600 prose-headings:hover:before:text-accent sm:prose-headings:before:content-['#'] sm:prose-th:before:content-none"
-			>
-				<slot />
-				<WebMentions />
-			</div>
+		<div
+			class="prose prose-sm prose-cactus prose-headings:font-semibold prose-headings:text-accent-2 prose-headings:before:absolute prose-headings:before:-ms-4 prose-headings:before:text-gray-600 prose-headings:hover:before:text-accent sm:prose-headings:before:content-['#'] sm:prose-th:before:content-none max-w-none"
+		>
+			<slot />
+			<WebMentions />
 		</div>
 	</article>
 	<button
diff --git a/src/utils/generateToc.ts b/src/utils/generateToc.ts
deleted file mode 100644
index f63f0bf..0000000
--- a/src/utils/generateToc.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-// Heavy inspiration from starlight: https://github.com/withastro/starlight/blob/main/packages/starlight/utils/generateToC.ts
-import type { MarkdownHeading } from "astro";
-
-export interface TocItem extends MarkdownHeading {
-	children: TocItem[];
-}
-
-interface TocOpts {
-	maxHeadingLevel?: number | undefined;
-	minHeadingLevel?: number | undefined;
-}
-
-/** Inject a ToC entry as deep in the tree as its `depth` property requires. */
-function injectChild(items: TocItem[], item: TocItem): void {
-	const lastItem = items.at(-1);
-	if (!lastItem || lastItem.depth >= item.depth) {
-		items.push(item);
-	} else {
-		injectChild(lastItem.children, item);
-		return;
-	}
-}
-
-export function generateToc(
-	headings: ReadonlyArray<MarkdownHeading>,
-	{ maxHeadingLevel = 4, minHeadingLevel = 2 }: TocOpts = {},
-) {
-	// by default this ignores/filters out h1 and h5 heading(s)
-	const bodyHeadings = headings.filter(
-		({ depth }) => depth >= minHeadingLevel && depth <= maxHeadingLevel,
-	);
-	const toc: Array<TocItem> = [];
-
-	for (const heading of bodyHeadings) injectChild(toc, { ...heading, children: [] });
-
-	return toc;
-}