From da51cffcff0d6875c30adbb62cd13f06190b7734 Mon Sep 17 00:00:00 2001
From: rijkvanzanten <rijkvanzanten@me.com>
Date: Wed, 7 Oct 2020 22:05:19 -0400
Subject: [PATCH] Small tweaks

---
 app/src/modules/docs/routes/not-found.vue | 23 +++++++++++++++++++++--
 app/src/modules/docs/routes/static.vue    | 17 ++++++++++++-----
 2 files changed, 33 insertions(+), 7 deletions(-)

diff --git a/app/src/modules/docs/routes/not-found.vue b/app/src/modules/docs/routes/not-found.vue
index f790be1ebc..5778564643 100644
--- a/app/src/modules/docs/routes/not-found.vue
+++ b/app/src/modules/docs/routes/not-found.vue
@@ -1,13 +1,32 @@
 <template>
-	<private-view>
-		<div>Not Found</div>
+	<private-view :title="$t('page_not_found')">
+		<template #navigation>
+			<docs-navigation />
+		</template>
+
+		<div class="not-found">
+			<v-info :title="$t('page_not_found')" icon="not_interested">
+				{{ $t('page_not_found_body') }}
+			</v-info>
+		</div>
 	</private-view>
 </template>
 
 <script lang="ts">
 import { defineComponent } from '@vue/composition-api';
+import DocsNavigation from '../components/navigation.vue';
 
 export default defineComponent({
 	name: 'NotFound',
+	components: { DocsNavigation },
 });
 </script>
+
+<style lang="scss" scoped>
+.not-found {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	padding: 20vh 0;
+}
+</style>
diff --git a/app/src/modules/docs/routes/static.vue b/app/src/modules/docs/routes/static.vue
index cc917fb84e..8b6c19b3da 100644
--- a/app/src/modules/docs/routes/static.vue
+++ b/app/src/modules/docs/routes/static.vue
@@ -1,5 +1,5 @@
 <template>
-	<private-view :title="title">
+	<private-view :title="title" ref="view">
 		<template #headline>Documentation</template>
 
 		<template #title-outer:prepend>
@@ -12,14 +12,14 @@
 			<docs-navigation />
 		</template>
 
-		<div class="content selectable">
+		<div class="docs-content selectable">
 			<markdown>{{ markdownWithoutTitle }}</markdown>
 		</div>
 	</private-view>
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, computed } from '@vue/composition-api';
+import { defineComponent, ref, computed, inject, onUpdated } from '@vue/composition-api';
 import DocsNavigation from '../components/navigation.vue';
 import Markdown from '../components/markdown.vue';
 
@@ -59,6 +59,9 @@ export default defineComponent({
 	},
 	setup() {
 		const markdown = ref('');
+		const view = ref<Vue>();
+
+		const mainElement = inject('main-element', ref<Element | null>(null));
 
 		const title = computed(() => {
 			const firstLine = markdown.value.split('\n').shift();
@@ -71,13 +74,17 @@ export default defineComponent({
 			return lines.join('\n');
 		});
 
-		return { markdown, title, markdownWithoutTitle };
+		onUpdated(() => {
+			view.value.$data.contentEl?.scrollTo({ top: 0 });
+		});
+
+		return { markdown, title, markdownWithoutTitle, view };
 	},
 });
 </script>
 
 <style lang="scss" scoped>
-.content {
+.docs-content {
 	max-width: 740px;
 	padding: 0 var(--content-padding) var(--content-padding-bottom);
 }