add rank btn

src/app.js

@@ -124,7 +124,7 @@ class App{
             <span class="title">统计</span>
             <ul id="total"></ul>
             <span style="padding:0.25rem; margin: 0.5rem 0; border: none; background: #ccc;"></span>
-            <span class="title">成就</span>
+            <span class="title">成就<button id="rank">排行榜</button></span>
             <ul id="achievements"></ul>
         `)
 
@@ -132,6 +132,9 @@ class App{
             .find('#specialthanks')
             .click(()=>this.switch('index'));
 
+        achievementPage
+            .find('#rank')
+            .click(()=>this.hint('别卷了，没有排行榜'));
         // Talent
         const talentPage = $(`
         <div id="main">

view/dark.css

@@ -135,6 +135,7 @@ body {
 }
 
 .sponsor,
+#rank,
 #specialthanks,
 #achievement {
   position: fixed;
@@ -164,6 +165,13 @@ body {
   padding: 0.5rem;
 }
 
+#rank {
+  position: absolute;
+  top: 50%;
+  right: 1.5rem;
+  transform: translateY(-50%);
+}
+
 #spthx {
   position: fixed;
   display: grid;
@@ -221,6 +229,7 @@ body {
 
 .title {
   color: white;
+  position: relative;
   font-size: 1.5rem;
   font-weight: 700;
   padding: 1rem;

view/light.css

@@ -134,6 +134,7 @@ body {
 }
 
 .sponsor,
+#rank,
 #specialthanks,
 #achievement {
   position: fixed;
@@ -163,6 +164,13 @@ body {
   padding: 0.5rem;
 }
 
+#rank {
+  position: absolute;
+  top: 50%;
+  right: 1.5rem;
+  transform: translateY(-50%);
+}
+
 #spthx {
   position: fixed;
   display: grid;
@@ -218,6 +226,7 @@ body {
 }
 
 .title {
+  position: relative;
   font-size: 1.5rem;
   font-weight: 700;
   padding: 1rem;