diff --git a/src/package.json b/src/package.json
index 53fb5bca..fafca483 100644
--- a/src/package.json
+++ b/src/package.json
@@ -1,29 +1,34 @@
 {
   "private": true,
   "scripts": {
     "dev": "npm run development",
     "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
     "watch": "npm run development -- --watch",
     "watch-poll": "npm run watch -- --watch-poll",
     "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
     "prod": "npm run production",
-    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
+    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
+    "lint": "eslint --ext .js,.vue resources && stylelint \"resources/sass/*.scss\" \"resources/vue/components/*.vue\""
   },
   "devDependencies": {
+    "@deveodk/vue-toastr": "^1.1.0",
     "axios": "^0.19",
     "bootstrap": "^4.3.1",
     "cross-env": "^5.1",
+    "eslint": "^6.8.0",
+    "eslint-plugin-vue": "^6.1.1",
     "jquery": "^3.4.1",
     "laravel-mix": "^4.0.7",
     "lodash": "^4.17.13",
     "popper.js": "^1.12",
     "resolve-url-loader": "^2.3.1",
     "sass": "^1.15.2",
     "sass-loader": "^7.1.0",
+    "stylelint": "^12.0.1",
+    "stylelint-config-standard": "^19.0.0",
     "vue": "^2.5.17",
     "vue-router": "^3.1.3",
     "vue-template-compiler": "^2.6.10",
-    "vuex": "^3.1.1",
-    "@deveodk/vue-toastr": "^1.1.0"
+    "vuex": "^3.1.1"
   }
 }
diff --git a/src/resources/js/app.js b/src/resources/js/app.js
index 226f6ff5..732780a2 100644
--- a/src/resources/js/app.js
+++ b/src/resources/js/app.js
@@ -1,85 +1,85 @@
 /**
  * First we will load all of this project's JavaScript dependencies which
  * includes Vue and other libraries. It is a great starting point when
  * building robust, powerful web applications using Vue and Laravel.
  */
 
 require('./bootstrap')
 
 window.Vue = require('vue')
 
 import AppComponent from '../vue/components/App'
 import MenuComponent from '../vue/components/Menu'
 import router from '../vue/js/routes.js'
 import VueToastr from '@deveodk/vue-toastr'
 
 // Add a response interceptor for general/validation error handler
 // This have to be before Vue and Router setup. Otherwise we would
 // not be able to handle axios responses initiated from inside
 // components created/mounted handlers (e.g. signup code verification link)
 window.axios.interceptors.response.use(
     response => {
         // Do nothing
         return response
     },
     error => {
         var error_msg
 
         if (error.response && error.response.status == 422) {
             error_msg = "Form validation error"
 
             $.each(error.response.data.errors || {}, (idx, msg) => {
                 $('form').each((i, form) => {
                     const input_name = ($(form).data('validation-prefix') || '') + idx
                     const input = $('#' + input_name)
 
                     if (input.length) {
                         input.addClass('is-invalid')
                             .parent().append($('<div class="invalid-feedback">')
                                 .text($.type(msg) === 'string' ? msg : msg.join('<br>')))
 
                         return false
                     }
                 });
             })
 
             $('form .is-invalid').first().focus()
         }
         else if (error.response && error.response.data) {
             error_msg = error.response.data.message
         }
         else {
             error_msg = error.request ? error.request.statusText : error.message
         }
 
         app.$toastr('error', error_msg || "Server Error", 'Error')
 
         // Pass the error as-is
         return Promise.reject(error)
     }
 )
 
 const app = new Vue({
     el: '#app',
     components: {
         'app-component': AppComponent,
         'menu-component': MenuComponent
     },
     router,
+    mounted() {
+        this.$root.$on('clearFormValidation', (form) => {
+            this.clearFormValidation(form)
+        })
+    },
     methods: {
         clearFormValidation: form => {
             $(form).find('.is-invalid').removeClass('is-invalid')
             $(form).find('.invalid-feedback').remove()
         }
-    },
-    mounted() {
-        this.$root.$on('clearFormValidation', (form) => {
-            this.clearFormValidation(form)
-        })
     }
 })
 
 Vue.use(VueToastr, {
     defaultPosition: 'toast-bottom-right',
     defaultTimeout: 50000
 })
diff --git a/src/resources/sass/menu.scss b/src/resources/sass/menu.scss
index 10318fa5..8f8b7a61 100644
--- a/src/resources/sass/menu.scss
+++ b/src/resources/sass/menu.scss
@@ -1,85 +1,84 @@
 #primary-menu {
