diff --git a/frontend/admin/index.html b/frontend/admin/index.html
index 1042fd67..8ea866bc 100644
--- a/frontend/admin/index.html
+++ b/frontend/admin/index.html
@@ -4,320 +4,32 @@
     <meta charset="utf-8">
     <title>Online Judge Admin</title>
     <style>
-.cssload-wraper{
-	width:0px;
-	display:block;
-	margin: 200px auto;
-}
-
-.cssload-dots {
-	font-family: sans-serif;
-	font-weight: 100;
-}
-
-.cssload-dots:not(:required) {
-	overflow: hidden;
-	position: relative;
-	text-indent: -19998px;
-	display: inline-block;
-	width: 14px;
-	height: 14px;
-	background: transparent;
-	border-radius: 100%;
-	box-shadow: rgb(255,136,102) -28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-		-o-box-shadow: rgb(255,136,102) -28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-		-ms-box-shadow: rgb(255,136,102) -28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-		-webkit-box-shadow: rgb(255,136,102) -28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-		-moz-box-shadow: rgb(255,136,102) -28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	animation: cssload-dots 4.25s infinite ease-in-out;
-		-o-animation: cssload-dots 4.25s infinite ease-in-out;
-		-ms-animation: cssload-dots 4.25s infinite ease-in-out;
-		-webkit-animation: cssload-dots 4.25s infinite ease-in-out;
-		-moz-animation: cssload-dots 4.25s infinite ease-in-out;
-	transform-origin: 50% 50%;
-		-o-transform-origin: 50% 50%;
-		-ms-transform-origin: 50% 50%;
-		-webkit-transform-origin: 50% 50%;
-		-moz-transform-origin: 50% 50%;
-}
-
-
-
-@keyframes cssload-dots {
-	0% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) -28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	8.33% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) 28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	16.67% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) 28px 28px 0 14px, rgb(255,204,102) 28px 28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	25% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-
-	33.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee -28px -28px 0 14px;
-	}
-
-	41.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px -28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	50% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	58.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	66.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 -28px -28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	75% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px -28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	83.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px 28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee 28px 28px 0 14px;
-	}
-
-	91.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-
-	100% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-}
-
-@-o-keyframes cssload-dots {
-	0% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) -28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	8.33% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) 28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	16.67% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) 28px 28px 0 14px, rgb(255,204,102) 28px 28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	25% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-
-	33.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee -28px -28px 0 14px;
-	}
-
-	41.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px -28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	50% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	58.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	66.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 -28px -28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	75% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px -28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	83.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px 28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee 28px 28px 0 14px;
-	}
-
-	91.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-
-	100% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-}
-
-@-ms-keyframes cssload-dots {
-	0% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) -28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	8.33% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) 28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	16.67% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) 28px 28px 0 14px, rgb(255,204,102) 28px 28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	25% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-
-	33.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee -28px -28px 0 14px;
-	}
-
-	41.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px -28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	50% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	58.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	66.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 -28px -28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	75% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px -28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	83.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px 28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee 28px 28px 0 14px;
-	}
-
-	91.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-
-	100% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-}
-
-@-webkit-keyframes cssload-dots {
-	0% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) -28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	8.33% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) 28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	16.67% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) 28px 28px 0 14px, rgb(255,204,102) 28px 28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	25% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-
-	33.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee -28px -28px 0 14px;
-	}
-
-	41.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px -28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	50% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	58.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	66.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 -28px -28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	75% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px -28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	83.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px 28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee 28px 28px 0 14px;
-	}
-
-	91.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-
-	100% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-}
-
-@-moz-keyframes cssload-dots {
-	0% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) -28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	8.33% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) 28px -28px 0 14px, rgb(255,204,102) 28px -28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	16.67% {
-		box-shadow: white 0 0 30px 0, rgb(255,136,102) 28px 28px 0 14px, rgb(255,204,102) 28px 28px 0 14px, rgb(102,221,119) 28px 28px 0 14px, rgb(68,170,238) -28px 28px 0 14px;
-	}
-
-	25% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-
-	33.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee -28px -28px 0 14px;
-	}
-
-	41.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px -28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	50% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	58.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 -28px 28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	66.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 -28px -28px 0 14px, #66dd77 -28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	75% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px -28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px -28px 0 14px, #44aaee 28px -28px 0 14px;
-	}
-
-	83.33% {
-		box-shadow: white 0 0 30px 0, #ff8866 28px 28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee 28px 28px 0 14px;
-	}
-
-	91.67% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px 28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-
-	100% {
-		box-shadow: white 0 0 30px 0, #ff8866 -28px -28px 0 14px, #ffcc66 28px -28px 0 14px, #66dd77 28px 28px 0 14px, #44aaee -28px 28px 0 14px;
-	}
-}
+        #loading {
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            width: 400px;
+            height: 400px;
+            margin-top: -200px;
+            margin-left: -200px;
+        }
+        #browser-unsupported {
+            padding: 8px 0;
+            background: #FBE3E4;
+            color: #8A1F11;
+            text-align: center;
+        }
     </style>
 </head>
 <body>
