From 59eb9151618cc27baadb16b2f5e89f694ecbfc95 Mon Sep 17 00:00:00 2001
From: ricardovanlaarhoven <ricardo1994@gmail.com>
Date: Wed, 2 Oct 2019 15:10:12 +0200
Subject: [PATCH 1/7] remove clickable parent menu item

---
 generator/templates/Default/src/components/MainMenu.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/generator/templates/Default/src/components/MainMenu.vue b/generator/templates/Default/src/components/MainMenu.vue
index 1b937be..0743221 100644
--- a/generator/templates/Default/src/components/MainMenu.vue
+++ b/generator/templates/Default/src/components/MainMenu.vue
@@ -6,7 +6,6 @@
             <v-list-group
                 :disabled="item.disabled"
                 :prepend-icon="item.icon"
-                @click="routeTo(item.route)"
                 no-icon
                 v-if="typeof item.items !== 'undefined'"
                 v-model="item.active"
@@ -75,4 +74,4 @@
 </script>
 
 <style scoped>
-</style>
\ No newline at end of file
+</style>

From b042a04e7bd42cec56bb4faba5ee3307f37e5296 Mon Sep 17 00:00:00 2001
From: ricardovanlaarhoven <ricardo1994@gmail.com>
Date: Wed, 23 Oct 2019 14:28:13 +0200
Subject: [PATCH 2/7] vuetify 2.0 support

---
 generator/index.js                            |  2 +-
 .../src/views/InvitationAccept.vue            |  2 +-
 .../Authorisation/src/views/Login.vue         |  4 +-
 .../src/views/PasswordForgotten.vue           |  6 +--
 .../Authorisation/src/views/PasswordReset.vue |  2 +-
 .../Authorisation/src/views/Profile.vue       |  6 +--
 .../Crud/src/components/forms/User.vue        | 46 ++++++++---------
 .../Default/public/{.htaccess => _htaccess}   |  0
 generator/templates/Default/src/App.vue       |  6 +--
 .../Default/src/Views/PageForbidden.vue       |  4 +-
 .../Default/src/Views/PageNotFound.vue        |  4 +-
 .../Default/src/components/MainMenu.vue       | 50 +++++++++----------
 .../Default/src/components/ProfileMenu.vue    | 16 +++---
 generator/templates/Default/src/newmain.js    |  2 +-
 .../templates/Default/src/plugins/vuetify.js  | 34 ++++++++-----
 .../TemplateLoader/src/templates/Default.vue  |  6 +--
 16 files changed, 99 insertions(+), 91 deletions(-)
 rename generator/templates/Default/public/{.htaccess => _htaccess} (100%)