-    background-color: #F6F5F3;
+    background-color: #f6f5f3;
     padding: 0;
     line-height: 85px;
 
     .navbar-brand {
         padding: 0;
 
         > img {
             display: inline;
             vertical-align: middle;
         }
     }
 
     .nav-link {
         color: #202020;
         line-height: 85px;
         padding: 0 0 0 25px;
         background: transparent;
 
         &:focus {
             text-decoration: underline;
             outline: 0;
         }
 
-        &:hover,
         &:hover {
-            color: #F1A539;
+            color: #f1a539;
             text-decoration: underline;
         }
 
         &.active:not(.menulogin) {
             font-weight: bold;
         }
     }
 }
 
 @include media-breakpoint-up(lg) {
     #primary-menu {
         a.menulogin {
             text-transform: uppercase;
-            border: 2px solid #F1A539;
+            border: 2px solid #f1a539;
             border-radius: 21px;
             line-height: 21px;
             letter-spacing: 1px;
             padding: 6px 34px;
             margin: 25px 0 25px 25px;
 
             &:focus,
             &:hover {
                 text-decoration: none;
-                background-color: #F1A539;
+                background-color: #f1a539;
                 color: #fff;
                 font-weight: normal;
             }
         }
     }
 }
 
 @include media-breakpoint-down(md) {
     #primary-menu {
         .navbar-nav {
-            padding-bottom: 1em
+            padding-bottom: 1em;
         }
 
         .nav-link {
             line-height: 45px;
             padding: 0;
         }
     }
 }
 
 @include media-breakpoint-down(sm) {
     #primary-menu {
         padding: 0 1em;
     }
 }
 
 @media (max-width: 340px) {
     #primary-menu {
         .navbar-brand img {
             width: 160px;
         }
     }
 }
diff --git a/src/resources/vue/components/Login.vue b/src/resources/vue/components/Login.vue
index 358dd24e..56e693fa 100644
--- a/src/resources/vue/components/Login.vue
+++ b/src/resources/vue/components/Login.vue
@@ -1,81 +1,86 @@
 <template>
     <div class="text-center form-wrapper">
-        <form class="form-signin" v-on:submit.prevent="submitLogin">
+        <form class="form-signin" @submit.prevent="submitLogin">
             <h1 class="h3 mb-3 font-weight-normal">Please sign in</h1>
 
             <label for="inputEmail" class="sr-only">Email address</label>
             <input type="email" id="inputEmail" class="form-control" placeholder="Email address" required autofocus v-model="email">
 
             <label for="inputPassword" class="sr-only">Password</label>
             <input type="password" id="inputPassword" class="form-control" placeholder="Password" required v-model="password">
 
             <button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button>
 
             <br><br><router-link :to="{ name: 'password-reset' }">Forgot password?</router-link>
         </form>
     </div>
 </template>
 
 <script>
     import store from '../js/store'
     export default {
         data() {
             return {
                 email: '',
                 password: '',
                 loginError: false,
             }
         },
         methods: {
             submitLogin() {
                 this.loginError = false;
                 axios.post('/api/auth/login', {
                     email: this.email,
                     password: this.password
                 }).then(response => {
                     // login user, store the token and redirect to dashboard
                     store.commit('loginUser')
                     localStorage.setItem('token', response.data.access_token)
                     this.$router.push({ name: 'dashboard' })
                 }).catch(error => {
                     this.loginError = true
                 });
             }
         }
     }
 </script>
 
 <style scoped>
     .form-wrapper {
         min-height: 100%;
         min-height: 100vh;
         display: flex;
         align-items: center;
     }
+
     .form-signin {
         width: 100%;
         max-width: 330px;
         padding: 15px;
         margin: 0 auto;
     }
+
     .form-signin .form-control {
         position: relative;
         box-sizing: border-box;
         height: auto;
         padding: 10px;
         font-size: 16px;
     }
+
     .form-signin .form-control:focus {
         z-index: 2;
     }
+
     .form-signin input[type="email"] {
         margin-bottom: -1px;
         border-bottom-right-radius: 0;
         border-bottom-left-radius: 0;
     }
+
     .form-signin input[type="password"] {
         margin-bottom: 10px;
         border-top-left-radius: 0;
         border-top-right-radius: 0;
     }
 </style>
