diff --git a/.gitignore b/.gitignore
index da8d1e2..380ea7b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,2 +1,4 @@
 
 .vscode/settings.json
+
+util_*.py
\ No newline at end of file
diff --git a/credits.json b/credits.json
index eee70b2..e8ce319 100644
--- a/credits.json
+++ b/credits.json
@@ -1,96 +1,96 @@
 {
-    "contributors": [
-        {
-            "username": "duiqt",
-            "name": "Phúc Duy",
-            "thing": "Main Dev",
-            "socialmedia": {
-                "github": "duiqt"
-            },
-            "icon": "https://avatars.githubusercontent.com/u/90624125?v=4"
-        },
-        {
-            "username": "fred913",
-            "name": "Sheng Fan",
-            "thing": "Main Dev",
-            "socialmedia": {
-                "github": "fred913",
-                "bilibili": 496636524
-            },
-            "icon": "https://avatars.githubusercontent.com/u/41846047?v=4"
-        },
-        {
-            "username": "PencilCore",
-            "thing": "Code Contributor",
-            "socialmedia": {
-                "github": "PencilCore"
-            },
-            "icon": "https://avatars.githubusercontent.com/u/62322900?v=4"
-        },
-        {
-            "username": "risbi0",
-            "thing": "Code Contributor",
-            "socialmedia": {
-                "github": "risbi0"
-            },
-            "icon": "https://avatars.githubusercontent.com/u/81689588?v=4"
-        },
-        {
-            "username": "moepoi",
-            "thing": "Code Contributor",
-            "socialmedia": {
-                "github": "moepoi"
-            },
-            "icon": "https://avatars.githubusercontent.com/u/29736957?v=4"
-        },
-        {
-            "username": "rikarani",
-            "thing": "Code Contributor",
-            "socialmedia": {
-                "github": "rikarani"
-            },
-            "icon": "https://avatars.githubusercontent.com/u/46773591?v=4"
-        },
-        {
-            "username": "joulev",
-            "thing": "Code Contributor",
-            "socialmedia": {
-                "github": "joulev"
-            },
-            "icon": "https://avatars.githubusercontent.com/u/44609036?v=4"
-        },
-        {
-            "username": "RafadanaM",
-            "thing": "Code Contributor",
-            "socialmedia": {
-                "github": "RafadanaM"
-            },
-            "icon": "https://avatars.githubusercontent.com/u/7974643?v=4"
-        },
-        {
-            "username": "vgwik",
-            "thing": "Localization Contributor",
-            "socialmedia": {
-                "github": "vgwik",
-                "bilibili": 38120922
-            },
-            "icon": "https://avatars.githubusercontent.com/u/52212950?v=4"
-        },
-        {
-            "username": "提灯书梦",
-            "thing": "Korean Translation",
-            "socialmedia": {
-                "bilibili": 6318620
-            },
-            "icon": "https://i2.hdslb.com/bfs/face/d3f6572157f3c51497cff1d58dd925632477faf5.jpg@240w_240h_1c_1s_!web-avatar-space-header.webp"
-        },
-        {
-            "username": "二次元のリア充",
-            "thing": "Japanese Translation",
-            "socialmedia": {
-                "bilibili": 7885894
-            },
-            "icon": "https://i1.hdslb.com/bfs/face/5772af8e0ad4067323e1f082f887a220b92dbf71.jpg@240w_240h_1c_1s_!web-avatar-space-header.webp"
-        }
-    ]
+  "contributors": [
+    {
+      "username": "duiqt",
+      "name": "Ph\u00fac Duy",
+      "thing": "Main Dev",
+      "socialmedia": {
+        "github": "duiqt"
+      },
+      "icon": "credits/images/93a7f481e5a39e10c47c196afacf13a68e2037f0.jpg"
+    },
+    {
+      "username": "fred913",
+      "name": "Sheng Fan",
+      "thing": "Main Dev",
+      "socialmedia": {
+        "github": "fred913",
+        "bilibili": 496636524
+      },
+      "icon": "credits/images/5f6a01f9a9a75d6db4cda0a6af0f64668035c408.jpg"
+    },
+    {
+      "username": "PencilCore",
+      "thing": "Code Contributor",
+      "socialmedia": {
+        "github": "PencilCore"
+      },
+      "icon": "credits/images/154915e50f36cd01283127ff1edd4b77d679c3a1.jpg"
+    },
+    {
+      "username": "risbi0",
+      "thing": "Code Contributor",
+      "socialmedia": {
+        "github": "risbi0"
+      },
+      "icon": "credits/images/71c4726c2704ca7397a23ff8dfee50eb460622e7.jpg"
+    },
+    {
+      "username": "moepoi",
+      "thing": "Code Contributor",
+      "socialmedia": {
+        "github": "moepoi"
+      },
+      "icon": "credits/images/785c87bcadbdd8a8b55278746561ff835ceb9565.jpg"
+    },
+    {
+      "username": "rikarani",
+      "thing": "Code Contributor",
+      "socialmedia": {
+        "github": "rikarani"
+      },
+      "icon": "credits/images/6387ed3947711ace1d350b806990a9640eb52757.jpg"
+    },
+    {
+      "username": "joulev",
+      "thing": "Code Contributor",
+      "socialmedia": {
+        "github": "joulev"
+      },
+      "icon": "credits/images/05f43cf0c42c4b55db91a1f258beeb1b249d747e.jpg"
+    },
+    {
+      "username": "RafadanaM",
+      "thing": "Code Contributor",
+      "socialmedia": {
+        "github": "RafadanaM"
+      },
+      "icon": "credits/images/9882e0e4562cac10e2f1e4f3021ebbdacb299210.jpg"
+    },
+    {
+      "username": "vgwik",
+      "thing": "Localization Contributor",
+      "socialmedia": {
+        "github": "vgwik",
+        "bilibili": 38120922
+      },
+      "icon": "credits/images/1324cb8ee772fe67f44ccc67ee002bdca3242064.jpg"
+    },
+    {
+      "username": "\u63d0\u706f\u4e66\u68a6",
+      "thing": "Korean Translation",
+      "socialmedia": {
+        "bilibili": 6318620
+      },
+      "icon": "credits/images/cee4acdeb90c016909e531ecbdfab2fe3eb6f65f.jpg"
+    },
+    {
+      "username": "\u4e8c\u6b21\u5143\u306e\u30ea\u30a2\u5145",
+      "thing": "Japanese Translation",
+      "socialmedia": {
+        "bilibili": 7885894
+      },
+      "icon": "credits/images/68f10e69275761caab0892eea60589997bffa6b5.jpg"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/credits.rawiconurl.json b/credits.rawiconurl.json
new file mode 100644
index 0000000..7c9608f
--- /dev/null
+++ b/credits.rawiconurl.json
@@ -0,0 +1,96 @@
+{
+    "contributors": [
+        {
+            "username": "duiqt",
+            "name": "Phúc Duy",
+            "thing": "Main Dev",
+            "socialmedia": {
+                "github": "duiqt"
+            },
+            "icon": "https://avatars.githubusercontent.com/u/90624125?v=4"
+        },
+        {
+            "username": "fred913",
+            "name": "Sheng Fan",
+            "thing": "Main Dev",
+            "socialmedia": {
+                "github": "fred913",
+                "bilibili": 496636524
+            },
+            "icon": "https://avatars.githubusercontent.com/u/41846047?v=4"
+        },
+        {
+            "username": "PencilCore",
+            "thing": "Code Contributor",
+            "socialmedia": {
+                "github": "PencilCore"
+            },
+            "icon": "https://avatars.githubusercontent.com/u/62322900?v=4"
+        },
+        {
+            "username": "risbi0",
+            "thing": "Code Contributor",
+            "socialmedia": {
+                "github": "risbi0"
+            },
+            "icon": "https://avatars.githubusercontent.com/u/81689588?v=4"
+        },
+        {
+            "username": "moepoi",
+            "thing": "Code Contributor",
+            "socialmedia": {
+                "github": "moepoi"
+            },
+            "icon": "https://avatars.githubusercontent.com/u/29736957?v=4"
+        },
+        {
+            "username": "rikarani",
+            "thing": "Code Contributor",
+            "socialmedia": {
+                "github": "rikarani"
+            },
+            "icon": "https://avatars.githubusercontent.com/u/46773591?v=4"
+        },
+        {
+            "username": "joulev",
+            "thing": "Code Contributor",
+            "socialmedia": {
+                "github": "joulev"
+            },
+            "icon": "https://avatars.githubusercontent.com/u/44609036?v=4"
+        },
+        {
+            "username": "RafadanaM",
+            "thing": "Code Contributor",
+            "socialmedia": {
+                "github": "RafadanaM"
+            },
+            "icon": "https://avatars.githubusercontent.com/u/7974643?v=4"
+        },
+        {
+            "username": "vgwik",
+            "thing": "Localization Contributor",
+            "socialmedia": {
+                "github": "vgwik",
+                "bilibili": 38120922
+            },
+            "icon": "https://avatars.githubusercontent.com/u/52212950?v=4"
+        },
+        {
+            "username": "提灯书梦",
+            "thing": "Korean Translation",
+            "socialmedia": {
+                "bilibili": 6318620
+            },
+            "icon": "https://i2.hdslb.com/bfs/face/d3f6572157f3c51497cff1d58dd925632477faf5.jpg"
+        },
+        {
+            "username": "二次元のリア充",
+            "thing": "Japanese Translation",
+            "socialmedia": {
+                "bilibili": 7885894
+            },
+            "icon": "https://i1.hdslb.com/bfs/face/5772af8e0ad4067323e1f082f887a220b92dbf71.jpg"
+        }
+    ]
+}
\ No newline at end of file
diff --git a/credits/images/05f43cf0c42c4b55db91a1f258beeb1b249d747e.jpg b/credits/images/05f43cf0c42c4b55db91a1f258beeb1b249d747e.jpg
new file mode 100644
index 0000000..e227b6b
Binary files /dev/null and b/credits/images/05f43cf0c42c4b55db91a1f258beeb1b249d747e.jpg differ
diff --git a/credits/images/1324cb8ee772fe67f44ccc67ee002bdca3242064.jpg b/credits/images/1324cb8ee772fe67f44ccc67ee002bdca3242064.jpg
new file mode 100644
index 0000000..f25ba08
Binary files /dev/null and b/credits/images/1324cb8ee772fe67f44ccc67ee002bdca3242064.jpg differ
diff --git a/credits/images/154915e50f36cd01283127ff1edd4b77d679c3a1.jpg b/credits/images/154915e50f36cd01283127ff1edd4b77d679c3a1.jpg
new file mode 100644
index 0000000..6f21a19
Binary files /dev/null and b/credits/images/154915e50f36cd01283127ff1edd4b77d679c3a1.jpg differ
diff --git a/credits/images/5f6a01f9a9a75d6db4cda0a6af0f64668035c408.jpg b/credits/images/5f6a01f9a9a75d6db4cda0a6af0f64668035c408.jpg
new file mode 100644
index 0000000..941ce71
Binary files /dev/null and b/credits/images/5f6a01f9a9a75d6db4cda0a6af0f64668035c408.jpg differ
diff --git a/credits/images/6387ed3947711ace1d350b806990a9640eb52757.jpg b/credits/images/6387ed3947711ace1d350b806990a9640eb52757.jpg
new file mode 100644
index 0000000..b5fc6c4
Binary files /dev/null and b/credits/images/6387ed3947711ace1d350b806990a9640eb52757.jpg differ
diff --git a/credits/images/68f10e69275761caab0892eea60589997bffa6b5.jpg b/credits/images/68f10e69275761caab0892eea60589997bffa6b5.jpg
new file mode 100644
index 0000000..3961b99
Binary files /dev/null and b/credits/images/68f10e69275761caab0892eea60589997bffa6b5.jpg differ
diff --git a/credits/images/71c4726c2704ca7397a23ff8dfee50eb460622e7.jpg b/credits/images/71c4726c2704ca7397a23ff8dfee50eb460622e7.jpg
new file mode 100644
index 0000000..221dc98
Binary files /dev/null and b/credits/images/71c4726c2704ca7397a23ff8dfee50eb460622e7.jpg differ
diff --git a/credits/images/785c87bcadbdd8a8b55278746561ff835ceb9565.jpg b/credits/images/785c87bcadbdd8a8b55278746561ff835ceb9565.jpg
new file mode 100644
index 0000000..fb1f2e7
Binary files /dev/null and b/credits/images/785c87bcadbdd8a8b55278746561ff835ceb9565.jpg differ
diff --git a/credits/images/93a7f481e5a39e10c47c196afacf13a68e2037f0.jpg b/credits/images/93a7f481e5a39e10c47c196afacf13a68e2037f0.jpg
new file mode 100644
index 0000000..3a44a90
Binary files /dev/null and b/credits/images/93a7f481e5a39e10c47c196afacf13a68e2037f0.jpg differ
diff --git a/credits/images/9882e0e4562cac10e2f1e4f3021ebbdacb299210.jpg b/credits/images/9882e0e4562cac10e2f1e4f3021ebbdacb299210.jpg
new file mode 100644
index 0000000..2a6e21b
Binary files /dev/null and b/credits/images/9882e0e4562cac10e2f1e4f3021ebbdacb299210.jpg differ
diff --git a/credits/images/cee4acdeb90c016909e531ecbdfab2fe3eb6f65f.jpg b/credits/images/cee4acdeb90c016909e531ecbdfab2fe3eb6f65f.jpg
new file mode 100644
index 0000000..ca17e88
Binary files /dev/null and b/credits/images/cee4acdeb90c016909e531ecbdfab2fe3eb6f65f.jpg differ
diff --git a/index.html b/index.html
index 3f927b6..2f9d57b 100644
--- a/index.html
+++ b/index.html
@@ -8,83 +8,85 @@
     <link rel="stylesheet" href="style.css" type="text/css" />
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet" />
-    <script src="https://code.iconify.design/iconify-icon/1.0.2/iconify-icon.min.js"></script>
+    <link rel="stylesheet" href="https://unpkg.com/ionicons@4.5.10-0/dist/css/ionicons.min.css">
+    <link rel="stylesheet" href="https://unpkg.com/mdui@1.0.2/dist/css/mdui.min.css" />
+    <!-- <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet" /> -->
+    <!-- <script src="https://code.iconify.design/iconify-icon/1.0.2/iconify-icon.min.js"></script> -->
     <link href="img/favicon.ico" rel="shortcut icon">
 </head>
 
 <body>
-    <main class="wrapper">
-        <div id="wrapper-background-filter"></div>
-        <div id="wrapper-background"></div>
-        <img src="img/hertaa1.gif" class="preload" />
-        <img src="img/hertaa2.gif" class="preload" />
-        <div id="content">
-            <div id="title-container">
-                <h1 id="page-title">Welcome to herta kuru</h1>
-                <img id="title-img" alt="img of herta" src="img/favicon.ico">
-            </div>
-            <select id="language-selector">
-                <option value="en" selected>English</option>
-                <option value="cn">中文</option>
-                <option value="ja">日本語</option>
-                <option value="kr">한국어</option>
-            </select>
+    <div class="mdui-container-fluid">
+        <main class="wrapper">
+            <div id="wrapper-background-filter"></div>
+            <div id="wrapper-background"></div>
+            <img src="img/hertaa1.gif" class="preload" />
+            <img src="img/hertaa2.gif" class="preload" />
+            <div id="content">
+                <div id="title-container">
+                    <h1 id="page-title">Welcome to herta kuru</h1>
+                    <img id="title-img" alt="img of herta" src="img/favicon.ico">
+                </div>
+                <select id="language-selector">
+                    <option value="en" selected>English</option>
+                    <option value="cn">中文</option>
+                    <option value="ja">日本語</option>
+                    <option value="kr">한국어</option>
+                </select>
 
 
-            <hr id="subtitle-seperator" />
-            <h2 id="page-descriptions">
-                The website for Herta, the <del>annoying</del> cutest genius Honkai:
-                Star Rail character out there.
-            </h2>
-            <div id="counter-container">
-                <h3 id="counter-descriptions">The kuru~ has been squished</h3>
-                <br />
-                <br />
-                <p id="global-counter">0</p>
-                <p id="local-counter">0</p>
-                <br />
-                <br />
-                <p id="counter-unit">times</p>
-                <button id="counter-button">
-                    Squish the kuru~!
-                </button>
-            </div>
-            <hr />
-            <div id="grid">
-                <noscript>Your browser does not support JavaScript or JavaScript has been
-                    disabled.<br />This website relies on JavaScript, so please enable it
-                    or use another browser.</noscript>
+                <hr id="subtitle-seperator" />
+                <h2 id="page-descriptions">
+                    The website for Herta, the <del>annoying</del> cutest genius Honkai:
+                    Star Rail character out there.
+                </h2>
+                <div id="counter-container">
+                    <h3 id="counter-descriptions">The kuru~ has been squished</h3>
+                    <br />
+                    <br />
+                    <p id="global-counter">0</p>
+                    <p id="local-counter">0</p>
+                    <br />
+                    <br />
+                    <p id="counter-unit">times</p>
+                    <button id="counter-button">
+                        Squish the kuru~!
+                    </button>
+                </div>
+                <hr />
+                <div id="grid">
+                    <noscript>Your browser does not support JavaScript or JavaScript has been
+                        disabled.<br />This website relies on JavaScript, so please enable it
+                        or use another browser.</noscript>
+                </div>
             </div>
-        </div>
-    </main>
-    <div id="footer">
-        <img id="herta-card" loading="lazy" src="img/card.jpg" alt="" />
-        <div id="footer-text">
-            <p id="credits-gif">Herta gif made by</p>
-            <p>
-                <a href="https://twitter.com/Seseren_kr" target="_blank"><iconify-icon icon="mdi:twitter"
-                        id="twitter-footer-icon" class="footer-icon"></iconify-icon><span
-                        class="footer-icon-text">@Seseren_kr</span></a>
-            </p>
-            <p id="footer-repository-text">
-                You can check out the GitHub repository here:
-            </p>
-            <p>
-                <a href="https://github.com/duiqt/herta.kuru" target="_blank"><iconify-icon icon="mdi:github"
-                        id="github-footer-icon" class="footer-icon"></iconify-icon><span class="footer-icon-text"
-                        id="footer-repository-text-2">herta_kuru repo</span></a>
-            </p>
-            <p>
-                <a href="#" onclick="show_credits()" target="_blank"><span class="footer-icon-text"
-                        id="footer-show-credits-text">Show Credits</span></a>
-            </p>
-            <div id="credits-part">
-                
+        </main>
+        <div id="footer">
+            <img id="herta-card" loading="lazy" src="img/card_en.jpg" class="img-autocdn" alt="" />
+            <div id="footer-text">
+                <div class="mdui-list"><a href="https://twitter.com/Seseren_kr" target="_blank"
+                        class="mdui-list-item mdui-ripple">
+                        <i class="mdui-icon mdui-list-item-icon ion-logo-twitter mdui-text-color-light-blue"></i>
+                        <div class="mdui-list-item-content footer-icon-text about-link">Herta GIF - @Seseren_kr</div>
+                    </a><a href="https://github.com/duiqt/herta.kuru" target="_blank"
+                        class="mdui-list-item mdui-ripple">
+                        <i class="mdui-icon mdui-list-item-icon ion-logo-github mdui-text-color-black-icon"></i>
+                        <div class="mdui-list-item-content footer-icon-text about-link">GitHub Repo - duiqt/herta_kuru
+                        </div>
+                    </a>
+                </div>
+                <div class="mdui-typo">
+                    <!-- <button class="mdui-btn mdui-btn-raised mdui-ripple mdui-btn-block" onclick="show_credits();"
+                        id="footer-show-credits-text">Show Credits
+                    </button> -->
+                    <div id="access-via-tip-parent"></div>
+                </div>
             </div>
         </div>
     </div>
+    <script src="https://unpkg.com/mdui@1.0.2/dist/js/mdui.min.js"></script>
     <script src="script.js" async></script>
+
     <!-- Google tag (gtag.js) -->
     <script async src="https://www.googletagmanager.com/gtag/js?id=G-T303QPC9L9"></script>
     <script>
diff --git a/script.js b/script.js
index 8e1e13e..9076999 100644
--- a/script.js
+++ b/script.js
@@ -22,8 +22,7 @@ const LANGUAGES = {
             "counter-unit": "times",
             "counter-button": ["Squish the kuru~!", "Kuru kuru~!"],
             "credits-gif": "Herta gif made by",
-            "footer-repository-text": "You can check out the GitHub repository here:",
-            "footer-repository-text-2": "herta_kuru repo",
+            "footer-repository-text": "GitHub Repo",
             "access-via-pages": "You're currently accessing via GitHub Pages. For users in China (Mainland) or some other regions, click <a href='https://herta.ft2.ltd/'>here to access the mirror on Netlify</a>. ",
             "access-via-mirror": "Congratulations! You are using a mirror site, which should speed up access within China (Mainland) and some regions. Click here to <a href='https://duiqt.github.io/herta_kuru/'>visit the source site on GitHub Pages</a>.",
             "footer-show-credits-text": "Show Credits"
@@ -44,8 +43,7 @@ const LANGUAGES = {
             "counter-unit": ["次", "次圈圈"],
             "counter-button": ["转圈圈~", "咕噜噜！"],
             "credits-gif": "黑塔GIF作者：",
-            "footer-repository-text": "源代码在此：",
-            "footer-repository-text-2": "herta_kuru 仓库",
+            "footer-repository-text": "GitHub 仓库",
             "access-via-pages": "您目前是通过 GitHub Pages 访问。对于中国大陆或其他一些地区的用户，请<a href='https://herta.ft2.ltd/'>单击此处访问 Netlify 上的镜像</a>。",
             "access-via-mirror": "恭喜！你正在使用镜像站，这应当会加速在中国大陆及部分地区境内的访问。点此<a href='https://duiqt.github.io/herta_kuru/'>访问 GitHub Pages 上的源站</a>。",
             "footer-show-credits-text": "查看感谢页"
@@ -68,7 +66,6 @@ const LANGUAGES = {
             "counter-button": "クル クル~!",
             "credits-gif": "GIF作成者は",
             "footer-repository-text": "こちらはこのページGitHubリポジトリ:",
-            "footer-repository-text-2": "herta_kuru リポジトリ",
             "access-via-pages": "今アクセスしてるページはぎGitHubです。中国大陸まだは他の地域のユーサーはNetlifyのミラーに入るために、<a href='https://herta.ft2.ltd/'>ここにクリックして</a>ください。",
             "access-via-mirror": "おめでとうございます！今はもうミラーサイトを使っています、中国大陸まだは他の地域のアクセス速度が速くなります。サイトのソースを見たいなら、<a href='https://duiqt.github.io/herta_kuru/'>ここにクリックして</a>、GitHubページで見てください。",
             "footer-show-credits-text": "Show Credits"
@@ -91,7 +88,6 @@ const LANGUAGES = {
             "counter-button": "빙글 빙글~!",
             "credits-gif": "gif의 제작자입니다",
             "footer-repository-text": "여기 github 리 포지 토리가 있습니다:",
-            "footer-repository-text-2": "herta_kuru 리 포지 토리",
             "access-via-pages": "당신은 GitHub를 통해 액세스하고 있습니다. 중국 또는 기타 지역 사용자의 경우 여기를 <a href='https://herta.ft2.ltd/'>클릭하여 Netlify의 미러 액세스하십시오</a>. ",
             "access-via-mirror": "축하합니다. 당신은 미러 웹 사이트를 통해 액세스하고 있습니다, 이렇게 하면 중국 및 일부 다른 지역에서의 액세스 속도가 빨라집니다. 여기를 <a href='https://duiqt.github.io/herta_kuru/'> 클릭하여 GitHub의 소스 페이지에 액세스하십시오</a>. ",
             "footer-show-credits-text": "Show Credits"
@@ -354,20 +350,22 @@ function refreshDynamicTexts() {
 
 // CN mirror check
 if (location.hostname == "herta.ft2.ltd" || location.hostname == "hertakuru.netlify.app") {
-    document.getElementById("footer").innerHTML += "<p id='access-via-mirror'>Congratulations! You are using a mirror site, which should speed up access within China (Mainland) and some regions. Click here to <a href='https://duiqt.github.io/herta_kuru/'>visit the source site on GitHub Pages</a>.</p>";
+    document.getElementById("access-via-tip-parent").innerHTML = "<p id='access-via-mirror'>Congratulations! You are using a mirror site, which should speed up access within China (Mainland) and some regions. Click here to <a href='https://duiqt.github.io/herta_kuru/'>visit the source site on GitHub Pages</a>.</p>";
     multiLangMutation();
 } else {
-    document.getElementById("footer").innerHTML += "<p id='access-via-pages'>You're currently accessing via GitHub Pages. For users in China (Mainland) or some regions, click <a href='https://duiqt.github.io/herta_kuru/'>here to access the mirror on Netlify</a>.</p>";
+    document.getElementById("access-via-tip-parent").innerHTML = "<p id='access-via-pages'>You're currently accessing via GitHub Pages. For users in China (Mainland) or some regions, click <a href='https://duiqt.github.io/herta_kuru/'>here to access the mirror on Netlify</a>.</p>";
     multiLangMutation();
 }
 
-document.getElementById("credits-part").style.display = "none";
+// document.getElementById("credits-dialog").style.display = "none";
 fetch("credits.json").then(response => response.json()).then((data) => {
     for (let i = 0; i < data.contributors.length; i++) {
         var current = data.contributors[i];
-        document.getElementById("credits-part").innerHTML += `<div class="credit"><img src="${current.icon}" class="credits-head-img" /><div class="credit-usr-info"><p></p></div></div>`;
+        document.getElementById("credits-dialog").innerHTML += `<div class="credit"><img src="${current.icon}" class="credits-head-img" /><div class="credit-usr-info"><p></p></div></div>`;
     }
 });
 function show_credits() {
+    let myDialog = document.getElementById('credits-dialog');
 
+    myDialog.showModal();
 }
diff --git a/style.css b/style.css
index ca9af65..53cb3ed 100644
--- a/style.css
+++ b/style.css
@@ -131,6 +131,7 @@ hr {
 #global-counter {
     color: #574f84;
     font-size: 2em;
+    line-height: 38px;
 }
 
 #local-counter {
@@ -344,4 +345,8 @@ hr {
     width: 80px;
     height: 80px;
     border-radius: 50%;
+}
+
+.about-link {
+    color: black !important;
 }
\ No newline at end of file