diff --git a/generator/index.js b/generator/index.js
index 23411d6..818342b 100644
--- a/generator/index.js
+++ b/generator/index.js
@@ -14,7 +14,7 @@ module.exports = (api, options) => {
     if (options.useCrud) {
         api.extendPackage({
             dependencies: {
-                '@kingscode/vuetify-resource': '^1.0.0',
+                '@kingscode/vuetify-resource': '^1.1.0',
             },
         });
         api.render('./templates/Crud', {
diff --git a/generator/templates/Authorisation/src/views/InvitationAccept.vue b/generator/templates/Authorisation/src/views/InvitationAccept.vue
index 0353270..f3ac4de 100644
--- a/generator/templates/Authorisation/src/views/InvitationAccept.vue
+++ b/generator/templates/Authorisation/src/views/InvitationAccept.vue
@@ -6,7 +6,7 @@
                 <template v-if="!loading">
                     <v-alert
                         :value="errorMessage !== null"
-                        class="mb-4"
+                        class="mb-10"
                         transition="fade-transition"
                         type="error"
                     >
diff --git a/generator/templates/Authorisation/src/views/Login.vue b/generator/templates/Authorisation/src/views/Login.vue
index be30422..0c56895 100644
--- a/generator/templates/Authorisation/src/views/Login.vue
+++ b/generator/templates/Authorisation/src/views/Login.vue
@@ -6,7 +6,7 @@
                     <img :src="require('../assets/logo.png')" class="logo">
                     <v-alert
                         :value="errorMessage !== null"
-                        class="mb-4"
+                        class="mb-10"
                         transition="fade-transition"
                         type="error"
                     >
@@ -39,7 +39,7 @@
             </v-card-text>
             <v-card-actions>
                 <v-spacer></v-spacer>
-                <v-btn @click="handlePasswordForgotten()" color="accent" flat>Wachtwoord vergeten</v-btn>
+                <v-btn @click="handlePasswordForgotten()" color="accent" text>Wachtwoord vergeten</v-btn>
                 <v-btn @click="handleLogin()" tabindex="3" type="submit" color="accent">Inloggen</v-btn>
             </v-card-actions>
         </v-card>
diff --git a/generator/templates/Authorisation/src/views/PasswordForgotten.vue b/generator/templates/Authorisation/src/views/PasswordForgotten.vue
index 4350de5..95e6b17 100644
--- a/generator/templates/Authorisation/src/views/PasswordForgotten.vue
+++ b/generator/templates/Authorisation/src/views/PasswordForgotten.vue
@@ -6,7 +6,7 @@
                     <img :src="require('../assets/logo.png')" class="logo">
                     <v-alert
                         :value="successMessage !== null"
-                        class="mb-4"
+                        class="mb-10"
                         transition="fade-transition"
                         type="success"
                     >
@@ -29,7 +29,7 @@
             </v-card-text>
             <v-card-actions>
                 <v-spacer></v-spacer>
-                <v-btn @click="handleLogin()" color="accent" flat>inloggen</v-btn>
+                <v-btn @click="handleLogin()" color="accent" text>inloggen</v-btn>
                 <v-btn @click="handlePasswordForgotten()" type="submit" color="accent">Wachtwoord aanvragen</v-btn>
             </v-card-actions>
         </v-card>
@@ -81,4 +81,4 @@
         display: block;
         margin: 0 auto;
     }
-</style>
\ No newline at end of file
+</style>
diff --git a/generator/templates/Authorisation/src/views/PasswordReset.vue b/generator/templates/Authorisation/src/views/PasswordReset.vue
index 89281b6..d051c8b 100644
--- a/generator/templates/Authorisation/src/views/PasswordReset.vue
+++ b/generator/templates/Authorisation/src/views/PasswordReset.vue
@@ -6,7 +6,7 @@
                 <template v-if="!loading">
                     <v-alert
                         :value="errorMessage !== null"
-                        class="mb-4"
+                        class="mb-10"
                         transition="fade-transition"
                         type="error"
                     >
diff --git a/generator/templates/Authorisation/src/views/Profile.vue b/generator/templates/Authorisation/src/views/Profile.vue
index 3338b2d..2f581bb 100644
--- a/generator/templates/Authorisation/src/views/Profile.vue
+++ b/generator/templates/Authorisation/src/views/Profile.vue
@@ -1,11 +1,11 @@
 <template>
     <v-container>
-        <v-layout align-center justify-center mt-5>
+        <v-layout align-center justify-center mt-12>
             <v-flex xs12 sm10 md8 lg6 xl4>
                 <v-form @submit.prevent="updateProfile" ref="profileForm">
                     <v-subheader class="pa-0">Profiel</v-subheader>
                     <v-card class="themed-color">
-                        <div class="text-xs-center pa-5"
+                        <div class="text-xs-center pa-12"
                              v-if="profileFormLoading">
                             <v-progress-circular
                                 :width="3"
@@ -46,7 +46,7 @@
                 <v-form  @submit.prevent="updatePassword" ref="passwordForm">
                     <v-subheader class="pa-0">Wachtwoord</v-subheader>
                     <v-card class="themed-color">
-                        <div class="text-xs-center pa-5"
+                        <div class="text-xs-center pa-12"
                              v-if="passwordFormLoading">
                             <v-progress-circular
                                 :width="3"
diff --git a/generator/templates/Crud/src/components/forms/User.vue b/generator/templates/Crud/src/components/forms/User.vue
index 0432094..e057572 100644
--- a/generator/templates/Crud/src/components/forms/User.vue
+++ b/generator/templates/Crud/src/components/forms/User.vue
@@ -1,29 +1,27 @@
 <template>
     <v-container>
-        <v-layout align-center justify-center mt-5>
-            <v-flex lg6 md8 sm10 xl4 xs12>
-                <v-form ref="form" v-model="valid">
-                    <v-subheader class="pa-0">Gebruiker</v-subheader>
-                    <v-card class="themed-color">
-                        <v-card-text>
-                            <v-text-field
-                                :counter="100"
-                                :rules="[(v) => !!v || 'Naam is verplicht', v => serverError('name', v), (v) => !!v && v.length <= 100 || 'de naam mag maximaal 100 tekens bevatten']"
-                                label="Naam"
-                                class="required"
-                                v-model="values.name"></v-text-field>
-                            <v-text-field
-                                :counter="150"
-                                :rules="[(v) => !!v || 'E-mail is verplicht', v => serverError('email', v), (v) => !!v && v.length <= 100 || 'het e-mailadres mag maximaal 150 tekens bevatten']"
-                                label="E-mail"
-                                hint="Het e-mailadres waarmee de gebruiker gaat inloggen en waarnaar een mail verzonden wordt met instructies om een wachtwoord aan te maken"
-                                class="required"
-                                v-model="values.email"></v-text-field>
-                        </v-card-text>
-                    </v-card>
-                </v-form>
-            </v-flex>
-        </v-layout>
+        <v-form ref="form" v-model="valid" class="mt-5">
+            <v-col cols="12" sm="10" offset-sm="1" md="8" offset-md="2" lg="6" offset-lg="3">
+                <v-subheader class="pa-0">Gebruiker</v-subheader>
+                <v-card class="themed-color">
+                    <v-card-text>
+                        <v-text-field
+                            :counter="100"
+                            :rules="[(v) => !!v || 'Naam is verplicht', v => serverError('name', v), (v) => !!v && v.length <= 100 || 'de naam mag maximaal 100 tekens bevatten']"
+                            label="Naam"
+                            class="required"
+                            v-model="values.name"></v-text-field>
+                        <v-text-field
+                            :counter="150"
+                            :rules="[(v) => !!v || 'E-mail is verplicht', v => serverError('email', v), (v) => !!v && v.length <= 100 || 'het e-mailadres mag maximaal 150 tekens bevatten']"
+                            label="E-mail"
+                            hint="Het e-mailadres waarmee de gebruiker gaat inloggen en waarnaar een mail verzonden wordt met instructies om een wachtwoord aan te maken"
+                            class="required"
+                            v-model="values.email"></v-text-field>
+                    </v-card-text>
+                </v-card>
+            </v-col>
+        </v-form>
     </v-container>
 </template>
 
diff --git a/generator/templates/Default/public/.htaccess b/generator/templates/Default/public/_htaccess
similarity index 100%
rename from generator/templates/Default/public/.htaccess
rename to generator/templates/Default/public/_htaccess
diff --git a/generator/templates/Default/src/App.vue b/generator/templates/Default/src/App.vue
index 6f9c421..de95cf1 100644
--- a/generator/templates/Default/src/App.vue
+++ b/generator/templates/Default/src/App.vue
@@ -7,7 +7,7 @@
                 v-model="menu"
             >
                 <img :src="require('../assets/logo.png')" @click="$router.push({name: 'home'})" class="logo">
-                <v-divider class="mt-4"/>
+                <v-divider class="mt-10"/>
                 <main-menu/>
             </v-navigation-drawer>
             <v-toolbar app color="primary" dark mfixed>
@@ -20,7 +20,7 @@
                 <router-view/>
             </v-content>
             <v-footer app color="primary" inset>
-                <span class="white--text pl-3">Created by Kings Code</span>
+                <span class="white--text pl-6">Created by Kings Code</span>
             </v-footer>
         </v-app>
     </div>
@@ -59,4 +59,4 @@
     .v-dialog--fullscreen > .v-card.v-sheet.theme--light {
         background: rgb(248, 249, 250);
     }
-</style>
\ No newline at end of file
+</style>
diff --git a/generator/templates/Default/src/Views/PageForbidden.vue b/generator/templates/Default/src/Views/PageForbidden.vue
index 37df856..f60224d 100644
--- a/generator/templates/Default/src/Views/PageForbidden.vue
+++ b/generator/templates/Default/src/Views/PageForbidden.vue
@@ -3,7 +3,7 @@
         <h1>
             Onjuiste autorisatie
         </h1>
-        <div class="my-5 title">Je hebt niet voldoende rechten om deze actie uit te mogen voeren</div>
+        <div class="my-12 title">Je hebt niet voldoende rechten om deze actie uit te mogen voeren</div>
         <v-btn color="primary" @click="home">Terug naar de homepage</v-btn>
     </div>
 </template>
@@ -25,4 +25,4 @@
 
 <style scoped lang="scss">
 
-</style>
\ No newline at end of file
+</style>
diff --git a/generator/templates/Default/src/Views/PageNotFound.vue b/generator/templates/Default/src/Views/PageNotFound.vue
index c8cb360..f8c1aa6 100644
--- a/generator/templates/Default/src/Views/PageNotFound.vue
+++ b/generator/templates/Default/src/Views/PageNotFound.vue
@@ -3,7 +3,7 @@
         <h1>
             Pagina niet gevonden
         </h1>
-        <div class="my-5 title">De pagina die u probeert te bereiken is niet gevonden</div>
+        <div class="my-12 title">De pagina die u probeert te bereiken is niet gevonden</div>
         <v-btn color="primary" @click="home">Terug naar de startpagina</v-btn>
     </div>
 </template>
@@ -25,4 +25,4 @@
 
 <style scoped lang="scss">
 
-</style>
\ No newline at end of file
+</style>
diff --git a/generator/templates/Default/src/components/MainMenu.vue b/generator/templates/Default/src/components/MainMenu.vue
index 0743221..ac0cd25 100644
--- a/generator/templates/Default/src/components/MainMenu.vue
+++ b/generator/templates/Default/src/components/MainMenu.vue
@@ -1,8 +1,8 @@
 <template>
     <v-list>
         <div
-            :key="item.title"
-            v-for="item in items">
+            :key="index"
+            v-for="(item, index) in items">
             <v-list-group
                 :disabled="item.disabled"
                 :prepend-icon="item.icon"
@@ -10,41 +10,41 @@
                 v-if="typeof item.items !== 'undefined'"
                 v-model="item.active"
             >
-                <v-list-tile @click="routeTo('merchant')" slot="activator">
-                    <v-list-tile-content>
-                        <v-list-tile-title>{{ item.title }}</v-list-tile-title>
-                    </v-list-tile-content>
-                </v-list-tile>
+                <v-list-item slot="activator">
+                    <v-list-item-content>
+                        <v-list-item-title>{{ item.title }}</v-list-item-title>
+                    </v-list-item-content>
+                </v-list-item>
 
-                <v-list-tile
+                <v-list-item
                     :key="subItem.title"
                     @click="routeTo(subItem.route)"
 
                     v-for="subItem in item.items"
-                    v-model="$route.name === subItem.route"
+                    :value="$route.name === subItem.route"
                 >
-                    <v-list-tile-action>
+                    <v-list-item-action>
                         <v-icon>{{ subItem.icon }}</v-icon>
-                    </v-list-tile-action>
-                    <v-list-tile-content>
-                        <v-list-tile-title>{{ subItem.title }}</v-list-tile-title>
-                    </v-list-tile-content>
+                    </v-list-item-action>
+                    <v-list-item-content>
+                        <v-list-item-title>{{ subItem.title }}</v-list-item-title>
+                    </v-list-item-content>
 
-                </v-list-tile>
+                </v-list-item>
             </v-list-group>
-            <v-list-tile
+            <v-list-item
                 @click="routeTo(item.route)"
                 v-else
-                v-model="$route.name === item.route"
+                :value="$route.name === item.route"
             >
-                <v-list-tile-action>
+                <v-list-item-action>
                     <v-icon>{{ item.icon }}</v-icon>
-                </v-list-tile-action>
-                <v-list-tile-content>
-                    <v-list-tile-title>{{ item.title }}</v-list-tile-title>
-                </v-list-tile-content>
+                </v-list-item-action>
+                <v-list-item-content>
+                    <v-list-item-title>{{ item.title }}</v-list-item-title>
+                </v-list-item-content>
 
-            </v-list-tile>
+            </v-list-item>
         </div>
 
     </v-list>
@@ -68,8 +68,8 @@
         methods: {
             routeTo(name) {
                 this.$router.push({name: name});
-            }
-        }
+            },
+        },
     };
 </script>
 