diff --git a/src/resources/vue/components/Logout.vue b/src/resources/vue/components/Logout.vue
index f7dcde90..2699dd5e 100644
--- a/src/resources/vue/components/Logout.vue
+++ b/src/resources/vue/components/Logout.vue
@@ -1,14 +1,10 @@
-<template>
-
-</template>
-
 <script>
     import store from '../js/store'
     export default {
         mounted () {
             localStorage.removeItem('token')
             store.commit('logoutUser')
             this.$router.push({ name: 'login' })
         }
     }
 </script>
diff --git a/src/resources/vue/components/PasswordReset.vue b/src/resources/vue/components/PasswordReset.vue
index 156c079e..03537de7 100644
--- a/src/resources/vue/components/PasswordReset.vue
+++ b/src/resources/vue/components/PasswordReset.vue
@@ -1,161 +1,161 @@
 <template>
     <div class="container">
         <div class="card" id="step1">
             <div class="card-body">
                 <h4 class="card-title">Password Reset - Step 1/3</h4>
                 <p class="card-text">
                     Enter your email address to reset your password. You may need to check your spam folder or unblock noreply@kolabnow.com.
                 </p>
-                <form v-on:submit.prevent="submitStep1" data-validation-prefix="reset_">
+                <form @submit.prevent="submitStep1" data-validation-prefix="reset_">
                     <div class="form-group">
                         <label for="reset_email" class="sr-only">Email Address</label>
                         <input type="text" class="form-control" id="reset_email" placeholder="Email Address" required v-model="email">
                     </div>
                     <button class="btn btn-primary" type="submit">Continue</button>
                 </form>
             </div>
         </div>
 
         <div class="card d-none" id="step2">
             <div class="card-body">
                 <h4 class="card-title">Password Reset - Step 2/3</h4>
                 <p class="card-text">
                     We sent out a confirmation code to your external email address.
                     Enter the code we sent you, or click the link in the message.
                 </p>
-                <form v-on:submit.prevent="submitStep2" data-validation-prefix="reset_">
+                <form @submit.prevent="submitStep2" data-validation-prefix="reset_">
                     <div class="form-group">
                         <label for="reset_short_code" class="sr-only">Confirmation Code</label>
                         <input type="text" class="form-control" id="reset_short_code" placeholder="Confirmation Code" required v-model="short_code">
                     </div>
-                    <button class="btn btn-secondary" type="button" v-on:click="stepBack">Back</button>
+                    <button class="btn btn-secondary" type="button" @click="stepBack">Back</button>
                     <button class="btn btn-primary" type="submit">Continue</button>
                     <input type="hidden" id="reset_code" v-model="code" />
                 </form>
             </div>
         </div>
 
         <div class="card d-none" id="step3">
             <div class="card-body">
                 <h4 class="card-title">Password Reset - Step 3/3</h4>
                 <p class="card-text">
                 </p>
-                <form v-on:submit.prevent="submitStep3" data-validation-prefix="reset_">
+                <form @submit.prevent="submitStep3" data-validation-prefix="reset_">
                     <div class="form-group">
                         <label for="reset_password" class="sr-only">Password</label>
                         <input type="password" class="form-control" id="reset_password" placeholder="Password" required v-model="password">
                     </div>
                     <div class="form-group">
                         <label for="reset_confirm" class="sr-only">Confirm Password</label>
                         <input type="password" class="form-control" id="reset_confirm" placeholder="Confirm Password" required v-model="password_confirmation">
                     </div>
