Header links

Author: andrewbranch

content/main.css

@@ -184,7 +184,7 @@ h3 {
 	font-family: var(--font-grotesk);
 	font-variant: small-caps;
 	text-transform: lowercase;
-	letter-spacing: 3px;
+	letter-spacing: 1px;
 	font-weight: 500;
 	font-size: 1.4rem;
 	margin-bottom: calc(var(--rhythm) * 0.25rem);

eleventy.config.js

@@ -4,6 +4,7 @@ const bundlerPlugin = require("@11ty/eleventy-plugin-bundle");
 const eleventyImage = require("@11ty/eleventy-img");
 const getImageSize = require("image-size");
 
+const anchor = require("markdown-it-anchor");
 /** @param {import("@11ty/eleventy").UserConfig} eleventyConfig */
 module.exports = (eleventyConfig) => {
 	const monthDayYearFormat = new Intl.DateTimeFormat("en-US", {
@@ -83,6 +84,11 @@ module.exports = (eleventyConfig) => {
 	eleventyConfig.amendLibrary("md", (md) => {
 		md.use(require("markdown-it-footnote"));
 		md.use(require("@ryanxcharles/markdown-it-katex"));
+		md.use(anchor, {
+			permalink: anchor.permalink.headerLink({
+				class: "no-underline",
+			}),
+		});
 	});
 
 	return {

package-lock.json

@@ -22,6 +22,7 @@
 		"@unocss/reset": "^0.57.2",
 		"image-size": "*",
 		"katex": "^0.16.9",
+		"markdown-it-anchor": "^8.6.7",
 		"markdown-it-footnote": "^3.0.3",
 		"npm-run-all": "^4.1.5",
 		"prettier": "^3.0.3",

package.json

@@ -4,7 +4,7 @@ import { defineConfig, presetUno } from "unocss";
 export default defineConfig({
 	cli: {
 		entry: {
-			patterns: ["{content,_layouts}/**/*.{html,md,liquid}"],
+			patterns: ["{content,_layouts}/**/*.{html,md,liquid}", "eleventy.config.js"],
 			outFile: "content/uno.css",
 		},
 	},