Update layout

This commit is contained in:
2022-10-20 14:12:11 +02:00
parent e19602f6fa
commit bcbd5cd136
7 changed files with 25 additions and 15 deletions

9
components/FooterApp.vue Normal file
View File

@@ -0,0 +1,9 @@
<template>
<v-footer app>
<v-row justify="center" no-gutters>
<v-col cols="12" class="text-center">
<span class="text-caption">&copy; {{ new Date().getFullYear() }}</span>
</v-col>
</v-row>
</v-footer>
</template>

View File

@@ -1,18 +1,21 @@
<template>
<v-app dark>
<v-app-bar fixed app>
<NavigationDrawer ref="navDrawer" />
<v-app-bar app clipped-left>
<v-app-bar-nav-icon @click="toggleNavDrawer" />
<v-toolbar-title v-text="title" />
<v-spacer />
<v-btn v-if="loggedIn" icon color="primary" @click="logout">
<v-btn icon @click="$vuetify.theme.dark = !$vuetify.theme.dark">
<v-icon>mdi-theme-light-dark</v-icon>
</v-btn>
<v-btn v-if="loggedIn" icon @click="logout">
<v-icon>mdi-logout-variant</v-icon>
</v-btn>
</v-app-bar>
<v-main>
<Nuxt />
</v-main>
<v-footer :absolute="!fixed" app>
<span>&copy; {{ new Date().getFullYear() }}</span>
</v-footer>
<FooterApp />
<ToastComponent />
</v-app>
</template>
@@ -34,6 +37,9 @@ export default {
}
},
methods: {
toggleNavDrawer () {
this.$refs.navDrawer.toggle()
},
logout () {
signOut(this.$auth).then(() => {
// Sign-out successful

View File

@@ -3,6 +3,8 @@
<v-main>
<Nuxt />
</v-main>
<FooterApp />
<ToastComponent />
</v-app>
</template>

View File

@@ -7,6 +7,7 @@
{{ otherError }}
</h1>
<NuxtLink to="/"> Home page </NuxtLink>
<FooterApp />
</v-app>
</template>

View File

@@ -18,6 +18,7 @@
</v-card>
</v-container>
</v-main>
<FooterApp />
<ToastComponent />
</v-app>
</template>

View File

@@ -6,16 +6,6 @@
{{ id.toUpperCase() }} - {{ course.name }}
</v-card>
</v-col>
<v-col cols="12" class="text-center">
<blockquote class="blockquote">
&#8220;First, solve the problem. Then, write the code.&#8221;
<footer>
<small>
<em>&mdash;John Johnson</em>
</small>
</footer>
</blockquote>
</v-col>
</v-row>
</v-container>
</template>

View File

@@ -128,6 +128,7 @@ import {
export default {
name: 'LoginPage',
layout: 'empty',
data () {
return {
existingUser: true,