-                    <button class="btn btn-secondary" type="button" v-on:click="stepBack">Back</button>
+                    <button class="btn btn-secondary" type="button" @click="stepBack">Back</button>
                     <button class="btn btn-primary" type="submit">Submit</button>
                 </form>
             </div>
         </div>
     </div>
 </template>
 
 <script>
     import store from '../js/store'
 
     export default {
         data() {
             return {
                 email: '',
                 code: '',
                 short_code: '',
                 password: '',
                 password_confirmation: ''
             }
         },
         created() {
             // Verification code provided, auto-submit Step 2
             if (this.$route.params.code) {
                 if (/^([A-Z0-9]+)-([a-zA-Z0-9]+)$/.test(this.$route.params.code)) {
                     this.short_code = RegExp.$1
                     this.code = RegExp.$2
                     this.submitStep2(true)
                 }
                 else {
                     // TODO: Find a way to display error page without changing the URL
                     //       Maybe https://github.com/raniesantos/vue-error-page
                     this.$router.push({name: '404'})
                 }
             }
         },
         mounted() {
             // Focus the first input (autofocus does not work when using the menu/router)
             this.displayForm(1, true)
         },
         methods: {
             // Submits data to the API, validates and gets verification code
             submitStep1() {
                 this.$root.$emit('clearFormValidation', $('#step1 form'))
 
                 axios.post('/api/auth/password-reset/init', {
                     email: this.email
                 }).then(response => {
                     this.displayForm(2, true)
                     this.code = response.data.code
                 })
             },
             // Submits the code to the API for verification
             submitStep2(bylink) {
                 if (bylink === true) {
                     this.displayForm(2, false)
                 }
 
                 this.$root.$emit('clearFormValidation', $('#step2 form'))
 
                 axios.post('/api/auth/password-reset/verify', {
                     code: this.code,
                     short_code: this.short_code
                 }).then(response => {
                     this.displayForm(3, true)
                 }).catch(error => {
                     if (bylink === true) {
                         // FIXME: display step 1, user can do nothing about it anyway
                         //        Maybe we should display 404 error page?
                         this.displayForm(1, true)
                     }
                 })
             },
             // Submits the data to the API to reset the password
             submitStep3() {
                 this.$root.$emit('clearFormValidation', $('#step3 form'))
 
                 axios.post('/api/auth/password-reset', {
                     code: this.code,
                     short_code: this.short_code,
                     password: this.password,
                     password_confirmation: this.password_confirmation
                 }).then(response => {
                     // auto-login and goto dashboard
                     store.commit('loginUser')
                     localStorage.setItem('token', response.data.access_token)
                     this.$router.push({name: 'dashboard'})
                 })
             },
             // Moves the user a step back in registration form
             stepBack(e) {
                 var card = $(e.target).closest('.card')
 
                 card.prev().removeClass('d-none').find('input').first().focus()
                 card.addClass('d-none').find('form')[0].reset()
             },
             displayForm(step, focus) {
                 [1, 2, 3].filter(value => value != step).forEach(value => {
                     $('#step' + value).addClass('d-none')
                 })
 
                 $('#step' + step).removeClass('d-none')
 
                 if (focus) {
                     $('#step' + step).find('input').first().focus()
                 }
             }
         }
     }
 </script>
diff --git a/src/resources/vue/components/Signup.vue b/src/resources/vue/components/Signup.vue
index 1aba7e8c..70ace083 100644
--- a/src/resources/vue/components/Signup.vue
+++ b/src/resources/vue/components/Signup.vue
@@ -1,183 +1,183 @@
 <template>
     <div class="container">
         <div class="card" id="step1">
             <div class="card-body">
                 <h4 class="card-title">Sign Up - Step 1/3</h4>
                 <p class="card-text">
                     Sign up to start your free month.
                 </p>
-                <form v-on:submit.prevent="submitStep1" data-validation-prefix="signup_">
+                <form @submit.prevent="submitStep1" data-validation-prefix="signup_">
                     <div class="form-group">
                         <label for="signup_name" class="sr-only">Your Name</label>
                         <input type="text" class="form-control" id="signup_name" placeholder="Your Name" required autofocus v-model="name">
                     </div>
                     <div class="form-group">
                         <label for="signup_email" class="sr-only">Existing Email Address</label>
                         <input type="text" class="form-control" id="signup_email" placeholder="Existing Email Address" required v-model="email">
                     </div>
                     <button class="btn btn-primary" type="submit">Continue</button>
                 </form>
             </div>
         </div>
 
         <div class="card d-none" id="step2">
             <div class="card-body">
                 <h4 class="card-title">Sign Up - Step 2/3</h4>
                 <p class="card-text">
                     We sent out a confirmation code to your email address.
                     Enter the code we sent you, or click the link in the message.
                 </p>
-                <form v-on:submit.prevent="submitStep2" data-validation-prefix="signup_">
+                <form @submit.prevent="submitStep2" data-validation-prefix="signup_">
                     <div class="form-group">
                         <label for="signup_short_code" class="sr-only">Confirmation Code</label>
                         <input type="text" class="form-control" id="signup_short_code" placeholder="Confirmation Code" required v-model="short_code">
                     </div>
-                    <button class="btn btn-secondary" type="button" v-on:click="stepBack">Back</button>
+                    <button class="btn btn-secondary" type="button" @click="stepBack">Back</button>
                     <button class="btn btn-primary" type="submit">Continue</button>
                     <input type="hidden" id="signup_code" v-model="code" />
                 </form>
             </div>
         </div>
 
         <div class="card d-none" id="step3">
             <div class="card-body">
                 <h4 class="card-title">Sign Up - Step 3/3</h4>
                 <p class="card-text">
                     Create your Kolab identity (you can choose additional addresses later).
                 </p>
