Fix highlight.js

Author: Discusser

src/routes/+layout.svelte

@@ -6,10 +6,14 @@
 	import NavBar from '$lib/components/shared/NavBar.svelte';
 	import Footer from '$lib/components/shared/Footer.svelte';
 	import SideNav from '$lib/components/shared/SideNav.svelte';
-	import hljs from 'highlight.js';
-	import { onMount } from 'svelte';
+	import hljs from 'highlight.js/lib/core';
+	import c from 'highlight.js/lib/languages/c';
+	import { afterNavigate } from '$app/navigation';
 
-	onMount(() => {
+	let { children } = $props();
+
+	hljs.registerLanguage('c', c);
+	afterNavigate(() => {
 		hljs.highlightAll();
 	});
 </script>
@@ -25,7 +29,7 @@
 		</div>
 		<div class="flex grow justify-center">
 			<div class="w-full lg:w-1/2">
-				<slot />
+				{@render children()}
 			</div>
 		</div>
 	</div>

src/routes/blog/articles/numworks-programming/+page.svelte

@@ -116,7 +116,7 @@ sleep(t) - suspend execution for t seconds</code
 		and also uses a special implementation of python called MicroPython. Digging into the
 		MicroPython source code, we can find a base definition of an object in C:
 	</p>
-	<pre><code class="language-c"
+	<pre><code
 			>{`// Anything that wants to be a concrete MicroPython object must have mp_obj_base_t
 // as its first member (small ints, qstr objs and inline floats are not concrete).
 struct _mp_obj_base_t {
@@ -163,7 +163,7 @@ struct _mp_obj_base_t {
 		code for the header file, pulled from my latest app at the time of writing, below.
 	</p>
 	<Collapsible title="eadk.h">
-		<pre class="h-96"><code class="language-c"
+		<pre class="h-96"><code
 				>{`#ifndef EADK_H
 #define EADK_H