diff --git a/client/client-app.js b/client/client-app.js
index f8e2410b..cffe3d8f 100644
--- a/client/client-app.js
+++ b/client/client-app.js
@@ -164,6 +164,7 @@ Vue.component('profile', () => import(/* webpackChunkName: "profile" */ './compo
 Vue.component('register', () => import(/* webpackChunkName: "register" */ './components/register.vue'))
 Vue.component('v-card-chin', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/v-card-chin.vue'))
 Vue.component('search-results', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/search-results.vue'))
+Vue.component('unauthorized', () => import(/* webpackChunkName: "unauthorized" */ './components/unauthorized.vue'))
 Vue.component('welcome', () => import(/* webpackChunkName: "welcome" */ './components/welcome.vue'))
 
 Vue.component('nav-footer', () => import(/* webpackChunkName: "theme-page"  */ './themes/' + process.env.CURRENT_THEME + '/components/nav-footer.vue'))
diff --git a/client/components/unauthorized.vue b/client/components/unauthorized.vue
new file mode 100644
index 00000000..7e8dfebe
--- /dev/null
+++ b/client/components/unauthorized.vue
@@ -0,0 +1,33 @@
+<template lang='pug'>
+  v-app
+    .unauthorized
+      .unauthorized-content
+        img.animated.fadeIn(src='/svg/icon-delete-shield.svg', alt='Unauthorized')
+        .headline {{$t('unauthorized.title')}}
+        .subtitle-1.mt-3 {{$t('unauthorized.action.' + action)}}
+        v-btn.mt-5(href='/login', x-large)
+          v-icon(left) mdi-login
+          span {{$t('unauthorized.login')}}
+        v-btn.mt-5(color='red lighten-4', href='javascript:window.history.go(-1);', outlined)
+          v-icon(left) mdi-arrow-left
+          span {{$t('unauthorized.goback')}}
+</template>
+
+<script>
+
+export default {
+  props: {
+    action: {
+      type: String,
+      default: 'view'
+    }
+  },
+  data() {
+    return { }
+  }
+}
+</script>
+
+<style lang='scss'>
+
+</style>
diff --git a/server/views/unauthorized.pug b/server/views/unauthorized.pug
index d303797e..3a36ec69 100644
--- a/server/views/unauthorized.pug
+++ b/server/views/unauthorized.pug
@@ -2,16 +2,4 @@ extends master.pug
 
 block body
   #root.is-fullscreen
-    v-app
-      .unauthorized
-        .unauthorized-content
-          img.animated.fadeIn(src='/svg/icon-delete-shield.svg', alt='Unauthorized')
-          .headline= t('unauthorized.title')
-          .subheading.mt-3= t('unauthorized.action.' + action)
-          .mt-5
-            v-btn(color='red lighten-4', href='javascript:window.history.go(-1);', large, outline)
-              v-icon(left) arrow_back
-              span= t('unauthorized.goback')
-            v-btn(color='red lighten-4', href='/login', large, outline)
-              v-icon(left) person_outline
-              span= t('unauthorized.login')
+    unauthorized(action=action)