-<div class="cssload-wraper" id="loading">
-	<div class="cssload-dots"></div>
-</div>
+<div id="browser-unsupported" style="display: none">Your browser is <strong>NOT</strong> supported. click <a href="http://browsehappy.com/">here</a> tp upgrade your browser.</div>
+<script>
+    // new version IE do not have 'MSIE' in ua
+    if (navigator.userAgent.indexOf("MSIE") > -1) {
+        document.getElementById("browser-unsupported").removeAttribute("style");
+    }
+</script>
+<img src="../static/img/loading.jpg" id="loading">
 <div id="app">
 </div>
 </body>
diff --git a/frontend/admin/src/App.vue b/frontend/admin/src/App.vue
index 71b628ea..f21c58b2 100644
--- a/frontend/admin/src/App.vue
+++ b/frontend/admin/src/App.vue
@@ -1,6 +1,5 @@
 <template>
     <div>
-        <unsupported-browser-warning></unsupported-browser-warning>
         <top-nav></top-nav>
         <div class="container">
             <div class="row">
@@ -28,13 +27,11 @@
 </style>
 
 <script>
-    import unsupportedBrowserWarning from "./components/utils/unsupportedBrowserWarning.vue"
     import topNav from "./components/utils/topNav.vue"
     import leftNav from "./components/utils/leftNav.vue"
 
     export default({
         components: {
-            unsupportedBrowserWarning,
             topNav,
             leftNav
         }
diff --git a/frontend/admin/src/components/utils/unsupportedBrowserWarning.vue b/frontend/admin/src/components/utils/unsupportedBrowserWarning.vue
deleted file mode 100644
index c4eff0ce..00000000
--- a/frontend/admin/src/components/utils/unsupportedBrowserWarning.vue
+++ /dev/null
@@ -1,13 +0,0 @@
-<template>
-    <div id="browser-unsupported" style="display: none">{{{ $t("adminUtils.unsupportedBrowserWarningMsg") }}}
-    </div>
-</template>
-<script>
-    export default{
-        attached() {
-            if (navigator.userAgent.indexOf("MSIE") > -1) {
-                document.getElementById("browser-unsupported").removeAttribute("style");
-            }
-        }
-    }
-</script>
\ No newline at end of file
diff --git a/frontend/admin/static/img/favicon.ico b/frontend/admin/static/img/favicon.ico
new file mode 100644
index 00000000..a8f829aa
Binary files /dev/null and b/frontend/admin/static/img/favicon.ico differ
diff --git a/frontend/static/img/loading.jpg b/frontend/static/img/loading.jpg
new file mode 100644
index 00000000..e22da85b
Binary files /dev/null and b/frontend/static/img/loading.jpg differ