aboutsummaryrefslogtreecommitdiff
path: root/layouts
diff options
context:
space:
mode:
authorAndrew Lee <alee14498@protonmail.com>2020-05-10 09:24:22 -0400
committerAndrew Lee <alee14498@protonmail.com>2020-05-10 09:24:22 -0400
commitfa3f2d2cd196998bd1d0d09a0c649d7f26500ded (patch)
tree4ce90849ef672a1a8a5d693acb3c0f104bd0f613 /layouts
parent69474fee32c62e1b97b9f51b78a2e242542ae9a7 (diff)
downloadProject-NewTube-fa3f2d2cd196998bd1d0d09a0c649d7f26500ded.tar.gz
Project-NewTube-fa3f2d2cd196998bd1d0d09a0c649d7f26500ded.tar.bz2
Project-NewTube-fa3f2d2cd196998bd1d0d09a0c649d7f26500ded.zip
Added the files
Diffstat (limited to 'layouts')
-rw-r--r--layouts/README.md7
-rw-r--r--layouts/default.vue93
-rw-r--r--layouts/error.vue44
3 files changed, 144 insertions, 0 deletions
diff --git a/layouts/README.md b/layouts/README.md
new file mode 100644
index 0000000..cad1ad5
--- /dev/null
+++ b/layouts/README.md
@@ -0,0 +1,7 @@
+# LAYOUTS
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your Application Layouts.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/views#layouts).
diff --git a/layouts/default.vue b/layouts/default.vue
new file mode 100644
index 0000000..d48cc8c
--- /dev/null
+++ b/layouts/default.vue
@@ -0,0 +1,93 @@
+<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-spacer />
+ <v-btn icon @click.stop="rightDrawer = !rightDrawer">
+ <v-icon>mdi-menu</v-icon>
+ </v-btn>
+ </v-app-bar>
+ <v-content>
+ <v-container>
+ <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 :fixed="fixed" app>
+ <span>&copy; {{ new Date().getFullYear() }}</span>
+ </v-footer>
+ </v-app>
+</template>
+
+<script>
+export default {
+ data() {
+ 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'
+ }
+ }
+}
+</script>
diff --git a/layouts/error.vue b/layouts/error.vue
new file mode 100644
index 0000000..3b535fe
--- /dev/null
+++ b/layouts/error.vue
@@ -0,0 +1,44 @@
+<template>
+ <v-app dark>
+ <h1 v-if="error.statusCode === 404">
+ {{ pageNotFound }}
+ </h1>
+ <h1 v-else>
+ {{ otherError }}
+ </h1>
+ <NuxtLink to="/">
+ Home page
+ </NuxtLink>
+ </v-app>
+</template>
+
+<script>
+export default {
+ layout: 'empty',
+ props: {
+ error: {
+ type: Object,
+ default: null
+ }
+ },
+ data() {
+ return {
+ pageNotFound: '404 Not Found',
+ otherError: 'An error occurred'
+ }
+ },
+ head() {
+ const title =
+ this.error.statusCode === 404 ? this.pageNotFound : this.otherError
+ return {
+ title
+ }
+ }
+}
+</script>
+
+<style scoped>
+h1 {
+ font-size: 20px;
+}
+</style>