diff --git a/src/language/en.ts b/src/language/en.ts
index 57093049..4d6728d7 100644
--- a/src/language/en.ts
+++ b/src/language/en.ts
@@ -276,6 +276,29 @@ export default {
     rePwd: 'Confirm Password',
     confirm: 'Confirm',
   },
+  // 路由标题
+  router: {
+    home: 'Home',
+    balance: 'P & L',
+    edit: 'Edit',
+    about: 'About',
+    userInfo: 'Info',
+    userSettings: 'Settings',
+    userPassword: 'Password',
+    userPublished: 'Published Topic',
+    userLiked: 'Liked Topic',
+    userUpvote: 'Upvote Topic',
+    userReply: 'Reply',
+    userComment: 'Comment',
+    nonMoe: 'Non-MoeMoe!',
+    pool: 'Pool',
+    ranking: 'Ranking',
+    regulations: 'Regulations',
+    technique: 'Technique',
+    thanks: 'Thinks List',
+    topics: 'Topics',
+    update: 'Update Log',
+  },
   // 非页面组件这里统一用大驼峰
   ComponentAlert: {
     confirm: 'OK',
diff --git a/src/language/zh.ts b/src/language/zh.ts
index 95f6739a..3f4a446a 100644
--- a/src/language/zh.ts
+++ b/src/language/zh.ts
@@ -274,6 +274,29 @@ export default {
     rePwd: '确认密码',
     confirm: '确定更改',
   },
+  // 路由标题
+  router: {
+    home: '主页',
+    balance: '收支公示',
+    edit: '编辑',
+    about: '关于我们',
+    userInfo: '个人信息',
+    userSettings: '信息设置',
+    userPassword: '邮箱密码',
+    userPublished: '发的话题',
+    userLiked: '赞的话题',
+    userUpvote: '推的话题',
+    userReply: '发的回复',
+    userComment: '发的评论',
+    nonMoe: '不萌萌!',
+    pool: '话题池',
+    ranking: '排行榜',
+    regulations: '执行条例',
+    technique: '技术交流',
+    thanks: '感谢名单',
+    topics: '话题',
+    update: '更新日志',
+  },
   // 非页面组件这里统一用大驼峰
   ComponentAlert: {
     confirm: '确定',
diff --git a/src/router/guard/index.ts b/src/router/guard/index.ts
index b21d76fc..bf5b3e3b 100644
--- a/src/router/guard/index.ts
+++ b/src/router/guard/index.ts
@@ -1,9 +1,11 @@
 import { Router } from 'vue-router'
 import { createPermission } from './permission'
+import i18n from '@/language/i18n'
 
 const createPageTitle = (router: Router) => {
   router.beforeEach((to) => {
-    document.title = to.meta.title as string
+    const title = to.meta.title as string
+    document.title = i18n.global.tm(`router.${title}`)
     return true
   })
 }
diff --git a/src/router/modules/balance.ts b/src/router/modules/balance.ts
index 4a79e460..2ee8d800 100644
--- a/src/router/modules/balance.ts
+++ b/src/router/modules/balance.ts
@@ -13,7 +13,7 @@ const balance: RouteRecordRaw[] = [
         path: '',
         component: () => import('@/views/balance/Balance.vue'),
         meta: {
-          title: '收支公示',
+          title: 'balance',
         },
       },
     ],
diff --git a/src/router/modules/edit.ts b/src/router/modules/edit.ts
index b5de0483..99d78da0 100644
--- a/src/router/modules/edit.ts
+++ b/src/router/modules/edit.ts
@@ -13,7 +13,7 @@ const edit: RouteRecordRaw[] = [
         path: '',
         component: () => import('@/views/edit/Edit.vue'),
         meta: {
-          title: '编辑',
+          title: 'edit',
         },
       },
     ],
diff --git a/src/router/modules/home.ts b/src/router/modules/home.ts
index f88c8faf..39c4fca7 100644
--- a/src/router/modules/home.ts
+++ b/src/router/modules/home.ts
@@ -14,7 +14,7 @@ const index: RouteRecordRaw[] = [
         path: '',
         component: () => import('@/views/Home/KUNGalgameMainPage.vue'),
         meta: {
-          title: '主页',
+          title: 'home',
         },
       },
     ],