-                <form v-on:submit.prevent="submitStep3" data-validation-prefix="signup_">
+                <form @submit.prevent="submitStep3" data-validation-prefix="signup_">
                     <div class="form-group">
                         <label for="signup_login" class="sr-only"></label>
                         <div class="input-group">
                             <input type="text" class="form-control" id="signup_login" required v-model="login">
                             <span class="input-group-append">
                                 <span class="input-group-text">@{{ domain }}</span>
                             </span>
                         </div>
                     </div>
                     <div class="form-group">
                         <label for="signup_password" class="sr-only">Password</label>
                         <input type="password" class="form-control" id="signup_password" placeholder="Password" required v-model="password">
                     </div>
                     <div class="form-group">
                         <label for="signup_confirm" class="sr-only">Confirm Password</label>
                         <input type="password" class="form-control" id="signup_confirm" placeholder="Confirm Password" required v-model="password_confirmation">
                     </div>
-                    <button class="btn btn-secondary" type="button" v-on:click="stepBack">Back</button>
+                    <button class="btn btn-secondary" type="button" @click="stepBack">Back</button>
                     <button class="btn btn-primary" type="submit">Submit</button>
                 </form>
             </div>
         </div>
     </div>
 </template>
 
 <script>
     import store from '../js/store'
 
     export default {
         data() {
             return {
                 email: '',
                 name: '',
                 code: '',
                 short_code: '',
                 login: '',
                 password: '',
                 password_confirmation: '',
                 domain: window.config['app.domain']
             }
         },
         created() {
             // Verification code provided, auto-submit Step 2
             if (this.$route.params.code) {
                 if (/^([A-Z0-9]+)-([a-zA-Z0-9]+)$/.test(this.$route.params.code)) {
                     this.short_code = RegExp.$1
                     this.code = RegExp.$2
                     this.submitStep2(true)
                 }
                 else {
                     // TODO: Find a way to display error page without changing the URL
                     //       Maybe https://github.com/raniesantos/vue-error-page
                     this.$router.push({name: '404'})
                 }
             }
         },
         mounted() {
             // Focus the first input (autofocus does not work when using the menu/router)
             this.displayForm(1, true)
         },
         methods: {
             // Submits data to the API, validates and gets verification code
             submitStep1() {
                 this.$root.$emit('clearFormValidation', $('#step1 form'))
 
                 axios.post('/api/auth/signup/init', {
                     email: this.email,
                     name: this.name
                 }).then(response => {
                     this.displayForm(2, true)
                     this.code = response.data.code
                 })
             },
             // Submits the code to the API for verification
             submitStep2(bylink) {
                 if (bylink === true) {
                     this.displayForm(2, false)
                 }
 
                 this.$root.$emit('clearFormValidation', $('#step2 form'))
 
                 axios.post('/api/auth/signup/verify', {
                     code: this.code,
                     short_code: this.short_code
                 }).then(response => {
                     this.displayForm(3, true)
                     // Reset user name/email, we don't have them if user used a verification link
                     this.name = response.data.name
                     this.email = response.data.email
                 }).catch(error => {
                     if (bylink === true) {
                         // FIXME: display step 1, user can do nothing about it anyway
                         //        Maybe we should display 404 error page?
                         this.displayForm(1, true)
                     }
                 })
             },
             // Submits the data to the API to create the user account
             submitStep3() {
                 this.$root.$emit('clearFormValidation', $('#step3 form'))
 
                 axios.post('/api/auth/signup', {
                     code: this.code,
                     short_code: this.short_code,
                     login: this.login,
                     password: this.password,
                     password_confirmation: this.password_confirmation
                 }).then(response => {
                     // auto-login and goto dashboard
                     store.commit('loginUser')
                     localStorage.setItem('token', response.data.access_token)
                     this.$router.push({name: 'dashboard'})
                 })
             },
             // Moves the user a step back in registration form
             stepBack(e) {
                 var card = $(e.target).closest('.card')
 
                 card.prev().removeClass('d-none').find('input').first().focus()
                 card.addClass('d-none').find('form')[0].reset()
             },
             displayForm(step, focus) {
                 [1, 2, 3].filter(value => value != step).forEach(value => {
                     $('#step' + value).addClass('d-none')
                 })
 
                 $('#step' + step).removeClass('d-none')
 
                 if (focus) {
                     $('#step' + step).find('input').first().focus()
                 }
             }
         }
     }
 </script>