feat: add syntax highlighting for code blocks

Integrates @11ty/eleventy-plugin-syntaxhighlight (PrismJS) for
build-time syntax highlighting of fenced code blocks. Includes
a custom GitHub-inspired theme with dark mode support (.dark class).

All existing articles with triple-backtick code blocks will
automatically get highlighting on next Eleventy rebuild.

Also fixes overflow-x: hidden on .prose/.e-content that was
clipping scrollable code blocks — changed to overflow-x: clip.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Ricardo
2026-02-11 10:21:31 +01:00
parent 2b3e51042c
commit ddbc983505
6 changed files with 343 additions and 12 deletions

View File

@@ -10,23 +10,24 @@
},
"dependencies": {
"@11ty/eleventy": "^3.0.0",
"html-minifier-terser": "^7.0.0",
"markdown-it": "^14.0.0",
"@11ty/eleventy-fetch": "^4.0.1",
"@11ty/eleventy-img": "^6.0.0",
"@11ty/eleventy-plugin-rss": "^2.0.2",
"@11ty/eleventy-plugin-syntaxhighlight": "^5.0.2",
"@atproto/api": "^0.12.0",
"@chrisburnell/eleventy-cache-webmentions": "^2.2.7",
"@quasibit/eleventy-plugin-sitemap": "^2.2.0",
"@atproto/api": "^0.12.0",
"eleventy-plugin-embed-everything": "^1.21.0",
"rss-parser": "^3.13.0",
"pagefind": "^1.3.0"
"html-minifier-terser": "^7.0.0",
"markdown-it": "^14.0.0",
"pagefind": "^1.3.0",
"rss-parser": "^3.13.0"
},
"devDependencies": {
"tailwindcss": "^3.4.0",
"@tailwindcss/typography": "^0.5.0",
"autoprefixer": "^10.4.0",
"postcss": "^8.4.0",
"postcss-cli": "^11.0.0",
"autoprefixer": "^10.4.0",
"@tailwindcss/typography": "^0.5.0"
"tailwindcss": "^3.4.0"
}
}