Add site syntax highlighting

site/decodal-site/src/lib/docs.js

@@ -1,4 +1,5 @@
 import { marked } from 'marked';
+import { escapeAttribute, escapeHtml, highlightCode } from './highlight.js';
 
 const modules = import.meta.glob('../../../../doc/manual/souce/**/*.md', {
   query: '?raw',
@@ -79,7 +80,17 @@ export const nav = [
   { title: 'Open Issues', slug: 'open-issues' },
 ];
 
-marked.setOptions({ gfm: true });
+const renderer = new marked.Renderer();
+
+renderer.code = (code, language = '') => {
+  const normalizedLanguage = language.split(/\s+/)[0] ?? '';
+  const className = normalizedLanguage ? ` class="language-${escapeAttribute(normalizedLanguage)}"` : '';
+  return `<pre class="code-block"><code${className}>${highlightCode(code, normalizedLanguage)}</code></pre>`;
+};
+
+renderer.codespan = (code) => `<code>${escapeHtml(code)}</code>`;
+
+marked.setOptions({ gfm: true, renderer });
 
 export function allDocSlugs() {
   return Object.keys(docs).filter((slug) => slug !== 'index');