diff --git a/frontend/layouts/default.vue b/frontend/layouts/default.vue
index aa72dec..c279018 100644
--- a/frontend/layouts/default.vue
+++ b/frontend/layouts/default.vue
@@ -1,117 +1,37 @@
 <template>
-	<v-app dark>
-		<v-navigation-drawer
-			v-model="drawer"
-			:mini-variant="miniVariant"
-			:clipped="clipped"
-			fixed
-			app
-		>
-			<v-list>
-				<v-list-item
-					v-for="(item, i) in items"
-					:key="i"
-					:to="item.to"
-					router
-					exact
-				>
-					<v-list-item-action>
-						<v-icon>{{ item.icon }}</v-icon>
-					</v-list-item-action>
-					<v-list-item-content>
-						<v-list-item-title v-text="item.title" />
-					</v-list-item-content>
-				</v-list-item>
-			</v-list>
-		</v-navigation-drawer>
-		<v-app-bar
-			:clipped-left="clipped"
-			fixed
-			app
-		>
-			<v-app-bar-nav-icon @click.stop="drawer = !drawer" />
-			<v-btn
-				icon
-				@click.stop="miniVariant = !miniVariant"
-			>
-				<v-icon>mdi-{{ `chevron-${miniVariant ? 'right' : 'left'}` }}</v-icon>
-			</v-btn>
-			<v-btn
-				icon
-				@click.stop="clipped = !clipped"
-			>
-				<v-icon>mdi-application</v-icon>
-			</v-btn>
-			<v-btn
-				icon
-				@click.stop="fixed = !fixed"
-			>
-				<v-icon>mdi-minus</v-icon>
-			</v-btn>
-			<v-toolbar-title v-text="title" />
+	<v-app>
+		<v-app-bar height="54px" fixed app>
+			<v-toolbar-title>
+				Taskwarrior WebUI
+			</v-toolbar-title>
 			<v-spacer />
-			<v-btn
-				icon
-				@click.stop="rightDrawer = !rightDrawer"
-			>
-				<v-icon>mdi-menu</v-icon>
-			</v-btn>
+			<v-icon class="mr-2" size="28px" @click="dark = !dark">
+				{{ dark ? 'mdi-brightness-4' : 'mdi-brightness-7' }}
+			</v-icon>
 		</v-app-bar>
+
 		<v-content>
-			<v-container>
+			<v-container fluid>
 				<nuxt />
 			</v-container>
 		</v-content>
-		<v-navigation-drawer
-			v-model="rightDrawer"
-			:right="right"
-			temporary
-			fixed
-		>
-			<v-list>
-				<v-list-item @click.native="right = !right">
-					<v-list-item-action>
-						<v-icon light>
-							mdi-repeat
-						</v-icon>
-					</v-list-item-action>
-					<v-list-item-title>Switch drawer (click me)</v-list-item-title>
-				</v-list-item>
-			</v-list>
-		</v-navigation-drawer>
-		<v-footer
-			:absolute="!fixed"
-			app
-		>
-			<span>&copy; {{ new Date().getFullYear() }}</span>
-		</v-footer>
 	</v-app>
 </template>
 
-<script>
-export default {
-	data () {
+<script lang="ts">
+import { defineComponent, computed } from '@vue/composition-api';
+
+export default defineComponent({
+	setup(_props, context) {
+		const dark = computed({
+			get: () => context.root.$vuetify.theme.dark,
+			set: val => {
+				context.root.$vuetify.theme.dark = val;
+			}
+		});
 		return {
-			clipped: false,
-			drawer: false,
-			fixed: false,
-			items: [
-				{
-					icon: 'mdi-apps',
-					title: 'Welcome',
-					to: '/'
-				},
-				{
-					icon: 'mdi-chart-bubble',
-					title: 'Inspire',
-					to: '/inspire'
-				}
-			],
-			miniVariant: false,
-			right: true,
-			rightDrawer: false,
-			title: 'Vuetify.js'
+			dark
 		};
 	}
-};
+});
 </script>
diff --git a/frontend/layouts/error.vue b/frontend/layouts/error.vue
index bdd8d85..7d9129f 100644
--- a/frontend/layouts/error.vue
+++ b/frontend/layouts/error.vue
@@ -1,24 +1,30 @@
 <template>
-	<v-app dark>
-		<h1 v-if="error.statusCode === 404">
-			{{ pageNotFound }}
-		</h1>
-		<h1 v-else>
-			{{ otherError }}
-		</h1>
+	<v-app>
+		<h2 class="headline">
+			{{ error.statusCode }}
+		</h2>
+		<div>
+			{{ error.message }}
+		</div>
 		<NuxtLink to="/">
 			Home page
 		</NuxtLink>
 	</v-app>
 </template>
 
-<script>
-export default {
+<script lang="ts">
+import { defineComponent } from '@vue/composition-api';
+import { NuxtError } from '@nuxt/types';
+
+interface Props {
+	error: NuxtError
+};
+
+export default defineComponent({
 	layout: 'empty',
 	props: {
 		error: {
-			type: Object,
-			default: null
+			type: Object
 		}
 	},
 	data () {
@@ -27,18 +33,11 @@ export default {
 			otherError: 'An error occurred'
 		};
 	},
-	head () {
-		const title
-      = this.error.statusCode === 404 ? this.pageNotFound : this.otherError;
+
+	setup(props: Props, _context) {
 		return {
-			title
+			error: props.error
 		};
 	}
-};
+});
 </script>
-
-<style scoped>
-h1 {
-  font-size: 20px;
-}
-</style>