feat: add dpdk post and code component and footnotes

src/components/Code.svelte

@@ -58,4 +58,10 @@
 	:global([data-nu-scheme-is='dark'] body code) {
 		color: var(--bg-color);
 	}
+	:global(pre[class*='language-']) {
+		margin: 0.5em 1rem !important;
+	}
+	:global(code[class*='language-'], pre[class*='language-']) {
+		font-size: 0.9rem;
+	}
 </style>

src/components/Link.svelte

@@ -23,15 +23,16 @@
 	}
 </script>
 
-<a
+<a   
+    {...$$props}
 	{...props}
 	{href}
 	on:mouseover={() => (spin = true)}
 	on:focus={() => (spin = true)}
 	on:mouseleave={() => (spin = false)}
 >
-	{#if !disableIcon}
-		<Icon path={internal ? mdiChevronRight : mdiLinkVariant} size="1rem" {spin} />
+	{#if !disableIcon && !internal}
+		<Icon path={internal ? mdiChevronRight : mdiLinkVariant} size="1rem"  />
 	{/if}
 	<span class="text"><slot /></span>
 </a><style>

src/components/ListItem.svelte

@@ -1,4 +1,8 @@
-<li><slot /></li>
+<script lang="ts">
+	export let id: string | undefined = undefined;
+</script>
+
+<li {id}><slot /></li>
 
 <style>
 	li {

src/components/sup.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+	export let id: string | undefined;
+</script>
+
+<sup {id}><slot /></sup>
+
+<style>
+	sup {
+		vertical-align: top;
+		position: relative;
+		top: -0.3em;
+		left: -0.2em;
+	}
+</style>