Fix some route bugs and separate login styles

assets/src/css/login.css

@@ -0,0 +1,68 @@
+#login {
+  background: #fff;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
+#login img {
+  width: 4em;
+  height: 4em;
+  margin: 0 auto;
+  display: block;
+}
+
+#login h1 {
+  text-align: center;
+  font-size: 2.5em;
+  margin: .4em 0 .67em;
+}
+
+#login form {
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  max-width: 16em;
+  width: 90%;
+}
+
+#login input {
+  width: 100%;
+  width: 100%;
+  margin: .5em 0 0;
+}
+
+#login .wrong {
+  background: #F44336;
+  color: #fff;
+  padding: .5em;
+  text-align: center;
+  animation: .2s opac forwards;
+}
+
+@keyframes opac {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+#login input[type="text"],
+#login input[type="password"] {
+  padding: .5em 1em;
+  border: 1px solid #e9e9e9;
+  transition: .2s ease border;
+  color: #333;
+}
+
+#login input[type="text"]:focus,
+#login input[type="password"]:focus,
+#login input[type="text"]:hover,
+#login input[type="password"]:hover {
+  border-color: #9f9f9f;
+}

assets/src/css/styles.css

@@ -6,6 +6,7 @@
 @import "./listing.css";
 @import "./editor.css";
 @import "./dashboard.css";
+@import "./login.css";
 
 /* * * * * * * * * * * * * * * *
  *            ACTION           *

assets/src/i18n/index.js

@@ -7,7 +7,7 @@ import zhCN from './zh_cn.yaml'
 Vue.use(VueI18n)
 
 export default new VueI18n({
-  locale: 'zh_cn',
+  locale: 'en',
   fallbackLocale: 'en',
   messages: {
     'en': en,

assets/src/router/index.js

@@ -88,19 +88,13 @@ const router = new Router({
           component: error500
         },
         {
-          path: '/users',
+          path: '/settings/users',
           name: 'Users',
           component: Users,
           meta: {
             requiresAdmin: true
           }
         },
-        {
-          path: '/settings/users/',
-          redirect: {
-            path: '/users'
-          }
-        },
         {
           path: '/settings/users/*',
           name: 'User',

assets/src/views/Login.vue

@@ -34,85 +34,9 @@ export default {
       }
 
       auth.login(this.username, this.password)
-        .then(() => {
+        .then(() => { this.$router.push({ path: redirect }) })
-          this.$router.push({ path: redirect })
+        .catch(() => { this.wrong = true })
-        })
-        .catch(() => {
-          this.wrong = true
-        })
     }
   }
 }
 </script>
-
-<style>
-#login {
-  background: #fff;
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-}
-
-#login img {
-  width: 4em;
-  height: 4em;
-  margin: 0 auto;
-  display: block;
-}
-
-#login h1 {
-  text-align: center;
-  font-size: 2.5em;
-  margin: .4em 0 .67em;
-}
-
-#login form {
-  position: fixed;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  max-width: 16em;
-  width: 90%;
-}
-
-#login input {
-  width: 100%;
-  width: 100%;
-  margin: .5em 0 0;
-}
-
-#login .wrong {
-  background: #F44336;
-  color: #fff;
-  padding: .5em;
-  text-align: center;
-  animation: .2s opac forwards;
-}
-
-@keyframes opac {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-
-#login input[type="text"],
-#login input[type="password"] {
-  padding: .5em 1em;
-  border: 1px solid #e9e9e9;
-  transition: .2s ease border;
-  color: #333;
-}
-
-#login input[type="text"]:focus,
-#login input[type="password"]:focus,
-#login input[type="text"]:hover,
-#login input[type="password"]:hover {
-  border-color: #9f9f9f;
-}
-</style>
-