feat: custom not found page

package.json

@@ -1,6 +1,6 @@
 {
   "name": "md-blog",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "private": true,
   "type": "module",
   "repository": "https://github.com/klemek/md-blog",

src/views/NotFoundView.vue

@@ -2,17 +2,22 @@
 import { TITLE } from '@lib/config'
 import { stripHTML } from '@lib/strings'
 import PageFooter from '@components/PageFooter.vue'
-import { onBeforeMount } from 'vue'
+import { onBeforeMount, ref } from 'vue'
+import NavBar from '@components/NavBar.vue'
 
-onBeforeMount(() => {
+const html = ref<string>('')
-  window.document.title = stripHTML(TITLE) + ' — Not Found'
+
+onBeforeMount(async () => {
+  window.document.title = stripHTML(TITLE)
+
+  html.value = (await import('@articles/not_found.md')).html
 })
 </script>
 
 <template>
-  <main>
+  <main class="article">
     <NavBar />
-    <h1>Page not found</h1>
+    <div v-html="html"></div>
     <PageFooter />
   </main>
 </template>