diff --git a/generator/templates/Default/src/components/ProfileMenu.vue b/generator/templates/Default/src/components/ProfileMenu.vue
index 1a8c3e4..26f0a64 100644
--- a/generator/templates/Default/src/components/ProfileMenu.vue
+++ b/generator/templates/Default/src/components/ProfileMenu.vue
@@ -5,18 +5,18 @@
         offset-y
         transition="slide-y-transition"
     >
-        <v-btn class="mr-3" fab icon slot="activator">
+        <v-btn class="mr-6" fab icon slot="activator">
             <v-avatar class="accent" size="48" title>
                 <v-icon>fa-user</v-icon>
             </v-avatar>
         </v-btn>
         <v-list>
-            <v-list-tile @click="routeTo('profile')">
-                <v-list-tile-title>Profiel</v-list-tile-title>
-            </v-list-tile>
-            <v-list-tile @click="logout">
-                <v-list-tile-title>Uitloggen</v-list-tile-title>
-            </v-list-tile>
+            <v-list-item @click="routeTo('profile')">
+                <v-list-item-title>Profiel</v-list-item-title>
+            </v-list-item>
+            <v-list-item @click="logout">
+                <v-list-item-title>Uitloggen</v-list-item-title>
+            </v-list-item>
         </v-list>
     </v-menu>
 </template>