diff --git a/src/router/modules/kungalgame.ts b/src/router/modules/kungalgame.ts
index 72d686c5..1bcd7bf5 100644
--- a/src/router/modules/kungalgame.ts
+++ b/src/router/modules/kungalgame.ts
@@ -13,7 +13,7 @@ const kungalgame: RouteRecordRaw[] = [
         path: '',
         component: () => import('@/views/kungalgame/KUNGalgame.vue'),
         meta: {
-          title: '关于我们',
+          title: 'about',
         },
       },
     ],
diff --git a/src/router/modules/kungalgamer.ts b/src/router/modules/kungalgamer.ts
index 32509902..b18006a4 100644
--- a/src/router/modules/kungalgamer.ts
+++ b/src/router/modules/kungalgamer.ts
@@ -23,7 +23,7 @@ const kungalgamer: RouteRecordRaw[] = [
             path: 'info',
             component: () => import('@/views/kungalgamer/content/Info.vue'),
             meta: {
-              title: 'Info',
+              title: 'userInfo',
             },
           },
           {
@@ -31,7 +31,7 @@ const kungalgamer: RouteRecordRaw[] = [
             path: 'settings',
             component: () => import('@/views/kungalgamer/content/Settings.vue'),
             meta: {
-              title: 'Settings',
+              title: 'userSettings',
               permission: [4],
             },
           },
@@ -40,7 +40,7 @@ const kungalgamer: RouteRecordRaw[] = [
             path: 'password',
             component: () => import('@/views/kungalgamer/content/Password.vue'),
             meta: {
-              title: 'Password',
+              title: 'userPassword',
               permission: [4],
             },
           },
@@ -50,7 +50,7 @@ const kungalgamer: RouteRecordRaw[] = [
             path: 'published-topic',
             component: () => import('@/views/kungalgamer/content/Topic.vue'),
             meta: {
-              title: 'PublishedTopic',
+              title: 'userPublished',
             },
           },
           {
@@ -59,7 +59,7 @@ const kungalgamer: RouteRecordRaw[] = [
             path: 'liked-topic',
             component: () => import('@/views/kungalgamer/content/Topic.vue'),
             meta: {
-              title: 'LikedTopic',
+              title: 'userLiked',
               permission: [2, 3, 4],
             },
           },
@@ -69,7 +69,7 @@ const kungalgamer: RouteRecordRaw[] = [
             path: 'upvote-topic',
             component: () => import('@/views/kungalgamer/content/Topic.vue'),
             meta: {
-              title: 'UpvoteTopic',
+              title: 'userUpvote',
               permission: [2, 3, 4],
             },
           },
@@ -79,7 +79,7 @@ const kungalgamer: RouteRecordRaw[] = [
             path: 'reply',
             component: () => import('@/views/kungalgamer/content/Topic.vue'),
             meta: {
-              title: 'Reply',
+              title: 'userReply',
             },
           },
           {
@@ -88,7 +88,7 @@ const kungalgamer: RouteRecordRaw[] = [
             path: 'comment',
             component: () => import('@/views/kungalgamer/content/Topic.vue'),
             meta: {
-              title: 'Comment',
+              title: 'userComment',
             },
           },
         ],
diff --git a/src/router/modules/non-moe.ts b/src/router/modules/non-moe.ts
index 69317f36..b6f7b41e 100644
--- a/src/router/modules/non-moe.ts
+++ b/src/router/modules/non-moe.ts
@@ -13,7 +13,7 @@ const nonMoe: RouteRecordRaw[] = [
         path: '',
         component: () => import('@/views/non-moe/NonMoe.vue'),
         meta: {
-          title: '不萌萌',
+          title: 'nonMoe',
         },
       },
     ],
diff --git a/src/router/modules/pool.ts b/src/router/modules/pool.ts
index 82cd0367..895e575e 100644
--- a/src/router/modules/pool.ts
+++ b/src/router/modules/pool.ts
@@ -13,7 +13,7 @@ const pool: RouteRecordRaw[] = [
         path: '',
         component: () => import('@/views/pool/Pool.vue'),
         meta: {
-          title: '话题池',
+          title: 'pool',
         },
       },
     ],
