feat: more work done

src/routes/__layout.svelte

@@ -12,10 +12,16 @@
 
 	const NAV_ITEMS = [
 		{ href: '/blog', label: 'Blog' },
-		{ href: '/contact', label: 'Contact' }
+		{ href: '/contact', label: 'Contact' },
 	];
 </script>
 
+<svelte:head
+	><title>{$page.stuff.title} - AlexDaichendt</title>
+	<meta name="description" content={$page.stuff.description} />
+	<meta name="author" content="Alexander Daichendt" />
+</svelte:head>
+
 <div class="container upper">
 	<header>
 		<div class="header">
@@ -88,19 +94,19 @@
 	.navItem a:after {
 		content: '';
 		position: absolute;
-		bottom: 0;
+		bottom: -2px;
 		right: 50%;
 		width: 0%;
-		border-bottom: 2px solid var(--outline-color);
+		border-bottom: 3px solid var(--outline-color);
 		transition: 0.3s;
 	}
 	.navItem a:before {
 		content: '';
 		position: absolute;
-		bottom: 0;
+		bottom: -2px;
 		left: 50%;
 		width: 0%;
-		border-bottom: 2px solid var(--outline-color);
+		border-bottom: 3px solid var(--outline-color);
 		transition: 0.3s;
 	}
 	.navItem a:hover:after {

src/routes/blog/index.svelte

@@ -8,8 +8,13 @@
 		return {
 			status: response.status,
 			props: {
-				posts: response.ok && asJson.posts
-			}
+				posts: response.ok && asJson.posts,
+			},
+			stuff: {
+				title: 'Blog',
+				description:
+					'My blogposts, where I occasionally document things, that I think are not accessible or badly documented.',
+			},
 		};
 	}
 </script>

src/routes/blog/redminote7arrowos.svx

@@ -1,6 +1,13 @@
 ---
 date: '22-05-08'
 title: 'Arrow OS on Redmi Note 7'
+description: 'Learn how to install ArrowOS, based on Android 12 on your Redmi Note 7 (lavender) phone! Also installs root and microG for a BigTech free phone.'
+keywords: 
+  - ArrowOS
+  - Redmi Note 7
+  - Lavender
+  - root
+  - microG
 ---
 
 # How to: Redmi Note 7 with ArrowOs (Android 12), root, microG

src/routes/contact.svelte

@@ -1,7 +1,19 @@
+<script context="module" lang="ts">
+	export async function load() {
+		return {
+			stuff: {
+				title: 'Contact',
+				description: 'All the communication channels for contacting Alex Daichendt ',
+			},
+		};
+	}
+</script>
+
 <script>
 	import { mdiEmailEditOutline } from '@mdi/js';
 	import { mdiGithub } from '@mdi/js';
 	import Icon from 'mdi-svelte';
+	import Element from '../components/element.svelte';
 	import Link from '../components/Link.svelte';
 </script>
 
@@ -16,12 +28,19 @@
 		<Icon path={mdiGithub} />
 		Github: <Link disableIcon href="https://github.com/AlexDaichendt">AlexDaichendt</Link>
 	</li>
+	<li>
+		<span style="font-size:1rem"><Element /></span>
+		Element: @alexdaichendt:matrix.org
+	</li>
 </ul>
 
-I don't use any social media.
+I usually reply within a couple minutes - if it is important.
 
 <style>
 	ul {
 		list-style-type: none;
 	}
+	li {
+		margin-bottom: 0.5rem;
+	}
 </style>

src/routes/impressum.svelte

@@ -1,3 +1,14 @@
+<script context="module" lang="ts">
+	export async function load() {
+		return {
+			stuff: {
+				title: 'Impressum',
+				description: 'The impressum I have to include for Germany.',
+			},
+		};
+	}
+</script>
+
 <h1>Impressum</h1>
 
 <p>Information according to §5 TMG:</p>

src/routes/index.svelte

@@ -1,3 +1,15 @@
+<script context="module" lang="ts">
+	export async function load() {
+		return {
+			stuff: {
+				title: 'Home',
+				description:
+					'Alex Daichendt"s website, blog, and yard of stuffs and things of modern tech.',
+			},
+		};
+	}
+</script>
+
 <script lang="ts">
 	import Link from '../components/Link.svelte';
 	import type { Skill } from '../types';
@@ -9,7 +21,7 @@
 		{ name: 'LXC / Docker', started: 2021 },
 		{ name: 'FaaS', started: 2021 },
 		{ name: 'git', started: 2016 },
-		{ name: 'Linux administration (Debian)', started: 2017 }
+		{ name: 'Linux administration (Debian)', started: 2017 },
 	];
 	const SKILLS: Skill[] = _SKILLS.map((skill) => {
 		const years = new Date().getFullYear() - skill.started;
@@ -25,7 +37,7 @@
 	Programming has been a hobby of mine since my teens. Been working on countless projects for
 	various games. Recently, I started to dabble my feet in DevOps. My formal education I received at <Link
 		href="https://www.tum.de/">TUM</Link
-	>; currently I am persuing my Masters.
+	>, currently I am persuing my Masters.
 </p>
 
 <h2>Skills</h2>

src/routes/privacy.svelte

@@ -1,3 +1,15 @@
+<script context="module" lang="ts">
+	export async function load() {
+		return {
+			stuff: {
+				title: 'Privacy',
+				description:
+					'The privacy policy I have to include even though I don"t collect any data or use shady services.',
+			},
+		};
+	}
+</script>
+
 <h1>Privacy Policy for AlexDaichendt</h1>
 
 <p>