@@ -47,4 +47,4 @@
 
 <style scoped lang="scss">
 
-</style>
\ No newline at end of file
+</style>
diff --git a/generator/templates/Default/src/newmain.js b/generator/templates/Default/src/newmain.js
index af05a7d..85e89c3 100644
--- a/generator/templates/Default/src/newmain.js
+++ b/generator/templates/Default/src/newmain.js
@@ -1,7 +1,7 @@
 import '@babel/polyfill'
 import Vue from 'vue'
 import API from './API.js';
-import './plugins/vuetify'
+import vuetify from './plugins/vuetify';
 <%_ if (options.useCrud) { _%>
 import VuetifyResource from '@kingscode/vuetify-resource';
 <%_ } _%>
diff --git a/generator/templates/Default/src/plugins/vuetify.js b/generator/templates/Default/src/plugins/vuetify.js
index ca9551e..b5440d2 100644
--- a/generator/templates/Default/src/plugins/vuetify.js
+++ b/generator/templates/Default/src/plugins/vuetify.js
@@ -4,24 +4,34 @@ import '@fortawesome/fontawesome-pro/css/all.css';
 import 'vuetify/dist/vuetify.min.css';
 import nl from 'vuetify/es5/locale/nl';
 
-Vue.use(Vuetify, {
-    customProperties: true,
-    iconfont: 'fa',
+Vue.use(Vuetify);
+export default new Vuetify({
     icons: {
-        'close': 'fas fa-times',
-        'menu': 'fas fa-bars',
-        'delete': 'fas fa-trash',
-        'add': 'fas fa-plus',
-        'edit': 'fas fa-pencil-alt',
-        'search': 'fas fa-search',
+        iconfont: 'fa',
+        values: {
+            'close': 'far fa-times',
+            'menu': 'far fa-bars',
+            'delete': 'far fa-trash-alt',
+            'add': 'far fa-plus',
+            'edit': 'far fa-pencil-alt',
+            'search': 'far fa-search',
+        },
     },
+    customProperties: true,
     lang: {
         locales: {nl},
         current: 'nl',
     },
     theme: {
-        primary: '#002F4E',
-        secondary: '#000000',
-        accent: '#FFD0B1',
+        options: {
+            customProperties: true,
+        },
+        themes: {
+            light: {
+                primary: '#002F4E',
+                secondary: '#000000',
+                accent: '#FFD0B1',
+            },
+        },
     },
 });
diff --git a/generator/templates/TemplateLoader/src/templates/Default.vue b/generator/templates/TemplateLoader/src/templates/Default.vue
index baf611a..4e147b9 100644
--- a/generator/templates/TemplateLoader/src/templates/Default.vue
+++ b/generator/templates/TemplateLoader/src/templates/Default.vue
@@ -7,7 +7,7 @@
                 v-model="menu"
             >
                 <img :src="require('../assets/logo.png')" @click="$router.push({name: 'home'})" class="logo">
-                <v-divider class="mt-4"/>
+                <v-divider class="mt-10"/>
                 <main-menu/>
             </v-navigation-drawer>
             <v-toolbar app color="primary" dark mfixed>
@@ -20,7 +20,7 @@
                 <router-view/>
             </v-content>
             <v-footer app color="primary" inset>
-                <span class="white--text pl-3">Created by Kings Code</span>
+                <span class="white--text pl-6">Created by Kings Code</span>
             </v-footer>
         </v-app>
     </div>
@@ -59,4 +59,4 @@
     .v-dialog--fullscreen > .v-card.v-sheet.theme--light {
         background: rgb(248, 249, 250);
     }
-</style>
\ No newline at end of file
+</style>

From 9735f7aa55cdb139a9e65f57549acfdf353dcacd Mon Sep 17 00:00:00 2001
From: ricardovanlaarhoven <ricardo1994@gmail.com>
Date: Wed, 23 Oct 2019 16:25:58 +0200
Subject: [PATCH 3/7] add vuetify 2.0 support

---
 .../Authorisation/src/store/modules/Authorization.js |  2 +-
 .../Authorisation/src/views/InvitationAccept.vue     |  4 ++--
 .../templates/Authorisation/src/views/Login.vue      |  2 +-
 .../Authorisation/src/views/PasswordForgotten.vue    |  2 +-
 .../Authorisation/src/views/PasswordReset.vue        |  4 ++--
 .../templates/Authorisation/src/views/Profile.vue    |  6 +++---
 generator/templates/Crud/src/components/BaseForm.vue |  2 +-
 generator/templates/Default/_env.development.local   |  3 ++-
 generator/templates/Default/_env.example             |  1 +
 .../Default/src/components/PaginatedAutocomplete.vue |  2 +-
 .../templates/Default/src/components/ProfileMenu.vue | 12 +++++++-----
 generator/templates/Default/src/newmain.js           |  1 +
 generator/templates/Default/src/views/Home.vue       |  7 +++++--
 .../TemplateLoader/src/templates/Authorisation.vue   |  4 ++--
 .../TemplateLoader/src/templates/Default.vue         |  8 ++++----
 15 files changed, 34 insertions(+), 26 deletions(-)

diff --git a/generator/templates/Authorisation/src/store/modules/Authorization.js b/generator/templates/Authorisation/src/store/modules/Authorization.js
index 7c07332..0a6747b 100644
--- a/generator/templates/Authorisation/src/store/modules/Authorization.js
+++ b/generator/templates/Authorisation/src/store/modules/Authorization.js
@@ -12,7 +12,7 @@ export default {
     actions: {
         login(context, data) {
             return new Promise((resolve, reject) => {
-                $http.post('oauth/token',
+                window.$http.post('oauth/token',
                     {
                         grant_type: 'password',
                         client_id: process.env.VUE_APP_OAUTH_CLIENT_ID,
diff --git a/generator/templates/Authorisation/src/views/InvitationAccept.vue b/generator/templates/Authorisation/src/views/InvitationAccept.vue
index f3ac4de..8d6ba53 100644
--- a/generator/templates/Authorisation/src/views/InvitationAccept.vue
+++ b/generator/templates/Authorisation/src/views/InvitationAccept.vue
@@ -34,7 +34,7 @@
                         v-model="password_confirmation"
                     ></v-text-field>
                 </template>
-                <div class="text-xs-center" v-else>
+                <div class="text-center" v-else>
                     <v-progress-circular
                         :size="70"
                         :width="7"
@@ -105,7 +105,7 @@
             },
             handleLogin() {
                 this.$router.push({name: 'login'});
-            }, serverError(name, v) {
+            }, serverError(name) {
                 if (this.errors !== null && typeof this.errors[name] !== 'undefined') {
                     return this.errors[name][0];
                 }
diff --git a/generator/templates/Authorisation/src/views/Login.vue b/generator/templates/Authorisation/src/views/Login.vue
index 0c56895..4b7c121 100644
--- a/generator/templates/Authorisation/src/views/Login.vue
+++ b/generator/templates/Authorisation/src/views/Login.vue
@@ -28,7 +28,7 @@
                         tabindex="2"
                     ></v-text-field>
                 </template>
-                <div class="text-xs-center" v-else>
+                <div class="text-center" v-else>
                     <v-progress-circular
                         :size="70"
                         :width="7"
diff --git a/generator/templates/Authorisation/src/views/PasswordForgotten.vue b/generator/templates/Authorisation/src/views/PasswordForgotten.vue
index 95e6b17..3f307fc 100644
--- a/generator/templates/Authorisation/src/views/PasswordForgotten.vue
+++ b/generator/templates/Authorisation/src/views/PasswordForgotten.vue
@@ -18,7 +18,7 @@
                         v-model="email"
                     ></v-text-field>
                 </template>
-                <div class="text-xs-center" v-else>
+                <div class="text-center" v-else>
                     <v-progress-circular
                         :size="70"
                         :width="7"
diff --git a/generator/templates/Authorisation/src/views/PasswordReset.vue b/generator/templates/Authorisation/src/views/PasswordReset.vue
index d051c8b..79b5d98 100644
--- a/generator/templates/Authorisation/src/views/PasswordReset.vue
+++ b/generator/templates/Authorisation/src/views/PasswordReset.vue
@@ -34,7 +34,7 @@
                         v-model="password_confirmation"
                     ></v-text-field>
                 </template>
-                <div class="text-xs-center" v-else>
+                <div class="text-center" v-else>
                     <v-progress-circular
                         :size="70"
                         :width="7"
@@ -105,7 +105,7 @@
             },
             handleLogin() {
                 this.$router.push({name: 'login'});
-            }, serverError(name, v) {
+            }, serverError(name) {
                 if (this.errors !== null && typeof this.errors[name] !== 'undefined') {
                     return this.errors[name][0];
                 }
diff --git a/generator/templates/Authorisation/src/views/Profile.vue b/generator/templates/Authorisation/src/views/Profile.vue
index 2f581bb..7cade07 100644
--- a/generator/templates/Authorisation/src/views/Profile.vue
+++ b/generator/templates/Authorisation/src/views/Profile.vue
@@ -5,7 +5,7 @@
                 <v-form @submit.prevent="updateProfile" ref="profileForm">
                     <v-subheader class="pa-0">Profiel</v-subheader>
                     <v-card class="themed-color">
-                        <div class="text-xs-center pa-12"
+                        <div class="text-center pa-12"
                              v-if="profileFormLoading">
                             <v-progress-circular
                                 :width="3"
@@ -46,7 +46,7 @@
                 <v-form  @submit.prevent="updatePassword" ref="passwordForm">
                     <v-subheader class="pa-0">Wachtwoord</v-subheader>
                     <v-card class="themed-color">
-                        <div class="text-xs-center pa-12"
+                        <div class="text-center pa-12"
                              v-if="passwordFormLoading">
                             <v-progress-circular
                                 :width="3"
@@ -145,7 +145,7 @@
                     });
                 });
             },
-            serverError(name, v) {
+            serverError(name) {
                 if (this.errors !== null && typeof this.errors[name] !== 'undefined') {
                     return this.errors[name][0];
                 }
diff --git a/generator/templates/Crud/src/components/BaseForm.vue b/generator/templates/Crud/src/components/BaseForm.vue
index 2267411..7fa8a27 100644
--- a/generator/templates/Crud/src/components/BaseForm.vue
+++ b/generator/templates/Crud/src/components/BaseForm.vue
@@ -62,7 +62,7 @@
             clear() {
                 this.$refs.form.reset();
             },
-            serverError(name, v) {
+            serverError(name) {
                 if (this.errors !== null && typeof this.errors[name] !== 'undefined') {
                     return this.errors[name][0];
                 }
diff --git a/generator/templates/Default/_env.development.local b/generator/templates/Default/_env.development.local
index 7f1d0dd..ccb1c23 100644
--- a/generator/templates/Default/_env.development.local
+++ b/generator/templates/Default/_env.development.local
@@ -1,6 +1,7 @@
 NODE_ENV=development
 VUE_APP_ROOT_API=<%= options.rootUrl %>
+VUE_APP_PUBLIC_PATH=
 <%_ if (options.useAuthorisation) { _%>
 VUE_APP_OAUTH_CLIENT_ID=<%= options.oauthClientId %>
 VUE_APP_OAUTH_CLIENT_SECRET=<%= options.oauthSecret %>
-<%_ } _%>
\ No newline at end of file
+<%_ } _%>
diff --git a/generator/templates/Default/_env.example b/generator/templates/Default/_env.example
index 263f27a..7c5a76f 100644
--- a/generator/templates/Default/_env.example
+++ b/generator/templates/Default/_env.example
@@ -1,5 +1,6 @@
 NODE_ENV=development
 VUE_APP_ROOT_API=//url.local/api
+VUE_APP_PUBLIC_PATH=
 <%_ if (options.useAuthorisation) { _%>
 VUE_APP_OAUTH_CLIENT_SECRET=
 VUE_APP_OAUTH_CLIENT_ID=
diff --git a/generator/templates/Default/src/components/PaginatedAutocomplete.vue b/generator/templates/Default/src/components/PaginatedAutocomplete.vue
index 00098c8..fa014f8 100644
--- a/generator/templates/Default/src/components/PaginatedAutocomplete.vue
+++ b/generator/templates/Default/src/components/PaginatedAutocomplete.vue
@@ -8,7 +8,7 @@
                     v-if="enabled"
     >
         <template v-slot:append-item>
-            <v-flex v-if="canLoadMoreItems" class="text-xs-center">
+            <v-flex v-if="canLoadMoreItems" class="text-center">
                 <v-btn color="accent" @click="getItemsFromApi(page + 1)">Meer laden</v-btn>
             </v-flex>
         </template>
diff --git a/generator/templates/Default/src/components/ProfileMenu.vue b/generator/templates/Default/src/components/ProfileMenu.vue
index 26f0a64..c160d75 100644
--- a/generator/templates/Default/src/components/ProfileMenu.vue
+++ b/generator/templates/Default/src/components/ProfileMenu.vue
@@ -5,11 +5,13 @@
         offset-y
         transition="slide-y-transition"
     >
-        <v-btn class="mr-6" fab icon slot="activator">
-            <v-avatar class="accent" size="48" title>
-                <v-icon>fa-user</v-icon>
-            </v-avatar>
-        </v-btn>
+        <template v-slot:activator="{ on }">
+            <v-btn class="mr-6" fab icon v-on="on">
+                <v-avatar class="accent" size="48" title>
+                    <v-icon>fa-user</v-icon>
+                </v-avatar>
+            </v-btn>
+        </template>
         <v-list>
             <v-list-item @click="routeTo('profile')">
                 <v-list-item-title>Profiel</v-list-item-title>
diff --git a/generator/templates/Default/src/newmain.js b/generator/templates/Default/src/newmain.js
index 85e89c3..bed1da0 100644
--- a/generator/templates/Default/src/newmain.js
+++ b/generator/templates/Default/src/newmain.js
@@ -22,6 +22,7 @@ Vue.config.productionTip = false
 
 new Vue({
     router,
+    vuetify,
 <%_ if (options.useAuthorisation) { _%>
     store,
 <%_ } _%>
diff --git a/generator/templates/Default/src/views/Home.vue b/generator/templates/Default/src/views/Home.vue
index e1d86b7..918236f 100644
--- a/generator/templates/Default/src/views/Home.vue
+++ b/generator/templates/Default/src/views/Home.vue
@@ -1,5 +1,8 @@
 <template>
-
+    <div>
+        You now can remove this and create your own homepage, or in the router.js create a redirect to one of the other
+        views, so that becomes the homepage
+    </div>
 </template>
 
 <script>
@@ -21,4 +24,4 @@
 
 <style scoped lang="scss">
 
-</style>
\ No newline at end of file
+</style>
diff --git a/generator/templates/TemplateLoader/src/templates/Authorisation.vue b/generator/templates/TemplateLoader/src/templates/Authorisation.vue
index 7ba1003..a566ccf 100644
--- a/generator/templates/TemplateLoader/src/templates/Authorisation.vue
+++ b/generator/templates/TemplateLoader/src/templates/Authorisation.vue
@@ -2,7 +2,7 @@
     <div id="app">
         <v-app class="primary" id="inspire">
             <v-content>
-                <v-container fill-height fluid justify-center>
+                <v-container fill-height fluid justify-center class="primary">
                     <v-flex lg4 md6 xl3 xs12>
                         <router-view/>
                     </v-flex>
@@ -31,4 +31,4 @@
 
 <style scoped lang="scss">
 
-</style>
\ No newline at end of file
+</style>
diff --git a/generator/templates/TemplateLoader/src/templates/Default.vue b/generator/templates/TemplateLoader/src/templates/Default.vue
index 4e147b9..95048a9 100644
--- a/generator/templates/TemplateLoader/src/templates/Default.vue
+++ b/generator/templates/TemplateLoader/src/templates/Default.vue
@@ -10,17 +10,17 @@
                 <v-divider class="mt-10"/>
                 <main-menu/>
             </v-navigation-drawer>
-            <v-toolbar app color="primary" dark mfixed>
-                <v-toolbar-side-icon @click.stop="menu = !menu"></v-toolbar-side-icon>
+            <v-app-bar app color="primary" dark mfixed>
+                <v-app-bar-nav-icon @click.stop="menu = !menu"></v-app-bar-nav-icon>
                 <v-toolbar-title>Beheer</v-toolbar-title>
                 <v-spacer/>
                 <profile-menu></profile-menu>
-            </v-toolbar>
+            </v-app-bar>
             <v-content>
                 <router-view/>
             </v-content>
             <v-footer app color="primary" inset>
-                <span class="white--text pl-6">Created by Kings Code</span>
+                <span class="white--text">Created by Kings Code</span>
             </v-footer>
         </v-app>
     </div>

From 310f92e032f6f54b508674a3f6f1d36c931e53fe Mon Sep 17 00:00:00 2001
From: ricardovanlaarhoven <ricardo1994@gmail.com>
Date: Wed, 23 Oct 2019 16:33:00 +0200
Subject: [PATCH 4/7] remove unnecessary routeTo

---
 generator/templates/Default/src/components/ProfileMenu.vue | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/generator/templates/Default/src/components/ProfileMenu.vue b/generator/templates/Default/src/components/ProfileMenu.vue
index c160d75..f1a0ed1 100644
--- a/generator/templates/Default/src/components/ProfileMenu.vue
+++ b/generator/templates/Default/src/components/ProfileMenu.vue
@@ -13,7 +13,7 @@
             </v-btn>
         </template>
         <v-list>
-            <v-list-item @click="routeTo('profile')">
+            <v-list-item :to="{name:'profile'}">
                 <v-list-item-title>Profiel</v-list-item-title>
             </v-list-item>
             <v-list-item @click="logout">
@@ -37,9 +37,6 @@
 
         },
         methods: {
-            routeTo(name) {
-                this.$router.push({name: name});
-            },
             logout() {
                 this.$store.dispatch('Authorization/unauthorized');
             }

From 61f1da8b03d28c85f53b6b391f2666672d1d736d Mon Sep 17 00:00:00 2001
From: ricardovanlaarhoven <ricardo1994@gmail.com>
Date: Wed, 23 Oct 2019 16:59:19 +0200
Subject: [PATCH 5/7] remove unnecessary routeTo

---
 .../templates/Default/src/components/MainMenu.vue     | 11 +++--------
 1 file changed, 3 insertions(+), 8 deletions(-)

diff --git a/generator/templates/Default/src/components/MainMenu.vue b/generator/templates/Default/src/components/MainMenu.vue
index ac0cd25..e96ee52 100644
--- a/generator/templates/Default/src/components/MainMenu.vue
+++ b/generator/templates/Default/src/components/MainMenu.vue
@@ -18,7 +18,7 @@
 
                 <v-list-item
                     :key="subItem.title"
-                    @click="routeTo(subItem.route)"
+                    :to="subItem.route"
 
                     v-for="subItem in item.items"
                     :value="$route.name === subItem.route"
@@ -33,7 +33,7 @@
                 </v-list-item>
             </v-list-group>
             <v-list-item
-                @click="routeTo(item.route)"
+                :to="item.route"
                 v-else
                 :value="$route.name === item.route"
             >
@@ -59,17 +59,12 @@
                     {
                         icon: 'fa-users',
                         title: 'Gebruikers',
-                        route: 'users',
+                        route: {name: 'users'},
                     }
 
                 ]
             };
         },
-        methods: {
-            routeTo(name) {
-                this.$router.push({name: name});
-            },
-        },
     };
 </script>
 

From edbd1008dc421781a45a8b1fbc6b599aee1bdf58 Mon Sep 17 00:00:00 2001
From: ricardovanlaarhoven <ricardo1994@gmail.com>
Date: Wed, 23 Oct 2019 16:59:36 +0200
Subject: [PATCH 6/7] text-xs-center becomes text-center

---
 generator/templates/Default/src/Views/PageForbidden.vue | 2 +-
 generator/templates/Default/src/Views/PageNotFound.vue  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/generator/templates/Default/src/Views/PageForbidden.vue b/generator/templates/Default/src/Views/PageForbidden.vue
index f60224d..321fbe0 100644
--- a/generator/templates/Default/src/Views/PageForbidden.vue
+++ b/generator/templates/Default/src/Views/PageForbidden.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="text-xs-center">
+    <div class="text-center">
         <h1>
             Onjuiste autorisatie
         </h1>
diff --git a/generator/templates/Default/src/Views/PageNotFound.vue b/generator/templates/Default/src/Views/PageNotFound.vue
index f8c1aa6..13062fd 100644
--- a/generator/templates/Default/src/Views/PageNotFound.vue
+++ b/generator/templates/Default/src/Views/PageNotFound.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="text-xs-center">
+    <div class="text-center">
         <h1>
             Pagina niet gevonden
         </h1>

From 5596f87db0d9e62adb8a785469b96e3f4ad39f37 Mon Sep 17 00:00:00 2001
From: ricardovanlaarhoven <ricardo1994@gmail.com>
Date: Wed, 23 Oct 2019 17:04:27 +0200
Subject: [PATCH 7/7] update version

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index e84f7f1..4f38814 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-cli-plugin-kingscode-scaffold",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "",
   "main": "index.js",
   "scripts": {