diff --git a/src/router/modules/ranking.ts b/src/router/modules/ranking.ts
index be054fb1..fbe4e1a3 100644
--- a/src/router/modules/ranking.ts
+++ b/src/router/modules/ranking.ts
@@ -13,7 +13,7 @@ const ranking: RouteRecordRaw[] = [
         path: '',
         component: () => import('@/views/ranking/Ranking.vue'),
         meta: {
-          title: '排行榜',
+          title: 'ranking',
         },
       },
     ],
diff --git a/src/router/modules/regulations.ts b/src/router/modules/regulations.ts
index 49a891d3..5e2bedb3 100644
--- a/src/router/modules/regulations.ts
+++ b/src/router/modules/regulations.ts
@@ -13,7 +13,7 @@ const bylaw: RouteRecordRaw[] = [
         path: '',
         component: () => import('@/views/bylaw/Bylaw.vue'),
         meta: {
-          title: '执行条例（试行）',
+          title: 'regulations',
         },
       },
     ],
diff --git a/src/router/modules/technique.ts b/src/router/modules/technique.ts
index a21936e3..d1d60c65 100644
--- a/src/router/modules/technique.ts
+++ b/src/router/modules/technique.ts
@@ -13,7 +13,7 @@ const technique: RouteRecordRaw[] = [
         path: '',
         component: () => import('@/views/technique/Technique.vue'),
         meta: {
-          title: '技术交流',
+          title: 'technique',
         },
       },
     ],
diff --git a/src/router/modules/thanks-list.ts b/src/router/modules/thanks-list.ts
index 70465de2..aa1111a6 100644
--- a/src/router/modules/thanks-list.ts
+++ b/src/router/modules/thanks-list.ts
@@ -13,7 +13,7 @@ const thanksList: RouteRecordRaw[] = [
         path: '',
         component: () => import('@/views/thanks-list/ThanksList.vue'),
         meta: {
-          title: '感谢名单',
+          title: 'thanks',
         },
       },
     ],
diff --git a/src/router/modules/topic.ts b/src/router/modules/topic.ts
index 4c6b73f2..fd8ca0e2 100644
--- a/src/router/modules/topic.ts
+++ b/src/router/modules/topic.ts
@@ -18,7 +18,7 @@ const topic: RouteRecordRaw[] = [
         props: true,
         meta: {
           transition: 'animate__fadeIn animate__faster',
-          title: '话题',
+          title: 'topics',
         },
       },
     ],
diff --git a/src/router/modules/update-log.ts b/src/router/modules/update-log.ts
index 0a20b26c..640b7c17 100644
--- a/src/router/modules/update-log.ts
+++ b/src/router/modules/update-log.ts
@@ -13,7 +13,7 @@ const updateLog: RouteRecordRaw[] = [
         path: '',
         component: () => import('@/views/update-log/UpdateLog.vue'),
         meta: {
-          title: '更新日志',
+          title: 'update',
         },
       },
     ],
diff --git a/src/views/Home/content/article/components/header/SortTopic.vue b/src/views/Home/content/article/components/header/SortTopic.vue
index 4f03821d..6153c41d 100644
--- a/src/views/Home/content/article/components/header/SortTopic.vue
+++ b/src/views/Home/content/article/components/header/SortTopic.vue
@@ -128,10 +128,8 @@ const isSortField = () => {
   font-size: 14px;
   color: var(--kungalgame-font-color-3);
   text-decoration: none;
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  grid-template-rows: repeat(1, minmax(0, 1fr));
-  place-items: center;
+  display: flex;
+  justify-content: space-around;
 }
 /* 单个二级菜单 hover */
 .sort-item:hover {
@@ -178,4 +176,17 @@ const isSortField = () => {
     color: var(--kungalgame-red-4);
   }
 }
+
+@media (max-width: 700px) {
+  .sort-item {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    span {
+      &:nth-child(1) {
+        display: none;
+      }
+    }
+  }
+}
 </style>