feat: render semantic portfolio document

src/components/SiteNavigation.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+import type { SectionId } from '@/content/types';
+
+defineProps<{ items: ReadonlyArray<{ id: SectionId; label: string }> }>();
+</script>
+
+<template>
+  <nav aria-label="Portfolio sections">
+    <ul>
+      <li v-for="item in items" :key="item.id">
+        <a :href="`#${item.id}`">{{ item.label }}</a>
+      </li>
+    </ul>
+  </nav>
+</template>