diff --git a/public/favicon.ico b/public/favicon.ico
index df36fcfb..928f98f4 100644
Binary files a/public/favicon.ico and b/public/favicon.ico differ
diff --git a/src/assets/css/basic.css b/src/assets/css/basic.css
index 2102246b..9e17813d 100644
--- a/src/assets/css/basic.css
+++ b/src/assets/css/basic.css
@@ -63,6 +63,10 @@ h3::before {
     content: "# ";
 }
 
+.markdown-container img {
+    max-width: 100%;
+}
+
 .markdown-container h1,
 .cm-header-1 {
     font-size: 30px;
diff --git a/src/assets/icon/SOJ-thick-white.svg b/src/assets/icon/SOJ-thick-white.svg
new file mode 100644
index 00000000..cec42fdb
--- /dev/null
+++ b/src/assets/icon/SOJ-thick-white.svg
@@ -0,0 +1,34 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1500" height="1500" viewBox="0 0 1500 1500">
+  <defs>
+    <style>
+      .cls-1 {
+        clip-path: url(#clip-custom_1);
+      }
+
+      .cls-2 {
+        fill: #fff;
+        stroke: #fff;
+        stroke-width: 40px;
+      }
+
+      .cls-3 {
+        filter: url(#SOJ);
+      }
+    </style>
+    <filter id="SOJ" x="365.696" y="232.945" width="769.525" height="1037.514" filterUnits="userSpaceOnUse">
+      <feOffset dy="3" input="SourceAlpha"/>
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feFlood flood-color="#fff" flood-opacity="0.502"/>
+      <feComposite operator="in" in2="blur"/>
+      <feComposite in="SourceGraphic"/>
+    </filter>
+    <clipPath id="clip-custom_1">
+      <rect width="1500" height="1500"/>
+    </clipPath>
+  </defs>
+  <g id="custom_1" data-name="custom – 1" class="cls-1">
+    <g class="cls-3" transform="matrix(1, 0, 0, 1, 0, 0)">
+      <path id="SOJ-2" data-name="SOJ" class="cls-2" d="M195.822,726.991,204,731Zm0,0L-204,531,195.822,726.991,187.777,731Zm0,0,287.955-143.5V302.728L494,308l-10.223-5.272V583.492l5-2.492-5,2.492Zm287.955-143.5v0ZM-158,179.635,237,382ZM88.777,99l395,203.728ZM-158,179.635-169,174l11,5.636v0Zm0,0V-102.5L133.389-248.195,137-250l-3.611,1.805L529.777-50,133.389-248.195-158-102.5Zm0-282.136-5,2.5ZM129.777-250l3.612,1.805Z" transform="translate(587.5 509.5)"/>
+    </g>
+  </g>
+</svg>
diff --git a/src/components/home/page.vue b/src/components/home/page.vue
index 3638dbb9..b40afda6 100644
--- a/src/components/home/page.vue
+++ b/src/components/home/page.vue
@@ -12,7 +12,3 @@ export default {
   }
 };
 </script>
-
-<style scoped>
-
-</style>
\ No newline at end of file
diff --git a/src/components/page/navbar.vue b/src/components/page/navbar.vue
index 57049b2f..a9b24b3a 100644
--- a/src/components/page/navbar.vue
+++ b/src/components/page/navbar.vue
@@ -11,6 +11,7 @@
         text-color="#fff"
         active-text-color="rgb(233, 233, 235)"
       >
+        <el-menu-item index=""><img src="./../../assets/icon/SOJ-thick-white.svg" style="height: 40px;" /></el-menu-item>
         <el-menu-item index="/"><i class="el-icon-s-home" /> Home</el-menu-item>
         <el-menu-item index="/problem/list"><i class="el-icon-s-order" />Problem List</el-menu-item>
         <el-submenu index="2" id="user">
diff --git a/src/components/problem/content.vue b/src/components/problem/content.vue
index 3cfa6a96..b1df8950 100644
--- a/src/components/problem/content.vue
+++ b/src/components/problem/content.vue
@@ -55,6 +55,8 @@
             <div class="tool-content">{{title}}</div>
             <el-divider class="divider">PID</el-divider>
             <div class="tool-content">#{{pid}}</div>
+            <el-divider class="divider">Date Created</el-divider>
+            <div class="tool-content">{{timeAdd}}</div>
           </el-card>
           <el-card shadow="never" class="margin-top">
             <div><i class="el-icon-menu" /> Limitation </div>
@@ -70,6 +72,7 @@
 </template>
 
 <script>
+import timeFormat from './../../methods/time';
 import apiurl from './../../apiurl';
 import MarkdownContainer from './../lib/MarkdownContainer.vue';
 
@@ -78,7 +81,7 @@ export default {
   data() {
     return {
       description: null,
-      title: '-',
+      title: 'Unknown',
       pid: this.$route.params.id,
       allowHTML: false,
       isWider: false,
@@ -86,6 +89,7 @@ export default {
       hidden: false,
       time: '-',
       memery: '-',
+      timeAdd: 'Unknown',
       problemLoading: true
     };
   },
@@ -102,6 +106,7 @@ export default {
           this.memery = data.memory_limit / 1000;
           this.time = data.time_limit;
           this.hidden = !data.enabled;
+          this.timeAdd = timeFormat(data.date_added);
           this.problemLoading = false;
         })
         .catch(err => {
diff --git a/src/components/problem/list.vue b/src/components/problem/list.vue
index fdffc8f9..8a287bac 100644
--- a/src/components/problem/list.vue
+++ b/src/components/problem/list.vue
@@ -45,8 +45,8 @@ export default {
       if (!x.enabled) {
         x.title = (
           <div>
+            <router-link to={'/problem/' + String(x.pid)} class={color + ' text-normal'}>{ x.title } </router-link>
             <el-tag effect="dark" type="warning">Hidden</el-tag>
-            <router-link to={'/problem/' + String(x.pid)} class={color + ' text-normal'}> { x.title }</router-link>
           </div>
         );
       } else {
diff --git a/src/components/problem/submit.vue b/src/components/problem/submit.vue
index 67810ca5..36c4a5ee 100644
--- a/src/components/problem/submit.vue
+++ b/src/components/problem/submit.vue
@@ -32,7 +32,7 @@ export default {
   data() {
     return {
       code: '',
-      lang_num: null,
+      lang_num: '-',
       buttonLoading: false,
       options: [{
         value: '0',
diff --git a/src/components/user/content.vue b/src/components/user/content.vue
index f71bae3a..d6aebc73 100644
--- a/src/components/user/content.vue
+++ b/src/components/user/content.vue
@@ -10,7 +10,7 @@
         <el-button @click="$router.go(-1);">Back</el-button>
       </el-card>
     </div>
-    <div id="info">
+    <div id="info" v-loading="userLoading">
       <el-row :gutter="20">
         <el-col :span="18">
           <el-card shadow="never">
@@ -25,10 +25,26 @@
           </el-card>
         </el-col>
       </el-row>
-      <el-card shadow="never" class="item">
-        <div slot="header" class="clearfix"><i class="el-icon-message" /> Email</div>
-        {{email}}
-      </el-card>
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-card shadow="never" class="item">
+            <div slot="header" class="clearfix"><i class="el-icon-message" /> Email</div>
+            {{email}}
+          </el-card>
+        </el-col>
+        <el-col :span="6">
+          <el-card shadow="never" class="item">
+            <div slot="header" class="clearfix"><i class="el-icon-date" /> Time Joined</div>
+            {{timeJoin}}
+          </el-card>
+        </el-col>
+        <el-col :span="6">
+          <el-card shadow="never" class="item">
+            <div slot="header" class="clearfix"><i class="el-icon-time" /> Last Login</div>
+            {{lastLogin}}
+          </el-card>
+        </el-col>
+      </el-row>
       <el-row :gutter="20">
         <el-col :span="8">
           <el-card shadow="never" class="item">
@@ -39,7 +55,7 @@
         <el-col :span="8">
           <el-card shadow="never" class="item">
             <div slot="header" class="clearfix"><i class="el-icon-upload2" /> Submited</div>
-            {{submit}} Problems
+            {{submit}} Times
           </el-card>
         </el-col>
         <el-col :span="8">
@@ -58,6 +74,7 @@
 </template>
 
 <script>
+import timeFormat from './../../methods/time';
 import apiurl from './../../apiurl';
 import MarkdownContainer from './../lib/MarkdownContainer.vue';
 
@@ -65,14 +82,17 @@ export default {
   name: 'UserHomepage',
   data() {
     return {
-      username: '-',
+      username: 'Unknown',
       userid: '-',
-      email: '-',
+      email: 'Unknown',
       introduction: null,
       solved: '-',
       submit: '-',
-      rate: '-',
-      ismine: false
+      rate: 100,
+      ismine: false,
+      timeJoin: 'Unknown',
+      lastLogin: 'Unknown',
+      userLoading: true
     };
   },
   methods: {
@@ -87,6 +107,9 @@ export default {
           this.introduction = data.introduction;
           this.solved = data.solved;
           this.submit = data.submit_time;
+          this.timeJoin = timeFormat(data.date_joined);
+          this.lastLogin = timeFormat(data.last_login);
+          this.userLoading = false;
           if (this.solved == 0) {
             this.rate = 100;
           } else {
diff --git a/src/methods/time.js b/src/methods/time.js
new file mode 100644
index 00000000..c0119e71
--- /dev/null
+++ b/src/methods/time.js
@@ -0,0 +1,7 @@
+let timeFormat = (origin) => {
+  let time = new Date(origin);
+  let res = time.getFullYear() + '-' + (time.getMonth() + 1) + '-' + time.getDate();
+  return res;
+};
+
+export default timeFormat;
\ No newline at end of file