From e8da6e555d9523e360277110be9fcba0791e998d Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Sun, 4 Jul 2021 18:39:16 +0700
Subject: [PATCH 001/278] add: layout for admin panel

---
 blueprints/admin.py               | 26 +++++++++++++++++++++++++-
 templates/admin/badges.html       | 10 ++++++++++
 templates/admin/base.html         | 20 +++++++++++++++++---
 templates/admin/log.html          | 10 ++++++++++
 templates/admin/privilege.html    | 10 ++++++++++
 templates/admin/recentplay.html   | 10 ++++++++++
 templates/admin/reports.html      | 10 ++++++++++
 templates/admin/restrictions.html | 10 ++++++++++
 8 files changed, 102 insertions(+), 4 deletions(-)
 create mode 100644 templates/admin/badges.html
 create mode 100644 templates/admin/log.html
 create mode 100644 templates/admin/privilege.html
 create mode 100644 templates/admin/recentplay.html
 create mode 100644 templates/admin/reports.html
 create mode 100644 templates/admin/restrictions.html

diff --git a/blueprints/admin.py b/blueprints/admin.py
index e5409a4a..3fcc6a75 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -44,5 +44,29 @@ async def home():
     return await render_template(
         'admin/home.html', dashdata=dash_data,
         recentusers=recent_users, recentscores=recent_scores,
-        datetime=datetime, timeago=timeago
+        datetime=datetime, timeago=timeago, header='Dashboard', isdashboard=True
     )
+
+@admin.route('/reports')
+async def reports():
+    return await render_template('admin/reports.html', header='Reports')
+
+@admin.route('/recentplay')
+async def recentplay():
+    return await render_template('admin/recentplay.html', header='Recent Play')
+
+@admin.route('/restrictions')
+async def restrictions():
+    return await render_template('admin/restrictions.html', header='Restrictions')
+
+@admin.route('/privilege')
+async def privilege():
+    return await render_template('admin/privilege.html', header='Privilege Groups')
+
+@admin.route('/badges')
+async def badges():
+    return await render_template('admin/badges.html', header='Badges')
+
+@admin.route('/logs')
+async def logs():
+    return await render_template('admin/log.html', header='Admin logs')
\ No newline at end of file
diff --git a/templates/admin/badges.html b/templates/admin/badges.html
new file mode 100644
index 00000000..c50160c5
--- /dev/null
+++ b/templates/admin/badges.html
@@ -0,0 +1,10 @@
+<!-- For handling out badges? I think? -->
+{% extends 'admin/base.html' %}
+{% block title %} Badges {% endblock %}
+{% block header %} 
+
+{% endblock%}
+
+{% block content %}
+
+{% endblock %}
\ No newline at end of file
diff --git a/templates/admin/base.html b/templates/admin/base.html
index 7c4048d3..7da4a161 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -135,8 +135,20 @@
           <div id="style-3" class="sidebar-wrapper">
             <div class="logo"><a class="simple-text logo-normal">{{ appName() }} Admin Panel</a></div>
             <ul class="nav">
-              <li class="nav-item"><a class="nav-link"><span class="icon"><i class="fa fa-home"></i></span> <span
-                    class="name">Dashboard</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin"><span class="icon"><i class="fa fa-home"></i></span>
+                <span class="name">Dashboard</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/reports"><span class="icon"><i class="fa fa-book"></i></span> 
+                <span class="name">Reports</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/recentplay"><span class="icon"><i class="fa fa-video-camera"></i></span>
+                <span class="name">Recent Play</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/restrictions"><span class="icon"><i class="fa fa-warning"></i></span>
+                <span class="name">Restrictions</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/privilege"><span class="icon"><i class="fa fa-users"></i></span>
+                <span class="name">Privilege Groups</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/badges"><span class="icon"><i class="fa fa-bookmark"></i></span>
+                <span class="name">Badges</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/logs"><span class="icon"><i class="fa fa-address-book"></i></span>
+                <span class="name">Admin logs</span></a></li>
             </ul>
           </div>
         </div>
@@ -149,8 +161,10 @@
                 onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
             </div>
             <div class="column is-paddingless flex-vcenter">
-              <h2 class="section-title">Dashboard</h2>
+              <h2 class="section-title">{{ header }}</h2>
+              {% if isdashboard %}
               <p class="section-lead">Welcome to {{ appName() }} admin panel!</p>
+              {% endif %}
             </div>
           </div>
           <section class="section">
diff --git a/templates/admin/log.html b/templates/admin/log.html
new file mode 100644
index 00000000..b634cc16
--- /dev/null
+++ b/templates/admin/log.html
@@ -0,0 +1,10 @@
+<!-- All admin logs will appered here -->
+{% extends 'admin/base.html' %}
+{% block title %} Logs {% endblock %}
+{% block header %} 
+
+{% endblock%}
+
+{% block content %}
+
+{% endblock %}
\ No newline at end of file
diff --git a/templates/admin/privilege.html b/templates/admin/privilege.html
new file mode 100644
index 00000000..c33ce328
--- /dev/null
+++ b/templates/admin/privilege.html
@@ -0,0 +1,10 @@
+<!-- For giving privilege -->
+{% extends 'admin/base.html' %}
+{% block title %} Privileges {% endblock %}
+{% block header %} 
+
+{% endblock%}
+
+{% block content %}
+
+{% endblock %}
\ No newline at end of file
diff --git a/templates/admin/recentplay.html b/templates/admin/recentplay.html
new file mode 100644
index 00000000..2a235a36
--- /dev/null
+++ b/templates/admin/recentplay.html
@@ -0,0 +1,10 @@
+<!-- All recent play will be shown in a list here -->
+{% extends 'admin/base.html' %}
+{% block title %} Recent {% endblock %}
+{% block header %} 
+
+{% endblock%}
+
+{% block content %}
+
+{% endblock %}
\ No newline at end of file
diff --git a/templates/admin/reports.html b/templates/admin/reports.html
new file mode 100644
index 00000000..147aa4ba
--- /dev/null
+++ b/templates/admin/reports.html
@@ -0,0 +1,10 @@
+<!-- For report submission -->
+{% extends 'admin/base.html' %}
+{% block title %} Reports {% endblock %}
+{% block header %} 
+
+{% endblock%}
+
+{% block content %}
+
+{% endblock %}
\ No newline at end of file
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
new file mode 100644
index 00000000..e894268a
--- /dev/null
+++ b/templates/admin/restrictions.html
@@ -0,0 +1,10 @@
+<!-- For banning players -->
+{% extends 'admin/base.html' %}
+{% block title %} Restrictions {% endblock %}
+{% block header %} 
+
+{% endblock%}
+
+{% block content %}
+
+{% endblock %}
\ No newline at end of file

From 2e89dd0bd4ba89b25f763254b81334579442a61a Mon Sep 17 00:00:00 2001
From: Pavaresorn Malai <61514399+Varkaria@users.noreply.github.com>
Date: Sun, 4 Jul 2021 18:59:53 +0700
Subject: [PATCH 002/278] change: new look in admin panel

---
 templates/admin/base.html | 223 ++++++++++++--------------------------
 1 file changed, 71 insertions(+), 152 deletions(-)

diff --git a/templates/admin/base.html b/templates/admin/base.html
index 7da4a161..f28b203f 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -19,177 +19,96 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <!-- jquery -->
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.min.js"
-    integrity="sha512-/DXTXr6nQodMUiq+IUJYCt2PPOUjrHJ9wFrqpJ3XkgPNOZVfMok7cRw6CSxyCQxXn6ozlESsSh1/sMCTF1rL/g=="
-    crossorigin="anonymous"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.min.js"></script>
 
-  <!-- bulma -->
-  <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/bulma.min-v6.css" />
-
-  <!-- font awesome -->
-  <script src="https://kit.fontawesome.com/e5971878b8.js" crossorigin="anonymous"></script>
-
-  <!-- custom style -->
-  <link rel="stylesheet" href="/static/css/style.css">
-  <link rel="stylesheet" href="/static/css/pages/admin/style.css">
+  <!-- framework -->
+  <link rel="stylesheet" href="https://unpkg.com/@tabler/core@latest/dist/css/tabler.min.css">
+  <script src="https://unpkg.com/@tabler/core@latest/dist/js/tabler.min.js"></script>
 
   {% block header %}
   {% endblock %}
 </head>
 
-<body>
-  <!-- header -->
-  <nav id="navbar" class="navbar is-primary">
-    <div class="navbar-brand">
-      <a class="navbar-item navbar-logo" href="/home">
-        {{ appName() }}
-      </a>
-
-      <a role="button" class="navbar-burger" id="navbar-burger" onclick="togglenavbar()">
-        <span aria-hidden="true"></span>
-        <span aria-hidden="true"></span>
-        <span aria-hidden="true"></span>
-      </a>
-    </div>
-
-    <div id="navbar" class="navbar-menu">
-      <div class="navbar-start">
-        <a class="navbar-item" href="/home">
-          Home
-        </a>
-
-        <a class="navbar-item" href="/lb">
-          Leaderboards
-        </a>
-
-        <div class="navbar-item has-dropdown is-hoverable">
-          <a class="navbar-link">
-            Information
-          </a>
-          <div class="navbar-dropdown">
-            <a class="navbar-item" href="/docs">
-              Documentation
-            </a>
-            <a class="navbar-item" href="/rules">
-              Rules
-            </a>
-            <a class="navbar-item" href="/discord">
-              Discord
-            </a>
-            <hr class="navbar-divider">
-            <a class="navbar-item">
-              Report an issue
-            </a>
-          </div>
-        </div>
-
-        {% if session.authenticated and session.user_data['is_staff'] %}
-        <a class="navbar-item" href="/admin">
-          Admin
-        </a>
-        {% endif %}
-      </div>
-
-      <div class="navbar-end">
-        {% if session.authenticated %}
-        <div class="navbar-item has-dropdown is-hoverable">
-          <a class="navbar-link">
-            {{ session.user_data['name'] }}
-          </a>
-          <div class="navbar-dropdown">
-            <a class="navbar-item" href="/u/{{ session.user_data['id'] }}">
-              Profile
-            </a>
-            <a class="navbar-item" href="/settings">
-              Settings
+<body class="antialiased">
+    <div class="wrapper">
+      <header class="navbar navbar-expand-md navbar-dark d-print-none">
+        <div class="container-xl">
+          <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbar-menu">
+            <span class="navbar-toggler-icon"></span>
+          </button>
+          <h1 class="navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-md-3">
+            <a href=".">
+              {{ appName() }}
             </a>
+          </h1>
+          <div class="navbar-nav flex-row order-md-last">
           </div>
         </div>
-        <div class="navbar-item">
-          <a class="button is-light" href="/logout">
-            Logout
-          </a>
-        </div>
-        {% else %}
-        <div class="navbar-item">
-          <div class="buttons">
-            <a class="button is-primary" href="/register">
-              <strong>Sign up</strong>
-            </a>
-            <a class="button is-light" href="/login">
-              Log in
-            </a>
-          </div>
-        </div>
-        {% endif %}
-      </div>
-    </div>
-    </div>
-  </nav>
-
-  <!-- content -->
-  <div class="content admin-con">
-    <div class="columns is-marginless is-paddingless">
-      <div class="colmun">
-        <div class="sidebar">
-          <div id="style-3" class="sidebar-wrapper">
-            <div class="logo"><a class="simple-text logo-normal">{{ appName() }} Admin Panel</a></div>
-            <ul class="nav">
-              <li class="nav-item"><a class="nav-link" href="/admin"><span class="icon"><i class="fa fa-home"></i></span>
-                <span class="name">Dashboard</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/reports"><span class="icon"><i class="fa fa-book"></i></span> 
-                <span class="name">Reports</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/recentplay"><span class="icon"><i class="fa fa-video-camera"></i></span>
-                <span class="name">Recent Play</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/restrictions"><span class="icon"><i class="fa fa-warning"></i></span>
-                <span class="name">Restrictions</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/privilege"><span class="icon"><i class="fa fa-users"></i></span>
-                <span class="name">Privilege Groups</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/badges"><span class="icon"><i class="fa fa-bookmark"></i></span>
-                <span class="name">Badges</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/logs"><span class="icon"><i class="fa fa-address-book"></i></span>
-                <span class="name">Admin logs</span></a></li>
-            </ul>
+      </header>
+      <div class="navbar-expand-md">
+        <div class="collapse navbar-collapse" id="navbar-menu">
+          <div class="navbar navbar-light">
+            <div class="container-xl">
+              <ul class="navbar-nav">
+                <li class="nav-item">
+                  <a class="nav-link" href="/admin/">
+                    <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/home -->
+                      <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="5 12 3 12 12 3 21 12 19 12"></polyline><path d="M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-7"></path><path d="M9 21v-6a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v6"></path></svg>
+                    </span>
+                    <span class="nav-link-title">
+                      Home
+                    </span>
+                  </a>
+                </li>
+              </ul>
+            </div>
           </div>
         </div>
       </div>
-      <div class="column content">
-        <div class="main-content">
-          <div class="columns is-marginless">
-            <div class="column is-paddingless is-avatar">
-              <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
-                onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
-            </div>
-            <div class="column is-paddingless flex-vcenter">
-              <h2 class="section-title">{{ header }}</h2>
-              {% if isdashboard %}
-              <p class="section-lead">Welcome to {{ appName() }} admin panel!</p>
-              {% endif %}
+      <div class="page-wrapper">
+        <div class="container-xl">
+          <!-- Page title -->
+          <div class="page-header d-print-none">
+            <div class="row align-items-center">
+              <div class="col">
+                <!-- Page pre-title -->
+                <div class="page-pretitle">
+                  Overview
+                </div>
+                <h2 class="page-title">
+                  {{ header }}
+                </h2>
+              </div>
             </div>
           </div>
-          <section class="section">
+        </div>
+        <div class="page-body">
+          <div class="container-xl">
             {% block content %}
             {% endblock %}
-          </section>
+          </div>
         </div>
+        <footer class="footer footer-transparent d-print-none">
+          <div class="container">
+            <div class="row text-center align-items-center flex-row-reverse">
+              <div class="col-lg-auto ms-lg-auto">
+                <ul class="list-inline list-inline-dots mb-0">
+                </ul>
+              </div>
+              <div class="col-12 col-lg-auto mt-3 mt-lg-0">
+                <ul class="list-inline list-inline-dots mb-0">
+                  <li class="list-inline-item">
+                    Copyright © 2021
+                    <a href="." class="link-secondary">{{ appName() }}</a>.
+                    All rights reserved.
+                  </li>
+                </ul>
+              </div>
+            </div>
+          </div>
+        </footer>
       </div>
     </div>
-  </div>
-
-  <!-- footer -->
-  <footer class="footer">
-    <div class="content">
-      <span>{{ appName() }} <strong>v{{ appVersion() }}</strong></span>
-      <a class="foot-link" href="/github"><i class="fa fa-github"></i> GitHub</a>
-      <a class="foot-link" href="/discord"><i class="fab fa-discord"></i> Discord</a>
-      <a class="foot-link" href="/youtube"><i class="fab fa-youtube"></i> YouTube</a>
-      <a class="foot-link" href="/twitter"><i class="fab fa-twitter"></i> Twitter</a>
-      <a class="foot-link" href="/instagram"><i class="fab fa-instagram"></i> Instagram</a>
-    </div>
-  </footer>
-
-  <!-- main js script -->
-  <script src="/static/js/main.js" crossorigin="anonymous"></script>
 </body>
 
 </html>
\ No newline at end of file

From 4d3053e00e47c286368a85043e96bec4b7fb93ed Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Sun, 4 Jul 2021 21:18:42 +0700
Subject: [PATCH 003/278] add: Users page on admin panel

---
 blueprints/admin.py        |   4 ++
 templates/admin/users.html | 131 +++++++++++++++++++++++++++++++++++++
 2 files changed, 135 insertions(+)
 create mode 100644 templates/admin/users.html

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 3fcc6a75..07e22223 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -47,6 +47,10 @@ async def home():
         datetime=datetime, timeago=timeago, header='Dashboard', isdashboard=True
     )
 
+@admin.route('/users')
+async def users():
+    return await render_template('admin/users.html', header='Users')
+
 @admin.route('/reports')
 async def reports():
     return await render_template('admin/reports.html', header='Reports')
diff --git a/templates/admin/users.html b/templates/admin/users.html
new file mode 100644
index 00000000..098f2b44
--- /dev/null
+++ b/templates/admin/users.html
@@ -0,0 +1,131 @@
+{% extends 'admin/base.html' %}
+{% block title %} Users {% endblock %}
+{% block header %} 
+
+{% endblock%}
+
+{% block content %}
+<div class="container-xl" id="users">
+    <div class="row row-deck row-cards">
+        <div class="col-sm-6 col-lg-3">
+            <div class="card">
+                <div class="card-body">
+                    <div class="d-flex align-items-center">
+                        <div class="subheader">Total users</div>
+                    </div>
+                    <div class="text-center">
+
+                        <p class="h1 mt-3 mb-3">12938129</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="col-sm-6 col-lg-3">
+            <div class="card">
+                <div class="card-body">
+                    <div class="d-flex align-items-center">
+                        <div class="subheader">Banned users</div>
+                    </div>
+                    <div class="text-center">
+                        <p class="h1 mt-3 mb-3">12938129</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="col-sm-6 col-lg-3">
+            <div class="card">
+                <div class="card-body">
+                    <div class="d-flex align-items-center">
+                        <div class="subheader">Supporters</div>
+                    </div>
+                    <div class="text-center">
+                        <p class="h1 mt-3 mb-3">5</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="col-sm-6 col-lg-3">
+            <div class="card">
+                <div class="card-body">
+                    <div class="d-flex align-items-center">
+                        <div class="subheader">Premium members</div>
+                    </div>
+                    <div class="text-center">
+                        <p class="h1 mt-3 mb-3">33</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <!-- DEVELOPMENT START BELOW HERE -->
+        <div class="col-12">
+            <div class="card">
+                <div class="card-header">
+                    <form action="" class="d-flex m-auto">
+                        <button class="btn m-2">Edit user (username)</button>
+                        <button class="btn m-2">Edit user (email)</button>
+                        <button class="btn m-2">Search user by IP</button>
+                        <button class="btn m-2">Silence user</button>
+                        <button class="btn m-2">Kick user from bancho</button>
+                    </form>
+                </div>
+                <div class="card-body border-bottom py-3">
+                    <div class="d-flex">
+                        <div class="text-muted">
+                            Show
+                            <div class="mx-2 d-inline-block">
+                            <input type="text" class="form-control form-control-sm" value="8" size="3" aria-label="Users count">
+                            </div>
+                            entries
+                        </div>
+                        <div class="ms-auto text-muted">
+                            Search:
+                            <div class="ms-2 d-inline-block">
+                            <input type="text" class="form-control form-control-sm" aria-label="Search invoice">
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="table-responsive">
+                    <table class="table card-table table-vcenter text-nowrap datatable">
+                        <thead>
+                            <tr>
+                              <th>ID</th>
+                              <th>Username</th>
+                              <th>Privilege groups</th>
+                              <th>Allowed</th>
+                              <th>Action</th>
+                            </tr>
+                          </thead>
+                          <!-- SHOW USERS -->
+                          <tbody>
+
+                          </tbody>
+                    </table>
+                </div>
+                <div class="card-footer d-flex align-items-center">
+                    <ul class="pagination m-0 m-auto">
+                      <li class="page-item">
+                        <a class="page-link" href="#" tabindex="-1">
+                          <!-- Download SVG icon from http://tabler-icons.io/i/chevron-left -->
+                          <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="15 6 9 12 15 18"></polyline></svg>
+                          prev
+                        </a>
+                      </li>
+                      <li class="page-item"><a class="page-link" href="#">1</a></li>
+                      <li class="page-item active"><a class="page-link" href="#">2</a></li>
+                      <li class="page-item"><a class="page-link" href="#">3</a></li>
+                      <li class="page-item"><a class="page-link" href="#">4</a></li>
+                      <li class="page-item"><a class="page-link" href="#">5</a></li>
+                      <li class="page-item">
+                        <a class="page-link" href="#">
+                          next <!-- Download SVG icon from http://tabler-icons.io/i/chevron-right -->
+                          <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="9 6 15 12 9 18"></polyline></svg>
+                        </a>
+                      </li>
+                    </ul>
+                  </div>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}
\ No newline at end of file

From 34cc72034433dbf0ac30099825ab553fddad2280 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Sun, 4 Jul 2021 21:19:28 +0700
Subject: [PATCH 004/278] remove pre-title if the page is not dashboard

---
 templates/admin/base.html | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/templates/admin/base.html b/templates/admin/base.html
index f28b203f..4b3b32bc 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -72,9 +72,11 @@ <h1 class="navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-m
             <div class="row align-items-center">
               <div class="col">
                 <!-- Page pre-title -->
+                {% if isdashboard %}
                 <div class="page-pretitle">
                   Overview
                 </div>
+                {% endif %}
                 <h2 class="page-title">
                   {{ header }}
                 </h2>

From 16e122bfedf2fb6a37f3d3b1a0e9c549e1999513 Mon Sep 17 00:00:00 2001
From: Pavaresorn Malai <61514399+Varkaria@users.noreply.github.com>
Date: Sun, 4 Jul 2021 23:10:14 +0700
Subject: [PATCH 005/278] rework: admin stuff

---
 blueprints/admin.py               |  16 +-
 templates/admin/badges.html       |   3 -
 templates/admin/base.html         |  34 ++--
 templates/admin/home.html         | 260 ++++++++++++++++--------------
 templates/admin/log.html          |   3 -
 templates/admin/privilege.html    |   3 -
 templates/admin/recentplay.html   |   3 -
 templates/admin/reports.html      |   3 -
 templates/admin/restrictions.html |   3 -
 templates/admin/users.html        |   3 -
 10 files changed, 163 insertions(+), 168 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 07e22223..bfd1e0a0 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -44,33 +44,33 @@ async def home():
     return await render_template(
         'admin/home.html', dashdata=dash_data,
         recentusers=recent_users, recentscores=recent_scores,
-        datetime=datetime, timeago=timeago, header='Dashboard', isdashboard=True
+        datetime=datetime, timeago=timeago
     )
 
 @admin.route('/users')
 async def users():
-    return await render_template('admin/users.html', header='Users')
+    return await render_template('admin/users.html')
 
 @admin.route('/reports')
 async def reports():
-    return await render_template('admin/reports.html', header='Reports')
+    return await render_template('admin/reports.html')
 
 @admin.route('/recentplay')
 async def recentplay():
-    return await render_template('admin/recentplay.html', header='Recent Play')
+    return await render_template('admin/recentplay.html')
 
 @admin.route('/restrictions')
 async def restrictions():
-    return await render_template('admin/restrictions.html', header='Restrictions')
+    return await render_template('admin/restrictions.html')
 
 @admin.route('/privilege')
 async def privilege():
-    return await render_template('admin/privilege.html', header='Privilege Groups')
+    return await render_template('admin/privilege.html')
 
 @admin.route('/badges')
 async def badges():
-    return await render_template('admin/badges.html', header='Badges')
+    return await render_template('admin/badges.html')
 
 @admin.route('/logs')
 async def logs():
-    return await render_template('admin/log.html', header='Admin logs')
\ No newline at end of file
+    return await render_template('admin/log.html')
\ No newline at end of file
diff --git a/templates/admin/badges.html b/templates/admin/badges.html
index c50160c5..6ca7310d 100644
--- a/templates/admin/badges.html
+++ b/templates/admin/badges.html
@@ -1,9 +1,6 @@
 <!-- For handling out badges? I think? -->
 {% extends 'admin/base.html' %}
 {% block title %} Badges {% endblock %}
-{% block header %} 
-
-{% endblock%}
 
 {% block content %}
 
diff --git a/templates/admin/base.html b/templates/admin/base.html
index 4b3b32bc..d92a54d5 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -23,12 +23,22 @@
 
   <!-- framework -->
   <link rel="stylesheet" href="https://unpkg.com/@tabler/core@latest/dist/css/tabler.min.css">
-  <script src="https://unpkg.com/@tabler/core@latest/dist/js/tabler.min.js"></script>
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" />
 
   {% block header %}
   {% endblock %}
 </head>
 
+{% macro nav_item(name='', url='/', icon='') %}
+<li class="nav-item">
+  <a class="nav-link" href="/admin/{{ url }}">
+    <span class="nav-link-title">
+      <i class="{{ icon }}"></i> {{ name }}
+    </span>
+  </a>
+</li>
+{% endmacro %}
+
 <body class="antialiased">
     <div class="wrapper">
       <header class="navbar navbar-expand-md navbar-dark d-print-none">
@@ -50,16 +60,7 @@ <h1 class="navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-m
           <div class="navbar navbar-light">
             <div class="container-xl">
               <ul class="navbar-nav">
-                <li class="nav-item">
-                  <a class="nav-link" href="/admin/">
-                    <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/home -->
-                      <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="5 12 3 12 12 3 21 12 19 12"></polyline><path d="M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-7"></path><path d="M9 21v-6a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v6"></path></svg>
-                    </span>
-                    <span class="nav-link-title">
-                      Home
-                    </span>
-                  </a>
-                </li>
+                {{ nav_item('Home','/','fas fa-home') }}
               </ul>
             </div>
           </div>
@@ -72,13 +73,13 @@ <h1 class="navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-m
             <div class="row align-items-center">
               <div class="col">
                 <!-- Page pre-title -->
-                {% if isdashboard %}
                 <div class="page-pretitle">
-                  Overview
+                  {% block stitle %}
+                  {% endblock %}
                 </div>
-                {% endif %}
                 <h2 class="page-title">
-                  {{ header }}
+                  {% block htitle %}
+                  {% endblock %}
                 </h2>
               </div>
             </div>
@@ -111,6 +112,9 @@ <h2 class="page-title">
         </footer>
       </div>
     </div>
+    <script src="https://preview.tabler.io/dist/libs/apexcharts/dist/apexcharts.min.js"></script>
+    <script src="https://unpkg.com/@tabler/core@latest/dist/js/tabler.min.js"></script>
+    {% block scriptb %}{% endblock scriptb %}
 </body>
 
 </html>
\ No newline at end of file
diff --git a/templates/admin/home.html b/templates/admin/home.html
index 00b45c76..e412fa6f 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -1,144 +1,156 @@
 {% extends 'admin/base.html' %}
 {% block title %} Dashboard {% endblock %}
-{% block header %} 
-<script src="/static/js/asserts/vue.js"></script>
-<script src="/static/js/asserts/vue-axios.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
-{% endblock%}
+{% block htitle %} Dashboard {% endblock %}
+{% block stitle %} Overview {% endblock %}
 
-{% block content %}
-
-<div class="dashboard" id="dashboard">
-    <div class="columns is-marginless is-paddingless">
-        <div class="column is-paddingless p-3">
-            <div class="card">
-                <div class="title">total users</div>
-                <i class="fa fa-users"></i>
-                <div class="value">{{ dashdata['count'] }}</div>
-                <div class="stat">that's a lot of people!</div>
-            </div>
+{% macro card(title='base', haschart=true, chartname='base', data=0) %}
+<div class="card">
+    <div class="card-body">
+        <div class="d-flex align-items-center">
+            <div class="subheader">{{ title }}</div>
         </div>
-        <div class="column is-paddingless p-3">
-            <div class="card">
-                <div class="title">total online</div>
-                <i class="fa fa-circle"></i>
-                <div class="value">
-                    <% online_users %>
-                </div>
-                <div class="stat">rising in popularity are we?</div>
-            </div>
+        <div class="d-flex align-items-baseline">
+            <div class="h1 mb-0 me-2">{{ data }}</div>
         </div>
-        <div class="column is-paddingless p-3">
-            <div class="card">
-                <div class="title">lastest user</div>
-                <i class="fa fa-book"></i>
-                <div class="value">{{ dashdata['lastest_user'] }}</div>
-                <div class="stat">latest and greatest! welcome!</div>
-            </div>
+    </div>
+    {% if haschart %}
+    <div id="chart-{{ chartname }}" class="chart-sm"></div>
+    {% endif %}
+</div>
+{% endmacro %}
+
+{% macro log() %}
+<div>
+    <div class="row">
+        <div class="col-auto">
+            <span class="avatar">VK</span>
         </div>
-        <div class="column is-paddingless p-3">
-            <div class="card">
-                <div class="title">total banned</div>
-                <i class="fa fa-calendar"></i>
-                <div class="value">{{ dashdata['banned'] }}</div>
-                <div class="stat">naughty naughty :(</div>
+        <div class="col">
+            <div class="text-truncate">
+                <strong>Varkaria</strong> was banned username <strong>"Among us"</strong>
             </div>
+            <div class="text-muted">yesterday</div>
+        </div>
+        <div class="col-auto align-self-center">
+            <div class="badge bg-primary"></div>
         </div>
     </div>
-<div class="columns is-marginless is-paddingless">
-    {% if recentusers %}
-    <div class="column is-paddingless m-2 is-3">
-        <div class="recent-beat">
-            <div class="columns is-marginless">
-                <div class="column is-paddingless flex-vcenter">
-                    <h2 class="section-title">Recent Users</h2>
-                </div>
+</div>
+{% endmacro %}
+
+{% block content %}
+<div class="row row-deck row-cards">
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Online Users', data=3, chartname='online-users') }}
+    </div>
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Registered Users',data=0) }}
+    </div>
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Banned Users',data=0) }}
+    </div>
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Supporter Users',data=0) }}
+    </div>
+    <div class="col-lg-6">
+        <div class="card">
+            <div class="card-header border-0">
+                <div class="card-title">Registered users list</div>
             </div>
-            <div class="blockdata">
-                {% for user in recentusers %}
-                <a href="/u/{{ user.id }}" class="user-block{% if user.priv == 1 %} unverified{% endif %}">
-                    <img src="https://a.{{ domain() }}/{{ user.id }}" class="avatar-picture">
-                    <div class="user-stats"><span class="user-title">
-                        <img src="/static/images/flags/{{ user.country|upper }}.png" class="profile-flag"> {{ user.name }}
-                        </span><span class="user-artist">
-                            {{ user.email }}
-                        </span>
-                        <div class="user-footer">
-                            <span class="user-mapper">
-                            {{ timeago.format((datetime.datetime.fromtimestamp(user.creation_time)),
-                                (datetime.datetime.now() + datetime.timedelta(seconds = 60 * 3.4))) }}
-                            </span>
-                            <div class="d-flex align-items-baseline">
-                                <span>
-                                {{ timeago.format((datetime.datetime.fromtimestamp(user.latest_activity)),
-                                    (datetime.datetime.now() + datetime.timedelta(seconds = 60 * 3.4))) }}
-                                </span>
-                                <div class="target-button newmaps-color">
-                                    <i class="fa fa-arrow-right"></i>
+            <div class="card-table table-responsive">
+                <table class="table table-vcenter">
+                    <thead>
+                        <tr>
+                            <th>Avatar</th>
+                            <th>Username</th>
+                            <th>Date</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr>
+                            <td class="w-1">
+                                <span class="avatar avatar-sm">VK</span>
+                            </td>
+                            <td class="td-truncate">
+                                <div class="text-truncate">
+                                    Varkaria
                                 </div>
-                            </div>
-                        </div>
-                    </div>
-                </a>
-                {% endfor %}
+                            </td>
+                            <td class="text-nowrap text-muted">28 Nov 2019</td>
+                        </tr>
+                    </tbody>
+                </table>
             </div>
         </div>
     </div>
-    {% endif %}
-    {% if recentscores %}
-    <div class="column is-paddingless m-2">
-        <div class="recent-beat">
-            <div class="columns is-marginless">
-                <div class="column is-paddingless flex-vcenter">
-                    <h2 class="section-title">Recent Score</h2>
-                </div>
-            </div>
-            <div class="blockdata">
-                {% for maps in recentscores %}
-                <div class="map-single">
-                    <div class="map-content1">
-                        <div class="map-image"><img src="https://assets.ppy.sh/beatmaps/{{ maps.set_id }}/covers/cover.jpg"
-                                class="map-image-picture"></div>
-                        <div class="map-title-block">
-                            <div class="map-title"><a class="user-link">
-                                    [{{ maps.mode }}] {{ maps.title }} [{{ maps.version }}]
-                                </a></div>
-                            <div class="play-stats">
-                                {{ maps.score }} / {{ maps.max_combo }}x
-                            </div>
-                            <div class="map-date"><time>
-                                {{ timeago.format((maps.play_time), (datetime.datetime.now() + datetime.timedelta(seconds = 60 * 3.4))) }}
-                                </time></div>
-                        </div>
-                    </div>
-                    <div class="map-content2">
-                        <div class="score-details d-flex">
-                            <div class="score-details_right-block">
-                                <div class="score-details_pp-block">
-                                    <div class="map-pp">
-                                        {{ maps.pp }}<span class="map-pp-unit">pp</span></div>
-                                    <div class="map-acc">accuracy:&nbsp;<b>
-                                        {{ maps.acc }}%
-                                        </b></div>
-                                </div>
-                                <div class="score-details_grade-block">
-                                    <div class="rank-single">
-                                        <div class="map-rank rank-{{ maps.grade|upper }}">
-                                            {{ maps.grade.replace("X", "SS").replace("H", "") }}
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
+    <div class="col-lg-6">
+        <div class="card">
+            <div class="card-body card-body-scrollable card-body-scrollable-shadow">
+                <div class="divide-y">
+                    {{ log() }}
                 </div>
-                {% endfor %}
             </div>
         </div>
     </div>
-    {% endif %}
 </div>
-
-<script src="/static/js/pages/admin/dashboard.js"></script>
-
 {% endblock %}
+
+{% block scriptb %}
+<script>
+    document.addEventListener("DOMContentLoaded", function () {
+        window.ApexCharts && (new ApexCharts(document.getElementById('chart-online-users'), {
+            chart: {
+                type: "area",
+                fontFamily: 'inherit',
+                height: 40.0,
+                sparkline: {
+                    enabled: true
+                },
+                animations: {
+                    enabled: false
+                },
+            },
+            dataLabels: {
+                enabled: false,
+            },
+            fill: {
+                opacity: .16,
+                type: 'solid'
+            },
+            stroke: {
+                width: 2,
+                lineCap: "round",
+                curve: "smooth",
+            },
+            series: [{
+                name: "Online Users",
+                data: [0, 2, 3]
+            }],
+            grid: {
+                strokeDashArray: 4,
+            },
+            xaxis: {
+                labels: {
+                    padding: 0,
+                },
+                tooltip: {
+                    enabled: false
+                },
+                axisBorder: {
+                    show: false,
+                }
+            },
+            yaxis: {
+                labels: {
+                    padding: 4
+                },
+            },
+            labels: ['soon', 'soon', 'soon'],
+            colors: ["#206bc4"],
+            legend: {
+                show: false,
+            },
+        })).render();
+    });
+</script>
+{% endblock scriptb %}
\ No newline at end of file
diff --git a/templates/admin/log.html b/templates/admin/log.html
index b634cc16..b43a9c32 100644
--- a/templates/admin/log.html
+++ b/templates/admin/log.html
@@ -1,9 +1,6 @@
 <!-- All admin logs will appered here -->
 {% extends 'admin/base.html' %}
 {% block title %} Logs {% endblock %}
-{% block header %} 
-
-{% endblock%}
 
 {% block content %}
 
diff --git a/templates/admin/privilege.html b/templates/admin/privilege.html
index c33ce328..c4e2479d 100644
--- a/templates/admin/privilege.html
+++ b/templates/admin/privilege.html
@@ -1,9 +1,6 @@
 <!-- For giving privilege -->
 {% extends 'admin/base.html' %}
 {% block title %} Privileges {% endblock %}
-{% block header %} 
-
-{% endblock%}
 
 {% block content %}
 
diff --git a/templates/admin/recentplay.html b/templates/admin/recentplay.html
index 2a235a36..e7cba7ae 100644
--- a/templates/admin/recentplay.html
+++ b/templates/admin/recentplay.html
@@ -1,9 +1,6 @@
 <!-- All recent play will be shown in a list here -->
 {% extends 'admin/base.html' %}
 {% block title %} Recent {% endblock %}
-{% block header %} 
-
-{% endblock%}
 
 {% block content %}
 
diff --git a/templates/admin/reports.html b/templates/admin/reports.html
index 147aa4ba..27416cca 100644
--- a/templates/admin/reports.html
+++ b/templates/admin/reports.html
@@ -1,9 +1,6 @@
 <!-- For report submission -->
 {% extends 'admin/base.html' %}
 {% block title %} Reports {% endblock %}
-{% block header %} 
-
-{% endblock%}
 
 {% block content %}
 
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index e894268a..1a22eb37 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -1,9 +1,6 @@
 <!-- For banning players -->
 {% extends 'admin/base.html' %}
 {% block title %} Restrictions {% endblock %}
-{% block header %} 
-
-{% endblock%}
 
 {% block content %}
 
diff --git a/templates/admin/users.html b/templates/admin/users.html
index 098f2b44..c723287c 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -1,8 +1,5 @@
 {% extends 'admin/base.html' %}
 {% block title %} Users {% endblock %}
-{% block header %} 
-
-{% endblock%}
 
 {% block content %}
 <div class="container-xl" id="users">

From 8560b6d0cb5bccf4ef33d52818307f5744344767 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Sun, 4 Jul 2021 23:50:12 +0700
Subject: [PATCH 006/278] add: refactor users page on admin & improve design

---
 blueprints/admin.py        |   8 +-
 templates/admin/users.html | 257 ++++++++++++++++++++++---------------
 2 files changed, 158 insertions(+), 107 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index bfd1e0a0..92ae3221 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -49,7 +49,13 @@ async def home():
 
 @admin.route('/users')
 async def users():
-    return await render_template('admin/users.html')
+
+    data = {
+        'playercount': range(1),
+        'username':  'Gusbell'
+    }
+
+    return await render_template('admin/users.html', data=data)
 
 @admin.route('/reports')
 async def reports():
diff --git a/templates/admin/users.html b/templates/admin/users.html
index c723287c..904f9aa2 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -1,128 +1,173 @@
 {% extends 'admin/base.html' %}
 {% block title %} Users {% endblock %}
 
-{% block content %}
-<div class="container-xl" id="users">
-    <div class="row row-deck row-cards">
-        <div class="col-sm-6 col-lg-3">
-            <div class="card">
-                <div class="card-body">
-                    <div class="d-flex align-items-center">
-                        <div class="subheader">Total users</div>
-                    </div>
-                    <div class="text-center">
-
-                        <p class="h1 mt-3 mb-3">12938129</p>
-                    </div>
-                </div>
-            </div>
+{% macro card(title='base', haschart=true, chartname='base', data=0) %}
+<div class="card">
+    <div class="card-body">
+        <div class="d-flex align-items-center">
+            <div class="subheader">{{ title }}</div>
         </div>
-        <div class="col-sm-6 col-lg-3">
-            <div class="card">
-                <div class="card-body">
-                    <div class="d-flex align-items-center">
-                        <div class="subheader">Banned users</div>
-                    </div>
-                    <div class="text-center">
-                        <p class="h1 mt-3 mb-3">12938129</p>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="col-sm-6 col-lg-3">
-            <div class="card">
-                <div class="card-body">
-                    <div class="d-flex align-items-center">
-                        <div class="subheader">Supporters</div>
-                    </div>
-                    <div class="text-center">
-                        <p class="h1 mt-3 mb-3">5</p>
-                    </div>
-                </div>
-            </div>
+        <div class="d-flex align-items-baseline">
+            <div class="h1 mb-0 me-2">{{ data }}</div>
         </div>
-        <div class="col-sm-6 col-lg-3">
-            <div class="card">
-                <div class="card-body">
-                    <div class="d-flex align-items-center">
-                        <div class="subheader">Premium members</div>
-                    </div>
-                    <div class="text-center">
-                        <p class="h1 mt-3 mb-3">33</p>
-                    </div>
-                </div>
+    </div>
+    {% if haschart %}
+    <div id="chart-{{ chartname }}" class="chart-sm"></div>
+    {% endif %}
+</div>
+{% endmacro %}
+
+{% block content %}
+<div class="row row-deck row-cards">
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Online Users', data=727, chartname='online-users') }}
+    </div>
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Banned Users',data=727) }}
+    </div>
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Supporter users',data=727) }}
+    </div>
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Premium users',data=727) }}
+    </div>
+    <!-- DEVELOPMENT START BELOW HERE -->
+    <div class="col-12">
+        <div class="card">
+            <div class="card-header">
+                <form action="" class="d-flex m-auto">
+                    <button class="btn m-2">Edit user (username)</button>
+                    <button class="btn m-2">Edit user (email)</button>
+                    <button class="btn m-2">Search user by IP</button>
+                    <button class="btn m-2">Silence user</button>
+                    <button class="btn m-2">Kick user from bancho</button>
+                </form>
             </div>
-        </div>
-        <!-- DEVELOPMENT START BELOW HERE -->
-        <div class="col-12">
-            <div class="card">
-                <div class="card-header">
-                    <form action="" class="d-flex m-auto">
-                        <button class="btn m-2">Edit user (username)</button>
-                        <button class="btn m-2">Edit user (email)</button>
-                        <button class="btn m-2">Search user by IP</button>
-                        <button class="btn m-2">Silence user</button>
-                        <button class="btn m-2">Kick user from bancho</button>
-                    </form>
-                </div>
-                <div class="card-body border-bottom py-3">
-                    <div class="d-flex">
-                        <div class="text-muted">
-                            Show
-                            <div class="mx-2 d-inline-block">
+            <div class="card-body border-bottom py-3">
+                <div class="d-flex">
+                    <div class="text-muted">
+                        Show
+                        <div class="mx-2 d-inline-block">
                             <input type="text" class="form-control form-control-sm" value="8" size="3" aria-label="Users count">
-                            </div>
-                            entries
                         </div>
-                        <div class="ms-auto text-muted">
-                            Search:
-                            <div class="ms-2 d-inline-block">
+                        entries
+                    </div>
+                    <div class="ms-auto text-muted">
+                        Search:
+                        <div class="ms-2 d-inline-block">
                             <input type="text" class="form-control form-control-sm" aria-label="Search invoice">
-                            </div>
                         </div>
                     </div>
                 </div>
-                <div class="table-responsive">
-                    <table class="table card-table table-vcenter text-nowrap datatable">
-                        <thead>
+            </div>
+            <div class="table-responsive">
+                <table class="table card-table table-vcenter text-nowrap datatable">
+                    <thead>
+                        <tr>
+                            <th>ID</th>
+                            <th>Username</th>
+                            <th>Privilege groups</th>
+                            <th>Allowed</th>
+                            <th>Action</th>
+                        </tr>
+                    </thead>
+                    <!-- SHOW USERS -->
+                    <tbody>
+                        <!-- {% for i in data.playercount %} -->
                             <tr>
-                              <th>ID</th>
-                              <th>Username</th>
-                              <th>Privilege groups</th>
-                              <th>Allowed</th>
-                              <th>Action</th>
+                                <td>1</td>
+                                <td>Gusbell</td>
+                                <td>Developer</td>
+                                <td>Yes</td>
+                                <td>soon</td>
                             </tr>
-                          </thead>
-                          <!-- SHOW USERS -->
-                          <tbody>
-
-                          </tbody>
-                    </table>
-                </div>
-                <div class="card-footer d-flex align-items-center">
-                    <ul class="pagination m-0 m-auto">
-                      <li class="page-item">
+                        <!-- {% endfor %} -->
+                    </tbody>
+                </table>
+            </div>
+            <div class="card-footer d-flex align-items-center">
+                <ul class="pagination m-0 m-auto">
+                    <li class="page-item">
                         <a class="page-link" href="#" tabindex="-1">
-                          <!-- Download SVG icon from http://tabler-icons.io/i/chevron-left -->
-                          <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="15 6 9 12 15 18"></polyline></svg>
-                          prev
+                            <!-- Download SVG icon from http://tabler-icons.io/i/chevron-left -->
+                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="15 6 9 12 15 18"></polyline></svg>
+                            prev
                         </a>
-                      </li>
-                      <li class="page-item"><a class="page-link" href="#">1</a></li>
-                      <li class="page-item active"><a class="page-link" href="#">2</a></li>
-                      <li class="page-item"><a class="page-link" href="#">3</a></li>
-                      <li class="page-item"><a class="page-link" href="#">4</a></li>
-                      <li class="page-item"><a class="page-link" href="#">5</a></li>
-                      <li class="page-item">
+                    </li>
+                    <li class="page-item"><a class="page-link" href="#">1</a></li>
+                    <li class="page-item active"><a class="page-link" href="#">2</a></li>
+                    <li class="page-item"><a class="page-link" href="#">3</a></li>
+                    <li class="page-item"><a class="page-link" href="#">4</a></li>
+                    <li class="page-item"><a class="page-link" href="#">5</a></li>
+                    <li class="page-item">
                         <a class="page-link" href="#">
-                          next <!-- Download SVG icon from http://tabler-icons.io/i/chevron-right -->
-                          <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="9 6 15 12 9 18"></polyline></svg>
+                            next <!-- Download SVG icon from http://tabler-icons.io/i/chevron-right -->
+                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="9 6 15 12 9 18"></polyline></svg>
                         </a>
-                      </li>
-                    </ul>
-                  </div>
+                    </li>
+                </ul>
             </div>
         </div>
     </div>
 </div>
-{% endblock %}
\ No newline at end of file
+{% endblock %}
+
+{% block scriptb %}
+<script>
+    document.addEventListener("DOMContentLoaded", function () {
+        window.ApexCharts && (new ApexCharts(document.getElementById('chart-online-users'), {
+            chart: {
+                type: "area",
+                fontFamily: 'inherit',
+                height: 40.0,
+                sparkline: {
+                    enabled: true
+                },
+                animations: {
+                    enabled: false
+                },
+            },
+            dataLabels: {
+                enabled: false,
+            },
+            fill: {
+                opacity: .16,
+                type: 'solid'
+            },
+            stroke: {
+                width: 2,
+                lineCap: "round",
+                curve: "smooth",
+            },
+            series: [{
+                name: "Online Users",
+                data: [0, 2, 3]
+            }],
+            grid: {
+                strokeDashArray: 4,
+            },
+            xaxis: {
+                labels: {
+                    padding: 0,
+                },
+                tooltip: {
+                    enabled: false
+                },
+                axisBorder: {
+                    show: false,
+                }
+            },
+            yaxis: {
+                labels: {
+                    padding: 4
+                },
+            },
+            labels: ['soon', 'soon', 'soon'],
+            colors: ["#206bc4"],
+            legend: {
+                show: false,
+            },
+        })).render();
+    });
+</script>
+{% endblock scriptb %}
\ No newline at end of file

From bfea0ead326b8324d8da1bab8ce8504e427c0c14 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Mon, 5 Jul 2021 02:30:27 +0700
Subject: [PATCH 007/278] add: beatmaps page

---
 templates/admin/beatmaps.html | 35 +++++++++++++++++++++++++++++++++++
 1 file changed, 35 insertions(+)
 create mode 100644 templates/admin/beatmaps.html

diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
new file mode 100644
index 00000000..08c5d6d3
--- /dev/null
+++ b/templates/admin/beatmaps.html
@@ -0,0 +1,35 @@
+{% extends 'admin/base.html' %}
+{% block title %} Beatmaps {% endblock %}\
+
+{% macro card(title='base', haschart=true, chartname='base', data=0) %}
+<div class="card">
+    <div class="card-body">
+        <div class="d-flex align-items-center">
+            <div class="subheader">{{ title }}</div>
+        </div>
+        <div class="d-flex align-items-baseline">
+            <div class="h1 mb-0 me-2">{{ data }}</div>
+        </div>
+    </div>
+    {% if haschart %}
+    <div id="chart-{{ chartname }}" class="chart-sm"></div>
+    {% endif %}
+</div>
+{% endmacro %}
+
+{% block content %}
+<div class="row row-deck row-cards">
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Total beatmaps in database', data=1, chartname='total-beatmaps') }}
+    </div>
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Total ranked beatmaps', data=1) }}
+    </div>
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Total loved beatmaps', data=1) }}
+    </div>
+    <div class="col-sm-6 col-lg-3"> 
+        {{ card(title='Total Pending beatmaps', data=1) }}
+    </div>
+</div>
+{% endblock %}
\ No newline at end of file

From bb28f15716342873f5137490743b25a103d83ec6 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Mon, 5 Jul 2021 02:31:03 +0700
Subject: [PATCH 008/278] add: query data for users page

---
 blueprints/admin.py | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 92ae3221..3927fccc 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -50,12 +50,18 @@ async def home():
 @admin.route('/users')
 async def users():
 
+    query_data = await glob.db.fetchall(
+        'SELECT name AS `username`, id FROM users ORDER BY id'
+    )
+    for i in query_data:
+        print(i)
+
     data = {
         'playercount': range(1),
         'username':  'Gusbell'
     }
 
-    return await render_template('admin/users.html', data=data)
+    return await render_template('admin/users.html', data=data, query_data=query_data)
 
 @admin.route('/reports')
 async def reports():
@@ -73,6 +79,10 @@ async def restrictions():
 async def privilege():
     return await render_template('admin/privilege.html')
 
+@admin.route('/beatmaps')
+async def beatmaps():
+    return await render_template('admin/beatmaps.html')
+
 @admin.route('/badges')
 async def badges():
     return await render_template('admin/badges.html')

From cfaa36e0324d72251ec68b37f770adb4dc9ff9bb Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Mon, 5 Jul 2021 02:32:35 +0700
Subject: [PATCH 009/278] add: user listing & action layout

---
 templates/admin/users.html | 72 +++++++++++++++++++++++++++++---------
 1 file changed, 55 insertions(+), 17 deletions(-)

diff --git a/templates/admin/users.html b/templates/admin/users.html
index 904f9aa2..75d97232 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -17,6 +17,36 @@
 </div>
 {% endmacro %}
 
+{% macro modal(title='base', id='base') %}
+<div class="modal modal-blur fade" id="{{ id }}" tabindex="-1" aria-hidden="true">
+    <div class="modal-dialog modal-sm" role="document">
+        <div class="modal-content">
+            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            <div class="modal-body text-start pt-4">
+                <form action="">
+                    <div class="mb-3">
+                        <label class="form-label">{{ title }}</label>
+                        <input type="text" class="form-control" name="example-text-input">
+                      </div>
+                </form>
+            </div>
+            <div class="modal-footer">
+                <div class="w-100">
+                    <div class="row">
+                        <div class="col">
+                            <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">Cancel</button>
+                        </div>
+                        <div class="col">
+                            <button type="submit" id="del-submit" form="" class="btn btn-btn-primary w-100">Edit</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+{% endmacro %}
+
 {% block content %}
 <div class="row row-deck row-cards">
     <div class="col-sm-6 col-lg-3">
@@ -36,9 +66,9 @@
         <div class="card">
             <div class="card-header">
                 <form action="" class="d-flex m-auto">
-                    <button class="btn m-2">Edit user (username)</button>
-                    <button class="btn m-2">Edit user (email)</button>
-                    <button class="btn m-2">Search user by IP</button>
+                    <button class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-usr">Edit user (username)</button>
+                    <button class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-ema">Edit user (email)</button>
+                    <button class="btn m-2" data-bs-toggle="modal" data-bs-target="#sch-ip">Search user by IP</button>
                     <button class="btn m-2">Silence user</button>
                     <button class="btn m-2">Kick user from bancho</button>
                 </form>
@@ -73,15 +103,17 @@
                     </thead>
                     <!-- SHOW USERS -->
                     <tbody>
-                        <!-- {% for i in data.playercount %} -->
-                            <tr>
-                                <td>1</td>
-                                <td>Gusbell</td>
-                                <td>Developer</td>
-                                <td>Yes</td>
-                                <td>soon</td>
-                            </tr>
-                        <!-- {% endfor %} -->
+                        {% for i in query_data %}
+                        <tr>
+                            <td>{{ i.id }}</td>
+                            <td>{{ i.username }}</td>
+                            <td>Developer</td>
+                            <td>Yes</td>
+                            <td>
+                                <button class="btn"><i class="far fa-edit" aria-hidden="true"></i></button>
+                            </td>
+                        </tr>
+                        {% endfor %}
                     </tbody>
                 </table>
             </div>
@@ -89,19 +121,18 @@
                 <ul class="pagination m-0 m-auto">
                     <li class="page-item">
                         <a class="page-link" href="#" tabindex="-1">
-                            <!-- Download SVG icon from http://tabler-icons.io/i/chevron-left -->
                             <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="15 6 9 12 15 18"></polyline></svg>
                             prev
                         </a>
                     </li>
-                    <li class="page-item"><a class="page-link" href="#">1</a></li>
-                    <li class="page-item active"><a class="page-link" href="#">2</a></li>
+                    <li class="page-item active"><a class="page-link" href="#">1</a></li>
+                    <li class="page-item"><a class="page-link" href="#">2</a></li>
                     <li class="page-item"><a class="page-link" href="#">3</a></li>
                     <li class="page-item"><a class="page-link" href="#">4</a></li>
-                    <li class="page-item"><a class="page-link" href="#">5</a></li>
+                    <li class="page-item"><a class="page-link" href="#">5</a></li> 
                     <li class="page-item">
                         <a class="page-link" href="#">
-                            next <!-- Download SVG icon from http://tabler-icons.io/i/chevron-right -->
+                            next
                             <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="9 6 15 12 9 18"></polyline></svg>
                         </a>
                     </li>
@@ -110,6 +141,13 @@
         </div>
     </div>
 </div>
+
+{{ modal(title='Username', id="edi-usr-usr") }}
+
+{{ modal(title='Email', id="edi-usr-ema") }}
+
+{{ modal(title='IP', id="sch-ip") }}
+
 {% endblock %}
 
 {% block scriptb %}

From f05f26e4a06636a29a70abf3e392e0cad91d8f55 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Mon, 5 Jul 2021 16:10:29 +0700
Subject: [PATCH 010/278] hot fix: button somehow give redirect

---
 templates/admin/users.html | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/templates/admin/users.html b/templates/admin/users.html
index 75d97232..274f6202 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -37,7 +37,7 @@
                             <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">Cancel</button>
                         </div>
                         <div class="col">
-                            <button type="submit" id="del-submit" form="" class="btn btn-btn-primary w-100">Edit</button>
+                            <button type="submit" id="del-submit" form="" class="btn btn-primary w-100">Edit</button>
                         </div>
                     </div>
                 </div>
@@ -65,13 +65,13 @@
     <div class="col-12">
         <div class="card">
             <div class="card-header">
-                <form action="" class="d-flex m-auto">
-                    <button class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-usr">Edit user (username)</button>
-                    <button class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-ema">Edit user (email)</button>
-                    <button class="btn m-2" data-bs-toggle="modal" data-bs-target="#sch-ip">Search user by IP</button>
-                    <button class="btn m-2">Silence user</button>
-                    <button class="btn m-2">Kick user from bancho</button>
-                </form>
+                <div class="d-flex m-auto">
+                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-usr">Edit user (username)</button>
+                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-ema">Edit user (email)</button>
+                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#sch-ip">Search user by IP</button>
+                    <button type="button" class="btn m-2">Silence user</button>
+                    <button type="button" class="btn m-2">Kick user from bancho</button>
+                </div>
             </div>
             <div class="card-body border-bottom py-3">
                 <div class="d-flex">

From 7a2a713d2d243a605f4d4988b5058ac1a24188c5 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Mon, 5 Jul 2021 20:18:03 +0700
Subject: [PATCH 011/278] add: player searching & editing in users page

---
 blueprints/admin.py        | 33 ++++++++++++++++-------
 templates/admin/users.html | 54 ++++++++++++++++++++++++++++++++------
 2 files changed, 69 insertions(+), 18 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 3927fccc..a8dcf937 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -8,6 +8,7 @@
 from quart import Blueprint
 from quart import render_template
 from quart import session
+from quart import request
 
 from objects import glob
 from objects.utils import flash
@@ -47,21 +48,33 @@ async def home():
         datetime=datetime, timeago=timeago
     )
 
-@admin.route('/users')
+@admin.route('/users', methods=['GET', 'POST'])
 async def users():
+    await request.get_data()
 
     query_data = await glob.db.fetchall(
         'SELECT name AS `username`, id FROM users ORDER BY id'
     )
-    for i in query_data:
-        print(i)
-
-    data = {
-        'playercount': range(1),
-        'username':  'Gusbell'
-    }
-
-    return await render_template('admin/users.html', data=data, query_data=query_data)
+    if request.method == 'POST':
+        #TODO: Improve this mess
+        error = 'User not found!'
+        for i in await request.values:
+            header = i
+        if header == 'username':
+            form = await request.form
+            data = form['username']
+            search_data =  await glob.db.fetchall(f"SELECT * FROM users WHERE name = '{ data }'")
+            if search_data == ():
+                return await render_template('admin/users.html', query_data=query_data, search_data=search_data, error=error)
+            return await render_template('admin/users.html', query_data=query_data, search_data=search_data)
+        if header == 'email':
+            form = await request.form
+            data = form['email']
+            search_data =  await glob.db.fetchall(f"SELECT * FROM users WHERE email = '{ data }'")
+            if search_data == ():
+                return await render_template('admin/users.html', query_data=query_data, search_data=search_data, error=error)
+            return await render_template('admin/users.html', query_data=query_data, search_data=search_data)
+    return await render_template('admin/users.html', query_data=query_data)
 
 @admin.route('/reports')
 async def reports():
diff --git a/templates/admin/users.html b/templates/admin/users.html
index 274f6202..3b771b0c 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -17,17 +17,17 @@
 </div>
 {% endmacro %}
 
-{% macro modal(title='base', id='base') %}
+{% macro modal(title='base', id='base', form_id='base') %}
 <div class="modal modal-blur fade" id="{{ id }}" tabindex="-1" aria-hidden="true">
     <div class="modal-dialog modal-sm" role="document">
         <div class="modal-content">
             <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
             <div class="modal-body text-start pt-4">
-                <form action="">
+                <form id="{{ form_id }}" method="POST">
                     <div class="mb-3">
                         <label class="form-label">{{ title }}</label>
-                        <input type="text" class="form-control" name="example-text-input">
-                      </div>
+                        <input type="text" class="form-control" name="{{ form_id }}">
+                    </div>
                 </form>
             </div>
             <div class="modal-footer">
@@ -37,7 +37,7 @@
                             <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">Cancel</button>
                         </div>
                         <div class="col">
-                            <button type="submit" id="del-submit" form="" class="btn btn-primary w-100">Edit</button>
+                            <button type="submit" id="del-submit" form="{{ form_id }}" class="btn btn-primary w-100">Edit</button>
                         </div>
                     </div>
                 </div>
@@ -48,6 +48,11 @@
 {% endmacro %}
 
 {% block content %}
+{% if error %}
+<div class="alert alert-danger col-lg-2" role="alert" style="display: block; position: relative; margin-top: -3.5rem;">
+    <h4 class="alert-title">{{ error }}</h4>
+</div>
+{% endif %}
 <div class="row row-deck row-cards">
     <div class="col-sm-6 col-lg-3">
         {{ card(title='Online Users', data=727, chartname='online-users') }}
@@ -61,6 +66,39 @@
     <div class="col-sm-6 col-lg-3">
         {{ card(title='Premium users',data=727) }}
     </div>
+    {% if search_data %}
+    <div class="col-12">
+        {% for i in search_data %}
+        <div class="card">
+            <div class="card-header">Edit info of {{ i.name }}</div>
+            <div class="card-body">
+                <form action="">
+                    <label class="form-label">Username</label>
+                    <div>
+                    <div class="input-icon mb-3">
+                        <span class="input-icon-addon">
+                          <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><circle cx="12" cy="7" r="4"></circle><path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path></svg>
+                        </span>
+                        <input type="text" class="form-control" placeholder="{{ i.name }}">
+                    </div>
+                    <label class="form-label">Email</label>
+                    <div class="input-icon mb-3">
+                        <span class="input-icon-addon">
+                            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-mail" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="#2c3e50" fill="none" stroke-linecap="round" stroke-linejoin="round">
+                                <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+                                <rect x="3" y="5" width="18" height="14" rx="2" />
+                                <polyline points="3 7 12 13 21 7" />
+                            </svg>
+                        </span>
+                        <input type="text" class="form-control" placeholder="{{ i.email }}">
+                    </div>
+                </div>
+                </form>
+            </div>
+        </div>
+        {% endfor %}
+    </div>
+    {% endif %}
     <!-- DEVELOPMENT START BELOW HERE -->
     <div class="col-12">
         <div class="card">
@@ -142,11 +180,11 @@
     </div>
 </div>
 
-{{ modal(title='Username', id="edi-usr-usr") }}
+{{ modal(title='Username', id="edi-usr-usr", form_id='username') }}
 
-{{ modal(title='Email', id="edi-usr-ema") }}
+{{ modal(title='Email', id="edi-usr-ema", form_id='email') }}
 
-{{ modal(title='IP', id="sch-ip") }}
+{{ modal(title='IP', id="sch-ip", form_id='ip') }}
 
 {% endblock %}
 

From 725c630b353feb3ef6aceb3da30284101e32d675 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Mon, 5 Jul 2021 20:18:19 +0700
Subject: [PATCH 012/278] Update base.html

---
 templates/settings/base.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/settings/base.html b/templates/settings/base.html
index 4053a607..9e94b3ff 100644
--- a/templates/settings/base.html
+++ b/templates/settings/base.html
@@ -83,7 +83,7 @@
               Discord
             </a>
             <hr class="navbar-divider">
-            <a class="navbar-item" href="https://github.com/Yo-ru/guweb/issues/new">
+            <a class="navbar-item" href="https://github.com/Varkaria/guweb/issues/new">
               Report an issue
             </a>
           </div>

From 43855e88cd9445737aeab016b208d161f194dc22 Mon Sep 17 00:00:00 2001
From: def750 <def75023@gmail.com>
Date: Mon, 5 Jul 2021 19:27:05 +0200
Subject: [PATCH 013/278] Add fetching bmaps to admin/beatmaps

---
 blueprints/admin.py | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index a8dcf937..bf5cc9aa 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -94,7 +94,15 @@ async def privilege():
 
 @admin.route('/beatmaps')
 async def beatmaps():
-    return await render_template('admin/beatmaps.html')
+    r = await glob.db.fetchall('SELECT COUNT(id) as `r` FROM maps WHERE `status`=2')
+    l = await glob.db.fetchall('SELECT COUNT(id) as `l` FROM maps WHERE `status`=5')
+    p = await glob.db.fetchall('SELECT COUNT(id) as `p` FROM maps WHERE `status`=0')
+    t = await glob.db.fetchall('SELECT COUNT(id) as `t` FROM maps')
+    data = {"ranked": r[0]['r'], "loved": l[0]['l'], "pending": p[0]['p'], "total": t[0]['t']}
+    #This needs to be moved to api
+    bmaps = await glob.db.fetchall(f'SELECT set_id, id AS `map_id`, status, artist, title, version AS `diff_name`, total_length AS length, creator, mode, cs, od, ar, hp, bpm, diff AS `stars` FROM maps ORDER BY set_id ASC LIMIT 10 OFFSET 0')
+    print(bmaps)
+    return await render_template('admin/beatmaps.html', data=data, bmap_query=bmaps)
 
 @admin.route('/badges')
 async def badges():
@@ -102,4 +110,4 @@ async def badges():
 
 @admin.route('/logs')
 async def logs():
-    return await render_template('admin/log.html')
\ No newline at end of file
+    return await render_template('admin/log.html')

From 29c94d32a7b0c64859f0f0db9227758a772e6a2f Mon Sep 17 00:00:00 2001
From: def750 <def75023@gmail.com>
Date: Mon, 5 Jul 2021 19:29:56 +0200
Subject: [PATCH 014/278] Update beatmaps.html

Request for beatmap fetching should be moved to api, also changing beatmap status should happen on api request to gulag because if you update it only in database server needs to be restarted to fetch changes. Also, adding class 'disabled' to element with map status is not working.
TODO:
Fix error above
Add Popup on bottom with information of status change
Change status button on when diffrent status clicked (dropdown)
---
 templates/admin/beatmaps.html | 139 ++++++++++++++++++++++++++++++++--
 1 file changed, 134 insertions(+), 5 deletions(-)

diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 08c5d6d3..7ff12b71 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -17,19 +17,148 @@
 </div>
 {% endmacro %}
 
+
 {% block content %}
+<!-- Beatmap Number -->
 <div class="row row-deck row-cards">
     <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total beatmaps in database', data=1, chartname='total-beatmaps') }}
+        {{ card(title='Total beatmaps in database', data=data['total'], chartname='total-beatmaps') }}
     </div>
     <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total ranked beatmaps', data=1) }}
+        {{ card(title='Total ranked beatmaps', data=data['ranked'], chartname='ranked-beatmaps') }}
     </div>
     <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total loved beatmaps', data=1) }}
+        {{ card(title='Total loved beatmaps', data=data['loved'], chartname='loved-beatmaps') }}
     </div>
     <div class="col-sm-6 col-lg-3"> 
-        {{ card(title='Total Pending beatmaps', data=1) }}
+        {{ card(title='Total Pending beatmaps', data=data['pending'], chartname='pending-beatmaps') }}
+    </div>
+    <!-- Beatmap list -->
+    <div class="card-body border-bottom py-3">
+        <div class="d-flex">
+            <div class="text-muted">
+                Show
+                <div class="mx-2 d-inline-block">
+                    <input type="text" class="form-control form-control-sm" value="10" size="3" aria-label="Users count">
+                </div>
+                entries
+            </div>
+            <div class="ms-auto text-muted">
+                Search:
+                <div class="ms-2 d-inline-block">
+                    <input type="text" class="form-control form-control-sm" aria-label="Search invoice">
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="table-responsive">
+        <table class="table card-table table-vcenter text-nowrap datatable">
+            <thead>
+                <tr>
+                    <th><center>Beatmap</center></th>
+                    <th><center>Mode</center></th>
+                    <th><center>CS / Keys</center></th>
+                    <th><center>AR</center></th>
+                    <th><center>HP</center></th>
+                    <th><center>OD</center></th>
+                    <th><center>BPM</center></th>
+                    <th><center>Length</center></th>
+                    <th><center>Stars</center></th>
+                    <th><center>Manage Status</center></th>
+                </tr>
+            </thead>
+            <!-- SHOW USERS -->
+            <tbody>
+                {% for i in bmap_query %}
+                <tr>
+                    <td><center>
+                        <div class="card song-banner" style="background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size:cover">
+                            <div class="card-body" style="background-color: rgba(0, 0, 0, 0.45);">
+                              <a href="https://osu.ppy.sh/beatmapsets/{{ i.set_id }}" target="_blank" class="text-white">{{ i.artist }} + {{ i.creator }} -
+                              <br/>{{ i.title }}. [{{ i.diff_name }}]</a>
+                            </div>
+                          </div>
+                    </center></td> <!-- Beatmap -->
+                    <td><center>{{ i.mode }}</center></td>
+                    <td><center>{{ i.cs }}</center></td> <!-- CS -->
+                    <td><center>{{ i.ar }}</center></td> <!-- AR -->
+                    <td><center>{{ i.hp }}</center></td> <!-- HP -->
+                    <td><center>{{ i.od }}</center></td> <!-- OD -->
+                    <td><center>{{ i.bpm }}</center></td> <!-- BPM -->
+                    <td><center>{{ i.length }}</center></td> <!-- Length -->
+                    <td><center>{{ i.stars }}</center></td>
+                    <td> <!-- Status Management -->
+                        <script>
+                            var status = {{ i.status }};
+                            console.log(status);
+                            if (status == 2) {
+                                var v = document.getElementsByClassName("btn1a");
+                                console.log(v);
+                                v.btn1a += " disabled";
+                            }
+                            else if (status == 5) {
+                                var v = document.getElementsByClassName("btn2a");
+                                console.log(v);
+                                v.btn1a += " disabled";
+                            }
+                            else {
+                                var v = document.getElementsByClassName("btn3a");
+                                console.log(v);
+                                v.btn1a += " disabled";
+                            }
+                        </script>
+                        <center>
+                            <!-- IMPORTANT!! After <a> tag there's invisible character for spacing between text and icon
+                            DO NOT delete it, it's not a space (The character is blank brail pattern)-->
+                            <button type="button" class="btn dropdown-toggle" data-bs-toggle="dropdown">⠀
+                                Status Here
+                            </button>
+                            <div class="dropdown-menu">
+                                <a class="btn1a dropdown-item" href="#">
+                                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-double-up" viewBox="0 0 16 16" style="color: #00cf97;">
+                                        <path fill-rule="evenodd" d="M7.646 2.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 3.707 2.354 9.354a.5.5 0 1 1-.708-.708l6-6z"/>
+                                        <path fill-rule="evenodd" d="M7.646 6.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 7.707l-5.646 5.647a.5.5 0 0 1-.708-.708l6-6z"/>
+                                    </svg>⠀
+                                    Ranked
+                                </a>
+                                <a class="btn2a dropdown-item" href="#">
+                                    <i class="fas fa-heart" style="color: rgb(255, 172, 237);"></i>⠀
+                                    Loved
+                                </a>
+                                <a class="btn3a dropdown-item" href="#">
+                                    <i class="fas fa-question"></i>⠀
+                                    Unranked
+                                </a>
+                            </div>
+                        </center>
+                    </td>
+
+                </tr>
+                {% endfor %}
+            </tbody>
+        </table>
+    </div>
+    <div class="card-footer d-flex align-items-center">
+        <ul class="pagination m-0 m-auto">
+            <li class="page-item">
+                <a class="page-link" href="#" tabindex="-1">
+                    <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="15 6 9 12 15 18"></polyline></svg>
+                    prev
+                </a>
+            </li>
+            <li class="page-item active"><a class="page-link" href="#">1</a></li>
+            <li class="page-item"><a class="page-link" href="#">2</a></li>
+            <li class="page-item"><a class="page-link" href="#">3</a></li>
+            <li class="page-item"><a class="page-link" href="#">4</a></li>
+            <li class="page-item"><a class="page-link" href="#">...</a></li>
+            <li class="page-item"><a class="page-link" href="#">5</a></li> 
+            <li class="page-item">
+                <a class="page-link" href="#">
+                    next
+                    <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="9 6 15 12 9 18"></polyline></svg>
+                </a>
+            </li>
+        </ul>
     </div>
 </div>
-{% endblock %}
\ No newline at end of file
+{% endblock %}

From d8dcebcb4392db79b165724d22895d43fe0230c2 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Tue, 6 Jul 2021 02:17:17 +0700
Subject: [PATCH 015/278] add: player edition on user page

---
 blueprints/admin.py        | 45 ++++++++++++++------
 templates/admin/users.html | 87 ++++++++++++++++++++++++++------------
 2 files changed, 91 insertions(+), 41 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index a8dcf937..378d94ec 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -3,12 +3,14 @@
 __all__ = ()
 
 import datetime
+from quart.helpers import url_for
 
 import timeago
 from quart import Blueprint
 from quart import render_template
 from quart import session
 from quart import request
+from quart import redirect
 
 from objects import glob
 from objects.utils import flash
@@ -50,32 +52,47 @@ async def home():
 
 @admin.route('/users', methods=['GET', 'POST'])
 async def users():
-    await request.get_data()
 
-    query_data = await glob.db.fetchall(
-        'SELECT name AS `username`, id FROM users ORDER BY id'
-    )
+    query_data = await glob.db.fetchall('SELECT name AS `username`, id FROM users ORDER BY id')
+
     if request.method == 'POST':
-        #TODO: Improve this mess
+        global search_data
         error = 'User not found!'
         for i in await request.values:
             header = i
         if header == 'username':
-            form = await request.form
-            data = form['username']
-            search_data =  await glob.db.fetchall(f"SELECT * FROM users WHERE name = '{ data }'")
-            if search_data == ():
+            username = (await request.form)['username']
+            search_data = await glob.db.fetchall(f'SELECT * FROM users WHERE name = "{ username }"')
+            if not search_data:
                 return await render_template('admin/users.html', query_data=query_data, search_data=search_data, error=error)
             return await render_template('admin/users.html', query_data=query_data, search_data=search_data)
-        if header == 'email':
-            form = await request.form
-            data = form['email']
-            search_data =  await glob.db.fetchall(f"SELECT * FROM users WHERE email = '{ data }'")
-            if search_data == ():
+        elif header == 'email':
+            email = (await request.form)['email']
+            search_data = await glob.db.fetchall(f'SELECT * FROM users WHERE email = "{ email }"')
+            if not search_data:
                 return await render_template('admin/users.html', query_data=query_data, search_data=search_data, error=error)
             return await render_template('admin/users.html', query_data=query_data, search_data=search_data)
     return await render_template('admin/users.html', query_data=query_data)
 
+@admin.route('/users/update', methods=['GET', 'POST'])
+async def up_user():
+    if request.method == 'POST':
+        form = await request.form
+        for i in search_data:
+            id = i['id']
+        username = form['edit-username']
+        email = form['edit-email']
+        if not username and not email:
+            return redirect('/admin/users')
+        elif not username:
+            await glob.db.execute(f'UPDATE users SET email="{email}" WHERE id={id}')
+        elif not email:
+            await glob.db.execute(f'UPDATE users SET name="{username}", safe_name=LOWER("{username}") WHERE id={id}')
+        else:
+            await glob.db.execute(f'UPDATE users SET name="{username}", safe_name=LOWER("{username}"), email="{email}" WHERE id={id}')
+    return redirect('/admin/users')
+
+
 @admin.route('/reports')
 async def reports():
     return await render_template('admin/reports.html')
diff --git a/templates/admin/users.html b/templates/admin/users.html
index 3b771b0c..f42d6d8c 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -17,16 +17,16 @@
 </div>
 {% endmacro %}
 
-{% macro modal(title='base', id='base', form_id='base') %}
+{% macro modal(title='base', id='base', name='base') %}
 <div class="modal modal-blur fade" id="{{ id }}" tabindex="-1" aria-hidden="true">
     <div class="modal-dialog modal-sm" role="document">
         <div class="modal-content">
             <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
             <div class="modal-body text-start pt-4">
-                <form id="{{ form_id }}" method="POST">
+                <form id="{{ name }}" method="POST">
                     <div class="mb-3">
                         <label class="form-label">{{ title }}</label>
-                        <input type="text" class="form-control" name="{{ form_id }}">
+                        <input type="text" class="form-control" name="{{ name }}">
                     </div>
                 </form>
             </div>
@@ -37,7 +37,7 @@
                             <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">Cancel</button>
                         </div>
                         <div class="col">
-                            <button type="submit" id="del-submit" form="{{ form_id }}" class="btn btn-primary w-100">Edit</button>
+                            <button type="submit" id="del-submit" form="{{ name }}" class="btn btn-primary w-100">Edit</button>
                         </div>
                     </div>
                 </div>
@@ -49,7 +49,7 @@
 
 {% block content %}
 {% if error %}
-<div class="alert alert-danger col-lg-2" role="alert" style="display: block; position: relative; margin-top: -3.5rem;">
+<div class="alert alert-danger col-lg-3" role="alert" style="display: block; position: relative; margin-top: -3.5rem;">
     <h4 class="alert-title">{{ error }}</h4>
 </div>
 {% endif %}
@@ -72,34 +72,45 @@ <h4 class="alert-title">{{ error }}</h4>
         <div class="card">
             <div class="card-header">Edit info of {{ i.name }}</div>
             <div class="card-body">
-                <form action="">
+                <form action="/admin/users/update" method="POST" id="edit-usr">
                     <label class="form-label">Username</label>
                     <div>
-                    <div class="input-icon mb-3">
-                        <span class="input-icon-addon">
-                          <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><circle cx="12" cy="7" r="4"></circle><path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path></svg>
-                        </span>
-                        <input type="text" class="form-control" placeholder="{{ i.name }}">
+                        <div class="input-icon mb-3">
+                            <span class="input-icon-addon">
+                                <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><circle cx="12" cy="7" r="4"></circle><path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path></svg>
+                            </span>
+                            <input type="text" name="edit-username" class="form-control" placeholder="{{ i.name }}">
+                        </div>
+                        <label class="form-label">Email</label>
+                        <div class="input-icon mb-3">
+                            <span class="input-icon-addon">
+                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-mail" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="#2c3e50" fill="none" stroke-linecap="round" stroke-linejoin="round">
+                                    <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+                                    <rect x="3" y="5" width="18" height="14" rx="2" />
+                                    <polyline points="3 7 12 13 21 7" />
+                                </svg>
+                            </span>
+                            <input type="text" name="edit-email" class="form-control" placeholder="{{ i.email }}">
+                        </div>
                     </div>
-                    <label class="form-label">Email</label>
-                    <div class="input-icon mb-3">
-                        <span class="input-icon-addon">
-                            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-mail" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="#2c3e50" fill="none" stroke-linecap="round" stroke-linejoin="round">
-                                <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
-                                <rect x="3" y="5" width="18" height="14" rx="2" />
-                                <polyline points="3 7 12 13 21 7" />
-                            </svg>
-                        </span>
-                        <input type="text" class="form-control" placeholder="{{ i.email }}">
+                </form>
+            </div>
+            <div class="card-footer">
+                <div class="w-100">
+                    <div class="row">
+                        <div class="col">
+                            <a href="/admin/users"><button type="button" class="btn btn-white w-100">Cancel</button></a>
+                        </div>
+                        <div class="col">
+                            <button type="submit" class="btn btn-primary w-100" data-bs-toggle="modal" data-bs-target="#edit-confirmed">Save</button>
+                        </div>
                     </div>
                 </div>
-                </form>
             </div>
         </div>
         {% endfor %}
     </div>
     {% endif %}
-    <!-- DEVELOPMENT START BELOW HERE -->
     <div class="col-12">
         <div class="card">
             <div class="card-header">
@@ -139,7 +150,6 @@ <h4 class="alert-title">{{ error }}</h4>
                             <th>Action</th>
                         </tr>
                     </thead>
-                    <!-- SHOW USERS -->
                     <tbody>
                         {% for i in query_data %}
                         <tr>
@@ -180,11 +190,34 @@ <h4 class="alert-title">{{ error }}</h4>
     </div>
 </div>
 
-{{ modal(title='Username', id="edi-usr-usr", form_id='username') }}
+{{ modal(title='Username', id="edi-usr-usr", name='username') }}
+
+{{ modal(title='Email', id="edi-usr-ema", name='email') }}
 
-{{ modal(title='Email', id="edi-usr-ema", form_id='email') }}
+{{ modal(title='IP', id="sch-ip", name='ip') }}
 
-{{ modal(title='IP', id="sch-ip", form_id='ip') }}
+<div class="modal modal-blur fade" id="edit-confirmed" tabindex="-1" aria-hidden="true">
+    <div class="modal-dialog modal-sm" role="document">
+        <div class="modal-content">
+            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            <div class="modal-header text-center">
+                <h1>Confirmed?</h1>
+            </div>
+            <div class="modal-body text-start pt-4">
+                <div class="w-100">
+                    <div class="row">
+                        <div class="col">
+                            <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">No</button>
+                        </div>
+                        <div class="col">
+                            <button type="submit" form="edit-usr" class="btn btn-danger w-100">Yes</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
 
 {% endblock %}
 

From 69faafb1b88b6488ade48d1e3b20a0e340392e7a Mon Sep 17 00:00:00 2001
From: Pavaresorn Malai <61514399+Varkaria@users.noreply.github.com>
Date: Tue, 6 Jul 2021 02:54:12 +0700
Subject: [PATCH 016/278] beatmaps recent sort should be recent maps

---
 blueprints/admin.py | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index b78fb7e8..e4fa0c19 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -117,8 +117,7 @@ async def beatmaps():
     t = await glob.db.fetchall('SELECT COUNT(id) as `t` FROM maps')
     data = {"ranked": r[0]['r'], "loved": l[0]['l'], "pending": p[0]['p'], "total": t[0]['t']}
     #This needs to be moved to api
-    bmaps = await glob.db.fetchall(f'SELECT set_id, id AS `map_id`, status, artist, title, version AS `diff_name`, total_length AS length, creator, mode, cs, od, ar, hp, bpm, diff AS `stars` FROM maps ORDER BY set_id ASC LIMIT 10 OFFSET 0')
-    print(bmaps)
+    bmaps = await glob.db.fetchall(f'SELECT set_id, id AS `map_id`, status, artist, title, version AS `diff_name`, total_length AS length, creator, mode, cs, od, ar, hp, bpm, diff AS `stars` FROM maps ORDER BY id DESC LIMIT 10 OFFSET 0')
     return await render_template('admin/beatmaps.html', data=data, bmap_query=bmaps)
 
 @admin.route('/badges')

From e042064d7fdba7eb655f9e7723a164c42cead6d2 Mon Sep 17 00:00:00 2001
From: Pavaresorn Malai <61514399+Varkaria@users.noreply.github.com>
Date: Tue, 6 Jul 2021 02:54:56 +0700
Subject: [PATCH 017/278] remove: old style & remove padding from beatmap cover

---
 static/css/pages/admin/style.css | 525 +------------------------------
 templates/admin/base.html        |   3 +
 templates/admin/beatmaps.html    | 121 +++++--
 3 files changed, 93 insertions(+), 556 deletions(-)

diff --git a/static/css/pages/admin/style.css b/static/css/pages/admin/style.css
index 8f0a312a..ba903a74 100644
--- a/static/css/pages/admin/style.css
+++ b/static/css/pages/admin/style.css
@@ -1,522 +1,3 @@
-.admin-con {
-    margin-top: 53px!important
-}
-
-.sidebar {
-    background: hsl(var(--main), 10%, 15%);
-    width: 230px;
-    top: 0;
-    left: 0;
-    z-index: 1;
-    background-size: cover;
-    background-position: 50%;
-    display: block;
-    transition: .5s cubic-bezier(.685, .0473, .346, 1);
-}
-
-.sidebar .sidebar-wrapper {
-    width: 100%;
-    min-height: 100%;
-    max-height: calc(100vh - 705px);
-    z-index: 4;
-    position: relative;
-    overflow: auto;
-}
-
-.sidebar .sidebar-wrapper>.nav [data-toggle=collapse]~div>ul>li>a .sidebar-normal {
-    margin: 0;
-    position: relative;
-    -webkit-transform: translateX(0);
-    transform: translateX(0);
-    opacity: 1;
-    white-space: nowrap;
-    display: block;
-    line-height: 23px;
-    z-index: 1;
-    color: hsla(0, 0%, 100%, .8)
-}
-
-.sidebar .sidebar-wrapper>.nav [data-toggle=collapse]~div>ul>li>a i {
-    font-size: 17px;
-    line-height: 20px;
-    width: 26px
-}
-
-.sidebar .sidebar-wrapper [data-toggle=collapse]~div>ul>li:hover>a .sidebar-normal {
-    color: #fff
-}
-
-.sidebar .nav {
-    margin-top: 20px;
-    display: block;
-    margin-left: 0
-}
-
-.sidebar .nav li>a+div .nav {
-    margin-top: 5px
-}
-
-.sidebar .nav li>a+div .nav li>a {
-    margin-top: 0;
-    padding: 8px 8px
-}
-
-.sidebar .nav li>a {
-    margin: 10px 15px 0;
-    border-radius: 10px;
-    color: #fff;
-    display: block;
-    position: relative;
-    cursor: pointer;
-    padding: 10px 15px;
-    line-height: 1.625rem;
-    text-align: left
-}
-
-.sidebar .nav li:first-child>a {
-    margin: 0 15px
-}
-
-.sidebar .nav li:focus:not(.active)>a i, .sidebar .nav li:focus:not(.active)>a p, .sidebar .nav li:hover:not(.active)>a i, .sidebar .nav li:hover:not(.active)>a p {
-    color: #fff
-}
-
-.sidebar .nav li>a:hover {
-    background: #ff939314;
-    transform: translateY(-2px)
-}
-
-.sidebar .nav p {
-    margin: 0;
-    font-weight: 600;
-    color: hsla(0, 0%, 100%, .8);
-    line-height: 30px;
-    position: relative;
-    display: block;
-    height: auto;
-    white-space: nowrap
-}
-
-.sidebar .nav i {
-    font-size: 20px;
-    float: left;
-    margin-right: 12px;
-    line-height: 30px;
-    width: 34px;
-    text-align: center;
-    color: hsla(0, 0%, 100%, .8);
-    position: relative
-}
-
-.sidebar .logo {
-    position: relative;
-    padding: .5rem .7rem;
-    z-index: 4;
-    background: hsl(var(--main),37%,50%);
-}
-
-.sidebar .logo a.logo-normal {
-    display: block;
-    opacity: 1;
-    -webkit-transform: translateZ(0);
-    transform: translateZ(0)
-}
-
-.sidebar .logo p {
-    float: left;
-    font-size: 20px;
-    margin: 10px 10px;
-    color: #fff;
-    line-height: 20px;
-    font-family: Helvetica Neue, Helvetica, Arial, sans-serif
-}
-
-.sidebar .logo .simple-text {
-    text-transform: uppercase;
-    padding: .5rem 0;
-    display: block;
-    white-space: nowrap;
-    color: #fff;
-    text-decoration: none;
-    font-weight: 500;
-    line-height: 30px;
-    overflow: hidden;
-    text-align: center
-}
-
-.sidebar .user {
-    padding-bottom: 20px;
-    margin: 20px auto 0;
-    position: relative
-}
-
-.sidebar .user:after {
-    content: "";
-    position: absolute;
-    bottom: 0;
-    right: 15px;
-    height: 1px;
-    width: calc(100% - 30px);
-    background: hsla(0, 0%, 100%, .5)
-}
-
-.sidebar .user a {
-    color: #fff;
-    text-decoration: none;
-    padding: .5rem 15px;
-    white-space: nowrap
-}
-
-.footer {
-    margin-top: 0
-}
-
-.content:not(:last-child) {
-    margin: 0
-}
-
-.admin-con {
-    flex-grow: 1
-}
-
-.columns {
-    margin-top: 53px
-}
-
-li {
-    list-style-type: none;
-    margin: 0;
-    padding: 0
-}
-
-.nav-link .icon {
-    font-size: 16px;
-    padding-right: 18px
-}
-
-.nav-link .name {
-    font-size: 14px;
-    font-weight: 500
-}
-
-.column {
-    padding: 24px 26px
-}
-
-.content h2 {
-    margin-bottom: .2em
-}
-
-.section-lead {
-    color: #b5b5b5
-}
-
-.section {
-    padding: 1rem 0
-}
-
-.is-avatar {
-    width: 5%;
-    flex: inherit;
-    margin-right: 20px;
-    border-radius: 12px
-}
-
-.header-avatar {
-    border-radius: 12px
-}
-
-.card {
-    border-radius: 8px;
-    color: #fff;
-    padding: 10px;
-    position: relative;
-    border: 0;
-    background: hsl(var(--main),15%,25%);
-}
-
-.card .stat {
-    border-top: 1px solid rgba(255, 255, 255, .3);
-    font-size: 8px;
-    margin-top: 6px;
-    padding: 10px 10px 0;
-    text-transform: uppercase
-}
-
-.card .title {
-    display: inline-block;
-    font-size: 8px;
-    padding: 10px 10px 0;
-    text-transform: uppercase
-}
-
-.card .value {
-    font-size: 28px;
-    padding: 0 10px
-}
-
-.recent-beat {
-    margin-top: 20px
-}
-
-.recent-beat .section-title {
-    font-size: 20px
-}
-
-.title:not(:last-child) {
-    margin-bottom: 0
-}
-
-.user-block {
-    transition: .2s ease
-}
-
-.user-block {
-    display: flex;
-    border-radius: 8px;
-    padding: 12px;
-    font-weight: 700;
-    line-height: 1.3;
-    align-items: center;
-    overflow: hidden;
-    height: 76px;
-    margin-top: 8px
-}
-
-.user-block {
-    background-color: #413030;
-    color: #fff
-}
-
-.user-block:hover {
-    box-shadow: 0 0 1px rgba(0, 0, 0, .04), 0 4px 8px rgba(0, 0, 0, .04), 0 16px 24px rgba(0, 0, 0, .04), 0 24px 32px rgba(0, 0, 0, .04);
-    color: #fff;
-    transform: translateY(-5px)
-}
-
-.avatar-picture {
-    width: 58px;
-    border-radius: 6px;
-    margin-right: 8px
-}
-
-.profile-flag {
-    width: 18px
-}
-
-.unverified {
-    background: #3c3c3c
-}
-
-.unverified .target-button {
-    background: #4c4a4a!important
-}
-
-.user-artist, .user-mapper, .user-title {
-    text-overflow: ellipsis;
-    overflow: hidden;
-    white-space: nowrap;
-    font-size: 12
-}
-
-.user-artist {
-    font-size: 11px;
-    font-weight: 500
-}
-
-.user-footer {
-    display: flex;
-    justify-content: space-between;
-    align-items: baseline;
-    margin-top: 8px;
-    font-size: 16px;
-    font-weight: 600;
-    color: #fff;
-    white-space: nowrap
-}
-
-.user-footer .target-button {
-    background-color: #5d4343;
-    border-radius: 6px;
-    padding: 4.5px 7px;
-    font-size: 12px;
-    margin-left: 10px;
-    transition: .2s background-color;
-    color: #ff679b
-}
-
-.user-stats {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    min-width: 0
-}
-
-.user-link {
-    width: 400px;
-    overflow: hidden
-}
-
-span.user-mapper {
-    padding-right: 8px
-}
-
-.d-flex.align-items-baseline {
-    display: flex
-}
-
-.extra-block {
-    width: 100%;
-    display: flex;
-    justify-content: center
-}
-
-.map-single {
-    height: 76px;
-    min-width: 0;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    padding-right: 0;
-    margin: 8px 0 0 0;
-    padding: 8px;
-    border-radius: 8px;
-    overflow: hidden;
-    background: #413030;
-    transition: .2s ease;
-    cursor: pointer
-}
-
-.map-single:hover {
-    border-radius: 8px;
-    transform: translateY(-5px);
-    box-shadow: 0 0 1px rgba(0, 0, 0, .04), 0 4px 8px rgba(0, 0, 0, .04), 0 16px 24px rgba(0, 0, 0, .04), 0 24px 32px rgba(0, 0, 0, .04)
-}
-
-.map-content1 {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    height: 100%;
-    min-width: 0;
-    flex: 1
-}
-
-.map-title {
-    font-size: 14px;
-    display: flex;
-    font-weight: 500;
-    align-items: center;
-    white-space: nowrap
-}
-
-.map-title-block {
-    display: flex;
-    flex-direction: column;
-    line-height: 1;
-    margin-left: 6px;
-    min-width: 0;
-    padding-right: 12px;
-    flex: 2
-}
-
-.map-date {
-    font-size: 10px;
-    font-weight: 500;
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-start
-}
-
-.map-date>time {
-    margin-top: 2px
-}
-
-.map-content2 {
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    line-height: 1.2;
-    align-items: flex-end;
-    justify-content: center
-}
-
-.map-pp {
-    font-weight: 700;
-    color: #cc5288;
-    font-size: 20px
-}
-
-.map-acc {
-    font-size: 12px;
-    display: flex;
-    justify-content: flex-end
-}
-
-.main-stats {
-    display: flex;
-    flex-direction: column;
-    color: #fff;
-    height: 100%;
-    justify-content: space-between
-}
-
-.rank-single {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    line-height: 1
-}
-
-.rank-block {
-    margin: auto 0
-}
-
-.score-details_right-block {
-    display: flex;
-    flex-direction: row;
-    align-items: flex-end;
-    height: 100%;
-    min-width: 140px;
-    justify-content: center;
-    padding-right: 14px;
-    padding-left: 20px;
-    position: relative;
-    border-radius: 0 10px 10px 0;
-    z-index: 0;
-    margin-left: 6px;
-    align-items: center
-}
-
-.score-details_pp-block {
-    display: flex;
-    flex-direction: column;
-    align-items: flex-end;
-    height: 100%;
-    justify-content: center;
-    position: relative;
-    border-radius: 0 10px 10px 0;
-    z-index: 0;
-    margin-left: 6px;
-    margin-right: 12px
-}
-
-.score-details {
-    height: 100%;
-    align-items: flex-end
-}
-
-.score-details_grade-block .rank-single {
-    margin: 0
-}
-
-.score-details_grade-block .map-rank {
-    font-size: 32px
-}
-
-.map-image-picture {
-    width: 64px;
-    height: 45px;
-    border-radius: 6px;
-    object-fit: cover
-}
+.no-padding {
+    padding: 0px !important;
+}
\ No newline at end of file
diff --git a/templates/admin/base.html b/templates/admin/base.html
index d92a54d5..1664cbf4 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -25,6 +25,9 @@
   <link rel="stylesheet" href="https://unpkg.com/@tabler/core@latest/dist/css/tabler.min.css">
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" />
 
+  <!-- Custom -->
+  <link rel="stylesheet" href="/static/css/pages/admin/style.css">
+
   {% block header %}
   {% endblock %}
 </head>
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 7ff12b71..125b6fd9 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -30,7 +30,7 @@
     <div class="col-sm-6 col-lg-3">
         {{ card(title='Total loved beatmaps', data=data['loved'], chartname='loved-beatmaps') }}
     </div>
-    <div class="col-sm-6 col-lg-3"> 
+    <div class="col-sm-6 col-lg-3">
         {{ card(title='Total Pending beatmaps', data=data['pending'], chartname='pending-beatmaps') }}
     </div>
     <!-- Beatmap list -->
@@ -39,7 +39,8 @@
             <div class="text-muted">
                 Show
                 <div class="mx-2 d-inline-block">
-                    <input type="text" class="form-control form-control-sm" value="10" size="3" aria-label="Users count">
+                    <input type="text" class="form-control form-control-sm" value="10" size="3"
+                        aria-label="Users count">
                 </div>
                 entries
             </div>
@@ -55,39 +56,78 @@
         <table class="table card-table table-vcenter text-nowrap datatable">
             <thead>
                 <tr>
-                    <th><center>Beatmap</center></th>
-                    <th><center>Mode</center></th>
-                    <th><center>CS / Keys</center></th>
-                    <th><center>AR</center></th>
-                    <th><center>HP</center></th>
-                    <th><center>OD</center></th>
-                    <th><center>BPM</center></th>
-                    <th><center>Length</center></th>
-                    <th><center>Stars</center></th>
-                    <th><center>Manage Status</center></th>
+                    <th>
+                        <center>Beatmap</center>
+                    </th>
+                    <th>
+                        <center>Mode</center>
+                    </th>
+                    <th>
+                        <center>CS / Keys</center>
+                    </th>
+                    <th>
+                        <center>AR</center>
+                    </th>
+                    <th>
+                        <center>HP</center>
+                    </th>
+                    <th>
+                        <center>OD</center>
+                    </th>
+                    <th>
+                        <center>BPM</center>
+                    </th>
+                    <th>
+                        <center>Length</center>
+                    </th>
+                    <th>
+                        <center>Stars</center>
+                    </th>
+                    <th>
+                        <center>Manage Status</center>
+                    </th>
                 </tr>
             </thead>
             <!-- SHOW USERS -->
             <tbody>
                 {% for i in bmap_query %}
                 <tr>
-                    <td><center>
-                        <div class="card song-banner" style="background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size:cover">
+                    <td class="no-padding">
+                        <div class="card song-banner"
+                            style="background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size:cover">
                             <div class="card-body" style="background-color: rgba(0, 0, 0, 0.45);">
-                              <a href="https://osu.ppy.sh/beatmapsets/{{ i.set_id }}" target="_blank" class="text-white">{{ i.artist }} + {{ i.creator }} -
-                              <br/>{{ i.title }}. [{{ i.diff_name }}]</a>
+                                <a href="https://osu.ppy.sh/beatmapsets/{{ i.set_id }}" target="_blank"
+                                    class="text-white">{{ i.artist }} + {{ i.creator }} -
+                                    <br />{{ i.title }}. [{{ i.diff_name }}]</a>
                             </div>
-                          </div>
-                    </center></td> <!-- Beatmap -->
-                    <td><center>{{ i.mode }}</center></td>
-                    <td><center>{{ i.cs }}</center></td> <!-- CS -->
-                    <td><center>{{ i.ar }}</center></td> <!-- AR -->
-                    <td><center>{{ i.hp }}</center></td> <!-- HP -->
-                    <td><center>{{ i.od }}</center></td> <!-- OD -->
-                    <td><center>{{ i.bpm }}</center></td> <!-- BPM -->
-                    <td><center>{{ i.length }}</center></td> <!-- Length -->
-                    <td><center>{{ i.stars }}</center></td>
-                    <td> <!-- Status Management -->
+                        </div>
+                    </td> <!-- Beatmap -->
+                    <td>
+                        <center>{{ i.mode }}</center>
+                    </td>
+                    <td>
+                        <center>{{ i.cs }}</center>
+                    </td> <!-- CS -->
+                    <td>
+                        <center>{{ i.ar }}</center>
+                    </td> <!-- AR -->
+                    <td>
+                        <center>{{ i.hp }}</center>
+                    </td> <!-- HP -->
+                    <td>
+                        <center>{{ i.od }}</center>
+                    </td> <!-- OD -->
+                    <td>
+                        <center>{{ i.bpm }}</center>
+                    </td> <!-- BPM -->
+                    <td>
+                        <center>{{ i.length }}</center>
+                    </td> <!-- Length -->
+                    <td>
+                        <center>{{ i.stars }}</center>
+                    </td>
+                    <td>
+                        <!-- Status Management -->
                         <script>
                             var status = {{ i.status }};
                             console.log(status);
@@ -115,9 +155,12 @@
                             </button>
                             <div class="dropdown-menu">
                                 <a class="btn1a dropdown-item" href="#">
-                                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-double-up" viewBox="0 0 16 16" style="color: #00cf97;">
-                                        <path fill-rule="evenodd" d="M7.646 2.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 3.707 2.354 9.354a.5.5 0 1 1-.708-.708l6-6z"/>
-                                        <path fill-rule="evenodd" d="M7.646 6.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 7.707l-5.646 5.647a.5.5 0 0 1-.708-.708l6-6z"/>
+                                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
+                                        class="bi bi-chevron-double-up" viewBox="0 0 16 16" style="color: #00cf97;">
+                                        <path fill-rule="evenodd"
+                                            d="M7.646 2.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 3.707 2.354 9.354a.5.5 0 1 1-.708-.708l6-6z" />
+                                        <path fill-rule="evenodd"
+                                            d="M7.646 6.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 7.707l-5.646 5.647a.5.5 0 0 1-.708-.708l6-6z" />
                                     </svg>⠀
                                     Ranked
                                 </a>
@@ -142,7 +185,12 @@
         <ul class="pagination m-0 m-auto">
             <li class="page-item">
                 <a class="page-link" href="#" tabindex="-1">
-                    <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="15 6 9 12 15 18"></polyline></svg>
+                    <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24"
+                        stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round"
+                        stroke-linejoin="round">
+                        <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                        <polyline points="15 6 9 12 15 18"></polyline>
+                    </svg>
                     prev
                 </a>
             </li>
@@ -151,14 +199,19 @@
             <li class="page-item"><a class="page-link" href="#">3</a></li>
             <li class="page-item"><a class="page-link" href="#">4</a></li>
             <li class="page-item"><a class="page-link" href="#">...</a></li>
-            <li class="page-item"><a class="page-link" href="#">5</a></li> 
+            <li class="page-item"><a class="page-link" href="#">5</a></li>
             <li class="page-item">
                 <a class="page-link" href="#">
                     next
-                    <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="9 6 15 12 9 18"></polyline></svg>
+                    <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24"
+                        stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round"
+                        stroke-linejoin="round">
+                        <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                        <polyline points="9 6 15 12 9 18"></polyline>
+                    </svg>
                 </a>
             </li>
         </ul>
     </div>
 </div>
-{% endblock %}
+{% endblock %}
\ No newline at end of file

From 3a285ec7c17189624538c89ad725e4e7e5d627ef Mon Sep 17 00:00:00 2001
From: Pavaresorn Malai <61514399+Varkaria@users.noreply.github.com>
Date: Tue, 6 Jul 2021 02:56:11 +0700
Subject: [PATCH 018/278] remove: rounded beatmap cover

---
 static/css/pages/admin/style.css | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/static/css/pages/admin/style.css b/static/css/pages/admin/style.css
index ba903a74..ece12f3c 100644
--- a/static/css/pages/admin/style.css
+++ b/static/css/pages/admin/style.css
@@ -1,3 +1,7 @@
 .no-padding {
     padding: 0px !important;
+}
+
+.song-banner {
+    border-radius: 0px !important;
 }
\ No newline at end of file

From c6071aa344146ad9afebe3ee98fcefbb42e06b20 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Tue, 6 Jul 2021 18:10:42 +0700
Subject: [PATCH 019/278] add: cache for search_data

---
 objects/glob.py | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/objects/glob.py b/objects/glob.py
index e384e02c..9d6a0550 100644
--- a/objects/glob.py
+++ b/objects/glob.py
@@ -16,5 +16,6 @@
 version: 'Version'
 
 cache = {
-    'bcrypt': {}
+    'bcrypt': {},
+    'search_data': {}
 }

From 0de916afa8c93667346fd6d940f448d81422c1a7 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Tue, 6 Jul 2021 18:12:04 +0700
Subject: [PATCH 020/278] refactor: changed from f string to % in sql

---
 blueprints/admin.py        | 16 ++++++++--------
 templates/admin/users.html |  8 +++-----
 2 files changed, 11 insertions(+), 13 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 378d94ec..ad658da5 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -3,7 +3,6 @@
 __all__ = ()
 
 import datetime
-from quart.helpers import url_for
 
 import timeago
 from quart import Blueprint
@@ -62,13 +61,15 @@ async def users():
             header = i
         if header == 'username':
             username = (await request.form)['username']
-            search_data = await glob.db.fetchall(f'SELECT * FROM users WHERE name = "{ username }"')
+            search_data = await glob.db.fetch('SELECT id, name, email FROM users WHERE name = %s', [username])
+            glob.cache['search_data'] = search_data['id']
             if not search_data:
                 return await render_template('admin/users.html', query_data=query_data, search_data=search_data, error=error)
             return await render_template('admin/users.html', query_data=query_data, search_data=search_data)
         elif header == 'email':
             email = (await request.form)['email']
-            search_data = await glob.db.fetchall(f'SELECT * FROM users WHERE email = "{ email }"')
+            search_data = await glob.db.fetch('SELECT id, name, email FROM users WHERE email = %s', [email])
+            glob.cache['search_data'] = search_data['id']
             if not search_data:
                 return await render_template('admin/users.html', query_data=query_data, search_data=search_data, error=error)
             return await render_template('admin/users.html', query_data=query_data, search_data=search_data)
@@ -78,18 +79,17 @@ async def users():
 async def up_user():
     if request.method == 'POST':
         form = await request.form
-        for i in search_data:
-            id = i['id']
+        id = glob.cache['search_data']
         username = form['edit-username']
         email = form['edit-email']
         if not username and not email:
             return redirect('/admin/users')
         elif not username:
-            await glob.db.execute(f'UPDATE users SET email="{email}" WHERE id={id}')
+            await glob.db.execute('UPDATE users SET email=%s WHERE id = %s ', [email, id])
         elif not email:
-            await glob.db.execute(f'UPDATE users SET name="{username}", safe_name=LOWER("{username}") WHERE id={id}')
+            await glob.db.execute('UPDATE users SET name=%s, safe_name=LOWER(%s) WHERE id = %s', [username, username, id])
         else:
-            await glob.db.execute(f'UPDATE users SET name="{username}", safe_name=LOWER("{username}"), email="{email}" WHERE id={id}')
+            await glob.db.execute('UPDATE users SET name=%s, safe_name=LOWER(%s), email=%s WHERE id = %s', [username, username, email, id])
     return redirect('/admin/users')
 
 
diff --git a/templates/admin/users.html b/templates/admin/users.html
index f42d6d8c..dc7b7169 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -68,9 +68,8 @@ <h4 class="alert-title">{{ error }}</h4>
     </div>
     {% if search_data %}
     <div class="col-12">
-        {% for i in search_data %}
         <div class="card">
-            <div class="card-header">Edit info of {{ i.name }}</div>
+            <div class="card-header">Edit info of {{ search_data.name }}</div>
             <div class="card-body">
                 <form action="/admin/users/update" method="POST" id="edit-usr">
                     <label class="form-label">Username</label>
@@ -79,7 +78,7 @@ <h4 class="alert-title">{{ error }}</h4>
                             <span class="input-icon-addon">
                                 <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><circle cx="12" cy="7" r="4"></circle><path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path></svg>
                             </span>
-                            <input type="text" name="edit-username" class="form-control" placeholder="{{ i.name }}">
+                            <input type="text" name="edit-username" class="form-control" placeholder="{{ search_data.name }}">
                         </div>
                         <label class="form-label">Email</label>
                         <div class="input-icon mb-3">
@@ -90,7 +89,7 @@ <h4 class="alert-title">{{ error }}</h4>
                                     <polyline points="3 7 12 13 21 7" />
                                 </svg>
                             </span>
-                            <input type="text" name="edit-email" class="form-control" placeholder="{{ i.email }}">
+                            <input type="text" name="edit-email" class="form-control" placeholder="{{ search_data.email }}">
                         </div>
                     </div>
                 </form>
@@ -108,7 +107,6 @@ <h4 class="alert-title">{{ error }}</h4>
                 </div>
             </div>
         </div>
-        {% endfor %}
     </div>
     {% endif %}
     <div class="col-12">

From f7db3f027c2046cbb616c550aed12ab221991c64 Mon Sep 17 00:00:00 2001
From: def750 <def75023@gmail.com>
Date: Tue, 6 Jul 2021 14:35:58 +0200
Subject: [PATCH 021/278] Add contry to sql query in admin/users

---
 blueprints/admin.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index e4fa0c19..83e7d148 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -53,7 +53,7 @@ async def home():
 @admin.route('/users', methods=['GET', 'POST'])
 async def users():
 
-    query_data = await glob.db.fetchall('SELECT name AS `username`, id FROM users ORDER BY id')
+    query_data = await glob.db.fetchall('SELECT name AS `username`, id, country FROM users ORDER BY id')
 
     if request.method == 'POST':
         global search_data

From b505bb10fc59695684718032567c71205266f5ff Mon Sep 17 00:00:00 2001
From: def750 <def75023@gmail.com>
Date: Tue, 6 Jul 2021 14:37:34 +0200
Subject: [PATCH 022/278] Add country before username in admin/users

---
 templates/admin/users.html | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/templates/admin/users.html b/templates/admin/users.html
index f42d6d8c..9578fb09 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -154,7 +154,10 @@ <h4 class="alert-title">{{ error }}</h4>
                         {% for i in query_data %}
                         <tr>
                             <td>{{ i.id }}</td>
-                            <td>{{ i.username }}</td>
+                            <td>
+                                <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">
+                                {{ i.username }}
+                            </td>
                             <td>Developer</td>
                             <td>Yes</td>
                             <td>
@@ -279,4 +282,4 @@ <h1>Confirmed?</h1>
         })).render();
     });
 </script>
-{% endblock scriptb %}
\ No newline at end of file
+{% endblock scriptb %}

From b73867edd15516618036fb7b75322b70206cabc9 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Tue, 6 Jul 2021 20:29:09 +0700
Subject: [PATCH 023/278] remove: why global still there

---
 blueprints/admin.py | 2 --
 1 file changed, 2 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index ad658da5..a835c7b8 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -55,7 +55,6 @@ async def users():
     query_data = await glob.db.fetchall('SELECT name AS `username`, id FROM users ORDER BY id')
 
     if request.method == 'POST':
-        global search_data
         error = 'User not found!'
         for i in await request.values:
             header = i
@@ -92,7 +91,6 @@ async def up_user():
             await glob.db.execute('UPDATE users SET name=%s, safe_name=LOWER(%s), email=%s WHERE id = %s', [username, username, email, id])
     return redirect('/admin/users')
 
-
 @admin.route('/reports')
 async def reports():
     return await render_template('admin/reports.html')

From 9c75740c046d39cb0a16743bb6fbbf4793cd7086 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Tue, 6 Jul 2021 22:32:28 +0700
Subject: [PATCH 024/278] add: make users edit button work

---
 templates/admin/users.html | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/templates/admin/users.html b/templates/admin/users.html
index dc7b7169..fc13ac32 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -38,7 +38,7 @@
                         </div>
                         <div class="col">
                             <button type="submit" id="del-submit" form="{{ name }}" class="btn btn-primary w-100">Edit</button>
-                        </div>
+                        </div>   
                     </div>
                 </div>
             </div>
@@ -100,6 +100,11 @@ <h4 class="alert-title">{{ error }}</h4>
                         <div class="col">
                             <a href="/admin/users"><button type="button" class="btn btn-white w-100">Cancel</button></a>
                         </div>
+                        <div class="col">
+                            <form action="/admin/users/forgot/{{ search_data.id }}" method="post">
+                                <button type="submit" class="btn w-100 disabled">User forgot password?</button>
+                            </form>
+                        </div>
                         <div class="col">
                             <button type="submit" class="btn btn-primary w-100" data-bs-toggle="modal" data-bs-target="#edit-confirmed">Save</button>
                         </div>
@@ -115,9 +120,9 @@ <h4 class="alert-title">{{ error }}</h4>
                 <div class="d-flex m-auto">
                     <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-usr">Edit user (username)</button>
                     <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-ema">Edit user (email)</button>
-                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#sch-ip">Search user by IP</button>
-                    <button type="button" class="btn m-2">Silence user</button>
-                    <button type="button" class="btn m-2">Kick user from bancho</button>
+                    <button type="button" class="btn m-2 disabled" data-bs-toggle="modal" data-bs-target="#sch-ip">Search user by IP</button>
+                    <button type="button" class="btn m-2 disabled">Silence user</button>
+                    <button type="button" class="btn m-2 disabled">Kick user from bancho</button>
                 </div>
             </div>
             <div class="card-body border-bottom py-3">
@@ -156,7 +161,7 @@ <h4 class="alert-title">{{ error }}</h4>
                             <td>Developer</td>
                             <td>Yes</td>
                             <td>
-                                <button class="btn"><i class="far fa-edit" aria-hidden="true"></i></button>
+                                <button type="submit" class="btn" form="username" name="username" value="{{ i.username }}"><i class="far fa-edit" aria-hidden="true"></i></button>
                             </td>
                         </tr>
                         {% endfor %}

From bb02c1fff33ef8c4367226cba780359086bff8d2 Mon Sep 17 00:00:00 2001
From: Pavaresorn Malai <61514399+Varkaria@users.noreply.github.com>
Date: Tue, 6 Jul 2021 23:52:46 +0700
Subject: [PATCH 025/278] refactoring code (better looking)

---
 blueprints/admin.py           | 32 ++++++++++++++++++++++----------
 templates/admin/beatmaps.html |  8 ++++----
 2 files changed, 26 insertions(+), 14 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 83e7d148..7fcf3465 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -3,8 +3,6 @@
 __all__ = ()
 
 import datetime
-from quart.helpers import url_for
-
 import timeago
 from quart import Blueprint
 from quart import render_template
@@ -111,14 +109,28 @@ async def privilege():
 
 @admin.route('/beatmaps')
 async def beatmaps():
-    r = await glob.db.fetchall('SELECT COUNT(id) as `r` FROM maps WHERE `status`=2')
-    l = await glob.db.fetchall('SELECT COUNT(id) as `l` FROM maps WHERE `status`=5')
-    p = await glob.db.fetchall('SELECT COUNT(id) as `p` FROM maps WHERE `status`=0')
-    t = await glob.db.fetchall('SELECT COUNT(id) as `t` FROM maps')
-    data = {"ranked": r[0]['r'], "loved": l[0]['l'], "pending": p[0]['p'], "total": t[0]['t']}
-    #This needs to be moved to api
-    bmaps = await glob.db.fetchall(f'SELECT set_id, id AS `map_id`, status, artist, title, version AS `diff_name`, total_length AS length, creator, mode, cs, od, ar, hp, bpm, diff AS `stars` FROM maps ORDER BY id DESC LIMIT 10 OFFSET 0')
-    return await render_template('admin/beatmaps.html', data=data, bmap_query=bmaps)
+    query = await glob.db.fetch(
+        'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
+        '(SELECT COUNT(id) as `l` FROM maps WHERE `status`= 5) AS `l`, '
+        '(SELECT COUNT(id) as `p` FROM maps WHERE `status`= 0) AS `p`, '
+        '(SELECT COUNT(id) as `t` FROM maps) `t`'
+    )
+    counts = {
+        "ranked": query['r'], 
+        "loved": query['l'], 
+        "pending": query['p'], 
+        "total": query['t']
+    }
+    # This thing needs to be moved to API
+    beatmaps = await glob.db.fetchall(
+        'SELECT set_id, id AS `map_id`, status, '
+        'artist, title, version AS `diff_name`, '
+        'total_length AS length, creator, mode, '
+        'cs, od, ar, hp, bpm, diff AS `stars` '
+        'FROM maps ORDER BY id DESC '
+        'LIMIT 10 OFFSET 0'
+    )
+    return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps)
 
 @admin.route('/badges')
 async def badges():
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 125b6fd9..80250831 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -22,16 +22,16 @@
 <!-- Beatmap Number -->
 <div class="row row-deck row-cards">
     <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total beatmaps in database', data=data['total'], chartname='total-beatmaps') }}
+        {{ card(title='Total beatmaps in database', data=counts['total'], chartname='total-beatmaps') }}
     </div>
     <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total ranked beatmaps', data=data['ranked'], chartname='ranked-beatmaps') }}
+        {{ card(title='Total ranked beatmaps', data=counts['ranked'], chartname='ranked-beatmaps') }}
     </div>
     <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total loved beatmaps', data=data['loved'], chartname='loved-beatmaps') }}
+        {{ card(title='Total loved beatmaps', data=counts['loved'], chartname='loved-beatmaps') }}
     </div>
     <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total Pending beatmaps', data=data['pending'], chartname='pending-beatmaps') }}
+        {{ card(title='Total Pending beatmaps', data=counts['pending'], chartname='pending-beatmaps') }}
     </div>
     <!-- Beatmap list -->
     <div class="card-body border-bottom py-3">

From cfe2c3bcb642c11235e3e3bb9289fb48f1a1af7e Mon Sep 17 00:00:00 2001
From: Pavaresorn Malai <61514399+Varkaria@users.noreply.github.com>
Date: Wed, 7 Jul 2021 14:15:14 +0700
Subject: [PATCH 026/278] change: refactor code

---
 blueprints/admin.py             |  93 ++++++++++---------------
 objects/varka.py                |  46 +++++++++++++
 templates/admin/users.html      | 116 ++++++++------------------------
 templates/admin/users_edit.html |  90 +++++++++++++++++++++++++
 4 files changed, 201 insertions(+), 144 deletions(-)
 create mode 100644 objects/varka.py
 create mode 100644 templates/admin/users_edit.html

diff --git a/blueprints/admin.py b/blueprints/admin.py
index a835c7b8..f5a25620 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -2,9 +2,7 @@
 
 __all__ = ()
 
-import datetime
-
-import timeago
+import json
 from quart import Blueprint
 from quart import render_template
 from quart import session
@@ -13,9 +11,18 @@
 
 from objects import glob
 from objects.utils import flash
+from objects import varka
 
 admin = Blueprint('admin', __name__)
 
+def dict_cmp(a: dict, b: dict):
+    cmp = a.items() - b.items()
+    return dict(cmp)
+
+async def get(table_name: str, id: str):
+    data = await varka.get_data(table_name, id)
+    return data
+
 @admin.route('/')
 @admin.route('/home')
 @admin.route('/dashboard')
@@ -28,67 +35,41 @@ async def home():
         return await flash('error', f'You have insufficient privileges.', 'home')
 
     # fetch data from database
-    dash_data = await glob.db.fetch(
+    counts = await glob.db.fetch(
         'SELECT COUNT(id) count, '
-        '(SELECT name FROM users ORDER BY id DESC LIMIT 1) lastest_user, '
-        '(SELECT COUNT(id) FROM users WHERE NOT priv & 1) banned '
+        '(SELECT name FROM users ORDER BY id DESC LIMIT 1) AS `lastest_user`, '
+        '(SELECT COUNT(id) FROM users WHERE NOT priv & 1) AS `banned` '
         'FROM users'
     )
 
-    recent_users = await glob.db.fetchall('SELECT * FROM users ORDER BY id DESC LIMIT 5')
-    recent_scores = await glob.db.fetchall(
-        'SELECT scores_vn.*, maps.artist, maps.title, '
-        'maps.set_id, maps.creator, maps.version '
-        'FROM scores_vn JOIN maps ON scores_vn.map_md5 = maps.md5 '
-        'ORDER BY scores_vn.id DESC LIMIT 5'
-    )
+    data = {
+        "counts" : counts,
+        "recent_users": await varka.get_users(),
+        "recent_scores": await varka.get_scores()
+    }
 
-    return await render_template(
-        'admin/home.html', dashdata=dash_data,
-        recentusers=recent_users, recentscores=recent_scores,
-        datetime=datetime, timeago=timeago
-    )
+    return await render_template('admin/home.html', data=data)
 
-@admin.route('/users', methods=['GET', 'POST'])
+@admin.route('/users')
 async def users():
-
-    query_data = await glob.db.fetchall('SELECT name AS `username`, id FROM users ORDER BY id')
-
-    if request.method == 'POST':
-        error = 'User not found!'
-        for i in await request.values:
-            header = i
-        if header == 'username':
-            username = (await request.form)['username']
-            search_data = await glob.db.fetch('SELECT id, name, email FROM users WHERE name = %s', [username])
-            glob.cache['search_data'] = search_data['id']
-            if not search_data:
-                return await render_template('admin/users.html', query_data=query_data, search_data=search_data, error=error)
-            return await render_template('admin/users.html', query_data=query_data, search_data=search_data)
-        elif header == 'email':
-            email = (await request.form)['email']
-            search_data = await glob.db.fetch('SELECT id, name, email FROM users WHERE email = %s', [email])
-            glob.cache['search_data'] = search_data['id']
-            if not search_data:
-                return await render_template('admin/users.html', query_data=query_data, search_data=search_data, error=error)
-            return await render_template('admin/users.html', query_data=query_data, search_data=search_data)
-    return await render_template('admin/users.html', query_data=query_data)
-
-@admin.route('/users/update', methods=['GET', 'POST'])
-async def up_user():
-    if request.method == 'POST':
-        form = await request.form
-        id = glob.cache['search_data']
-        username = form['edit-username']
+    return await render_template('admin/users.html', query_data=await varka.get_users())
+
+@admin.route('/users/edit/<id>')
+async def users_edit(id:int):
+    query = await varka.get_user(id)
+    return await render_template('admin/users_edit.html', search_data=query)
+
+@admin.route('/users/update/<id>', methods=['POST']) # POST
+async def users_update(id:int):
+    form = await request.form
+    datadef: dict = await get('users', id)
+    data = dict(
+        name = form['edit-username'],
+        safe_name = form['edit-username'].lower().replace(' ', '_'),
         email = form['edit-email']
-        if not username and not email:
-            return redirect('/admin/users')
-        elif not username:
-            await glob.db.execute('UPDATE users SET email=%s WHERE id = %s ', [email, id])
-        elif not email:
-            await glob.db.execute('UPDATE users SET name=%s, safe_name=LOWER(%s) WHERE id = %s', [username, username, id])
-        else:
-            await glob.db.execute('UPDATE users SET name=%s, safe_name=LOWER(%s), email=%s WHERE id = %s', [username, username, email, id])
+    )
+    
+    await varka.update('users', ('id', id), **dict_cmp(data, datadef))
     return redirect('/admin/users')
 
 @admin.route('/reports')
diff --git a/objects/varka.py b/objects/varka.py
new file mode 100644
index 00000000..997b5fa8
--- /dev/null
+++ b/objects/varka.py
@@ -0,0 +1,46 @@
+from objects import glob
+from quart import jsonify
+import json
+
+async def get_users(limit:int=25):
+    """Returns the all of a users."""
+    query = (f'SELECT * FROM users ORDER BY id DESC LIMIT {limit}')
+    res = await glob.db.fetchall(query)
+    return res
+
+async def get_user(id:int):
+    """Returns the all of a users."""
+    query = (f'SELECT * FROM users WHERE id={id}')
+    res = await glob.db.fetch(query)
+    return res
+
+async def get_scores(limit:int=25):
+    """Returns the all of a scores."""
+    query = (
+        'SELECT scores_vn.*, maps.artist, maps.title, '
+        'maps.set_id, maps.creator, maps.version '
+        'FROM scores_vn '
+        'JOIN maps ON scores_vn.map_md5 = maps.md5 '
+        f'ORDER BY scores_vn.id DESC LIMIT {limit}'
+    )
+    res = await glob.db.fetchall(query)
+    return res
+
+async def get_data(table_name:str, id:str):
+    if table_name in ('users'):
+        if id.isdigit():
+            return await glob.db.fetch('select * from `%s` where id = %s limit 1' % (table_name, id))
+        else:
+            return (404)
+    else:
+        return (404)
+
+async def update(table, id, **kargs):
+    params = []
+    for k, v in kargs.items():
+        if v is not None:
+            params.append(f"{k}='{v}'")
+        else:
+            params.append(f"{k}=NULL")
+    await glob.db.execute("UPDATE `%s` SET %s WHERE %s = '%s'" % (table, ', '.join(params), *id))
+    return 'ok'
\ No newline at end of file
diff --git a/templates/admin/users.html b/templates/admin/users.html
index fc13ac32..5fc1b16f 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -37,8 +37,9 @@
                             <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">Cancel</button>
                         </div>
                         <div class="col">
-                            <button type="submit" id="del-submit" form="{{ name }}" class="btn btn-primary w-100">Edit</button>
-                        </div>   
+                            <button type="submit" id="del-submit" form="{{ name }}"
+                                class="btn btn-primary w-100">Edit</button>
+                        </div>
                     </div>
                 </div>
             </div>
@@ -66,61 +67,16 @@ <h4 class="alert-title">{{ error }}</h4>
     <div class="col-sm-6 col-lg-3">
         {{ card(title='Premium users',data=727) }}
     </div>
-    {% if search_data %}
-    <div class="col-12">
-        <div class="card">
-            <div class="card-header">Edit info of {{ search_data.name }}</div>
-            <div class="card-body">
-                <form action="/admin/users/update" method="POST" id="edit-usr">
-                    <label class="form-label">Username</label>
-                    <div>
-                        <div class="input-icon mb-3">
-                            <span class="input-icon-addon">
-                                <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><circle cx="12" cy="7" r="4"></circle><path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path></svg>
-                            </span>
-                            <input type="text" name="edit-username" class="form-control" placeholder="{{ search_data.name }}">
-                        </div>
-                        <label class="form-label">Email</label>
-                        <div class="input-icon mb-3">
-                            <span class="input-icon-addon">
-                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-mail" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="#2c3e50" fill="none" stroke-linecap="round" stroke-linejoin="round">
-                                    <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
-                                    <rect x="3" y="5" width="18" height="14" rx="2" />
-                                    <polyline points="3 7 12 13 21 7" />
-                                </svg>
-                            </span>
-                            <input type="text" name="edit-email" class="form-control" placeholder="{{ search_data.email }}">
-                        </div>
-                    </div>
-                </form>
-            </div>
-            <div class="card-footer">
-                <div class="w-100">
-                    <div class="row">
-                        <div class="col">
-                            <a href="/admin/users"><button type="button" class="btn btn-white w-100">Cancel</button></a>
-                        </div>
-                        <div class="col">
-                            <form action="/admin/users/forgot/{{ search_data.id }}" method="post">
-                                <button type="submit" class="btn w-100 disabled">User forgot password?</button>
-                            </form>
-                        </div>
-                        <div class="col">
-                            <button type="submit" class="btn btn-primary w-100" data-bs-toggle="modal" data-bs-target="#edit-confirmed">Save</button>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-    {% endif %}
     <div class="col-12">
         <div class="card">
             <div class="card-header">
                 <div class="d-flex m-auto">
-                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-usr">Edit user (username)</button>
-                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-ema">Edit user (email)</button>
-                    <button type="button" class="btn m-2 disabled" data-bs-toggle="modal" data-bs-target="#sch-ip">Search user by IP</button>
+                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-usr">Edit user
+                        (username)</button>
+                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-ema">Edit user
+                        (email)</button>
+                    <button type="button" class="btn m-2 disabled" data-bs-toggle="modal"
+                        data-bs-target="#sch-ip">Search user by IP</button>
                     <button type="button" class="btn m-2 disabled">Silence user</button>
                     <button type="button" class="btn m-2 disabled">Kick user from bancho</button>
                 </div>
@@ -130,7 +86,8 @@ <h4 class="alert-title">{{ error }}</h4>
                     <div class="text-muted">
                         Show
                         <div class="mx-2 d-inline-block">
-                            <input type="text" class="form-control form-control-sm" value="8" size="3" aria-label="Users count">
+                            <input type="text" class="form-control form-control-sm" value="8" size="3"
+                                aria-label="Users count">
                         </div>
                         entries
                     </div>
@@ -149,7 +106,6 @@ <h4 class="alert-title">{{ error }}</h4>
                             <th>ID</th>
                             <th>Username</th>
                             <th>Privilege groups</th>
-                            <th>Allowed</th>
                             <th>Action</th>
                         </tr>
                     </thead>
@@ -157,11 +113,12 @@ <h4 class="alert-title">{{ error }}</h4>
                         {% for i in query_data %}
                         <tr>
                             <td>{{ i.id }}</td>
-                            <td>{{ i.username }}</td>
-                            <td>Developer</td>
+                            <td class="td-truncate">{{ i.name }}</td>
                             <td>Yes</td>
                             <td>
-                                <button type="submit" class="btn" form="username" name="username" value="{{ i.username }}"><i class="far fa-edit" aria-hidden="true"></i></button>
+                                <a class="btn" href="/admin/users/edit/{{ i.id }}">
+                                    <i class="far fa-edit" aria-hidden="true"></i> Edit
+                                </a>
                             </td>
                         </tr>
                         {% endfor %}
@@ -172,19 +129,27 @@ <h4 class="alert-title">{{ error }}</h4>
                 <ul class="pagination m-0 m-auto">
                     <li class="page-item">
                         <a class="page-link" href="#" tabindex="-1">
-                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="15 6 9 12 15 18"></polyline></svg>
-                            prev
+                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
+                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+                                stroke-linecap="round" stroke-linejoin="round">
+                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                <polyline points="15 6 9 12 15 18"></polyline>
+                            </svg>
                         </a>
                     </li>
                     <li class="page-item active"><a class="page-link" href="#">1</a></li>
                     <li class="page-item"><a class="page-link" href="#">2</a></li>
                     <li class="page-item"><a class="page-link" href="#">3</a></li>
                     <li class="page-item"><a class="page-link" href="#">4</a></li>
-                    <li class="page-item"><a class="page-link" href="#">5</a></li> 
+                    <li class="page-item"><a class="page-link" href="#">5</a></li>
                     <li class="page-item">
                         <a class="page-link" href="#">
-                            next
-                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="9 6 15 12 9 18"></polyline></svg>
+                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
+                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+                                stroke-linecap="round" stroke-linejoin="round">
+                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                <polyline points="9 6 15 12 9 18"></polyline>
+                            </svg>
                         </a>
                     </li>
                 </ul>
@@ -194,34 +159,9 @@ <h4 class="alert-title">{{ error }}</h4>
 </div>
 
 {{ modal(title='Username', id="edi-usr-usr", name='username') }}
-
 {{ modal(title='Email', id="edi-usr-ema", name='email') }}
-
 {{ modal(title='IP', id="sch-ip", name='ip') }}
 
-<div class="modal modal-blur fade" id="edit-confirmed" tabindex="-1" aria-hidden="true">
-    <div class="modal-dialog modal-sm" role="document">
-        <div class="modal-content">
-            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-            <div class="modal-header text-center">
-                <h1>Confirmed?</h1>
-            </div>
-            <div class="modal-body text-start pt-4">
-                <div class="w-100">
-                    <div class="row">
-                        <div class="col">
-                            <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">No</button>
-                        </div>
-                        <div class="col">
-                            <button type="submit" form="edit-usr" class="btn btn-danger w-100">Yes</button>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-
 {% endblock %}
 
 {% block scriptb %}
diff --git a/templates/admin/users_edit.html b/templates/admin/users_edit.html
new file mode 100644
index 00000000..711be142
--- /dev/null
+++ b/templates/admin/users_edit.html
@@ -0,0 +1,90 @@
+{% extends 'admin/base.html' %}
+{% block title %} Users {% endblock %}
+
+{% block content %}
+{% if error %}
+<div class="alert alert-danger col-lg-3" role="alert" style="display: block; position: relative; margin-top: -3.5rem;">
+    <h4 class="alert-title">{{ error }}</h4>
+</div>
+{% endif %}
+<div class="row row-deck row-cards">
+    <div class="col-12">
+        <div class="card">
+            <div class="card-header">Edit info of {{ search_data['name'] }}</div>
+            <div class="card-body">
+                <form action="/admin/users/update/{{ search_data['id'] }}" method="POST" id="edit-usr">
+                    <label class="form-label">Username</label>
+                    <div>
+                        <div class="input-icon mb-3">
+                            <span class="input-icon-addon">
+                                <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
+                                    viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+                                    stroke-linecap="round" stroke-linejoin="round">
+                                    <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                    <circle cx="12" cy="7" r="4"></circle>
+                                    <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>
+                                </svg>
+                            </span>
+                            <input type="text" name="edit-username" class="form-control" value="{{ search_data.name }}">
+                        </div>
+                        <label class="form-label">Email</label>
+                        <div class="input-icon mb-3">
+                            <span class="input-icon-addon">
+                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-mail"
+                                    width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="#2c3e50"
+                                    fill="none" stroke-linecap="round" stroke-linejoin="round">
+                                    <path stroke="none" d="M0 0h24v24H0z" fill="noneW" />
+                                    <rect x="3" y="5" width="18" height="14" rx="2" />
+                                    <polyline points="3 7 12 13 21 7" />
+                                </svg>
+                            </span>
+                            <input type="text" name="edit-email" class="form-control" value="{{ search_data.email }}">
+                        </div>
+                    </div>
+                </form>
+            </div>
+            <div class="card-footer">
+                <div class="w-100">
+                    <div class="row">
+                        <div class="col">
+                            <a href="/admin/users"><button type="button" class="btn btn-white w-100">Cancel</button></a>
+                        </div>
+                        <div class="col">
+                            <form action="/admin/users/forgot/{{ search_data.id }}" method="post">
+                                <button type="submit" class="btn w-100 disabled">User forgot password?</button>
+                            </form>
+                        </div>
+                        <div class="col">
+                            <button type="submit" class="btn btn-primary w-100" data-bs-toggle="modal"
+                                data-bs-target="#edit-confirmed">Save</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<div class="modal modal-blur fade" id="edit-confirmed" tabindex="-1" aria-hidden="true">
+    <div class="modal-dialog modal-sm" role="document">
+        <div class="modal-content">
+            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            <div class="modal-header text-center">
+                Are you sure to modify this user?
+            </div>
+            <div class="modal-body text-start pt-4">
+                <div class="w-100">
+                    <div class="row">
+                        <div class="col">
+                            <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">No</button>
+                        </div>
+                        <div class="col">
+                            <button type="submit" form="edit-usr" class="btn btn-danger w-100">Yes</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}
\ No newline at end of file

From b0c5959ca9df49a9a1b2ff635ff7639272cb2e54 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Wed, 7 Jul 2021 16:32:21 +0700
Subject: [PATCH 027/278] fix: modal broke in users page

---
 blueprints/admin.py | 15 ++++++++++++++-
 objects/varka.py    | 10 ++++++++++
 2 files changed, 24 insertions(+), 1 deletion(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index f5a25620..548a67cf 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -50,8 +50,21 @@ async def home():
 
     return await render_template('admin/home.html', data=data)
 
-@admin.route('/users')
+@admin.route('/users', methods=['GET','POST'])
 async def users():
+    if request.method == 'POST':
+        try:
+            try:
+                username = (await request.form)['username']
+                id = (await varka.get_user_username(username))['id']
+                return redirect(f'/admin/users/edit/{id}')
+            except:
+                email = (await request.form)['email']
+                id = (await varka.get_user_email(email))['id']
+                return redirect(f'/admin/users/edit/{id}')
+        except:
+            error = 'User not found!'
+            return await render_template('admin/users.html', query_data=await varka.get_users(), error=error)
     return await render_template('admin/users.html', query_data=await varka.get_users())
 
 @admin.route('/users/edit/<id>')
diff --git a/objects/varka.py b/objects/varka.py
index 997b5fa8..568ec1b8 100644
--- a/objects/varka.py
+++ b/objects/varka.py
@@ -14,6 +14,16 @@ async def get_user(id:int):
     res = await glob.db.fetch(query)
     return res
 
+async def get_user_username(username:str):
+    query = (f'SELECT id from users WHERE name="{username}"')
+    res = await glob.db.fetch(query)
+    return res
+
+async def get_user_email(email:str):
+    query = (f'SELECT id from users WHERE email="{email}"')
+    res = await glob.db.fetch(query)
+    return res
+
 async def get_scores(limit:int=25):
     """Returns the all of a scores."""
     query = (

From e867bcee7dd2587ffc9ef0490c1d30f34ef3cb45 Mon Sep 17 00:00:00 2001
From: def750 <def75023@gmail.com>
Date: Wed, 7 Jul 2021 14:50:11 +0200
Subject: [PATCH 028/278] Add: Logs and beatmaps to admin panel

---
 blueprints/admin.py | 46 +++++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 44 insertions(+), 2 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 548a67cf..a4546a0f 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -103,7 +103,28 @@ async def privilege():
 
 @admin.route('/beatmaps')
 async def beatmaps():
-    return await render_template('admin/beatmaps.html')
+    query = await glob.db.fetch(
+        'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
+        '(SELECT COUNT(id) as `l` FROM maps WHERE `status`= 5) AS `l`, '
+        '(SELECT COUNT(id) as `p` FROM maps WHERE `status`= 0) AS `p`, '
+        '(SELECT COUNT(id) as `t` FROM maps) `t`'
+    )
+    counts = {
+        "ranked": query['r'], 
+        "loved": query['l'], 
+        "pending": query['p'], 
+        "total": query['t']
+    }
+    # This thing needs to be moved to API
+    beatmaps = await glob.db.fetchall(
+        'SELECT set_id, id AS `map_id`, status, '
+        'artist, title, version AS `diff_name`, '
+        'total_length AS length, creator, mode, '
+        'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
+        'FROM maps ORDER BY id DESC '
+        'LIMIT 10 OFFSET 0'
+    )
+    return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps)
 
 @admin.route('/badges')
 async def badges():
@@ -111,4 +132,25 @@ async def badges():
 
 @admin.route('/logs')
 async def logs():
-    return await render_template('admin/log.html')
\ No newline at end of file
+    query_data = await glob.db.fetchall('SELECT * FROM logs ORDER BY id DESC LIMIT 25 OFFSET 0') #Preset offset for 'show more' button
+    lc = await glob.db.fetchall('SELECT COUNT(id) AS `n` FROM logs')
+    #Reassign stuff to make it look clean
+    userdata = []
+    for i in query_data:
+        mod = await glob.db.fetch(f'SELECT name, country FROM users WHERE id={i["from"]}')
+        user = await glob.db.fetch(f'SELECT name, country FROM users WHERE id={i["to"]}')
+        fdata = {
+            'logcount': str(lc[0]['n']),
+            'action_id': i['id'],
+            'u1_name': mod['name'],
+            'u1_id': i['from'],
+            'u1_country': mod['country'],
+            'u2_name': user['name'],
+            'u2_id': i['to'],
+            'u2_country': user['country'],
+            'time': i['time'],
+            'msg': i['msg'],
+        }
+        userdata.append(fdata)
+    print("\n", userdata, "\n")
+    return await render_template('admin/log.html', query_data=userdata)

From 82e35539bc9d8b4836d13ef2ceaef546766b7a1d Mon Sep 17 00:00:00 2001
From: def750 <def75023@gmail.com>
Date: Wed, 7 Jul 2021 14:51:01 +0200
Subject: [PATCH 029/278] Add: Beatmaps template

---
 templates/admin/beatmaps.html | 167 ++++++++++++++++++++++++++++++++--
 1 file changed, 161 insertions(+), 6 deletions(-)

diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 08c5d6d3..ae273cf7 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -17,19 +17,174 @@
 </div>
 {% endmacro %}
 
+
 {% block content %}
 <div class="row row-deck row-cards">
     <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total beatmaps in database', data=1, chartname='total-beatmaps') }}
+        {{ card(title='Total beatmaps in database', data=counts['total'], chartname='total-beatmaps') }}
+    </div>
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Total ranked beatmaps', data=counts['ranked'], chartname='ranked-beatmaps') }}
     </div>
     <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total ranked beatmaps', data=1) }}
+        {{ card(title='Total loved beatmaps', data=counts['loved'], chartname='loved-beatmaps') }}
     </div>
     <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total loved beatmaps', data=1) }}
+        {{ card(title='Total Pending beatmaps', data=counts['pending'], chartname='pending-beatmaps') }}
     </div>
-    <div class="col-sm-6 col-lg-3"> 
-        {{ card(title='Total Pending beatmaps', data=1) }}
+    <div class="col-12">
+        <div class="card">
+            <div class="card-body border-bottom py-3">
+                <div class="d-flex">
+                    <div class="text-muted">
+                        Show
+                        <div class="mx-2 d-inline-block">
+                            <input type="text" class="form-control form-control-sm" value="10" size="3"
+                                aria-label="Users count">
+                        </div>
+                        entries
+                    </div>
+                    <div class="ms-auto text-muted">
+                        Search:
+                        <div class="ms-2 d-inline-block">
+                            <input type="text" class="form-control form-control-sm" aria-label="Search invoice">
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="table-responsive">
+                <table class="table card-table table-vcenter text-nowrap datatable">
+                    <thead style="text-align: center;">
+                        <tr>
+                            <th>
+                                Beatmap
+                            </th>
+                            <th>
+                                Mode
+                            </th>
+                            <th>
+                                CS / Keys
+                            </th>
+                            <th>
+                                AR
+                            </th>
+                            <th>
+                                HP
+                            </th>
+                            <th>
+                                OD
+                            </th>
+                            <th>
+                                BPM
+                            </th>
+                            <th>
+                                Length
+                            </th>
+                            <th>
+                                Stars
+                            </th>
+                            <th>
+                                Manage Status
+                            </th>
+                        </tr>
+                    </thead>
+                    <tbody style="text-align: center;">
+                        {% for i in bmap_query %}
+                        <tr>
+                            <td class="no-padding">
+                                <div class="card song-banner"
+                                    style="background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size:cover">
+                                    <div class="card-body" style="background-color: rgba(0, 0, 0, 0.45);">
+                                        <a href="https://osu.ppy.sh/beatmapsets/{{ i.set_id }}" target="_blank"
+                                            class="text-white">{{ i.artist }} + {{ i.creator }} -
+                                            <br />{{ i.title }}. [{{ i.diff_name }}]</a>
+                                    </div>
+                                </div>
+                            </td>
+                            <td>
+                                {{ i.mode }}
+                            </td>
+                            <td>
+                                {{ i.cs }}
+                            </td>
+                            <td>
+                                {{ i.ar }}
+                            </td>
+                            <td>
+                                {{ i.hp }}
+                            </td>
+                            <td>
+                                {{ i.od }}
+                            </td>
+                            <td>
+                                {{ i.bpm }}
+                            </td>
+                            <td>
+                                {{ i.length }}
+                            </td>
+                            <td>
+                                {{ i.stars }}
+                            </td>
+                            <td> <!-- TODO: Add js script to display correct status here -->
+                                <button type="button" class="btn dropdown-toggle" data-bs-toggle="dropdown">⠀
+                                    Status Here
+                                </button>
+                                <div class="dropdown-menu">
+                                    <a class="btn1a dropdown-item" href="#">
+                                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
+                                            class="bi bi-chevron-double-up" viewBox="0 0 16 16" style="color: #00cf97;">
+                                            <path fill-rule="evenodd"
+                                                d="M7.646 2.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 3.707 2.354 9.354a.5.5 0 1 1-.708-.708l6-6z" />
+                                            <path fill-rule="evenodd"
+                                                d="M7.646 6.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 7.707l-5.646 5.647a.5.5 0 0 1-.708-.708l6-6z" />
+                                        </svg>⠀
+                                        Ranked
+                                    </a>
+                                    <a class="btn2a dropdown-item" href="#">
+                                        <i class="fas fa-heart" style="color: rgb(255, 172, 237);"></i>⠀
+                                        Loved
+                                    </a>
+                                    <a class="btn3a dropdown-item" href="#">
+                                        <i class="fas fa-question"></i>⠀
+                                        Unranked
+                                    </a>
+                                </div>
+                            </td>
+                        </tr>
+                        {% endfor %}
+                    </tbody>        
+                </table>
+            </div>
+            <div class="card-footer d-flex align-items-center">
+                <ul class="pagination m-0 m-auto">
+                    <li class="page-item">
+                        <a class="page-link" href="#" tabindex="-1">
+                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
+                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+                                stroke-linecap="round" stroke-linejoin="round">
+                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                <polyline points="15 6 9 12 15 18"></polyline>
+                            </svg>
+                        </a>
+                    </li>
+                    <li class="page-item active"><a class="page-link" href="#">1</a></li>
+                    <li class="page-item"><a class="page-link" href="#">2</a></li>
+                    <li class="page-item"><a class="page-link" href="#">3</a></li>
+                    <li class="page-item"><a class="page-link" href="#">4</a></li>
+                    <li class="page-item"><a class="page-link" href="#">5</a></li>
+                    <li class="page-item">
+                        <a class="page-link" href="#">
+                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
+                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+                                stroke-linecap="round" stroke-linejoin="round">
+                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                <polyline points="9 6 15 12 9 18"></polyline>
+                            </svg>
+                        </a>
+                    </li>
+                </ul>
+            </div>
+        </div>
     </div>
 </div>
-{% endblock %}
\ No newline at end of file
+{% endblock %}

From 13c3a38c116aee70b8f4d2b81b9575e41548cf5d Mon Sep 17 00:00:00 2001
From: def750 <def75023@gmail.com>
Date: Wed, 7 Jul 2021 14:51:28 +0200
Subject: [PATCH 030/278] Update users.html

---
 templates/admin/users.html | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/templates/admin/users.html b/templates/admin/users.html
index 5fc1b16f..5b0735f0 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -113,11 +113,14 @@ <h4 class="alert-title">{{ error }}</h4>
                         {% for i in query_data %}
                         <tr>
                             <td>{{ i.id }}</td>
-                            <td class="td-truncate">{{ i.name }}</td>
+                            <td class="td-truncate">
+                                <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
+                                <a href="/u/{{ i.id }}">{{ i.name }}</a>
+                            </td>
                             <td>Yes</td>
                             <td>
                                 <a class="btn" href="/admin/users/edit/{{ i.id }}">
-                                    <i class="far fa-edit" aria-hidden="true"></i> Edit
+                                    <i class="far fa-edit" aria-hidden="true"></i>⠀Edit
                                 </a>
                             </td>
                         </tr>
@@ -222,4 +225,4 @@ <h4 class="alert-title">{{ error }}</h4>
         })).render();
     });
 </script>
-{% endblock scriptb %}
\ No newline at end of file
+{% endblock scriptb %}

From 4fd70a96347730d5e2da3518fdda89ad5661da4a Mon Sep 17 00:00:00 2001
From: def750 <def75023@gmail.com>
Date: Wed, 7 Jul 2021 14:51:54 +0200
Subject: [PATCH 031/278] Add: logs template

---
 templates/admin/log.html | 105 ++++++++++++++++++++++++++++++++++++++-
 1 file changed, 103 insertions(+), 2 deletions(-)

diff --git a/templates/admin/log.html b/templates/admin/log.html
index b43a9c32..a61bd8ee 100644
--- a/templates/admin/log.html
+++ b/templates/admin/log.html
@@ -2,6 +2,107 @@
 {% extends 'admin/base.html' %}
 {% block title %} Logs {% endblock %}
 
-{% block content %}
+{% macro card(title='base', haschart=true, chartname='base', data=0) %}
+<div class="card">
+    <div class="card-body">
+        <div class="d-flex align-items-center">
+            <div class="subheader">{{ title }}</div>
+        </div>
+        <div class="d-flex align-items-baseline">
+            <div class="h1 mb-0 me-2">{{ data }}</div>
+        </div>
+    </div>
+    {% if haschart %}
+    <div id="chart-{{ chartname }}" class="chart-sm"></div>
+    {% endif %}
+</div>
+{% endmacro %}
 
-{% endblock %}
\ No newline at end of file
+{% block content %}
+{% if error %}
+<div class="alert alert-danger col-lg-3" role="alert" style="display: block; position: relative; margin-top: -3.5rem;">
+    <h4 class="alert-title">{{ error }}</h4>
+</div>
+{% endif %}
+<div class="row row-deck row-cards">
+    <div class="col-sm-6 col-lg-6">
+        {{ card(title='Total logs', data=query_data[0]['logcount'], chartname='logs-total') }}
+    </div>
+    <div class="col-sm-6 col-lg-6">
+        {{ card(title='Logs this month',data=727, chartname='logs-month') }}
+    </div>
+    <div class="col-12">
+        <div class="card">
+            <div class="card-body border-bottom py-3">
+                <div class="d-flex">
+                    <div class="text-muted">
+                        Show
+                        <div class="mx-2 d-inline-block">
+                            <input type="text" class="form-control form-control-sm" value="25" size="3" aria-label="Users count">
+                        </div>
+                        entries
+                    </div>
+                    <div class="ms-auto text-muted">
+                        Search:
+                        <div class="ms-2 d-inline-block">
+                            <input type="text" class="form-control form-control-sm" aria-label="Search invoice">
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="table-responsive">
+                <table class="table card-table table-vcenter text-nowrap datatable">
+                    <thead>
+                        <tr>
+                            <th>Action ID</th>
+                            <th>Date</th>
+                            <th>Moderator</th>
+                            <th>User Affected</th>
+                            <th>Log message</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        {% for i in query_data %}
+                        <tr>
+                            <td>#{{ i.action_id }} </td>
+                            <td>{{ i.time }}</td>
+                            <td>
+                                <img src="/static/images/flags/{{ i.u1_country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
+                                <a href="/u/{{ i.u1_id }}">{{ i.u1_name }}</a>
+                            </td>
+                            <td>
+                                <img src="/static/images/flags/{{ i.u2_country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
+                                <a href="/u/{{ i.u2_id }}">{{ i.u2_name }}</a>
+                            </td>
+                            <td>{{ i.msg }}</td>
+                        </tr>
+                        {% endfor %}
+                    </tbody>
+                </table>
+            </div>
+            <div class="card-footer d-flex align-items-center">
+                <ul class="pagination m-0 m-auto">
+                    <li class="page-item">
+                        <a class="page-link" href="#" tabindex="-1">
+                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="15 6 9 12 15 18"></polyline></svg>
+                            prev
+                        </a>
+                    </li>
+                    <li class="page-item active"><a class="page-link" href="#">1</a></li>
+                    <li class="page-item"><a class="page-link" href="#">2</a></li>
+                    <li class="page-item"><a class="page-link" href="#">3</a></li>
+                    <li class="page-item"><a class="page-link" href="#">4</a></li>
+                    <li class="page-item"><a class="page-link" href="#">...</a></li>
+                    <li class="page-item"><a class="page-link" href="#">5</a></li> 
+                    <li class="page-item">
+                        <a class="page-link" href="#">
+                            next
+                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="9 6 15 12 9 18"></polyline></svg>
+                        </a>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}

From 81f5c69056dd90e63bf29bc203b3471133d3f1ef Mon Sep 17 00:00:00 2001
From: Pavaresorn Malai <61514399+Varkaria@users.noreply.github.com>
Date: Wed, 7 Jul 2021 21:09:49 +0700
Subject: [PATCH 032/278] more: formatting

---
 blueprints/admin.py | 19 +++++++------------
 1 file changed, 7 insertions(+), 12 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index e080c9e0..2a1fb814 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -136,19 +136,14 @@ async def logs():
     #Reassign stuff to make it look clean
     userdata = []
     for i in query_data:
-        mod = await glob.db.fetch(f'SELECT name, country FROM users WHERE id={i["from"]}')
-        user = await glob.db.fetch(f'SELECT name, country FROM users WHERE id={i["to"]}')
+        mod = await glob.db.fetch('SELECT name, country FROM users WHERE id=%s', (i['from']))
+        user = await glob.db.fetch('SELECT name, country FROM users WHERE id=%s', (i['to']))
         fdata = {
-            'logcount': str(lc[0]['n']),
-            'action_id': i['id'],
-            'u1_name': mod['name'],
-            'u1_id': i['from'],
-            'u1_country': mod['country'],
-            'u2_name': user['name'],
-            'u2_id': i['to'],
-            'u2_country': user['country'],
-            'time': i['time'],
-            'msg': i['msg'],
+            'logcount': str(lc[0]['n']), 'action_id': i['id'],
+            'u1_name': mod['name'], 'u1_id': i['from'],
+            'u1_country': mod['country'], 'u2_name': user['name'],
+            'u2_id': i['to'], 'u2_country': user['country'],
+            'time': i['time'], 'msg': i['msg'],
         }
         userdata.append(fdata)
     print("\n", userdata, "\n")

From 6dcf531c9d823aa3933e204a8694a52f7313c3fc Mon Sep 17 00:00:00 2001
From: Pavaresorn Malai <61514399+Varkaria@users.noreply.github.com>
Date: Wed, 7 Jul 2021 23:24:37 +0700
Subject: [PATCH 033/278] remove: unused thing

---
 static/js/pages/admin/dashboard.js | 35 ------------------------------
 1 file changed, 35 deletions(-)
 delete mode 100644 static/js/pages/admin/dashboard.js

diff --git a/static/js/pages/admin/dashboard.js b/static/js/pages/admin/dashboard.js
deleted file mode 100644
index 1712e4ff..00000000
--- a/static/js/pages/admin/dashboard.js
+++ /dev/null
@@ -1,35 +0,0 @@
-new Vue({
-    el: "#dashboard",
-    delimiters: ["<%", "%>"],
-    data() {
-        return {
-            online_users: 0,
-        }
-    },
-    created() {
-        var vm = this;
-        vm.GetOnlineUsers()
-    },
-    methods: {
-        GetOnlineUsers() {
-            var vm = this;
-            vm.$axios.get(`${window.location.protocol}//${window.location.hostname}:${window.location.port}/gw_api/get_online`)
-                .then(function (response) {
-                    vm.online_users = response.data.online;
-                });
-        },
-        addCommas(nStr) {
-            nStr += '';
-            var x = nStr.split('.');
-            var x1 = x[0];
-            var x2 = x.length > 1 ? '.' + x[1] : '';
-            var rgx = /(\d+)(\d{3})/;
-            while (rgx.test(x1)) {
-                x1 = x1.replace(rgx, '$1' + ',' + '$2');
-            }
-            return x1 + x2;
-        }
-    },
-    computed: {
-    }
-});

From a5ce4cea38e698a75579d19bbd12c653e1a689a7 Mon Sep 17 00:00:00 2001
From: Pavaresorn Malai <61514399+Varkaria@users.noreply.github.com>
Date: Wed, 7 Jul 2021 23:24:58 +0700
Subject: [PATCH 034/278] add: search page

---
 blueprints/admin.py              |  11 ++++
 objects/varka.py                 |  18 +++++-
 static/css/pages/admin/style.css |  15 +++++
 templates/admin/search.html      | 105 +++++++++++++++++++++++++++++++
 4 files changed, 146 insertions(+), 3 deletions(-)
 create mode 100644 templates/admin/search.html

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 2a1fb814..ab356457 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -7,6 +7,7 @@
 from quart import session
 from quart import request
 from quart import redirect
+from quart import jsonify
 
 from objects import glob
 from objects.utils import flash
@@ -148,3 +149,13 @@ async def logs():
         userdata.append(fdata)
     print("\n", userdata, "\n")
     return await render_template('admin/log.html', query_data=userdata)
+
+@admin.route('/api/search')
+async def search_api():
+    s = request.args.get('search', type=str)
+    res = await varka.get_users(search=s)
+    return jsonify(res)
+
+@admin.route('/search')
+async def search():
+    return await render_template('admin/search.html')
\ No newline at end of file
diff --git a/objects/varka.py b/objects/varka.py
index 568ec1b8..3f4ba0a8 100644
--- a/objects/varka.py
+++ b/objects/varka.py
@@ -2,10 +2,22 @@
 from quart import jsonify
 import json
 
-async def get_users(limit:int=25):
+async def get_users(limit:int=25, search:str=None):
     """Returns the all of a users."""
-    query = (f'SELECT * FROM users ORDER BY id DESC LIMIT {limit}')
-    res = await glob.db.fetchall(query)
+    query = ['SELECT * FROM users']
+    args = []
+
+    if search:
+        query.append("WHERE `name` LIKE %s")
+        args.append(f'{search}%')
+        query.append("OR `email` LIKE %s")
+        args.append(f'{search}%')
+
+    query.append(f'ORDER BY id DESC LIMIT %s')
+    args.append(limit)
+    
+    query = ' '.join(query)
+    res = await glob.db.fetchall(query, args)
     return res
 
 async def get_user(id:int):
diff --git a/static/css/pages/admin/style.css b/static/css/pages/admin/style.css
index ece12f3c..824a2bcd 100644
--- a/static/css/pages/admin/style.css
+++ b/static/css/pages/admin/style.css
@@ -4,4 +4,19 @@
 
 .song-banner {
     border-radius: 0px !important;
+}
+
+.banner-bg {
+    width: 100%;
+    height: 132px;
+    object-fit: cover;
+}
+
+.col-9 {
+    transition: 0.2s ease;
+}
+
+.load {
+    filter: blur(2px) !important;
+    opacity: 0.5 !important;
 }
\ No newline at end of file
diff --git a/templates/admin/search.html b/templates/admin/search.html
new file mode 100644
index 00000000..05cc86ab
--- /dev/null
+++ b/templates/admin/search.html
@@ -0,0 +1,105 @@
+{% extends 'admin/base.html' %}
+{% block title %}
+Search Result
+{% endblock title %}
+
+{% block header %}
+<script src="/static/js/asserts/vue.js"></script>
+<script src="/static/js/asserts/vue-axios.js"></script>
+{% endblock %}
+
+
+{% block content %}
+
+<div id="app">
+    <div class="container-xl">
+        <div class="row g-3">
+            <div class="col-3">
+                <form action="" method="get">
+                    <div class="subheader mb-2">Search</div>
+                    <div class="input-icon mb-4">
+                        <input type="text" class="form-control" v-model.trim="search" placeholder="Search players..."
+                            @keyup="getSearchData">
+                        <span class="input-icon-addon">
+                            <!-- Download SVG icon from http://tabler-icons.io/i/search -->
+                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
+                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+                                stroke-linecap="round" stroke-linejoin="round">
+                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                <circle cx="10" cy="10" r="7"></circle>
+                                <line x1="21" y1="21" x2="15" y2="15"></line>
+                            </svg>
+                        </span>
+                    </div>
+                    <div class="subheader mb-2">Category</div>
+                    <div class="list-group list-group-transparent mb-3">
+                        <a class="list-group-item list-group-item-action d-flex align-items-center active" href="#">
+                            Users
+                        </a>
+                        <a class="list-group-item list-group-item-action d-flex align-items-center disabled" href="#">
+                            Beatmaps
+                        </a>
+                    </div>
+                </form>
+            </div>
+            <div :class="'col-9' + (load ? ' load' : '')" >
+                <div class="row">
+                    <div class="col-sm-6 col-lg-4 mb-2" v-for="d in result">
+                        <div class="card card-sm">
+                            <a href="#" class="d-block">
+                                <img :src="`https://a.{{ domain() }}/${d.id}`"
+                                    class="card-img-top banner-bg">
+                            </a>
+                            <div class="card-body">
+                                <div class="d-flex align-items-center">
+                                    <span class="avatar me-3 rounded"
+                                        :style="`background-image: url(https://a.{{ domain() }}/${d.id})`"></span>
+                                    <div>
+                                        <div><% d.name %></div>
+                                        <div class="text-muted"><% d.email %></div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script>
+    new Vue({
+        el: "#app",
+        delimiters: ["<%", "%>"],
+        data() {
+            return {
+                search: '',
+                result: [],
+                load: false
+            }
+        },
+        created() {
+            this.getSearchData()
+        },
+        methods: {
+            getSearchData() {
+                this.load = true
+                this.$axios.get(`/admin/api/search`, {
+                    params: {
+                        search: this.search,
+                    }
+                })
+                    .then(res => {
+                        this.load = false;
+                        this.result = res.data;
+                    });
+            },
+        },
+        computed: {
+        }
+    });
+
+</script>
+
+{% endblock content %}
\ No newline at end of file

From 6ee78e7a140fddd5c0567b8844f342787ec4f150 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Wed, 14 Jul 2021 20:58:21 +0700
Subject: [PATCH 035/278] add: restriction on users page

---
 blueprints/admin.py               |  44 ++++++---
 objects/varka.py                  |   6 ++
 templates/admin/restrictions.html | 152 +++++++++++++++++++++++++++++-
 templates/admin/users.html        |   6 +-
 4 files changed, 194 insertions(+), 14 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index ab356457..355ffd3b 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -74,16 +74,23 @@ async def users_edit(id:int):
 
 @admin.route('/users/update/<id>', methods=['POST']) # POST
 async def users_update(id:int):
-    form = await request.form
-    datadef: dict = await get('users', id)
-    data = dict(
-        name = form['edit-username'],
-        safe_name = form['edit-username'].lower().replace(' ', '_'),
-        email = form['edit-email']
-    )
-    
-    await varka.update('users', ('id', id), **dict_cmp(data, datadef))
-    return redirect('/admin/users')
+    try:
+        form = await request.form
+        datadef: dict = await get('users', id)
+        data = dict(
+            name = form['edit-username'],
+            safe_name = form['edit-username'].lower().replace(' ', '_'),
+            email = form['edit-email'],
+        )
+        try:
+            if form['edit-restrict']:
+                data['priv'] = -1
+        except:
+            data['priv'] = 1
+        await varka.update('users', ('id', id), **dict_cmp(data, datadef))
+        return redirect('/admin/users')
+    except: 
+        return redirect('/admin/users')
 
 @admin.route('/reports')
 async def reports():
@@ -93,9 +100,22 @@ async def reports():
 async def recentplay():
     return await render_template('admin/recentplay.html')
 
-@admin.route('/restrictions')
+@admin.route('/restrictions', methods=['GET', 'POST'])
 async def restrictions():
-    return await render_template('admin/restrictions.html')
+    error = ''
+    if request.method == 'POST':
+        try:
+            try:
+                username = (await request.form)['username']
+                id = (await varka.get_user_username(username))['id']
+                return redirect(f'/admin/users/edit/{id}')
+            except:
+                email = (await request.form)['email']
+                id = (await varka.get_user_email(email))['id']
+                return redirect(f'/admin/users/edit/{id}')
+        except:
+            error = 'User not found!'
+    return await render_template('admin/restrictions.html', query_data=await varka.get_ban_users(), error=error)
 
 @admin.route('/privilege')
 async def privilege():
diff --git a/objects/varka.py b/objects/varka.py
index 3f4ba0a8..3e624539 100644
--- a/objects/varka.py
+++ b/objects/varka.py
@@ -36,6 +36,12 @@ async def get_user_email(email:str):
     res = await glob.db.fetch(query)
     return res
 
+async def get_ban_users(limit:int=25):
+    query = ['SELECT * FROM users WHERE priv = -1']
+    query = ' '.join(query)
+    res = await glob.db.fetchall(query)
+    return res
+
 async def get_scores(limit:int=25):
     """Returns the all of a scores."""
     query = (
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index 1a22eb37..8b62e5d4 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -1,7 +1,157 @@
-<!-- For banning players -->
 {% extends 'admin/base.html' %}
 {% block title %} Restrictions {% endblock %}
 
+{% macro modal(title='base', id='base', name='base') %}
+<div class="modal modal-blur fade" id="{{ id }}" tabindex="-1" aria-hidden="true">
+    <div class="modal-dialog modal-sm" role="document">
+        <div class="modal-content">
+            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            <div class="modal-body text-start pt-4">
+                <form id="{{ name }}" method="POST">
+                    <div class="mb-3">
+                        <label class="form-label">{{ title }}</label>
+                        <input type="text" class="form-control" name="{{ name }}">
+                    </div>
+                </form>
+            </div>
+            <div class="modal-footer">
+                <div class="w-100">
+                    <div class="row">
+                        <div class="col">
+                            <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">Cancel</button>
+                        </div>
+                        <div class="col">
+                            <button type="submit" id="del-submit" form="{{ name }}"
+                                class="btn btn-primary w-100">Edit</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+{% endmacro %}
+
+{% macro card(title='base', haschart=true, chartname='base', data=0) %}
+<div class="card">
+    <div class="card-body">
+        <div class="d-flex align-items-center">
+            <div class="subheader">{{ title }}</div>
+        </div>
+        <div class="d-flex align-items-baseline">
+            <div class="h1 mb-0 me-2">{{ data }}</div>
+        </div>
+    </div>
+    {% if haschart %}
+    <div id="chart-{{ chartname }}" class="chart-sm"></div>
+    {% endif %}
+</div>
+{% endmacro %}
+
 {% block content %}
+{% if error %}
+<div class="alert alert-danger col-lg-3" role="alert" style="display: block; position: relative; margin-top: -3.5rem;">
+    <h4 class="alert-title">{{ error }}</h4>
+</div>
+{% endif %}
+<div class="row row-deck row-cards">
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Banned Users', data=727, chartname='online-users') }}
+    </div>
+    <div class="col-sm-6 col-lg-3">
+        {{ card(title='Silenced Users',data=727) }}
+    </div>
+    <div class="col-12">
+        <div class="card">
+            <div class="card-header">
+                <div class="d-flex m-auto">
+                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-usr">Edit user (username)</button>
+                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-ema">Edit user (email)</button>
+                    <button type="button" class="btn m-2 disabled">Unban user</button>
+                    <button type="button" class="btn m-2 disabled">Unsilence user</button>
+                </div>
+            </div>
+            <div class="card-body border-bottom py-3">
+                <div class="d-flex">
+                    <div class="text-muted">
+                        Show
+                        <div class="mx-2 d-inline-block">
+                            <input type="text" class="form-control form-control-sm" value="8" size="3"
+                                aria-label="Users count">
+                        </div>
+                        entries
+                    </div>
+                    <div class="ms-auto text-muted">
+                        Search:
+                        <div class="ms-2 d-inline-block">
+                            <input type="text" class="form-control form-control-sm" aria-label="Search invoice">
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="table-responsive">
+                <table class="table card-table table-vcenter text-nowrap datatable">
+                    <thead>
+                        <tr>
+                            <th>ID</th>
+                            <th>Username</th>
+                            <th>Reason of ban</th>
+                            <th>Action</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        {% for i in query_data %}
+                        <tr>
+                            <td>{{ i.id }}</td>
+                            <td class="td-truncate">
+                                <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
+                                <a href="/u/{{ i.id }}">{{ i.name }}</a>
+                            </td>
+                            <td>{{ i.reason }}</td>
+                            <td>
+                                <a class="btn" href="/admin/users/edit/{{ i.id }}">
+                                    <i class="far fa-edit" aria-hidden="true"></i>⠀Edit
+                                </a>
+                            </td>
+                        </tr>
+                        {% endfor %}
+                    </tbody>
+                </table>
+            </div>
+            <div class="card-footer d-flex align-items-center">
+                <ul class="pagination m-0 m-auto">
+                    <li class="page-item">
+                        <a class="page-link" href="#" tabindex="-1">
+                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
+                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+                                stroke-linecap="round" stroke-linejoin="round">
+                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                <polyline points="15 6 9 12 15 18"></polyline>
+                            </svg>
+                        </a>
+                    </li>
+                    <li class="page-item active"><a class="page-link" href="#">1</a></li>
+                    <li class="page-item"><a class="page-link" href="#">2</a></li>
+                    <li class="page-item"><a class="page-link" href="#">3</a></li>
+                    <li class="page-item"><a class="page-link" href="#">4</a></li>
+                    <li class="page-item"><a class="page-link" href="#">5</a></li>
+                    <li class="page-item">
+                        <a class="page-link" href="#">
+                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
+                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
+                                stroke-linecap="round" stroke-linejoin="round">
+                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                <polyline points="9 6 15 12 9 18"></polyline>
+                            </svg>
+                        </a>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+</div>
+
+{{ modal(title='Username', id="edi-usr-usr", name='username') }}
+{{ modal(title='Email', id="edi-usr-ema", name='email') }}
 
 {% endblock %}
\ No newline at end of file
diff --git a/templates/admin/users.html b/templates/admin/users.html
index 5b0735f0..e1367d65 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -117,7 +117,11 @@ <h4 class="alert-title">{{ error }}</h4>
                                 <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
                                 <a href="/u/{{ i.id }}">{{ i.name }}</a>
                             </td>
-                            <td>Yes</td>
+                            {% if i.priv == -1 %}
+                            <td>Banned</td>
+                            {% else %}
+                            <td>Allowed</td>
+                            {% endif %}
                             <td>
                                 <a class="btn" href="/admin/users/edit/{{ i.id }}">
                                     <i class="far fa-edit" aria-hidden="true"></i>⠀Edit

From 8e731af83540fb92d5fb328a0222321f9a7c0d2d Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Wed, 14 Jul 2021 21:03:02 +0700
Subject: [PATCH 036/278] add: restrict button

---
 templates/admin/users_edit.html | 138 ++++++++++++++++++++------------
 1 file changed, 85 insertions(+), 53 deletions(-)

diff --git a/templates/admin/users_edit.html b/templates/admin/users_edit.html
index 711be142..557d23ce 100644
--- a/templates/admin/users_edit.html
+++ b/templates/admin/users_edit.html
@@ -1,9 +1,10 @@
-{% extends 'admin/base.html' %}
-{% block title %} Users {% endblock %}
+{% extends 'admin/base.html' %} 
+{% block title %} Users {% endblock %} 
+
+{% block content %} 
 
-{% block content %}
 {% if error %}
-<div class="alert alert-danger col-lg-3" role="alert" style="display: block; position: relative; margin-top: -3.5rem;">
+<div class="alert alert-danger col-lg-3" role="alert" style="display: block; position: relative; margin-top: -3.5rem">
     <h4 class="alert-title">{{ error }}</h4>
 </div>
 {% endif %}
@@ -13,57 +14,84 @@ <h4 class="alert-title">{{ error }}</h4>
             <div class="card-header">Edit info of {{ search_data['name'] }}</div>
             <div class="card-body">
                 <form action="/admin/users/update/{{ search_data['id'] }}" method="POST" id="edit-usr">
-                    <label class="form-label">Username</label>
-                    <div>
-                        <div class="input-icon mb-3">
-                            <span class="input-icon-addon">
-                                <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
-                                    viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
-                                    stroke-linecap="round" stroke-linejoin="round">
-                                    <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
-                                    <circle cx="12" cy="7" r="4"></circle>
-                                    <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>
-                                </svg>
-                            </span>
-                            <input type="text" name="edit-username" class="form-control" value="{{ search_data.name }}">
-                        </div>
-                        <label class="form-label">Email</label>
-                        <div class="input-icon mb-3">
-                            <span class="input-icon-addon">
-                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-mail"
-                                    width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="#2c3e50"
-                                    fill="none" stroke-linecap="round" stroke-linejoin="round">
-                                    <path stroke="none" d="M0 0h24v24H0z" fill="noneW" />
-                                    <rect x="3" y="5" width="18" height="14" rx="2" />
-                                    <polyline points="3 7 12 13 21 7" />
-                                </svg>
-                            </span>
-                            <input type="text" name="edit-email" class="form-control" value="{{ search_data.email }}">
-                        </div>
-                    </div>
-                </form>
-            </div>
-            <div class="card-footer">
-                <div class="w-100">
-                    <div class="row">
-                        <div class="col">
-                            <a href="/admin/users"><button type="button" class="btn btn-white w-100">Cancel</button></a>
-                        </div>
-                        <div class="col">
-                            <form action="/admin/users/forgot/{{ search_data.id }}" method="post">
-                                <button type="submit" class="btn w-100 disabled">User forgot password?</button>
-                            </form>
-                        </div>
-                        <div class="col">
-                            <button type="submit" class="btn btn-primary w-100" data-bs-toggle="modal"
-                                data-bs-target="#edit-confirmed">Save</button>
-                        </div>
-                    </div>
+                <label class="form-label">Username</label>
+                <div>
+                    <div class="input-icon mb-3">
+                        <span class="input-icon-addon">
+                            <svg
+                            xmlns="http://www.w3.org/2000/svg"
+                            class="icon"
+                            width="24"
+                            height="24"
+                            viewBox="0 0 24 24"
+                            stroke-width="2"
+                            stroke="currentColor"
+                            fill="none"
+                            stroke-linecap="round"
+                            stroke-linejoin="round"
+                            >
+                            <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                            <circle cx="12" cy="7" r="4"></circle>
+                            <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>
+                        </svg>
+                    </span>
+                    <input type="text" name="edit-username" class="form-control" value="{{ search_data.name }}">
                 </div>
+                <label class="form-label">Email</label>
+                <div class="input-icon mb-3">
+                    <span class="input-icon-addon">
+                        <svg
+                        xmlns="http://www.w3.org/2000/svg"
+                        class="icon icon-tabler icon-tabler-mail"
+                        width="24"
+                        height="24"
+                        viewBox="0 0 24 24"
+                        stroke-width="2"
+                        stroke="#2c3e50"
+                        fill="none"
+                        stroke-linecap="round"
+                        stroke-linejoin="round"
+                        >
+                        <path stroke="none" d="M0 0h24v24H0z" fill="noneW" />
+                        <rect x="3" y="5" width="18" height="14" rx="2" />
+                        <polyline points="3 7 12 13 21 7" />
+                    </svg>
+                </span>
+                <input type="text" name="edit-email" class="form-control" value="{{ search_data.email }}">
+            </div>
+            <div class="form-label">Restricted?</div>
+            <label class="form-check form-switch">
+                {% if search_data.priv == -1 %}
+                <input class="form-check-input" name="edit-restrict" type="checkbox" checked>
+                {% else %}
+                <input class="form-check-input" name="edit-restrict" type="checkbox">
+                {% endif %}
+            </label>
+        </div>
+    </form>
+</div>
+<div class="card-footer">
+    <div class="w-100">
+        <div class="row">
+            <div class="col">
+                <a href="/admin/users"><button type="button" class="btn btn-white w-100"> Cancel </button></a>
             </div>
+            <div class="col">
+                <form action="/admin/users/forgot/{{ search_data.id }}" method="post">
+                <button type="submit" class="btn w-100 disabled">
+                    User forgot password?
+                </button>
+            </form>
         </div>
+        <div class="col">
+            <button type="submit" class="btn btn-primary w-100" data-bs-toggle="modal" data-bs-target="#edit-confirmed"> Save </button>
     </div>
 </div>
+</div>
+</div>
+</div>
+</div>
+</div>
 
 <div class="modal modal-blur fade" id="edit-confirmed" tabindex="-1" aria-hidden="true">
     <div class="modal-dialog modal-sm" role="document">
@@ -76,10 +104,14 @@ <h4 class="alert-title">{{ error }}</h4>
                 <div class="w-100">
                     <div class="row">
                         <div class="col">
-                            <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">No</button>
+                            <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">
+                            No
+                            </button>
                         </div>
                         <div class="col">
-                            <button type="submit" form="edit-usr" class="btn btn-danger w-100">Yes</button>
+                            <button type="submit" form="edit-usr" class="btn btn-danger w-100">
+                            Yes
+                            </button>
                         </div>
                     </div>
                 </div>
@@ -87,4 +119,4 @@ <h4 class="alert-title">{{ error }}</h4>
         </div>
     </div>
 </div>
-{% endblock %}
\ No newline at end of file
+{% endblock %}

From af80f75a721b8f73fa6453472a4675d8640caa8c Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Thu, 15 Jul 2021 01:25:11 +0700
Subject: [PATCH 037/278] add: navbar items

---
 templates/admin/base.html | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/templates/admin/base.html b/templates/admin/base.html
index 1664cbf4..1140cc35 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -64,6 +64,14 @@ <h1 class="navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-m
             <div class="container-xl">
               <ul class="navbar-nav">
                 {{ nav_item('Home','/','fas fa-home') }}
+                {{ nav_item('Search', '/search', 'fa fa-search') }}
+                {{ nav_item('Users','/users','fas fa-user') }}
+                {{ nav_item('Reports','/reports','fa fa-exclamation-triangle') }}
+                {{ nav_item('Recentplay','/recentplay','fas fa-video') }}
+                {{ nav_item('Restrictions', '/restrictions', 'fa fa-address-book') }}
+                {{ nav_item('Privilege Groups', '/privilege', 'fa fa-users') }}
+                {{ nav_item('Beatmaps', '/beatmaps', 'fa fa-play-circle') }}
+                {{ nav_item('Logs', '/logs', 'fas fa-list-alt') }}
               </ul>
             </div>
           </div>

From 5c496f1a6beee5f9b57793a5c1a8e3dfc65a7196 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Thu, 15 Jul 2021 01:26:38 +0700
Subject: [PATCH 038/278] refactor code

---
 blueprints/admin.py             | 4 ++--
 objects/varka.py                | 7 +++----
 templates/admin/users.html      | 2 +-
 templates/admin/users_edit.html | 2 +-
 4 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 355ffd3b..685de42e 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -84,7 +84,7 @@ async def users_update(id:int):
         )
         try:
             if form['edit-restrict']:
-                data['priv'] = -1
+                data['priv'] = 2
         except:
             data['priv'] = 1
         await varka.update('users', ('id', id), **dict_cmp(data, datadef))
@@ -115,7 +115,7 @@ async def restrictions():
                 return redirect(f'/admin/users/edit/{id}')
         except:
             error = 'User not found!'
-    return await render_template('admin/restrictions.html', query_data=await varka.get_ban_users(), error=error)
+    return await render_template('admin/restrictions.html', query_data=await varka.get_res_users(), error=error)
 
 @admin.route('/privilege')
 async def privilege():
diff --git a/objects/varka.py b/objects/varka.py
index 3e624539..e6fb0aa5 100644
--- a/objects/varka.py
+++ b/objects/varka.py
@@ -1,4 +1,4 @@
-from objects import glob
+from objects import glob, privileges
 from quart import jsonify
 import json
 
@@ -36,9 +36,8 @@ async def get_user_email(email:str):
     res = await glob.db.fetch(query)
     return res
 
-async def get_ban_users(limit:int=25):
-    query = ['SELECT * FROM users WHERE priv = -1']
-    query = ' '.join(query)
+async def get_res_users():
+    query = ('SELECT * FROM users WHERE NOT priv & 1')
     res = await glob.db.fetchall(query)
     return res
 
diff --git a/templates/admin/users.html b/templates/admin/users.html
index e1367d65..eb70c106 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -117,7 +117,7 @@ <h4 class="alert-title">{{ error }}</h4>
                                 <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
                                 <a href="/u/{{ i.id }}">{{ i.name }}</a>
                             </td>
-                            {% if i.priv == -1 %}
+                            {% if i.priv == 2 %}
                             <td>Banned</td>
                             {% else %}
                             <td>Allowed</td>
diff --git a/templates/admin/users_edit.html b/templates/admin/users_edit.html
index 557d23ce..1593040d 100644
--- a/templates/admin/users_edit.html
+++ b/templates/admin/users_edit.html
@@ -61,7 +61,7 @@ <h4 class="alert-title">{{ error }}</h4>
             </div>
             <div class="form-label">Restricted?</div>
             <label class="form-check form-switch">
-                {% if search_data.priv == -1 %}
+                {% if search_data.priv == 2 %}
                 <input class="form-check-input" name="edit-restrict" type="checkbox" checked>
                 {% else %}
                 <input class="form-check-input" name="edit-restrict" type="checkbox">

From e6185cd469d8934160c5a8bad965f680af003af3 Mon Sep 17 00:00:00 2001
From: Kitpipat Jaritwong <Kitpipat.0647@gmail.com>
Date: Sat, 17 Jul 2021 18:34:46 +0700
Subject: [PATCH 039/278] add: user restriction

---
 blueprints/admin.py               |   2 +
 templates/admin/restrictions.html |   2 +-
 templates/admin/users_edit.html   | 140 +++++++++++++++++-------------
 3 files changed, 85 insertions(+), 59 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 685de42e..b8fd8e5e 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -85,8 +85,10 @@ async def users_update(id:int):
         try:
             if form['edit-restrict']:
                 data['priv'] = 2
+                data['reason'] = form['res-reason']
         except:
             data['priv'] = 1
+            data['reason'] = None
         await varka.update('users', ('id', id), **dict_cmp(data, datadef))
         return redirect('/admin/users')
     except: 
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index 8b62e5d4..f53f6d47 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -95,7 +95,7 @@ <h4 class="alert-title">{{ error }}</h4>
                         <tr>
                             <th>ID</th>
                             <th>Username</th>
-                            <th>Reason of ban</th>
+                            <th>Reason of restriction</th>
                             <th>Action</th>
                         </tr>
                     </thead>
diff --git a/templates/admin/users_edit.html b/templates/admin/users_edit.html
index 1593040d..8cb5aea7 100644
--- a/templates/admin/users_edit.html
+++ b/templates/admin/users_edit.html
@@ -14,84 +14,88 @@ <h4 class="alert-title">{{ error }}</h4>
             <div class="card-header">Edit info of {{ search_data['name'] }}</div>
             <div class="card-body">
                 <form action="/admin/users/update/{{ search_data['id'] }}" method="POST" id="edit-usr">
-                <label class="form-label">Username</label>
-                <div>
+                    <label class="form-label">Username</label>
+                    <div>
+                        <div class="input-icon mb-3">
+                            <span class="input-icon-addon">
+                                <svg
+                                xmlns="http://www.w3.org/2000/svg"
+                                class="icon"
+                                width="24"
+                                height="24"
+                                viewBox="0 0 24 24"
+                                stroke-width="2"
+                                stroke="currentColor"
+                                fill="none"
+                                stroke-linecap="round"
+                                stroke-linejoin="round"
+                                >
+                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                <circle cx="12" cy="7" r="4"></circle>
+                                <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>
+                            </svg>
+                        </span>
+                        <input type="text" name="edit-username" class="form-control" value="{{ search_data.name }}">
+                    </div>
+                    <label class="form-label">Email</label>
                     <div class="input-icon mb-3">
                         <span class="input-icon-addon">
                             <svg
                             xmlns="http://www.w3.org/2000/svg"
-                            class="icon"
+                            class="icon icon-tabler icon-tabler-mail"
                             width="24"
                             height="24"
                             viewBox="0 0 24 24"
                             stroke-width="2"
-                            stroke="currentColor"
+                            stroke="#2c3e50"
                             fill="none"
                             stroke-linecap="round"
                             stroke-linejoin="round"
                             >
-                            <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
-                            <circle cx="12" cy="7" r="4"></circle>
-                            <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>
+                            <path stroke="none" d="M0 0h24v24H0z" fill="noneW" />
+                            <rect x="3" y="5" width="18" height="14" rx="2" />
+                            <polyline points="3 7 12 13 21 7" />
                         </svg>
                     </span>
-                    <input type="text" name="edit-username" class="form-control" value="{{ search_data.name }}">
+                    <input type="text" name="edit-email" class="form-control" value="{{ search_data.email }}">
+                </div>
+                <div class="form-label">Restricted?</div>
+                <label class="form-check form-switch">
+                    {% if search_data.priv == 2 %}
+                    <input id="edit-res" class="form-check-input" name="edit-restrict" type="checkbox" value="ban" checked> <!--  data-bs-toggle="collapse" data-bs-target="#edit-res-reason" -->
+                    {% else %}
+                    <input id="edit-res" class="form-check-input" name="edit-restrict" type="checkbox" data-bs-toggle="collapse" data-bs-target="#edit-res-reason">
+                    {% endif %}
+                </label>
+                <div id="edit-res-reason" class="collapse">
+                    <label class="form-label">Reason of restriction?</label>
+                    <input type="text" name="res-reason" class="form-control" value="{{ search_data.reason }}">
                 </div>
-                <label class="form-label">Email</label>
-                <div class="input-icon mb-3">
-                    <span class="input-icon-addon">
-                        <svg
-                        xmlns="http://www.w3.org/2000/svg"
-                        class="icon icon-tabler icon-tabler-mail"
-                        width="24"
-                        height="24"
-                        viewBox="0 0 24 24"
-                        stroke-width="2"
-                        stroke="#2c3e50"
-                        fill="none"
-                        stroke-linecap="round"
-                        stroke-linejoin="round"
-                        >
-                        <path stroke="none" d="M0 0h24v24H0z" fill="noneW" />
-                        <rect x="3" y="5" width="18" height="14" rx="2" />
-                        <polyline points="3 7 12 13 21 7" />
-                    </svg>
-                </span>
-                <input type="text" name="edit-email" class="form-control" value="{{ search_data.email }}">
             </div>
-            <div class="form-label">Restricted?</div>
-            <label class="form-check form-switch">
-                {% if search_data.priv == 2 %}
-                <input class="form-check-input" name="edit-restrict" type="checkbox" checked>
-                {% else %}
-                <input class="form-check-input" name="edit-restrict" type="checkbox">
-                {% endif %}
-            </label>
-        </div>
-    </form>
-</div>
-<div class="card-footer">
-    <div class="w-100">
-        <div class="row">
-            <div class="col">
-                <a href="/admin/users"><button type="button" class="btn btn-white w-100"> Cancel </button></a>
+        </form>
+    </div>
+    <div class="card-footer">
+        <div class="w-100">
+            <div class="row">
+                <div class="col">
+                    <a href="/admin/users"><button type="button" class="btn btn-white w-100"> Cancel </button></a>
+                </div>
+                <div class="col">
+                    <form action="/admin/users/forgot/{{ search_data.id }}" method="post">
+                        <button type="submit" class="btn w-100 disabled">
+                            User forgot password?
+                        </button>
+                    </form>
+                </div>
+                <div class="col">
+                    <button type="submit" class="btn btn-primary w-100" data-bs-toggle="modal" data-bs-target="#edit-confirmed"> Save </button>
+                </div>
             </div>
-            <div class="col">
-                <form action="/admin/users/forgot/{{ search_data.id }}" method="post">
-                <button type="submit" class="btn w-100 disabled">
-                    User forgot password?
-                </button>
-            </form>
         </div>
-        <div class="col">
-            <button type="submit" class="btn btn-primary w-100" data-bs-toggle="modal" data-bs-target="#edit-confirmed"> Save </button>
     </div>
 </div>
 </div>
 </div>
-</div>
-</div>
-</div>
 
 <div class="modal modal-blur fade" id="edit-confirmed" tabindex="-1" aria-hidden="true">
     <div class="modal-dialog modal-sm" role="document">
@@ -105,12 +109,12 @@ <h4 class="alert-title">{{ error }}</h4>
                     <div class="row">
                         <div class="col">
                             <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">
-                            No
+                                No
                             </button>
                         </div>
                         <div class="col">
                             <button type="submit" form="edit-usr" class="btn btn-danger w-100">
-                            Yes
+                                Yes
                             </button>
                         </div>
                     </div>
@@ -120,3 +124,23 @@ <h4 class="alert-title">{{ error }}</h4>
     </div>
 </div>
 {% endblock %}
+
+{% block scriptb %}
+{% if search_data.priv == 2 %}
+<script>
+    document.addEventListener("DOMContentLoaded", function () {
+        $('#edit-res-reason').collapse('show');
+        $('#edit-res').on('click', function () {
+            var $this = $(this);
+            if ($(this).val() === 'ban') {
+                $('#edit-res-reason').collapse('hide');
+                $this.val('unban');
+            } else {
+                $('#edit-res-reason').collapse('show');
+                $this.val('ban');
+            }
+        });
+    });
+</script>
+{% endif %}
+{% endblock scriptb %}
\ No newline at end of file

From a0dde0a7f58e9f3519bf30db4aee0ab737f8b1a0 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Wed, 25 May 2022 14:01:12 +0800
Subject: [PATCH 040/278] Mods is now displayed in profile page Add more
 leaderboard sort Profile scores are clickable now

---
 ext/config.sample.py           |  49 -------------
 static/css/pages/profile.css   |   2 +-
 static/js/pages/leaderboard.js |   7 ++
 static/js/pages/profile.js     | 129 +++++++++++++++++++++++++++++++++
 templates/admin/base.html      |   2 +-
 templates/base.html            |   2 +-
 templates/leaderboard.html     |  12 ++-
 templates/profile.html         |  11 +--
 8 files changed, 153 insertions(+), 61 deletions(-)
 delete mode 100644 ext/config.sample.py

diff --git a/ext/config.sample.py b/ext/config.sample.py
deleted file mode 100644
index 313417a6..00000000
--- a/ext/config.sample.py
+++ /dev/null
@@ -1,49 +0,0 @@
-# -*- coding: utf-8 -*-
-
-# app name
-app_name = 'guweb'
-
-# secret key
-secret_key = 'changeme'
-
-#hCaptcha settings:
-hCaptcha_sitekey = 'changeme'
-hCaptcha_secret = 'changeme'
-
-# domain (used for api, avatar, etc)
-domain = 'gulag.ca'
-
-# mysql credentials
-mysql = {
-    'db': 'gulag',
-    'host': 'localhost',
-    'user': 'cmyui',
-    'password': 'changeme',
-}
-
-# path to gulag root (must have leading and following slash)
-path_to_gulag = '/path/to/gulag/'
-
-# enable debug (disable when in production to improve performance)
-debug = False
-
-# disallowed names (hardcoded banned usernames)
-disallowed_names = {
-    'cookiezi', 'rrtyui',
-    'hvick225', 'qsc20010'
-}
-
-# disallowed passwords (hardcoded banned passwords)
-disallowed_passwords = {
-    'password', 'minilamp'
-}
-
-# enable registration
-registration = True
-
-# social links (used throughout guweb)
-github = 'https://github.com/varkaria/guweb'
-discord_server = 'https://discord.com/invite/Y5uPvcNpD9'
-youtube = 'https://youtube.com/'
-twitter = 'https://twitter.com/'
-instagram = 'https://instagram.com/'
diff --git a/static/css/pages/profile.css b/static/css/pages/profile.css
index b9410093..417c0b7a 100644
--- a/static/css/pages/profile.css
+++ b/static/css/pages/profile.css
@@ -38,7 +38,7 @@
 .profile-avatar {
   width: 185px;
   height: 185px;
-  margin-top: -5.5rem;
+  margin-top: -9rem;
   border-radius: 16px;
   object-fit: cover;
   transition: 0.2s ease;
diff --git a/static/js/pages/leaderboard.js b/static/js/pages/leaderboard.js
index b903db48..7522c996 100644
--- a/static/js/pages/leaderboard.js
+++ b/static/js/pages/leaderboard.js
@@ -17,6 +17,13 @@ new Vue({
         this.LoadLeaderboard(sort, mode, mods);
     },
     methods: {
+        secondsToDhm(seconds) {
+            seconds = Number(seconds);
+            var dDisplay = `${Math.floor(seconds / (3600 * 24))}d `;
+            var hDisplay = `${Math.floor(seconds % (3600 * 24) / 3600)}h `;
+            var mDisplay = `${Math.floor(seconds % 3600 / 60)}m `;
+            return dDisplay + hDisplay + mDisplay;
+        },
         LoadData(mode, mods, sort) {
             this.$set(this, 'mode', mode);
             this.$set(this, 'mods', mods);
diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 78acca27..2c7a76e5 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -1,3 +1,132 @@
+function getScoreMods(m) {
+	var r = '';
+	var hasNightcore = false;
+	if (m & NoFail) {
+		r += 'NF, ';
+	}
+	if (m & Easy) {
+		r += 'EZ, ';
+	}
+	if (m & NoVideo) {
+		r += 'NV, ';
+	}
+	if (m & Hidden) {
+		r += 'HD, ';
+	}
+	if (m & HardRock) {
+		r += 'HR, ';
+	}
+	if (m & SuddenDeath) {
+		r += 'SD, ';
+	}
+	if (m & Nightcore) {
+		r += 'NC, ';
+		hasNightcore = true;
+	}
+	if (!hasNightcore && (m & DoubleTime)) {
+		r += 'DT, ';
+	}
+	if (m & Relax) {
+		r += 'RX, ';
+	}
+	if (m & HalfTime) {
+		r += 'HT, ';
+	}
+	if (m & Flashlight) {
+		r += 'FL, ';
+	}
+	if (m & Autoplay) {
+		r += 'AP, ';
+	}
+	if (m & SpunOut) {
+		r += 'SO, ';
+	}
+	if (m & Relax2) {
+		r += 'AP, ';
+	}
+	if (m & Perfect) {
+		r += 'PF, ';
+	}
+	if (m & Key4) {
+		r += '4K, ';
+	}
+	if (m & Key5) {
+		r += '5K, ';
+	}
+	if (m & Key6) {
+		r += '6K, ';
+	}
+	if (m & Key7) {
+		r += '7K, ';
+	}
+	if (m & Key8) {
+		r += '8K, ';
+	}
+	if (m & keyMod) {
+		r += '';
+	}
+	if (m & FadeIn) {
+		r += 'FD, ';
+	}
+	if (m & Random) {
+		r += 'RD, ';
+	}
+	if (m & LastMod) {
+		r += 'CN, ';
+	}
+	if (m & Key9) {
+		r += '9K, ';
+	}
+	if (m & Key10) {
+		r += '10K, ';
+	}
+	if (m & Key1) {
+		r += '1K, ';
+	}
+	if (m & Key3) {
+		r += '3K, ';
+	}
+	if (m & Key2) {
+		r += '2K, ';
+	}
+	if (r.length > 0) {
+		return "+ " + r.slice(0, -2);
+	} else {
+		return '';
+	}
+}
+
+var None = 0;
+var NoFail = 1;
+var Easy = 2;
+var NoVideo = 4;
+var Hidden = 8;
+var HardRock = 16;
+var SuddenDeath = 32;
+var DoubleTime = 64;
+var Relax = 128;
+var HalfTime = 256;
+var Nightcore = 512;
+var Flashlight = 1024;
+var Autoplay = 2048;
+var SpunOut = 4096;
+var Relax2 = 8192;
+var Perfect = 16384;
+var Key4 = 32768;
+var Key5 = 65536;
+var Key6 = 131072;
+var Key7 = 262144;
+var Key8 = 524288;
+var keyMod = 1015808;
+var FadeIn = 1048576;
+var Random = 2097152;
+var LastMod = 4194304;
+var Key9 = 16777216;
+var Key10 = 33554432;
+var Key1 = 67108864;
+var Key3 = 134217728;
+var Key2 = 268435456;
+
 new Vue({
     el: "#app",
     delimiters: ["<%", "%>"],
diff --git a/templates/admin/base.html b/templates/admin/base.html
index d91b3df7..6cbb483b 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -24,7 +24,7 @@
     crossorigin="anonymous"></script>
 
   <!-- bulma -->
-  <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/bulma.min-v6.css" />
+  <link rel="stylesheet" href="https://fastly.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/bulma.min-v6.css" />
 
   <!-- font awesome -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
diff --git a/templates/base.html b/templates/base.html
index 554a31e2..bab95059 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -24,7 +24,7 @@
     crossorigin="anonymous"></script>
 
   <!-- Bulma -->
-  <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/bulma.min-v7.css" />
+  <link rel="stylesheet" href="https://fastly.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/bulma.min-v7.css" />
 
   <!-- Font awesome -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index bc304cca..8ebcba25 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -43,6 +43,12 @@
                 @click="LoadLeaderboard('pp', mode, mods, '')">PP</a>
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'rscore' }"
                 @click="LoadLeaderboard('rscore', mode, mods, '')">Score</a>
+                <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'acc' }"
+                @click="LoadLeaderboard('acc', mode, mods, '')">Acc</a>
+                <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'plays' }"
+                @click="LoadLeaderboard('plays', mode, mods, '')">PlayCount</a>
+                <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'playtime' }"
+                @click="LoadLeaderboard('playtime', mode, mods, '')">PlayTime</a>
             </div>
             <div class="right">
                 <a class="simple-banner-switch" v-bind:class=" { 'active': mods === 'vn' }"
@@ -69,6 +75,7 @@
                             <th class="t-heading"> Accuracy </th>
                             <th class="t-heading"> Playcount </th>
                             <th class="t-heading"> Max Combo </th>
+                            <th class="t-heading"> Play Time </th>
                         </tr>
                     </thead>
                     <tbody>
@@ -100,6 +107,9 @@
                             <td>
                                 <% addCommas(user.max_combo) %>
                             </td>
+                            <td>
+                                <% secondsToDhm(user.playtime) %>
+                            </td>
                         </tr>
                     </tbody>
                 </table>
@@ -114,5 +124,5 @@
 </div>
 
 <script src="/static/js/asserts/vue-flags.js"></script>
-<script src="/static/js/pages/leaderboard.js"></script>
+<script src="/static/js/pages/leaderboard.js?v=1.0"></script>
 {% endblock %}
diff --git a/templates/profile.html b/templates/profile.html
index 23c5d5e3..90d479c1 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -11,7 +11,7 @@
     <div v-if="data.scores.{{ id }}.out.length != 0" class="scores">
         <div v-for="(map, index) in data.scores.{{ id }}.out" class="map-single"
             :style="`background: linear-gradient(hsl(var(--main), 25%, 25%, 90%), hsl(var(--main), 25%, 25%, 90%)), url(https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/cover.jpg)`">
-            <div class="map-data">
+            <div class="map-data" @click="window.open('https://osu.ppy.sh/beatmaps/' + map.beatmap.id) ">
                 <div class="map-content1">
                     <div class="map-image">
                         <img v-bind:src="'https://assets.ppy.sh/beatmaps/' + map.beatmap.set_id + '/covers/card.jpg'"
@@ -24,7 +24,7 @@
                             </a>
                         </div>
                         <div class="play-stats">
-                            <% addCommas(map.score) %> / <% map.max_combo %><b>x</b>
+                            <% map.mods_str %> / <% map.max_combo %><b>x</b>
                         </div>
                         <div class="map-date">
                             <time>
@@ -126,7 +126,7 @@ <h1 class="title is-6">No beatmaps available</h1>
 <script src="/static/js/asserts/vue.js"></script>
 <script src="/static/js/asserts/vue-axios.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
-<link rel="stylesheet" href="/static/css/pages/profile.css">
+<link rel="stylesheet" href="/static/css/pages/profile.css?v=1.0">
 
 <script>
     var userid = Number("{{ user['id'] }}"); //For text editor doesn't dizzy lmao
@@ -200,11 +200,6 @@ <h1 class="title">
                             class="mods-shorttext">AP</span></a>
                 </div>
             </div>
-            <div class="bar-selection badge-selects">
-                <span>
-                    Badges not yet implemented!
-                </span>
-            </div>
         </div>
     </div>
     <div class="second-block">

From 2364af12148fd467854ae2346748c74d1bae251f Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Wed, 25 May 2022 14:02:26 +0800
Subject: [PATCH 041/278] Remove useless js

---
 README.md                  |   4 +-
 static/js/pages/profile.js | 129 -------------------------------------
 2 files changed, 2 insertions(+), 131 deletions(-)

diff --git a/README.md b/README.md
index 3fbbb292..9242423c 100644
--- a/README.md
+++ b/README.md
@@ -8,7 +8,7 @@ Table of Contents
   - [The team](#the-team)
   - [The End](#the-end)
 
-What is guweb?
+What is ppy-sb-guweb?
 ------
 
 guweb is the front-facing appearance of the osu! server protocol, [gulag](https://github.com/cmyui/gulag)!
@@ -59,7 +59,7 @@ sudo nano ext/nginx.conf
 sudo nginx -s reload
 
 # Configure guweb.
-cp ext/config.sample.py config.py
+cp ext/config.py config.py
 nano config.py
 
 # Run guweb (on port 8000).
diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 2c7a76e5..78acca27 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -1,132 +1,3 @@
-function getScoreMods(m) {
-	var r = '';
-	var hasNightcore = false;
-	if (m & NoFail) {
-		r += 'NF, ';
-	}
-	if (m & Easy) {
-		r += 'EZ, ';
-	}
-	if (m & NoVideo) {
-		r += 'NV, ';
-	}
-	if (m & Hidden) {
-		r += 'HD, ';
-	}
-	if (m & HardRock) {
-		r += 'HR, ';
-	}
-	if (m & SuddenDeath) {
-		r += 'SD, ';
-	}
-	if (m & Nightcore) {
-		r += 'NC, ';
-		hasNightcore = true;
-	}
-	if (!hasNightcore && (m & DoubleTime)) {
-		r += 'DT, ';
-	}
-	if (m & Relax) {
-		r += 'RX, ';
-	}
-	if (m & HalfTime) {
-		r += 'HT, ';
-	}
-	if (m & Flashlight) {
-		r += 'FL, ';
-	}
-	if (m & Autoplay) {
-		r += 'AP, ';
-	}
-	if (m & SpunOut) {
-		r += 'SO, ';
-	}
-	if (m & Relax2) {
-		r += 'AP, ';
-	}
-	if (m & Perfect) {
-		r += 'PF, ';
-	}
-	if (m & Key4) {
-		r += '4K, ';
-	}
-	if (m & Key5) {
-		r += '5K, ';
-	}
-	if (m & Key6) {
-		r += '6K, ';
-	}
-	if (m & Key7) {
-		r += '7K, ';
-	}
-	if (m & Key8) {
-		r += '8K, ';
-	}
-	if (m & keyMod) {
-		r += '';
-	}
-	if (m & FadeIn) {
-		r += 'FD, ';
-	}
-	if (m & Random) {
-		r += 'RD, ';
-	}
-	if (m & LastMod) {
-		r += 'CN, ';
-	}
-	if (m & Key9) {
-		r += '9K, ';
-	}
-	if (m & Key10) {
-		r += '10K, ';
-	}
-	if (m & Key1) {
-		r += '1K, ';
-	}
-	if (m & Key3) {
-		r += '3K, ';
-	}
-	if (m & Key2) {
-		r += '2K, ';
-	}
-	if (r.length > 0) {
-		return "+ " + r.slice(0, -2);
-	} else {
-		return '';
-	}
-}
-
-var None = 0;
-var NoFail = 1;
-var Easy = 2;
-var NoVideo = 4;
-var Hidden = 8;
-var HardRock = 16;
-var SuddenDeath = 32;
-var DoubleTime = 64;
-var Relax = 128;
-var HalfTime = 256;
-var Nightcore = 512;
-var Flashlight = 1024;
-var Autoplay = 2048;
-var SpunOut = 4096;
-var Relax2 = 8192;
-var Perfect = 16384;
-var Key4 = 32768;
-var Key5 = 65536;
-var Key6 = 131072;
-var Key7 = 262144;
-var Key8 = 524288;
-var keyMod = 1015808;
-var FadeIn = 1048576;
-var Random = 2097152;
-var LastMod = 4194304;
-var Key9 = 16777216;
-var Key10 = 33554432;
-var Key1 = 67108864;
-var Key3 = 134217728;
-var Key2 = 268435456;
-
 new Vue({
     el: "#app",
     delimiters: ["<%", "%>"],

From b9052ddeaed6e254cad4e4b8b20d900d675d4488 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 29 May 2022 15:20:20 +0900
Subject: [PATCH 042/278] test

---
 blueprints/frontend.py |  2 ++
 ext/requirements.txt   |  2 ++
 locales/base.en.yml    | 11 +++++++++++
 templates/verify.html  | 16 ++++++++--------
 4 files changed, 23 insertions(+), 8 deletions(-)
 create mode 100644 locales/base.en.yml

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 898d46f3..e95908c5 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -26,6 +26,8 @@
 from objects.utils import flash
 from objects.utils import flash_with_customizations
 
+import i18n
+
 VALID_MODES = frozenset({'std', 'taiko', 'catch', 'mania'})
 VALID_MODS = frozenset({'vn', 'rx', 'ap'})
 
diff --git a/ext/requirements.txt b/ext/requirements.txt
index 0d392c8a..63c7fcb6 100644
--- a/ext/requirements.txt
+++ b/ext/requirements.txt
@@ -8,3 +8,5 @@ orjson
 timeago
 markdown2
 Pillow
+
+python-i18n[YAML]
\ No newline at end of file
diff --git a/locales/base.en.yml b/locales/base.en.yml
new file mode 100644
index 00000000..4cdfc97d
--- /dev/null
+++ b/locales/base.en.yml
@@ -0,0 +1,11 @@
+en:
+  verification: 'Verification'
+  how-to-verify-your-account: 'How to verify your account'
+  what-do-you-mean-this-must-be-easy-right: 'What do you mean? This must be easy right?'
+  follow-these-three-simple-steps$: 'Follow these three simple steps to get started playing %{ appName }!'
+  osu-shortcut: 'Osu shortcut'
+  find-your-shortcut$: 'Find your shortcut to osu on desktop and copy it!'
+  edit-it: 'Edit it'
+  right-click-properties: 'Right click -> Properties'
+  find-target-element-box: 'Find "Target element" Box'
+  add-domain$: 'Add " -devserver %{ domain } at the end of it'
\ No newline at end of file
diff --git a/templates/verify.html b/templates/verify.html
index 2b990997..2f84aa00 100644
--- a/templates/verify.html
+++ b/templates/verify.html
@@ -10,8 +10,8 @@
     <div class="columns pm-reset is-weeb">
         <div class="column title-block">
             <div class="titlewithsub">
-                <h1 class="title is-left">How to verify your account</h1>
-                <h2 class="subtitle">What do you mean? This must be easy right?</h2>
+                <h1 class="title is-left">{{ i18n.t('base.how-to-verify-your-account') }}</h1>
+                <h2 class="subtitle">{{ i18n.t('what-do-you-mean-this-must-be-easy-right') }}</h2>
             </div>
         </div>
         <div class="column icon-block">
@@ -22,8 +22,8 @@ <h2 class="subtitle">What do you mean? This must be easy right?</h2>
         <div class="box is-padding">
             <div class="bordertitle">
                 <div class="titlewithsub">
-                    <h1 class="title is-left">Verification</h1>
-                    <h2 class="subtitle">Follow these three simple steps to get started playing {{ appName() }}!</h2>
+                    <h1 class="title is-left">{{ i18n.t('verification') }}</h1>
+                    <h2 class="subtitle">{{ i18n.t('follow-these-three-simple-steps$', appName = appName()) }}</h2>
                 </div>
             </div>
             <div class="howto-content">
@@ -35,8 +35,8 @@ <h2 class="subtitle">Follow these three simple steps to get started playing {{ a
                                 <div class="howto-number">1</div>
                             </div>
                             <div class="howto-withsub">
-                                <h1 class="title is-left">Osu shortcut</h1>
-                                <h2 class="subtitle">Find your shortcut to osu on desktop and copy it!</h2>
+                                <h1 class="title is-left">{{ i18n.t('osu-shortcut') }}</h1>
+                                <h2 class="subtitle">{{ i18n.t('find-your-shortcut$') }}</h2>
                             </div>
                         </div>
                     </div>
@@ -47,8 +47,8 @@ <h2 class="subtitle">Find your shortcut to osu on desktop and copy it!</h2>
                                 <div class="howto-number">2</div>
                             </div>
                             <div class="howto-withsub">
-                                <h1 class="title is-left">Edit it</h1>
-                                <h2 class="subtitle"><strong>1.</strong> Right click -> Properties <strong>2.</strong> Find "Target element" Box <strong>3.</strong> Add " -devserver {{ domain() }}" at the end of it</h2>
+                                <h1 class="title is-left">{{ i18n.t('edit-it') }}</h1>
+                                <h2 class="subtitle"><strong>1.</strong>{{ i18n.t('right-click-properties') }}</h2>strong>2.</strong>{{ i18n.t('find-target-element-box') }}</h2>'strong>3.</strong>{{ i18n.t('add-domain$', domain = domain()) }}</h2>
                             </div>
                         </div>
                     </div>

From 0aab2bee5a84e66f64862e9430ba485b9b8312d6 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Sun, 29 May 2022 16:19:35 +0800
Subject: [PATCH 043/278] update i18n

---
 locales/base.en.yml   |  3 ++-
 main.py               |  9 ++++++++-
 templates/home.html   |  2 +-
 templates/verify.html | 16 ++++++++--------
 4 files changed, 19 insertions(+), 11 deletions(-)

diff --git a/locales/base.en.yml b/locales/base.en.yml
index 4cdfc97d..43dda477 100644
--- a/locales/base.en.yml
+++ b/locales/base.en.yml
@@ -8,4 +8,5 @@ en:
   edit-it: 'Edit it'
   right-click-properties: 'Right click -> Properties'
   find-target-element-box: 'Find "Target element" Box'
-  add-domain$: 'Add " -devserver %{ domain } at the end of it'
\ No newline at end of file
+  add-domain$: 'Add " -devserver %{ domain } at the end of it'
+  some-coolest-features: 'Some of our coolest features'
\ No newline at end of file
diff --git a/main.py b/main.py
index 53197dde..944463e9 100755
--- a/main.py
+++ b/main.py
@@ -6,6 +6,7 @@
 import os
 
 import aiohttp
+import i18n
 import orjson
 from quart import Quart
 from quart import render_template
@@ -46,6 +47,10 @@ async def shutdown() -> None:
 def appVersion() -> str:
     return repr(version)
 
+@app.template_global()
+def t(key, **kwargs) -> str:
+    return i18n.t(key, **kwargs)
+
 @app.template_global()
 def appName() -> str:
     return glob.config.app_name
@@ -71,4 +76,6 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    app.run(port=8000, debug=glob.config.debug) # blocking call
+    i18n.load_path.append(os.getcwd() + '/locales')
+    i18n.set('filename_format', '{locale}.{format}')
+    app.run(port=8000, debug=glob.config.debug)  # blocking call
diff --git a/templates/home.html b/templates/home.html
index c1a6897e..055cdb3f 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -68,7 +68,7 @@ <h2 class="subtitle">
 
 <section class="section">
   <div class="container has-text-centered py-4">
-    <h2 class="title mb-6">Some of our coolest features</h2>
+    <h2 class="title mb-6">{{ t('some-coolest-features') }}</h2>
     <div class="columns has-text-left mb-6">
       <div class="column is-4">
         <div class="columns">
diff --git a/templates/verify.html b/templates/verify.html
index 2f84aa00..e0490b71 100644
--- a/templates/verify.html
+++ b/templates/verify.html
@@ -10,8 +10,8 @@
     <div class="columns pm-reset is-weeb">
         <div class="column title-block">
             <div class="titlewithsub">
-                <h1 class="title is-left">{{ i18n.t('base.how-to-verify-your-account') }}</h1>
-                <h2 class="subtitle">{{ i18n.t('what-do-you-mean-this-must-be-easy-right') }}</h2>
+                <h1 class="title is-left">{{ t('base.how-to-verify-your-account') }}</h1>
+                <h2 class="subtitle">{{ t('what-do-you-mean-this-must-be-easy-right') }}</h2>
             </div>
         </div>
         <div class="column icon-block">
@@ -22,8 +22,8 @@ <h2 class="subtitle">{{ i18n.t('what-do-you-mean-this-must-be-easy-right') }}</h
         <div class="box is-padding">
             <div class="bordertitle">
                 <div class="titlewithsub">
-                    <h1 class="title is-left">{{ i18n.t('verification') }}</h1>
-                    <h2 class="subtitle">{{ i18n.t('follow-these-three-simple-steps$', appName = appName()) }}</h2>
+                    <h1 class="title is-left">{{ t('verification') }}</h1>
+                    <h2 class="subtitle">{{ t('follow-these-three-simple-steps$', appName = appName()) }}</h2>
                 </div>
             </div>
             <div class="howto-content">
@@ -35,8 +35,8 @@ <h2 class="subtitle">{{ i18n.t('follow-these-three-simple-steps$', appName = app
                                 <div class="howto-number">1</div>
                             </div>
                             <div class="howto-withsub">
-                                <h1 class="title is-left">{{ i18n.t('osu-shortcut') }}</h1>
-                                <h2 class="subtitle">{{ i18n.t('find-your-shortcut$') }}</h2>
+                                <h1 class="title is-left">{{ t('osu-shortcut') }}</h1>
+                                <h2 class="subtitle">{{ t('find-your-shortcut$') }}</h2>
                             </div>
                         </div>
                     </div>
@@ -47,8 +47,8 @@ <h2 class="subtitle">{{ i18n.t('find-your-shortcut$') }}</h2>
                                 <div class="howto-number">2</div>
                             </div>
                             <div class="howto-withsub">
-                                <h1 class="title is-left">{{ i18n.t('edit-it') }}</h1>
-                                <h2 class="subtitle"><strong>1.</strong>{{ i18n.t('right-click-properties') }}</h2>strong>2.</strong>{{ i18n.t('find-target-element-box') }}</h2>'strong>3.</strong>{{ i18n.t('add-domain$', domain = domain()) }}</h2>
+                                <h1 class="title is-left">{{ t('edit-it') }}</h1>
+                                <h2 class="subtitle"><strong>1.</strong>{{ t('right-click-properties') }}</h2>strong>2.</strong>{{ t('find-target-element-box') }}</h2>'strong>3.</strong>{{ t('add-domain$', domain = domain()) }}</h2>
                             </div>
                         </div>
                     </div>

From 21a85df0e7a0632f5d06a2c3d5c358f4c70b0712 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Sun, 29 May 2022 22:59:43 +0800
Subject: [PATCH 044/278] finish i18n

---
 blueprints/frontend.py                  |  5 +++++
 locales/{base.en.yml => base.en_GB.yml} |  6 +++---
 locales/base.en_US.yml                  |  2 ++
 locales/base.zh_CN.yml                  |  2 ++
 main.py                                 |  9 +++++++--
 templates/components/navbar.html        | 22 ++++++++++++++++++++--
 templates/verify.html                   |  8 ++++++--
 7 files changed, 45 insertions(+), 9 deletions(-)
 rename locales/{base.en.yml => base.en_GB.yml} (82%)
 create mode 100644 locales/base.en_US.yml
 create mode 100644 locales/base.zh_CN.yml

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index e95908c5..dd0ab996 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -609,6 +609,11 @@ async def get_profile_banner(user_id: int):
 
     return b'{"status":404}'
 
+@frontend.route('/language/<lang>')
+async def set_language(lang: str):
+    session['lang'] = lang
+    return await render_template('home.html')
+
 
 @frontend.route('/backgrounds/<user_id>')
 async def get_profile_background(user_id: int):
diff --git a/locales/base.en.yml b/locales/base.en_GB.yml
similarity index 82%
rename from locales/base.en.yml
rename to locales/base.en_GB.yml
index 43dda477..8d78a3b0 100644
--- a/locales/base.en.yml
+++ b/locales/base.en_GB.yml
@@ -1,12 +1,12 @@
-en:
+en_GB:
   verification: 'Verification'
   how-to-verify-your-account: 'How to verify your account'
   what-do-you-mean-this-must-be-easy-right: 'What do you mean? This must be easy right?'
-  follow-these-three-simple-steps$: 'Follow these three simple steps to get started playing %{ appName }!'
+  follow-these-three-simple-steps$: 'Follow these three simple steps to get started playing %{appName} !'
   osu-shortcut: 'Osu shortcut'
   find-your-shortcut$: 'Find your shortcut to osu on desktop and copy it!'
   edit-it: 'Edit it'
   right-click-properties: 'Right click -> Properties'
   find-target-element-box: 'Find "Target element" Box'
-  add-domain$: 'Add " -devserver %{ domain } at the end of it'
+  add-domain$: 'Add " -devserver %{domain} at the end of it'
   some-coolest-features: 'Some of our coolest features'
\ No newline at end of file
diff --git a/locales/base.en_US.yml b/locales/base.en_US.yml
new file mode 100644
index 00000000..38255b44
--- /dev/null
+++ b/locales/base.en_US.yml
@@ -0,0 +1,2 @@
+en_US:
+  some-coolest-features: 'Some of our coolest features (US)'
\ No newline at end of file
diff --git a/locales/base.zh_CN.yml b/locales/base.zh_CN.yml
new file mode 100644
index 00000000..c2ab9bea
--- /dev/null
+++ b/locales/base.zh_CN.yml
@@ -0,0 +1,2 @@
+zh_CN:
+  some-coolest-features: '来看看我们服的特性吧'
\ No newline at end of file
diff --git a/main.py b/main.py
index 944463e9..af656f20 100755
--- a/main.py
+++ b/main.py
@@ -8,13 +8,14 @@
 import aiohttp
 import i18n
 import orjson
-from quart import Quart
+from quart import Quart, session
 from quart import render_template
 
 from cmyui.logging import Ansi
 from cmyui.logging import log
 from cmyui.mysql import AsyncSQLPool
 from cmyui.version import Version
+from requests import cookies
 
 from objects import glob
 
@@ -49,7 +50,11 @@ def appVersion() -> str:
 
 @app.template_global()
 def t(key, **kwargs) -> str:
-    return i18n.t(key, **kwargs)
+    kwargs['locale'] = session.get('lang', 'en_GB')
+    try:
+        return i18n.t(key, **kwargs)
+    except:
+        return key
 
 @app.template_global()
 def appName() -> str:
diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index 8f82323f..343aea7e 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -21,7 +21,7 @@
                 Leaderboards
             </a>
 
-            <!--<div class="navbar-item has-dropdown is-hoverable">
+            <div class="navbar-item has-dropdown is-hoverable">
                 <a class="navbar-link">
                     Information
                 </a>
@@ -37,7 +37,7 @@
                         Report an issue
                     </a>
                 </div>
-            </div>-->
+            </div>
 
             {% if session.authenticated and session.user_data['is_staff'] %}
             <a class="navbar-item" href="/admin">
@@ -47,6 +47,24 @@
         </div>
 
         <div class="navbar-end">
+            <div class="navbar-item has-dropdown is-hoverable" >
+                <i style="display: flex;" class="fa fa-globe navbar-link"></i>
+                <div class="navbar-dropdown">
+                    <a class="navbar-item" href="/language/zh_CN">
+                        <img style="size: 20px; margin-right: 5px;" src="/static/images/flags/CN.png">
+                        简体中文
+                    </a>
+                    <a class="navbar-item" href="/language/en_US">
+                        <img style="size: 20px; margin-right: 5px;" src="/static/images/flags/US.png">
+                        English - US
+                    </a>
+                    <a class="navbar-item" href="/language/en_GB">
+                        <img style="size: 20px; margin-right: 5px;" src="/static/images/flags/GB.png">
+                        English - Global
+                    </a>
+                </div>
+            </div>
+
             {% if session.authenticated %}
             <div class="navbar-item has-dropdown is-hoverable">
                 <a class="navbar-link">
diff --git a/templates/verify.html b/templates/verify.html
index e0490b71..2aef0ad9 100644
--- a/templates/verify.html
+++ b/templates/verify.html
@@ -10,7 +10,7 @@
     <div class="columns pm-reset is-weeb">
         <div class="column title-block">
             <div class="titlewithsub">
-                <h1 class="title is-left">{{ t('base.how-to-verify-your-account') }}</h1>
+                <h1 class="title is-left">{{ t('how-to-verify-your-account') }}</h1>
                 <h2 class="subtitle">{{ t('what-do-you-mean-this-must-be-easy-right') }}</h2>
             </div>
         </div>
@@ -48,7 +48,11 @@ <h2 class="subtitle">{{ t('find-your-shortcut$') }}</h2>
                             </div>
                             <div class="howto-withsub">
                                 <h1 class="title is-left">{{ t('edit-it') }}</h1>
-                                <h2 class="subtitle"><strong>1.</strong>{{ t('right-click-properties') }}</h2>strong>2.</strong>{{ t('find-target-element-box') }}</h2>'strong>3.</strong>{{ t('add-domain$', domain = domain()) }}</h2>
+                                <h2 class="subtitle">
+                                    <strong>1.</strong>{{ t('right-click-properties') }}
+                                    <strong>2.</strong>{{ t('find-target-element-box') }}
+                                    <strong>3.</strong>{{ t('add-domain$', domain = domain()) }}
+                                </h2>
                             </div>
                         </div>
                     </div>

From 4bdd73153b2d197286bef6be9ace32cba66d1661 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 30 May 2022 00:26:09 +0900
Subject: [PATCH 045/278] verify.html

---
 locales/base.en_GB.yml                       | 12 -------
 locales/verify.en_GB.yml                     | 19 +++++++++++
 locales/{base.en_US.yml => verify.en_US.yml} |  0
 locales/{base.zh_CN.yml => verify.zh_CN.yml} |  0
 templates/verify.html                        | 34 ++++++++++----------
 5 files changed, 36 insertions(+), 29 deletions(-)
 delete mode 100644 locales/base.en_GB.yml
 create mode 100644 locales/verify.en_GB.yml
 rename locales/{base.en_US.yml => verify.en_US.yml} (100%)
 rename locales/{base.zh_CN.yml => verify.zh_CN.yml} (100%)

diff --git a/locales/base.en_GB.yml b/locales/base.en_GB.yml
deleted file mode 100644
index 8d78a3b0..00000000
--- a/locales/base.en_GB.yml
+++ /dev/null
@@ -1,12 +0,0 @@
-en_GB:
-  verification: 'Verification'
-  how-to-verify-your-account: 'How to verify your account'
-  what-do-you-mean-this-must-be-easy-right: 'What do you mean? This must be easy right?'
-  follow-these-three-simple-steps$: 'Follow these three simple steps to get started playing %{appName} !'
-  osu-shortcut: 'Osu shortcut'
-  find-your-shortcut$: 'Find your shortcut to osu on desktop and copy it!'
-  edit-it: 'Edit it'
-  right-click-properties: 'Right click -> Properties'
-  find-target-element-box: 'Find "Target element" Box'
-  add-domain$: 'Add " -devserver %{domain} at the end of it'
-  some-coolest-features: 'Some of our coolest features'
\ No newline at end of file
diff --git a/locales/verify.en_GB.yml b/locales/verify.en_GB.yml
new file mode 100644
index 00000000..ad9d7e13
--- /dev/null
+++ b/locales/verify.en_GB.yml
@@ -0,0 +1,19 @@
+en_GB:
+  verification: Verification
+  how-to-verify-your-account: How to verify your account
+  what-do-you-mean-this-must-be-easy-right: What do you mean? This must be easy right?
+  follow-these-three-simple-steps$: Follow these three simple steps to get started playing %{appName} !
+  osu-shortcut: Osu shortcut
+  find-your-shortcut$: Find your shortcut to osu on desktop and copy it!
+  edit-it: Edit it
+  right-click-properties: Right click -> Properties
+  find-target-element-box: Find "Target element" Box
+  add-domain$: Add " -devserver %{domain} at the end of it
+  some-coolest-features: Some of our coolest features
+  login-to-your-account: Login to your account
+  login-to-your-app-name-account$: Login to your %{appName} account and you should be done!
+  oh-crap-i-am-stuck$: 'Oh crap! I'm stuck please help me!'
+  need-help-join-discord-server$: Need help? We've got you covered - join the Discord so our community can help you out!
+  click-here-to-join-our-discord: 'Click here to join our Discord!'
+  waiting-for-verification: Waiting for verification!
+  follow-the-simple-instructions$: 'Follow the simple instructions above and once you're done reload this page!'
\ No newline at end of file
diff --git a/locales/base.en_US.yml b/locales/verify.en_US.yml
similarity index 100%
rename from locales/base.en_US.yml
rename to locales/verify.en_US.yml
diff --git a/locales/base.zh_CN.yml b/locales/verify.zh_CN.yml
similarity index 100%
rename from locales/base.zh_CN.yml
rename to locales/verify.zh_CN.yml
diff --git a/templates/verify.html b/templates/verify.html
index 2aef0ad9..4c5ce81f 100644
--- a/templates/verify.html
+++ b/templates/verify.html
@@ -10,8 +10,8 @@
     <div class="columns pm-reset is-weeb">
         <div class="column title-block">
             <div class="titlewithsub">
-                <h1 class="title is-left">{{ t('how-to-verify-your-account') }}</h1>
-                <h2 class="subtitle">{{ t('what-do-you-mean-this-must-be-easy-right') }}</h2>
+                <h1 class="title is-left">{{ t('verify.verifyhow-to-verify-your-account') }}</h1>
+                <h2 class="subtitle">{{ t('verify.what-do-you-mean-this-must-be-easy-right') }}</h2>
             </div>
         </div>
         <div class="column icon-block">
@@ -22,8 +22,8 @@ <h2 class="subtitle">{{ t('what-do-you-mean-this-must-be-easy-right') }}</h2>
         <div class="box is-padding">
             <div class="bordertitle">
                 <div class="titlewithsub">
-                    <h1 class="title is-left">{{ t('verification') }}</h1>
-                    <h2 class="subtitle">{{ t('follow-these-three-simple-steps$', appName = appName()) }}</h2>
+                    <h1 class="title is-left">{{ t('verify.verification') }}</h1>
+                    <h2 class="subtitle">{{ t('verify.follow-these-three-simple-steps$', appName = appName()) }}</h2>
                 </div>
             </div>
             <div class="howto-content">
@@ -35,8 +35,8 @@ <h2 class="subtitle">{{ t('follow-these-three-simple-steps$', appName = appName(
                                 <div class="howto-number">1</div>
                             </div>
                             <div class="howto-withsub">
-                                <h1 class="title is-left">{{ t('osu-shortcut') }}</h1>
-                                <h2 class="subtitle">{{ t('find-your-shortcut$') }}</h2>
+                                <h1 class="title is-left">{{ t('verify.osu-shortcut') }}</h1>
+                                <h2 class="subtitle">{{ t('verify.find-your-shortcut$') }}</h2>
                             </div>
                         </div>
                     </div>
@@ -47,11 +47,11 @@ <h2 class="subtitle">{{ t('find-your-shortcut$') }}</h2>
                                 <div class="howto-number">2</div>
                             </div>
                             <div class="howto-withsub">
-                                <h1 class="title is-left">{{ t('edit-it') }}</h1>
+                                <h1 class="title is-left">{{ t('verify.edit-it') }}</h1>
                                 <h2 class="subtitle">
-                                    <strong>1.</strong>{{ t('right-click-properties') }}
-                                    <strong>2.</strong>{{ t('find-target-element-box') }}
-                                    <strong>3.</strong>{{ t('add-domain$', domain = domain()) }}
+                                    <strong>1.</strong>{{ t('verify.right-click-properties') }}
+                                    <strong>2.</strong>{{ t('verify.find-target-element-box') }}
+                                    <strong>3.</strong>{{ t('verify.add-domain$', domain = domain()) }}
                                 </h2>
                             </div>
                         </div>
@@ -63,8 +63,8 @@ <h2 class="subtitle">
                                 <div class="howto-number">3</div>
                             </div>
                             <div class="howto-withsub">
-                                <h1 class="title is-left">Login to your account</h1>
-                                <h2 class="subtitle">Login to your {{ appName() }} account and you should be done!</h2>
+                                <h1 class="title is-left">{{ t('verify.login-to-your-account') }}</h1>
+                                <h2 class="subtitle">{{ t('verify.login-to-your-app-name-account$', appName = appName()) }}</h2>
                             </div>
                         </div>
                     </div>
@@ -72,8 +72,8 @@ <h2 class="subtitle">Login to your {{ appName() }} account and you should be don
             </div>
             <div class="bordertitle">
                 <div class="titlewithsub">
-                    <h1 class="title is-left">Oh crap! I'm stuck please help me!</h1>
-                    <h2 class="subtitle">Need help? We've got you covered - join the Discord so our community can help you out!</h2>
+                    <h1 class="title is-left">{{ t('verify.oh-crap-i-am-stuck$') }}</h1>
+                    <h2 class="subtitle">{{ t('verify.need-help-join-discord-server$') }}</h2>
                 </div>
             </div>
             <div class="box flex is-mpadding is-marginless">
@@ -81,7 +81,7 @@ <h2 class="subtitle">Need help? We've got you covered - join the Discord so our
                         src="https://cdn.iconscout.com/icon/free/png-256/discord-2752210-2285027.png"
                         class="discord-logo">
                     <div class="clickhere-title flex flex-vcenter">
-                        <h1 class="title">Click here to join our Discord!</h1>
+                        <h1 class="title">{{ t('verify.click-here-to-join-our-discord') }}</h1>
                     </div>
                 </a>
             </div>
@@ -89,8 +89,8 @@ <h1 class="title">Click here to join our Discord!</h1>
                 <div class="columns flex is-paddingless is-marginless">
                     <div class="column flex flex-vcenter">
                         <div>
-                            <h1 class="title is-left">Waiting for verification!</h1>
-                            <h2 class="subtitle">Follow the simple instructions above and once you're done reload this page!</h2>
+                            <h1 class="title is-left">{{ t('verify.waiting-for-verification') }}</h1>
+                            <h2 class="subtitle">{{ t('verify.follow-the-simple-instructions$') }}</h2>
                         </div>
                     </div>
                     <div class="column icon-block">

From 4dcb3ba12164c89a95c70319038eb6ad98f2dd82 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Sun, 29 May 2022 23:41:49 +0800
Subject: [PATCH 046/278] fix frontend

---
 blueprints/frontend.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index dd0ab996..46dc4663 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -612,7 +612,7 @@ async def get_profile_banner(user_id: int):
 @frontend.route('/language/<lang>')
 async def set_language(lang: str):
     session['lang'] = lang
-    return await render_template('home.html')
+    return redirect('/home')
 
 
 @frontend.route('/backgrounds/<user_id>')

From b0ad0afce85de94cd4c98fd083231fc7f74e451a Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 2 Jun 2022 21:19:44 +0900
Subject: [PATCH 047/278] Update requirements.txt

---
 ext/requirements.txt | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/ext/requirements.txt b/ext/requirements.txt
index 63c7fcb6..98989317 100644
--- a/ext/requirements.txt
+++ b/ext/requirements.txt
@@ -9,4 +9,5 @@ timeago
 markdown2
 Pillow
 
-python-i18n[YAML]
\ No newline at end of file
+python-i18n[YAML]
+requires

From 92fd6524b2cf942e6580c7271690f7ae637e8fe9 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Fri, 3 Jun 2022 09:51:47 +0800
Subject: [PATCH 048/278] i18n: 404 home navbar verify fix i18n structures

---
 locales/404.en_GB.yml            |  5 +++++
 locales/404.en_US.yml            |  5 +++++
 locales/404.zh_CN.yml            |  5 +++++
 locales/global.en_GB.yml         |  3 +++
 locales/global.en_US.yml         |  3 +++
 locales/global.zh_CN.yml         |  3 +++
 locales/home.en_GB.yml           |  7 +++++++
 locales/home.en_US.yml           |  7 +++++++
 locales/home.zh_CN.yml           |  7 +++++++
 locales/navbar.en_GB.yml         |  5 +++++
 locales/navbar.en_US.yml         |  5 +++++
 locales/navbar.zh_CN.yml         |  5 +++++
 locales/verify.en_GB.yml         | 10 +++++-----
 locales/verify.en_US.yml         | 19 ++++++++++++++++++-
 locales/verify.zh_CN.yml         | 19 ++++++++++++++++++-
 main.py                          |  1 -
 templates/404.html               |  8 ++++----
 templates/components/footer.html |  5 -----
 templates/components/navbar.html | 21 +++++++--------------
 templates/home.html              | 23 +++++++++--------------
 templates/verify.html            |  2 +-
 21 files changed, 122 insertions(+), 46 deletions(-)
 create mode 100644 locales/404.en_GB.yml
 create mode 100644 locales/404.en_US.yml
 create mode 100644 locales/404.zh_CN.yml
 create mode 100644 locales/global.en_GB.yml
 create mode 100644 locales/global.en_US.yml
 create mode 100644 locales/global.zh_CN.yml
 create mode 100644 locales/home.en_GB.yml
 create mode 100644 locales/home.en_US.yml
 create mode 100644 locales/home.zh_CN.yml
 create mode 100644 locales/navbar.en_GB.yml
 create mode 100644 locales/navbar.en_US.yml
 create mode 100644 locales/navbar.zh_CN.yml

diff --git a/locales/404.en_GB.yml b/locales/404.en_GB.yml
new file mode 100644
index 00000000..d6e5cf3e
--- /dev/null
+++ b/locales/404.en_GB.yml
@@ -0,0 +1,5 @@
+en_GB:
+  page-not-found: Page not found
+  where-am-i: Where am I?
+  check-url: Check that the URL you entered is correct.
+  make-sure-visit: Make sure that the place you are visiting isn't under maintenance!
\ No newline at end of file
diff --git a/locales/404.en_US.yml b/locales/404.en_US.yml
new file mode 100644
index 00000000..685f7132
--- /dev/null
+++ b/locales/404.en_US.yml
@@ -0,0 +1,5 @@
+en_US:
+  page-not-found: Page not found
+  where-am-i: Where am I?
+  check-url: Check that the URL you entered is correct.
+  make-sure-visit: Make sure that the place you are visiting isn't under maintenance!
\ No newline at end of file
diff --git a/locales/404.zh_CN.yml b/locales/404.zh_CN.yml
new file mode 100644
index 00000000..9249dce3
--- /dev/null
+++ b/locales/404.zh_CN.yml
@@ -0,0 +1,5 @@
+zh_CN:
+  page-not-found: Page not found
+  where-am-i: Where am I?
+  check-url: Check that the URL you entered is correct.
+  make-sure-visit: Make sure that the place you are visiting isn't under maintenance!
\ No newline at end of file
diff --git a/locales/global.en_GB.yml b/locales/global.en_GB.yml
new file mode 100644
index 00000000..a92c4174
--- /dev/null
+++ b/locales/global.en_GB.yml
@@ -0,0 +1,3 @@
+en_GB:
+  sign-up: Sign up
+  log-in: Log in
\ No newline at end of file
diff --git a/locales/global.en_US.yml b/locales/global.en_US.yml
new file mode 100644
index 00000000..148f84e5
--- /dev/null
+++ b/locales/global.en_US.yml
@@ -0,0 +1,3 @@
+en_US:
+  sign-up: Sign up
+  log-in: Log in
\ No newline at end of file
diff --git a/locales/global.zh_CN.yml b/locales/global.zh_CN.yml
new file mode 100644
index 00000000..c70b1e1e
--- /dev/null
+++ b/locales/global.zh_CN.yml
@@ -0,0 +1,3 @@
+zh_CN:
+  sign-up: Sign up
+  log-in: Log in
\ No newline at end of file
diff --git a/locales/home.en_GB.yml b/locales/home.en_GB.yml
new file mode 100644
index 00000000..7a627141
--- /dev/null
+++ b/locales/home.en_GB.yml
@@ -0,0 +1,7 @@
+en_GB:
+  subtitle-big: We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
+  some-of-our-coolest-features: Some of our coolest features
+  what-are-you-waiting-for: What are you waiting for?
+  subtitle: Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
+  sign-up-for-free: Sign up for free
+  login: Login
\ No newline at end of file
diff --git a/locales/home.en_US.yml b/locales/home.en_US.yml
new file mode 100644
index 00000000..130741c3
--- /dev/null
+++ b/locales/home.en_US.yml
@@ -0,0 +1,7 @@
+en_US:
+  subtitle-big: We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
+  some-of-our-coolest-features: Some of our coolest features
+  what-are-you-waiting-for: What are you waiting for?
+  subtitle: Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
+  sign-up-for-free: Sign up for free
+  login: Login
\ No newline at end of file
diff --git a/locales/home.zh_CN.yml b/locales/home.zh_CN.yml
new file mode 100644
index 00000000..bd3bbf82
--- /dev/null
+++ b/locales/home.zh_CN.yml
@@ -0,0 +1,7 @@
+zh_CN:
+  subtitle-big: We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
+  some-of-our-coolest-features: Some of our coolest features
+  what-are-you-waiting-for: What are you waiting for?
+  subtitle: Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
+  sign-up-for-free: Sign up for free
+  login: Login
\ No newline at end of file
diff --git a/locales/navbar.en_GB.yml b/locales/navbar.en_GB.yml
new file mode 100644
index 00000000..909dba09
--- /dev/null
+++ b/locales/navbar.en_GB.yml
@@ -0,0 +1,5 @@
+en_GB:
+  home: Home
+  leaderboards: Leaderboards
+  information: Information
+  admin: Admin
\ No newline at end of file
diff --git a/locales/navbar.en_US.yml b/locales/navbar.en_US.yml
new file mode 100644
index 00000000..15747c8d
--- /dev/null
+++ b/locales/navbar.en_US.yml
@@ -0,0 +1,5 @@
+en_US:
+  home: Home
+  leaderboards: Leaderboards
+  information: Information
+  admin: Admin
\ No newline at end of file
diff --git a/locales/navbar.zh_CN.yml b/locales/navbar.zh_CN.yml
new file mode 100644
index 00000000..6624c397
--- /dev/null
+++ b/locales/navbar.zh_CN.yml
@@ -0,0 +1,5 @@
+zh_CN:
+  home: Home
+  leaderboards: Leaderboards
+  information: Information
+  admin: Admin
\ No newline at end of file
diff --git a/locales/verify.en_GB.yml b/locales/verify.en_GB.yml
index ad9d7e13..974d3090 100644
--- a/locales/verify.en_GB.yml
+++ b/locales/verify.en_GB.yml
@@ -2,18 +2,18 @@ en_GB:
   verification: Verification
   how-to-verify-your-account: How to verify your account
   what-do-you-mean-this-must-be-easy-right: What do you mean? This must be easy right?
-  follow-these-three-simple-steps$: Follow these three simple steps to get started playing %{appName} !
+  follow-these-three-simple-steps: Follow these three simple steps to get started playing %{appName} !
   osu-shortcut: Osu shortcut
   find-your-shortcut$: Find your shortcut to osu on desktop and copy it!
   edit-it: Edit it
   right-click-properties: Right click -> Properties
   find-target-element-box: Find "Target element" Box
-  add-domain$: Add " -devserver %{domain} at the end of it
+  add-domain$: Add -devserver %{domain} at the end of it
   some-coolest-features: Some of our coolest features
   login-to-your-account: Login to your account
   login-to-your-app-name-account$: Login to your %{appName} account and you should be done!
-  oh-crap-i-am-stuck$: 'Oh crap! I'm stuck please help me!'
+  oh-crap-i-am-stuck$: Oh crap! I'm stuck please help me!
   need-help-join-discord-server$: Need help? We've got you covered - join the Discord so our community can help you out!
-  click-here-to-join-our-discord: 'Click here to join our Discord!'
+  click-here-to-join-our-discord: Click here to join our Discord!
   waiting-for-verification: Waiting for verification!
-  follow-the-simple-instructions$: 'Follow the simple instructions above and once you're done reload this page!'
\ No newline at end of file
+  follow-the-simple-instructions$: Follow the simple instructions above and once you're done reload this page!
\ No newline at end of file
diff --git a/locales/verify.en_US.yml b/locales/verify.en_US.yml
index 38255b44..89f3eace 100644
--- a/locales/verify.en_US.yml
+++ b/locales/verify.en_US.yml
@@ -1,2 +1,19 @@
 en_US:
-  some-coolest-features: 'Some of our coolest features (US)'
\ No newline at end of file
+  verification: Verification
+  how-to-verify-your-account: How to verify your account
+  what-do-you-mean-this-must-be-easy-right: What do you mean? This must be easy right?
+  follow-these-three-simple-steps$: Follow these three simple steps to get started playing %{appName} !
+  osu-shortcut: Osu shortcut
+  find-your-shortcut$: Find your shortcut to osu on desktop and copy it!
+  edit-it: Edit it
+  right-click-properties: Right click -> Properties
+  find-target-element-box: Find "Target element" Box
+  add-domain$: Add -devserver %{domain} at the end of it
+  some-coolest-features: Some of our coolest features
+  login-to-your-account: Login to your account
+  login-to-your-app-name-account$: Login to your %{appName} account and you should be done!
+  oh-crap-i-am-stuck$: Oh crap! I'm stuck please help me!
+  need-help-join-discord-server$: Need help? We've got you covered - join the Discord so our community can help you out!
+  click-here-to-join-our-discord: Click here to join our Discord!
+  waiting-for-verification: Waiting for verification!
+  follow-the-simple-instructions$: Follow the simple instructions above and once you're done reload this page!
\ No newline at end of file
diff --git a/locales/verify.zh_CN.yml b/locales/verify.zh_CN.yml
index c2ab9bea..16d9555e 100644
--- a/locales/verify.zh_CN.yml
+++ b/locales/verify.zh_CN.yml
@@ -1,2 +1,19 @@
 zh_CN:
-  some-coolest-features: '来看看我们服的特性吧'
\ No newline at end of file
+  verification: Verification
+  how-to-verify-your-account: How to verify your account
+  what-do-you-mean-this-must-be-easy-right: What do you mean? This must be easy right?
+  follow-these-three-simple-steps$: Follow these three simple steps to get started playing %{appName} !
+  osu-shortcut: Osu shortcut
+  find-your-shortcut$: Find your shortcut to osu on desktop and copy it!
+  edit-it: Edit it
+  right-click-properties: Right click -> Properties
+  find-target-element-box: Find "Target element" Box
+  add-domain$: Add -devserver %{domain} at the end of it
+  some-coolest-features: Some of our coolest features
+  login-to-your-account: Login to your account
+  login-to-your-app-name-account$: Login to your %{appName} account and you should be done!
+  oh-crap-i-am-stuck$: Oh crap! I'm stuck please help me!
+  need-help-join-discord-server$: Need help? We've got you covered - join the Discord so our community can help you out!
+  click-here-to-join-our-discord: Click here to join our Discord!
+  waiting-for-verification: Waiting for verification!
+  follow-the-simple-instructions$: Follow the simple instructions above and once you're done reload this page!
\ No newline at end of file
diff --git a/main.py b/main.py
index af656f20..afe909fe 100755
--- a/main.py
+++ b/main.py
@@ -82,5 +82,4 @@ async def page_not_found(e):
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
     i18n.load_path.append(os.getcwd() + '/locales')
-    i18n.set('filename_format', '{locale}.{format}')
     app.run(port=8000, debug=glob.config.debug)  # blocking call
diff --git a/templates/404.html b/templates/404.html
index 9480f44b..0a2e7dd4 100644
--- a/templates/404.html
+++ b/templates/404.html
@@ -11,14 +11,14 @@
 	<div class="title-block">
 		<span>404</span>
 		<h2 class="error-title">
-			Page not found
+            {{ t('404.page-not-found') }}
 		</h2>
 	</div>
 	<div class="error-block">
-		<h3 class="error-subtitle">Where am I?</h3>
+		<h3 class="error-subtitle">{{ t('404.where-am-i') }}</h3>
 		<ol>
-			<li>- Check that the URL you entered is correct.</li>
-			<li>- Make sure that the place you are visiting isn't under maintenance!</li>
+			<li>- {{ t('404.check-url') }}</li>
+			<li>- {{ t('404.make-sure-visit') }}</li>
 			<li></li>
 		</ol>
 	</div>
diff --git a/templates/components/footer.html b/templates/components/footer.html
index e3598af8..c755cfd8 100644
--- a/templates/components/footer.html
+++ b/templates/components/footer.html
@@ -1,10 +1,5 @@
 <footer class="footer">
     <div class="content">
         <span>{{ appName() }} <strong>v{{ appVersion() }}</strong></span>
-        <a class="foot-link" href="/github"><i class="fab fa-github"></i> GitHub</a>
-        <a class="foot-link" href="/discord"><i class="fab fa-discord"></i> Discord</a>
-        <a class="foot-link" href="/youtube"><i class="fab fa-youtube"></i> YouTube</a>
-        <a class="foot-link" href="/twitter"><i class="fab fa-twitter"></i> Twitter</a>
-        <a class="foot-link" href="/instagram"><i class="fab fa-instagram"></i> Instagram</a>
     </div>
 </footer>
diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index 343aea7e..fe2b4790 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -14,34 +14,27 @@
     <div id="navbar" class="navbar-menu">
         <div class="navbar-start">
             <a class="navbar-item" href="/home">
-                Home
+                {{ t('navbar.home') }}
             </a>
 
             <a class="navbar-item" href="/leaderboard">
-                Leaderboards
+                {{ t('navbar.leaderboards') }}
             </a>
 
             <div class="navbar-item has-dropdown is-hoverable">
                 <a class="navbar-link">
-                    Information
+                    {{ t('navbar.information') }}
                 </a>
                 <div class="navbar-dropdown">
                     <a class="navbar-item" href="/doc/rules">
-                        Rules
-                    </a>
-                    <a class="navbar-item" href="/discord">
-                        Discord
-                    </a>
-                    <hr class="navbar-divider">
-                    <a class="navbar-item" href="https://github.com/varkaria/guweb/issues/new">
-                        Report an issue
+                        Todo...
                     </a>
                 </div>
             </div>
 
             {% if session.authenticated and session.user_data['is_staff'] %}
             <a class="navbar-item" href="/admin">
-                Admin
+                {{ t('navbar.admin') }}
             </a>
             {% endif %}
         </div>
@@ -88,10 +81,10 @@
             <div class="navbar-item">
                 <div class="buttons">
                     <a class="button is-primary" href="/register">
-                        <strong>Sign up</strong>
+                        <strong>{{ t('global.sign-up') }}</strong>
                     </a>
                     <a class="button is-light" href="/login">
-                        Log in
+                        {{ t('global.log-in') }}
                     </a>
                 </div>
             </div>
diff --git a/templates/home.html b/templates/home.html
index 055cdb3f..ad6cc435 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -42,19 +42,16 @@
       <div class="column flex-vcenter flex-lcenter is-size-2-desktop is-size-1-fullhd" id="title">
         <h1 class="title is-spaced is-size-2-desktop is-size-1-fullhd">{{ appName() }}</h1>
         <h2 class="subtitle">
-          We are an osu! private server built from the ground up with many
-          unique features not seen elsewhere - for more information, check
-          out <a href="http://github.com/cmyui/gulag">gulag</a>
-          and <a href="https://github.com/Varkaria/guweb">guweb</a>
-          on GitHub - we're fully open source!
+            {{ t('home.subtitle-big') }}
+
         </h2>
         {% if not session.authenticated %}
         <div class="buttons">
           <a class="button is-primary" href="/register">
-            <strong>Sign up</strong>
+            <strong>{{ t('global.sign-up') }}</strong>
           </a>
           <a class="button is-light" href="/login">
-            Log in
+            {{ t('global.log-in') }}
           </a>
         </div>
         {% endif %}
@@ -68,7 +65,7 @@ <h2 class="subtitle">
 
 <section class="section">
   <div class="container has-text-centered py-4">
-    <h2 class="title mb-6">{{ t('some-coolest-features') }}</h2>
+    <h2 class="title mb-6">{{ t('home.some-of-our-coolest-features') }}</h2>
     <div class="columns has-text-left mb-6">
       <div class="column is-4">
         <div class="columns">
@@ -119,12 +116,10 @@ <h4 class="title is-spaced is-4">Flexible library</h4>
 <section class="hero splash">
   <div class="hero-body">
     <div class="container has-text-centered">
-      <h1 class="title is-spaced">What are you waiting for?</h1>
-      <h2 class="subtitle">Join {{ appName() }}! It's risk-free! You won't get your account banned on official servers
-        if
-        you play here with us! And don't worry, as you can always switch between the official servers and us at any time!</h2>
-      <div class="buttons is-centered"><a class="control button is-primary" href="/register">Sign up for free</a><a
-          class="control button is-light" href="/login">Login</a></div>
+      <h1 class="title is-spaced">{{ t('home.what-are-you-waiting-for') }}</h1>
+      <h2 class="subtitle">{{ t('home.subtitle', appName = appName()) }}</h2>
+      <div class="buttons is-centered"><a class="control button is-primary" href="/register">{{ t('home.sign-up-for-free') }}</a><a
+          class="control button is-light" href="/login">{{ t('home.login') }}</a></div>
     </div>
   </div>
 </section>
diff --git a/templates/verify.html b/templates/verify.html
index 4c5ce81f..511e4888 100644
--- a/templates/verify.html
+++ b/templates/verify.html
@@ -10,7 +10,7 @@
     <div class="columns pm-reset is-weeb">
         <div class="column title-block">
             <div class="titlewithsub">
-                <h1 class="title is-left">{{ t('verify.verifyhow-to-verify-your-account') }}</h1>
+                <h1 class="title is-left">{{ t('verify.how-to-verify-your-account') }}</h1>
                 <h2 class="subtitle">{{ t('verify.what-do-you-mean-this-must-be-easy-right') }}</h2>
             </div>
         </div>

From 9259198301a73bd0979e159bc0b458aa6c26e840 Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Fri, 3 Jun 2022 11:56:05 +0800
Subject: [PATCH 049/278] i18n:leaderborad login profile register

complete i18n structures
---
 locales/leaderboard.en_GB.yml |  3 +++
 locales/leaderboard.en_US.yml |  3 +++
 locales/leaderboard.zh_CN.yml |  3 +++
 locales/login.en_GB.yml       |  7 +++++++
 locales/login.en_US.yml       |  7 +++++++
 locales/login.zh_CN.yml       |  7 +++++++
 locales/profile.en_GB.yml     |  9 +++++++++
 locales/profile.en_US.yml     |  9 +++++++++
 locales/profile.zh_CN.yml     |  9 +++++++++
 locales/register.en_GB.yml    |  6 ++++++
 locales/register.en_US.yml    |  6 ++++++
 locales/register.zh_CN.yml    |  6 ++++++
 templates/leaderboard.html    |  4 ++--
 templates/login.html          | 14 +++++++-------
 templates/profile.html        | 20 ++++++++++----------
 templates/register.html       |  8 ++++----
 16 files changed, 98 insertions(+), 23 deletions(-)
 create mode 100644 locales/leaderboard.en_GB.yml
 create mode 100644 locales/leaderboard.en_US.yml
 create mode 100644 locales/leaderboard.zh_CN.yml
 create mode 100644 locales/login.en_GB.yml
 create mode 100644 locales/login.en_US.yml
 create mode 100644 locales/login.zh_CN.yml
 create mode 100644 locales/profile.en_GB.yml
 create mode 100644 locales/profile.en_US.yml
 create mode 100644 locales/profile.zh_CN.yml
 create mode 100644 locales/register.en_GB.yml
 create mode 100644 locales/register.en_US.yml
 create mode 100644 locales/register.zh_CN.yml

diff --git a/locales/leaderboard.en_GB.yml b/locales/leaderboard.en_GB.yml
new file mode 100644
index 00000000..0f87e293
--- /dev/null
+++ b/locales/leaderboard.en_GB.yml
@@ -0,0 +1,3 @@
+en_GB:
+  Leaderboard: Leaderboard
+  there-are-no-players-to-display: there are no players to display!
\ No newline at end of file
diff --git a/locales/leaderboard.en_US.yml b/locales/leaderboard.en_US.yml
new file mode 100644
index 00000000..cc8dd6b7
--- /dev/null
+++ b/locales/leaderboard.en_US.yml
@@ -0,0 +1,3 @@
+en_US:
+  Leaderboard: Leaderboard
+  there-are-no-players-to-display: there are no players to display!
\ No newline at end of file
diff --git a/locales/leaderboard.zh_CN.yml b/locales/leaderboard.zh_CN.yml
new file mode 100644
index 00000000..c2aa8b08
--- /dev/null
+++ b/locales/leaderboard.zh_CN.yml
@@ -0,0 +1,3 @@
+zh_CN:
+  Leaderboard: Leaderboard
+  there-are-no-players-to-display: there are no players to display!
\ No newline at end of file
diff --git a/locales/login.en_GB.yml b/locales/login.en_GB.yml
new file mode 100644
index 00000000..c795fa41
--- /dev/null
+++ b/locales/login.en_GB.yml
@@ -0,0 +1,7 @@
+en_GB:
+ Dont-have-an-account: Don't have an account?
+ Register: Register
+ Login: Login
+ Forgot-login: Forgot login?
+ Username: Username
+ Password: Password
\ No newline at end of file
diff --git a/locales/login.en_US.yml b/locales/login.en_US.yml
new file mode 100644
index 00000000..4cd31793
--- /dev/null
+++ b/locales/login.en_US.yml
@@ -0,0 +1,7 @@
+en_GB:
+  Dont-have-an-account : Don't have an account?
+  Register: Register
+  Login: Login
+  Forgot-login: Forgot login?
+  Username: Username
+  Password: Password
\ No newline at end of file
diff --git a/locales/login.zh_CN.yml b/locales/login.zh_CN.yml
new file mode 100644
index 00000000..4cd31793
--- /dev/null
+++ b/locales/login.zh_CN.yml
@@ -0,0 +1,7 @@
+en_GB:
+  Dont-have-an-account : Don't have an account?
+  Register: Register
+  Login: Login
+  Forgot-login: Forgot login?
+  Username: Username
+  Password: Password
\ No newline at end of file
diff --git a/locales/profile.en_GB.yml b/locales/profile.en_GB.yml
new file mode 100644
index 00000000..0d51ae3f
--- /dev/null
+++ b/locales/profile.en_GB.yml
@@ -0,0 +1,9 @@
+en_GB:
+  No-scores-available: No scores available
+  Try-playing-something: Try playing something
+  Show-more: Show more
+  Most-Played-Beatmaps: Most Played Beatmaps
+  No-beatmaps-available: No beatmaps available
+  Offline: Offline
+  Online: Online
+  Statistics: Statistics
\ No newline at end of file
diff --git a/locales/profile.en_US.yml b/locales/profile.en_US.yml
new file mode 100644
index 00000000..0d51ae3f
--- /dev/null
+++ b/locales/profile.en_US.yml
@@ -0,0 +1,9 @@
+en_GB:
+  No-scores-available: No scores available
+  Try-playing-something: Try playing something
+  Show-more: Show more
+  Most-Played-Beatmaps: Most Played Beatmaps
+  No-beatmaps-available: No beatmaps available
+  Offline: Offline
+  Online: Online
+  Statistics: Statistics
\ No newline at end of file
diff --git a/locales/profile.zh_CN.yml b/locales/profile.zh_CN.yml
new file mode 100644
index 00000000..0d51ae3f
--- /dev/null
+++ b/locales/profile.zh_CN.yml
@@ -0,0 +1,9 @@
+en_GB:
+  No-scores-available: No scores available
+  Try-playing-something: Try playing something
+  Show-more: Show more
+  Most-Played-Beatmaps: Most Played Beatmaps
+  No-beatmaps-available: No beatmaps available
+  Offline: Offline
+  Online: Online
+  Statistics: Statistics
\ No newline at end of file
diff --git a/locales/register.en_GB.yml b/locales/register.en_GB.yml
new file mode 100644
index 00000000..943c5a97
--- /dev/null
+++ b/locales/register.en_GB.yml
@@ -0,0 +1,6 @@
+en_GB:
+  Registration: Registration
+  Email: Email
+  Password: Password
+  Already-have-an-account: Already have an account?
+  Login: Login
\ No newline at end of file
diff --git a/locales/register.en_US.yml b/locales/register.en_US.yml
new file mode 100644
index 00000000..943c5a97
--- /dev/null
+++ b/locales/register.en_US.yml
@@ -0,0 +1,6 @@
+en_GB:
+  Registration: Registration
+  Email: Email
+  Password: Password
+  Already-have-an-account: Already have an account?
+  Login: Login
\ No newline at end of file
diff --git a/locales/register.zh_CN.yml b/locales/register.zh_CN.yml
new file mode 100644
index 00000000..943c5a97
--- /dev/null
+++ b/locales/register.zh_CN.yml
@@ -0,0 +1,6 @@
+en_GB:
+  Registration: Registration
+  Email: Email
+  Password: Password
+  Already-have-an-account: Already have an account?
+  Login: Login
\ No newline at end of file
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index 8ebcba25..fddd66bd 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -36,7 +36,7 @@
                 <i class="mode-icon mode-mania"></i><span class="modetext"> osu!mania</span>
             </a>
         </div>
-        <div class="banner-text">Leaderboard</div>
+        <div class="banner-text">{{ 'Leaderboard' }}</div>
         <div class="selector">
             <div class="left">
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'pp' }"
@@ -116,7 +116,7 @@
             </div>
             <div v-else>
                 <div class="text-center">
-                    there are no players to display!
+                    {{ 'there-are-no-players-to-display'}}
                 </div>
             </div>
         </div>
diff --git a/templates/login.html b/templates/login.html
index 95404e52..ce191bd4 100644
--- a/templates/login.html
+++ b/templates/login.html
@@ -10,7 +10,7 @@
 <div class="main-block is-marginless is-paddingless is-auth">
   <div class="columns is-reset is-weeb">
     <div class="column title-block">
-      <h1 class="title" id="regtitle">Login</h1>
+      <h1 class="title" id="regtitle">{{ 'Login' }}</h1>
     </div>
   </div>
   <div class="columns is-reset flex-lcenter is-block">
@@ -18,7 +18,7 @@ <h1 class="title" id="regtitle">Login</h1>
      <div class="content">
     <form action="/login" method="post" class="form-content">
       <div class="field">
-        <label for="user" class="label">Username</label>
+        <label for="user" class="label">{{ 'Username' }}</label>
         <div class="control has-icons-left">
           <input id="user" type="text" name="username" placeholder="Username" class="input" autocomplete="username" required>
           <span class="icon is-small is-left">
@@ -27,7 +27,7 @@ <h1 class="title" id="regtitle">Login</h1>
         </div>
       </div>
       <div class="field">
-        <label for="pass" class="label">Password</label>
+        <label for="pass" class="label">{{ 'Password' }}</label>
         <div class="control has-icons-left">
           <input id="pass" type="password" name="password" placeholder="Password" class="input" autocomplete="current-password" required>
           <span class="icon is-small is-left">
@@ -37,18 +37,18 @@ <h1 class="title" id="regtitle">Login</h1>
       </div>
       <div class="mt-5"></div>
       <div class="dialog">
-        Don't have an account?
+          {{ 'Dont-have-an-account'}}
         <a href="/register">
-          Register
+            {{ 'Register' }}
         </a>
       </div>
       <div class="field flex-vcenter">
         <div class="buttons">
           <button type="submit" class="button is-primary">
-            Login
+              {{ 'Login' }}
           </button>
           <a href="/forgot" class="button is-info"> <!-- will probably have paths "/forgot/username" and "/forgot/password" -->
-            Forgot login?
+              {{ 'Forgot-login'}}
           </a>
         </div>
       </div>
diff --git a/templates/profile.html b/templates/profile.html
index 90d479c1..054a7d4e 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -63,13 +63,13 @@
                 <h1 class="title">: (</h1>
             </div>
             <div class="column">
-                <h1 class="title is-6">No scores available</h1>
-                <p class="subtitle is-7">Try playing something?</p>
+                <h1 class="title is-6">{{ 'No-scores-available'}}</h1>
+                <p class="subtitle is-7">{{ 'Try-playing-something'}}</p>
             </div>
         </div>
     </div>
     <div v-if="data.scores.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button" @click="AddLimit('{{ id }}score')">Show more</a>
+        <a class="show-button" @click="AddLimit('{{ id }}score')">{{ 'Show-more'}}</a>
     </div>
 </div>
 {% endmacro %}
@@ -78,7 +78,7 @@ <h1 class="title is-6">No scores available</h1>
 <div class="log-block" v-bind:class="{ 'load' : data.maps.{{ id }}.load }">
     <div class="header">
         <div class="title">
-            <i class="fas fa-address-book"></i> Most Played Beatmaps
+            <i class="fas fa-address-book"></i> {{ 'Most-Played-Beatmaps'}}
         </div>
     </div>
     <div v-if="data.maps.{{ id }}.out.length != 0" class="beatmaps">
@@ -111,13 +111,13 @@ <h1 class="title is-6">No scores available</h1>
                 <h1 class="title">: (</h1>
             </div>
             <div class="column">
-                <h1 class="title is-6">No beatmaps available</h1>
-                <p class="subtitle is-7">Try playing something?</p>
+                <h1 class="title is-6">{{ 'No-beatmaps-available'}}</h1>
+                <p class="subtitle is-7">{{ 'Try-playing-something'}}</p>
             </div>
         </div>
     </div>
     <div v-if="data.maps.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button" @click="AddLimit('mostplay')">Show more</a>
+        <a class="show-button" @click="AddLimit('mostplay')">{{ 'Show-more'}}</a>
     </div>
 </div>
 {% endmacro %}
@@ -149,10 +149,10 @@ <h1 class="title">
                 </h1>
                 <transition name="fade">
                     <div class="subtitle" v-if='data.status.online == false'>
-                        <a class='circle'>●</a> Offline
+                        <a class='circle'>●</a> {{ 'Offline' }}
                     </div>
                     <div class="subtitle" v-else-if='data.status.online == true'>
-                        <a class='circle green'>●</a> Online
+                        <a class='circle green'>●</a> {{ 'Online' }}
                     </div>
                 </transition>
             </div>
@@ -234,7 +234,7 @@ <h1 class="title">
                 </div>-->
                 <div class="header">
                     <div class="title">
-                        <i class="fas fa-chart-pie"></i> Statistics
+                        <i class="fas fa-chart-pie"></i> {{ 'Statistics' }}
                     </div>
                 </div>
                 <div class="stats-block">
diff --git a/templates/register.html b/templates/register.html
index b11e0880..d42e9776 100644
--- a/templates/register.html
+++ b/templates/register.html
@@ -9,7 +9,7 @@
 <div class="main-block is-marginless is-paddingless is-auth">
   <div class="columns pm-reset is-weeb">
     <div class="column title-block">
-      <h1 class="title" id="regtitle">Registration</h1>
+      <h1 class="title" id="regtitle">{{ 'Registration' }}</h1>
     </div>
   </div>
   <div class="columns pm-reset flex-lcenter is-block">
@@ -26,7 +26,7 @@ <h1 class="title" id="regtitle">Registration</h1>
           </div>
         </div>
         <div class="field">
-          <label for="email" class="label">Email</label>
+          <label for="email" class="label">{{ 'Email' }}</label>
           <div class="control has-icons-left">
             <input id="email" type="email" name="email" placeholder="e.g. aika@gul.ag" class="input" autocomplete="email" required>
             <span class="icon is-small is-left">
@@ -35,7 +35,7 @@ <h1 class="title" id="regtitle">Registration</h1>
           </div>
         </div>
         <div class="field">
-          <label for="pass" class="label">Password</label>
+          <label for="pass" class="label">{{ 'Password' }}</label>
           <div class="control has-icons-left">
             <input id="pass" type="password" name="password" placeholder="*************" class="input" autocomplete="new-password" required>
             <span class="icon is-small is-left">
@@ -45,7 +45,7 @@ <h1 class="title" id="regtitle">Registration</h1>
         </div>
         <div class="mt-5"></div>
         <div class="dialog">
-          Already have an account? <a href="/login">Login</a>
+            {{ 'Already-have-an-account'}} <a href="/login">{{ 'Login' }}</a>
         </div>
         {% if not captchaKey() == 'changeme' %}
         <div class="field">

From 5c8649afe7f6b5f461c3c6804bf72a937b36eb1d Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Sun, 5 Jun 2022 11:39:55 +0800
Subject: [PATCH 050/278] i18n: all structures competed and Localization
 Chinese almost completed
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#1 fix all and add some Localization key
#2 Localization Chinese almost competed,some issue need to confirm.

The issue to ask trou:
#1 GB英语还暂未确定
#2 因为页面元素位置不清楚,导致词义存疑,所以部分汉化保留原文
#3 页面的部分内容是否需要本地化暂不清楚,例如:home页面最上面的debug内容
#4 标签内的属性值为字符串硬编码，是否能够使用本地化暂不清楚。例如register:22,31,40的placeholder的字符串值
#5 本地化文本当中是否能够使用（换行）还有(注释)存疑
---
 locales/404.zh_CN.yml         |  8 ++++----
 locales/global.en_GB.yml      |  4 +++-
 locales/global.en_US.yml      |  4 +++-
 locales/global.zh_CN.yml      |  6 ++++--
 locales/home.en_GB.yml        |  9 +++++++--
 locales/home.en_US.yml        |  9 +++++++--
 locales/home.zh_CN.yml        | 17 +++++++++++------
 locales/leaderboard.en_GB.yml |  2 +-
 locales/leaderboard.en_US.yml |  2 +-
 locales/leaderboard.zh_CN.yml |  4 ++--
 locales/login.en_GB.yml       | 11 +++++------
 locales/login.en_US.yml       | 13 ++++++-------
 locales/login.zh_CN.yml       | 13 ++++++-------
 locales/navbar.zh_CN.yml      |  4 ++--
 locales/profile.en_GB.yml     | 14 ++++++--------
 locales/profile.en_US.yml     | 16 +++++++---------
 locales/profile.zh_CN.yml     | 16 +++++++---------
 locales/register.en_GB.yml    | 10 +++++-----
 locales/register.en_US.yml    | 12 ++++++------
 locales/register.zh_CN.yml    | 12 ++++++------
 locales/verify.en_GB.yml      | 13 ++++++-------
 locales/verify.en_US.yml      | 15 +++++++--------
 locales/verify.zh_CN.yml      | 31 +++++++++++++++----------------
 templates/home.html           | 22 +++++++---------------
 templates/leaderboard.html    |  4 ++--
 templates/login.html          | 14 +++++++-------
 templates/profile.html        | 20 ++++++++++----------
 templates/register.html       | 12 ++++++------
 templates/verify.html         | 14 +++++++-------
 29 files changed, 166 insertions(+), 165 deletions(-)

diff --git a/locales/404.zh_CN.yml b/locales/404.zh_CN.yml
index 9249dce3..ca47db03 100644
--- a/locales/404.zh_CN.yml
+++ b/locales/404.zh_CN.yml
@@ -1,5 +1,5 @@
 zh_CN:
-  page-not-found: Page not found
-  where-am-i: Where am I?
-  check-url: Check that the URL you entered is correct.
-  make-sure-visit: Make sure that the place you are visiting isn't under maintenance!
\ No newline at end of file
+  page-not-found: 404 查无此页
+  where-am-i: 我是谁 我在哪 我在干什么?
+  check-url: 请检查下你输入的链接是否正确。
+  make-sure-visit: 或者确保你想访问的地方没有在维护中!
\ No newline at end of file
diff --git a/locales/global.en_GB.yml b/locales/global.en_GB.yml
index a92c4174..b3407129 100644
--- a/locales/global.en_GB.yml
+++ b/locales/global.en_GB.yml
@@ -1,3 +1,5 @@
 en_GB:
   sign-up: Sign up
-  log-in: Log in
\ No newline at end of file
+  log-in: Log in
+  offline: Offline
+  online: Online
\ No newline at end of file
diff --git a/locales/global.en_US.yml b/locales/global.en_US.yml
index 148f84e5..473c1621 100644
--- a/locales/global.en_US.yml
+++ b/locales/global.en_US.yml
@@ -1,3 +1,5 @@
 en_US:
   sign-up: Sign up
-  log-in: Log in
\ No newline at end of file
+  log-in: Log in
+  offline: Offline
+  online: Online
\ No newline at end of file
diff --git a/locales/global.zh_CN.yml b/locales/global.zh_CN.yml
index c70b1e1e..1aeaeb00 100644
--- a/locales/global.zh_CN.yml
+++ b/locales/global.zh_CN.yml
@@ -1,3 +1,5 @@
 zh_CN:
-  sign-up: Sign up
-  log-in: Log in
\ No newline at end of file
+  sign-up: 注册
+  log-in: 登录
+  offline: 离线
+  online: 在线
\ No newline at end of file
diff --git a/locales/home.en_GB.yml b/locales/home.en_GB.yml
index 7a627141..78623936 100644
--- a/locales/home.en_GB.yml
+++ b/locales/home.en_GB.yml
@@ -1,7 +1,12 @@
 en_GB:
   subtitle-big: We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
   some-of-our-coolest-features: Some of our coolest features
+  features-title-1: PP for Relax and Autopilot
+  features-content-1: Our server has unique pp formula for relax and autopilot.Good at waving your cursor or just smashing your keyboard? Join {{ appName() }} and get a fair reward foryour skills!
+  features-title-2: Free osu!direct
+  features-content-2: You won't have to pay for osu!supporter to have a convenient gameplay experience in the client - osu!direct is available for everyone! Keep in mind supporting us still grants a huge set of cool perks but absense of it doesn't affect your game sessions!
+  features-title-3: Flexible library
+  features-content-3: We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
   what-are-you-waiting-for: What are you waiting for?
   subtitle: Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
-  sign-up-for-free: Sign up for free
-  login: Login
\ No newline at end of file
+  sign-up-for-free: Sign up for free
\ No newline at end of file
diff --git a/locales/home.en_US.yml b/locales/home.en_US.yml
index 130741c3..649522b6 100644
--- a/locales/home.en_US.yml
+++ b/locales/home.en_US.yml
@@ -1,7 +1,12 @@
 en_US:
   subtitle-big: We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
   some-of-our-coolest-features: Some of our coolest features
+  features-title-1: PP for Relax and Autopilot
+  features-content-1: Our server has unique pp formula for relax and autopilot.Good at waving your cursor or just smashing your keyboard? Join {{ appName() }} and get a fair reward foryour skills!
+  features-title-2: Free osu!direct
+  features-content-2: You won't have to pay for osu!supporter to have a convenient gameplay experience in the client - osu!direct is available for everyone! Keep in mind supporting us still grants a huge set of cool perks but absense of it doesn't affect your game sessions!
+  features-title-3: Flexible library
+  features-content-3: We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
   what-are-you-waiting-for: What are you waiting for?
   subtitle: Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
-  sign-up-for-free: Sign up for free
-  login: Login
\ No newline at end of file
+  sign-up-for-free: Sign up for free
\ No newline at end of file
diff --git a/locales/home.zh_CN.yml b/locales/home.zh_CN.yml
index bd3bbf82..a8db77dd 100644
--- a/locales/home.zh_CN.yml
+++ b/locales/home.zh_CN.yml
@@ -1,7 +1,12 @@
 zh_CN:
-  subtitle-big: We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
-  some-of-our-coolest-features: Some of our coolest features
-  what-are-you-waiting-for: What are you waiting for?
-  subtitle: Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
-  sign-up-for-free: Sign up for free
-  login: Login
\ No newline at end of file
+  subtitle-big: 我们是一个从头搭建的 osu! 私人服务器,具有许多你曾未见识到的独特功能。--想了解更多信息,可以查看我们在Github 上的 gulag 和 guweb 项目 -- 我们完全开源
+  some-of-our-coolest-features: 我们觉得最酷的一些功能
+  features-title-1: 对Relax 和 Autopilot mod的PP计算
+  features-content-1: 我们的服务器针对RX和AP有专门的PP计算算法。有超高的AIM移动能力但是左手无力？又或者左手超强的手速speed却不会移动AIM? 在 {{ appName() }} 当中都可以完美发挥你的强项。
+  features-title-2: 免费的 osu!direct 服务
+  features-content-2: 你不用特意成为 osu!supporter 以此来提高你在客户端下图方面的体验。osu!direct 对所有人开放(并且使用的是国内的sayo镜像站)! 虽然如此,如果你愿意支持我们,你仍然可以获得一些超酷的特权。只不过这些特权并不会影响到你的game sessions!
+  features-title-3: Flexible library
+  features-content-3: We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
+  what-are-you-waiting-for: 你 还 在 等 什 么?
+  subtitle: 赶紧加入到 %{appName} 当中吧! 没有风险! 并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
+  sign-up-for-free: 免 费 注 册！
\ No newline at end of file
diff --git a/locales/leaderboard.en_GB.yml b/locales/leaderboard.en_GB.yml
index 0f87e293..482d0e8c 100644
--- a/locales/leaderboard.en_GB.yml
+++ b/locales/leaderboard.en_GB.yml
@@ -1,3 +1,3 @@
 en_GB:
-  Leaderboard: Leaderboard
+  leaderboard: Leaderboard
   there-are-no-players-to-display: there are no players to display!
\ No newline at end of file
diff --git a/locales/leaderboard.en_US.yml b/locales/leaderboard.en_US.yml
index cc8dd6b7..4d1d40fe 100644
--- a/locales/leaderboard.en_US.yml
+++ b/locales/leaderboard.en_US.yml
@@ -1,3 +1,3 @@
 en_US:
-  Leaderboard: Leaderboard
+  leaderboard: Leaderboard
   there-are-no-players-to-display: there are no players to display!
\ No newline at end of file
diff --git a/locales/leaderboard.zh_CN.yml b/locales/leaderboard.zh_CN.yml
index c2aa8b08..cb092c63 100644
--- a/locales/leaderboard.zh_CN.yml
+++ b/locales/leaderboard.zh_CN.yml
@@ -1,3 +1,3 @@
 zh_CN:
-  Leaderboard: Leaderboard
-  there-are-no-players-to-display: there are no players to display!
\ No newline at end of file
+  leaderboard: 排行榜
+  there-are-no-players-to-display: 这里没有符合条件的玩家可供显示!
\ No newline at end of file
diff --git a/locales/login.en_GB.yml b/locales/login.en_GB.yml
index c795fa41..395dcd82 100644
--- a/locales/login.en_GB.yml
+++ b/locales/login.en_GB.yml
@@ -1,7 +1,6 @@
 en_GB:
- Dont-have-an-account: Don't have an account?
- Register: Register
- Login: Login
- Forgot-login: Forgot login?
- Username: Username
- Password: Password
\ No newline at end of file
+  dont-have-an-account : Don't have an account?
+  register: Register
+  forgot-login: Forgot login?
+  username: Username
+  password: Password
\ No newline at end of file
diff --git a/locales/login.en_US.yml b/locales/login.en_US.yml
index 4cd31793..7e346364 100644
--- a/locales/login.en_US.yml
+++ b/locales/login.en_US.yml
@@ -1,7 +1,6 @@
-en_GB:
-  Dont-have-an-account : Don't have an account?
-  Register: Register
-  Login: Login
-  Forgot-login: Forgot login?
-  Username: Username
-  Password: Password
\ No newline at end of file
+en_US:
+  dont-have-an-account : Don't have an account?
+  register: Register
+  forgot-login: Forgot login?
+  username: Username
+  password: Password
\ No newline at end of file
diff --git a/locales/login.zh_CN.yml b/locales/login.zh_CN.yml
index 4cd31793..3f7e6644 100644
--- a/locales/login.zh_CN.yml
+++ b/locales/login.zh_CN.yml
@@ -1,7 +1,6 @@
-en_GB:
-  Dont-have-an-account : Don't have an account?
-  Register: Register
-  Login: Login
-  Forgot-login: Forgot login?
-  Username: Username
-  Password: Password
\ No newline at end of file
+zh_CN:
+  dont-have-an-account : 还未拥有一个账号？
+  register: 注册
+  forgot-login: 忘记账号?
+  username: 你的用户名
+  password: 你的密码
\ No newline at end of file
diff --git a/locales/navbar.zh_CN.yml b/locales/navbar.zh_CN.yml
index 6624c397..8081e449 100644
--- a/locales/navbar.zh_CN.yml
+++ b/locales/navbar.zh_CN.yml
@@ -1,5 +1,5 @@
 zh_CN:
-  home: Home
-  leaderboards: Leaderboards
+  home: 主页
+  leaderboards: 排行榜
   information: Information
   admin: Admin
\ No newline at end of file
diff --git a/locales/profile.en_GB.yml b/locales/profile.en_GB.yml
index 0d51ae3f..31699646 100644
--- a/locales/profile.en_GB.yml
+++ b/locales/profile.en_GB.yml
@@ -1,9 +1,7 @@
 en_GB:
-  No-scores-available: No scores available
-  Try-playing-something: Try playing something
-  Show-more: Show more
-  Most-Played-Beatmaps: Most Played Beatmaps
-  No-beatmaps-available: No beatmaps available
-  Offline: Offline
-  Online: Online
-  Statistics: Statistics
\ No newline at end of file
+  no-scores-available: No scores available
+  try-playing-something: Try playing something
+  show-more: Show more
+  most-played-beatmaps: Most Played Beatmaps
+  no-beatmaps-available: No beatmaps available
+  statistics: Statistics
\ No newline at end of file
diff --git a/locales/profile.en_US.yml b/locales/profile.en_US.yml
index 0d51ae3f..e9ea6316 100644
--- a/locales/profile.en_US.yml
+++ b/locales/profile.en_US.yml
@@ -1,9 +1,7 @@
-en_GB:
-  No-scores-available: No scores available
-  Try-playing-something: Try playing something
-  Show-more: Show more
-  Most-Played-Beatmaps: Most Played Beatmaps
-  No-beatmaps-available: No beatmaps available
-  Offline: Offline
-  Online: Online
-  Statistics: Statistics
\ No newline at end of file
+en_US:
+  no-scores-available: No scores available
+  try-playing-something: Try playing something
+  show-more: Show more
+  most-played-beatmaps: Most Played Beatmaps
+  no-beatmaps-available: No beatmaps available
+  statistics: Statistics
\ No newline at end of file
diff --git a/locales/profile.zh_CN.yml b/locales/profile.zh_CN.yml
index 0d51ae3f..be77629a 100644
--- a/locales/profile.zh_CN.yml
+++ b/locales/profile.zh_CN.yml
@@ -1,9 +1,7 @@
-en_GB:
-  No-scores-available: No scores available
-  Try-playing-something: Try playing something
-  Show-more: Show more
-  Most-Played-Beatmaps: Most Played Beatmaps
-  No-beatmaps-available: No beatmaps available
-  Offline: Offline
-  Online: Online
-  Statistics: Statistics
\ No newline at end of file
+zh_CN:
+  no-scores-available: 暂无有效成绩
+  try-playing-something: 尝试去游玩一会吧！
+  show-more: 展示更多
+  most-played-beatmaps: 游玩最多的铺面
+  no-beatmaps-available: 暂无有效铺面
+  statistics: 数据统计
\ No newline at end of file
diff --git a/locales/register.en_GB.yml b/locales/register.en_GB.yml
index 943c5a97..cdd1850b 100644
--- a/locales/register.en_GB.yml
+++ b/locales/register.en_GB.yml
@@ -1,6 +1,6 @@
 en_GB:
-  Registration: Registration
-  Email: Email
-  Password: Password
-  Already-have-an-account: Already have an account?
-  Login: Login
\ No newline at end of file
+  registration: Registration
+  register: register
+  email: Email
+  password: Password
+  already-have-an-account: Already have an account?
\ No newline at end of file
diff --git a/locales/register.en_US.yml b/locales/register.en_US.yml
index 943c5a97..fcb09a03 100644
--- a/locales/register.en_US.yml
+++ b/locales/register.en_US.yml
@@ -1,6 +1,6 @@
-en_GB:
-  Registration: Registration
-  Email: Email
-  Password: Password
-  Already-have-an-account: Already have an account?
-  Login: Login
\ No newline at end of file
+en_US:
+  registration: Registration
+  register: register
+  email: Email
+  password: Password
+  already-have-an-account: Already have an account?
\ No newline at end of file
diff --git a/locales/register.zh_CN.yml b/locales/register.zh_CN.yml
index 943c5a97..a71a1403 100644
--- a/locales/register.zh_CN.yml
+++ b/locales/register.zh_CN.yml
@@ -1,6 +1,6 @@
-en_GB:
-  Registration: Registration
-  Email: Email
-  Password: Password
-  Already-have-an-account: Already have an account?
-  Login: Login
\ No newline at end of file
+zh_CN:
+  registration: 注册
+  register: 注册账号
+  email: 电子邮箱
+  password: 密码
+  already-have-an-account: 已经拥有账号了?
\ No newline at end of file
diff --git a/locales/verify.en_GB.yml b/locales/verify.en_GB.yml
index 974d3090..4dc15416 100644
--- a/locales/verify.en_GB.yml
+++ b/locales/verify.en_GB.yml
@@ -4,16 +4,15 @@ en_GB:
   what-do-you-mean-this-must-be-easy-right: What do you mean? This must be easy right?
   follow-these-three-simple-steps: Follow these three simple steps to get started playing %{appName} !
   osu-shortcut: Osu shortcut
-  find-your-shortcut$: Find your shortcut to osu on desktop and copy it!
+  find-your-shortcut: Find your shortcut to osu on desktop and copy it!
   edit-it: Edit it
   right-click-properties: Right click -> Properties
   find-target-element-box: Find "Target element" Box
-  add-domain$: Add -devserver %{domain} at the end of it
-  some-coolest-features: Some of our coolest features
+  add-domain: Add -devserver %{domain} at the end of it
   login-to-your-account: Login to your account
-  login-to-your-app-name-account$: Login to your %{appName} account and you should be done!
-  oh-crap-i-am-stuck$: Oh crap! I'm stuck please help me!
-  need-help-join-discord-server$: Need help? We've got you covered - join the Discord so our community can help you out!
+  login-to-your-app-name-account: Login to your %{appName} account and you should be done!
+  oh-crap-i-am-stuck: Oh crap! I'm stuck please help me!
+  need-help-join-discord-server: Need help? We've got you covered - join the Discord so our community can help you out!
   click-here-to-join-our-discord: Click here to join our Discord!
   waiting-for-verification: Waiting for verification!
-  follow-the-simple-instructions$: Follow the simple instructions above and once you're done reload this page!
\ No newline at end of file
+  follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
\ No newline at end of file
diff --git a/locales/verify.en_US.yml b/locales/verify.en_US.yml
index 89f3eace..4c2e8ab7 100644
--- a/locales/verify.en_US.yml
+++ b/locales/verify.en_US.yml
@@ -2,18 +2,17 @@ en_US:
   verification: Verification
   how-to-verify-your-account: How to verify your account
   what-do-you-mean-this-must-be-easy-right: What do you mean? This must be easy right?
-  follow-these-three-simple-steps$: Follow these three simple steps to get started playing %{appName} !
+  follow-these-three-simple-steps: Follow these three simple steps to get started playing %{appName} !
   osu-shortcut: Osu shortcut
-  find-your-shortcut$: Find your shortcut to osu on desktop and copy it!
+  find-your-shortcut: Find your shortcut to osu on desktop and copy it!
   edit-it: Edit it
   right-click-properties: Right click -> Properties
   find-target-element-box: Find "Target element" Box
-  add-domain$: Add -devserver %{domain} at the end of it
-  some-coolest-features: Some of our coolest features
+  add-domain: Add -devserver %{domain} at the end of it
   login-to-your-account: Login to your account
-  login-to-your-app-name-account$: Login to your %{appName} account and you should be done!
-  oh-crap-i-am-stuck$: Oh crap! I'm stuck please help me!
-  need-help-join-discord-server$: Need help? We've got you covered - join the Discord so our community can help you out!
+  login-to-your-app-name-account: Login to your %{appName} account and you should be done!
+  oh-crap-i-am-stuck: Oh crap! I'm stuck please help me!
+  need-help-join-discord-server: Need help? We've got you covered - join the Discord so our community can help you out!
   click-here-to-join-our-discord: Click here to join our Discord!
   waiting-for-verification: Waiting for verification!
-  follow-the-simple-instructions$: Follow the simple instructions above and once you're done reload this page!
\ No newline at end of file
+  follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
\ No newline at end of file
diff --git a/locales/verify.zh_CN.yml b/locales/verify.zh_CN.yml
index 16d9555e..103586b3 100644
--- a/locales/verify.zh_CN.yml
+++ b/locales/verify.zh_CN.yml
@@ -1,19 +1,18 @@
 zh_CN:
-  verification: Verification
-  how-to-verify-your-account: How to verify your account
-  what-do-you-mean-this-must-be-easy-right: What do you mean? This must be easy right?
-  follow-these-three-simple-steps$: Follow these three simple steps to get started playing %{appName} !
-  osu-shortcut: Osu shortcut
-  find-your-shortcut$: Find your shortcut to osu on desktop and copy it!
+  verification: 认证账号
+  how-to-verify-your-account: 如何来认证你的账号
+  what-do-you-mean-this-must-be-easy-right: 别想太复杂, 肯定很简单拉~。
+  follow-these-three-simple-steps: 跟随以下三个简单的步骤即可游玩 %{appName} 了!
+  osu-shortcut: Osu! 快捷方式
+  find-your-shortcut: 在桌面上寻找你的osu!快捷方式并复制一份 (如果没有，可以去osu!目录里创建一份)
   edit-it: Edit it
-  right-click-properties: Right click -> Properties
-  find-target-element-box: Find "Target element" Box
-  add-domain$: Add -devserver %{domain} at the end of it
-  some-coolest-features: Some of our coolest features
-  login-to-your-account: Login to your account
-  login-to-your-app-name-account$: Login to your %{appName} account and you should be done!
-  oh-crap-i-am-stuck$: Oh crap! I'm stuck please help me!
-  need-help-join-discord-server$: Need help? We've got you covered - join the Discord so our community can help you out!
+  right-click-properties: 右键快捷方式,在菜单中找到 "属性" 选项,(一般在最下边)
+  find-target-element-box: 找到 "目标" 这一行
+  add-domain: 在文本的末尾添加 -devserver %{domain}
+  login-to-your-account: 登入你的账号
+  login-to-your-app-name-account: 登录你的 %{appName} 账号,然后就应该万事大吉了!
+  oh-crap-i-am-stuck: 妈的，我卡在这个步骤了,赶紧过来帮我一下
+  need-help-join-discord-server: Need help? We've got you covered - join the Discord so our community can help you out!
   click-here-to-join-our-discord: Click here to join our Discord!
-  waiting-for-verification: Waiting for verification!
-  follow-the-simple-instructions$: Follow the simple instructions above and once you're done reload this page!
\ No newline at end of file
+  waiting-for-verification: 正在等待验证结果~
+  follow-the-simple-instructions: 只需按照上面的简单说明进行操作，完成后重新加载此页面！
\ No newline at end of file
diff --git a/templates/home.html b/templates/home.html
index ad6cc435..2a0a954a 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -73,11 +73,8 @@ <h2 class="title mb-6">{{ t('home.some-of-our-coolest-features') }}</h2>
             <i class="image is-32x32 fas fa-address-card"></i>
           </div>
           <div class="column is-10">
-            <h4 class="title is-spaced is-4">PP for Relax and Autopilot</h4>
-            <p class="subtitle is-6">Our server has unique pp formula for relax and autopilot.
-              Good at waving your cursor or just smashing your keyboard? Join {{ appName() }} and get a fair reward for
-              your skills!
-            </p>
+            <h4 class="title is-spaced is-4">{{ 'home.features-title-1' }}</h4>
+            <p class="subtitle is-6">{{ 'home.features-content-1' }}</p>
           </div>
         </div>
       </div>
@@ -87,12 +84,8 @@ <h4 class="title is-spaced is-4">PP for Relax and Autopilot</h4>
             <i class="image is-32x32 fas fa-ambulance"></i>
           </div>
           <div class="column is-10">
-            <h4 class="title is-spaced is-4">Free osu!direct</h4>
-            <p class="subtitle is-6">You won't have to pay for osu!supporter to have a convenient gameplay experience in
-              the
-              client - osu!direct is available for everyone! Keep in mind supporting us still grants a huge set of cool
-              perks but
-              absense of it doesn't affect your game sessions!</p>
+            <h4 class="title is-spaced is-4">{{ 'home.features-title-2' }}</h4>
+            <p class="subtitle is-6">{{ 'home.features-content-2' }}</p>
           </div>
         </div>
       </div>
@@ -102,9 +95,8 @@ <h4 class="title is-spaced is-4">Free osu!direct</h4>
             <i class="image is-32x32 fas fa-archive"></i>
           </div>
           <div class="column is-10">
-            <h4 class="title is-spaced is-4">Flexible library</h4>
-            <p class="subtitle is-6">We're written on top of cmyui's multipurpose library allowing for a fully
-              asynchronous environment, both improving performance and the user's experience in the long term!</p>
+            <h4 class="title is-spaced is-4">{{ 'home.features-title-3' }}</h4>
+            <p class="subtitle is-6">{{ 'home.features-content-3' }}</p>
           </div>
         </div>
       </div>
@@ -119,7 +111,7 @@ <h4 class="title is-spaced is-4">Flexible library</h4>
       <h1 class="title is-spaced">{{ t('home.what-are-you-waiting-for') }}</h1>
       <h2 class="subtitle">{{ t('home.subtitle', appName = appName()) }}</h2>
       <div class="buttons is-centered"><a class="control button is-primary" href="/register">{{ t('home.sign-up-for-free') }}</a><a
-          class="control button is-light" href="/login">{{ t('home.login') }}</a></div>
+          class="control button is-light" href="/login">{{ t('global.log-in') }}</a></div>
     </div>
   </div>
 </section>
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index fddd66bd..8567a17e 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -36,7 +36,7 @@
                 <i class="mode-icon mode-mania"></i><span class="modetext"> osu!mania</span>
             </a>
         </div>
-        <div class="banner-text">{{ 'Leaderboard' }}</div>
+        <div class="banner-text">{{ 'leaderboard.leaderboard' }}</div>
         <div class="selector">
             <div class="left">
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'pp' }"
@@ -116,7 +116,7 @@
             </div>
             <div v-else>
                 <div class="text-center">
-                    {{ 'there-are-no-players-to-display'}}
+                    {{ 'leaderboard.there-are-no-players-to-display'}}
                 </div>
             </div>
         </div>
diff --git a/templates/login.html b/templates/login.html
index ce191bd4..e64806f8 100644
--- a/templates/login.html
+++ b/templates/login.html
@@ -10,7 +10,7 @@
 <div class="main-block is-marginless is-paddingless is-auth">
   <div class="columns is-reset is-weeb">
     <div class="column title-block">
-      <h1 class="title" id="regtitle">{{ 'Login' }}</h1>
+      <h1 class="title" id="regtitle">{{ 'global.log-in' }}</h1>
     </div>
   </div>
   <div class="columns is-reset flex-lcenter is-block">
@@ -18,7 +18,7 @@ <h1 class="title" id="regtitle">{{ 'Login' }}</h1>
      <div class="content">
     <form action="/login" method="post" class="form-content">
       <div class="field">
-        <label for="user" class="label">{{ 'Username' }}</label>
+        <label for="user" class="label">{{ 'login.username' }}</label>
         <div class="control has-icons-left">
           <input id="user" type="text" name="username" placeholder="Username" class="input" autocomplete="username" required>
           <span class="icon is-small is-left">
@@ -27,7 +27,7 @@ <h1 class="title" id="regtitle">{{ 'Login' }}</h1>
         </div>
       </div>
       <div class="field">
-        <label for="pass" class="label">{{ 'Password' }}</label>
+        <label for="pass" class="label">{{ 'login.password' }}</label>
         <div class="control has-icons-left">
           <input id="pass" type="password" name="password" placeholder="Password" class="input" autocomplete="current-password" required>
           <span class="icon is-small is-left">
@@ -37,18 +37,18 @@ <h1 class="title" id="regtitle">{{ 'Login' }}</h1>
       </div>
       <div class="mt-5"></div>
       <div class="dialog">
-          {{ 'Dont-have-an-account'}}
+          {{ 'login.dont-have-an-account'}}
         <a href="/register">
-            {{ 'Register' }}
+            {{ 'login.register' }}
         </a>
       </div>
       <div class="field flex-vcenter">
         <div class="buttons">
           <button type="submit" class="button is-primary">
-              {{ 'Login' }}
+              {{ 'global.log-in' }}
           </button>
           <a href="/forgot" class="button is-info"> <!-- will probably have paths "/forgot/username" and "/forgot/password" -->
-              {{ 'Forgot-login'}}
+              {{ 'login.forgot-login'}}
           </a>
         </div>
       </div>
diff --git a/templates/profile.html b/templates/profile.html
index 054a7d4e..50b3f688 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -63,13 +63,13 @@
                 <h1 class="title">: (</h1>
             </div>
             <div class="column">
-                <h1 class="title is-6">{{ 'No-scores-available'}}</h1>
-                <p class="subtitle is-7">{{ 'Try-playing-something'}}</p>
+                <h1 class="title is-6">{{ 'profile.no-scores-available'}}</h1>
+                <p class="subtitle is-7">{{ 'profile.try-playing-something'}}</p>
             </div>
         </div>
     </div>
     <div v-if="data.scores.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button" @click="AddLimit('{{ id }}score')">{{ 'Show-more'}}</a>
+        <a class="show-button" @click="AddLimit('{{ id }}score')">{{ 'profile.show-more'}}</a>
     </div>
 </div>
 {% endmacro %}
@@ -78,7 +78,7 @@ <h1 class="title is-6">{{ 'No-scores-available'}}</h1>
 <div class="log-block" v-bind:class="{ 'load' : data.maps.{{ id }}.load }">
     <div class="header">
         <div class="title">
-            <i class="fas fa-address-book"></i> {{ 'Most-Played-Beatmaps'}}
+            <i class="fas fa-address-book"></i> {{ 'profile.most-played-eatmaps'}}
         </div>
     </div>
     <div v-if="data.maps.{{ id }}.out.length != 0" class="beatmaps">
@@ -111,13 +111,13 @@ <h1 class="title is-6">{{ 'No-scores-available'}}</h1>
                 <h1 class="title">: (</h1>
             </div>
             <div class="column">
-                <h1 class="title is-6">{{ 'No-beatmaps-available'}}</h1>
-                <p class="subtitle is-7">{{ 'Try-playing-something'}}</p>
+                <h1 class="title is-6">{{ 'profile.no-beatmaps-available'}}</h1>
+                <p class="subtitle is-7">{{ 'profile.try-playing-something'}}</p>
             </div>
         </div>
     </div>
     <div v-if="data.maps.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button" @click="AddLimit('mostplay')">{{ 'Show-more'}}</a>
+        <a class="show-button" @click="AddLimit('mostplay')">{{ 'profile.show-more'}}</a>
     </div>
 </div>
 {% endmacro %}
@@ -149,10 +149,10 @@ <h1 class="title">
                 </h1>
                 <transition name="fade">
                     <div class="subtitle" v-if='data.status.online == false'>
-                        <a class='circle'>●</a> {{ 'Offline' }}
+                        <a class='circle'>●</a> {{ 'global.offline' }}
                     </div>
                     <div class="subtitle" v-else-if='data.status.online == true'>
-                        <a class='circle green'>●</a> {{ 'Online' }}
+                        <a class='circle green'>●</a> {{ 'global.online' }}
                     </div>
                 </transition>
             </div>
@@ -234,7 +234,7 @@ <h1 class="title">
                 </div>-->
                 <div class="header">
                     <div class="title">
-                        <i class="fas fa-chart-pie"></i> {{ 'Statistics' }}
+                        <i class="fas fa-chart-pie"></i> {{ 'profile.statistics' }}
                     </div>
                 </div>
                 <div class="stats-block">
diff --git a/templates/register.html b/templates/register.html
index d42e9776..4c82c305 100644
--- a/templates/register.html
+++ b/templates/register.html
@@ -9,7 +9,7 @@
 <div class="main-block is-marginless is-paddingless is-auth">
   <div class="columns pm-reset is-weeb">
     <div class="column title-block">
-      <h1 class="title" id="regtitle">{{ 'Registration' }}</h1>
+      <h1 class="title" id="regtitle">{{ 'register.registration' }}</h1>
     </div>
   </div>
   <div class="columns pm-reset flex-lcenter is-block">
@@ -17,7 +17,7 @@ <h1 class="title" id="regtitle">{{ 'Registration' }}</h1>
       <div class="login-bg"></div>
       <form action="/register" method="post" class="form-content">
         <div class="field">
-          <label for="user" class="label">Username</label>
+          <label for="user" class="label">{{ 'register.username' }}</label>
           <div class="control has-icons-left">
             <input id="user" type="text" name="username" placeholder="e.g. Aika" class="input" autocomplete="username" required>
             <span class="icon is-small is-left">
@@ -26,7 +26,7 @@ <h1 class="title" id="regtitle">{{ 'Registration' }}</h1>
           </div>
         </div>
         <div class="field">
-          <label for="email" class="label">{{ 'Email' }}</label>
+          <label for="email" class="label">{{ 'register.email' }}</label>
           <div class="control has-icons-left">
             <input id="email" type="email" name="email" placeholder="e.g. aika@gul.ag" class="input" autocomplete="email" required>
             <span class="icon is-small is-left">
@@ -35,7 +35,7 @@ <h1 class="title" id="regtitle">{{ 'Registration' }}</h1>
           </div>
         </div>
         <div class="field">
-          <label for="pass" class="label">{{ 'Password' }}</label>
+          <label for="pass" class="label">{{ 'register.password' }}</label>
           <div class="control has-icons-left">
             <input id="pass" type="password" name="password" placeholder="*************" class="input" autocomplete="new-password" required>
             <span class="icon is-small is-left">
@@ -45,7 +45,7 @@ <h1 class="title" id="regtitle">{{ 'Registration' }}</h1>
         </div>
         <div class="mt-5"></div>
         <div class="dialog">
-            {{ 'Already-have-an-account'}} <a href="/login">{{ 'Login' }}</a>
+            {{ 'register.already-have-an-account'}} <a href="/login">{{ 'global.log-in' }}</a>
         </div>
         {% if not captchaKey() == 'changeme' %}
         <div class="field">
@@ -54,7 +54,7 @@ <h1 class="title" id="regtitle">{{ 'Registration' }}</h1>
         {% endif %}
         <div class="field">
           <button type="submit" class="button is-primary">
-            Register
+              {{ 'register.register' }}
           </button>
         </div>
       </form>
diff --git a/templates/verify.html b/templates/verify.html
index 511e4888..afcb3a89 100644
--- a/templates/verify.html
+++ b/templates/verify.html
@@ -23,7 +23,7 @@ <h2 class="subtitle">{{ t('verify.what-do-you-mean-this-must-be-easy-right') }}<
             <div class="bordertitle">
                 <div class="titlewithsub">
                     <h1 class="title is-left">{{ t('verify.verification') }}</h1>
-                    <h2 class="subtitle">{{ t('verify.follow-these-three-simple-steps$', appName = appName()) }}</h2>
+                    <h2 class="subtitle">{{ t('verify.follow-these-three-simple-steps', appName = appName()) }}</h2>
                 </div>
             </div>
             <div class="howto-content">
@@ -36,7 +36,7 @@ <h2 class="subtitle">{{ t('verify.follow-these-three-simple-steps$', appName = a
                             </div>
                             <div class="howto-withsub">
                                 <h1 class="title is-left">{{ t('verify.osu-shortcut') }}</h1>
-                                <h2 class="subtitle">{{ t('verify.find-your-shortcut$') }}</h2>
+                                <h2 class="subtitle">{{ t('verify.find-your-shortcut') }}</h2>
                             </div>
                         </div>
                     </div>
@@ -51,7 +51,7 @@ <h1 class="title is-left">{{ t('verify.edit-it') }}</h1>
                                 <h2 class="subtitle">
                                     <strong>1.</strong>{{ t('verify.right-click-properties') }}
                                     <strong>2.</strong>{{ t('verify.find-target-element-box') }}
-                                    <strong>3.</strong>{{ t('verify.add-domain$', domain = domain()) }}
+                                    <strong>3.</strong>{{ t('verify.add-domain', domain = domain()) }}
                                 </h2>
                             </div>
                         </div>
@@ -64,7 +64,7 @@ <h2 class="subtitle">
                             </div>
                             <div class="howto-withsub">
                                 <h1 class="title is-left">{{ t('verify.login-to-your-account') }}</h1>
-                                <h2 class="subtitle">{{ t('verify.login-to-your-app-name-account$', appName = appName()) }}</h2>
+                                <h2 class="subtitle">{{ t('verify.login-to-your-app-name-account', appName = appName()) }}</h2>
                             </div>
                         </div>
                     </div>
@@ -72,8 +72,8 @@ <h2 class="subtitle">{{ t('verify.login-to-your-app-name-account$', appName = ap
             </div>
             <div class="bordertitle">
                 <div class="titlewithsub">
-                    <h1 class="title is-left">{{ t('verify.oh-crap-i-am-stuck$') }}</h1>
-                    <h2 class="subtitle">{{ t('verify.need-help-join-discord-server$') }}</h2>
+                    <h1 class="title is-left">{{ t('verify.oh-crap-i-am-stuck') }}</h1>
+                    <h2 class="subtitle">{{ t('verify.need-help-join-discord-server') }}</h2>
                 </div>
             </div>
             <div class="box flex is-mpadding is-marginless">
@@ -90,7 +90,7 @@ <h1 class="title">{{ t('verify.click-here-to-join-our-discord') }}</h1>
                     <div class="column flex flex-vcenter">
                         <div>
                             <h1 class="title is-left">{{ t('verify.waiting-for-verification') }}</h1>
-                            <h2 class="subtitle">{{ t('verify.follow-the-simple-instructions$') }}</h2>
+                            <h2 class="subtitle">{{ t('verify.follow-the-simple-instructions') }}</h2>
                         </div>
                     </div>
                     <div class="column icon-block">

From 919b51a2f284db705afd8d0281ebb16f76ad01dc Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Sun, 5 Jun 2022 16:08:44 +0800
Subject: [PATCH 051/278] fix structure

---
 templates/home.html        | 12 ++++++------
 templates/leaderboard.html |  4 ++--
 templates/login.html       | 14 +++++++-------
 templates/profile.html     | 20 ++++++++++----------
 templates/register.html    | 12 ++++++------
 5 files changed, 31 insertions(+), 31 deletions(-)

diff --git a/templates/home.html b/templates/home.html
index 2a0a954a..07554871 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -73,8 +73,8 @@ <h2 class="title mb-6">{{ t('home.some-of-our-coolest-features') }}</h2>
             <i class="image is-32x32 fas fa-address-card"></i>
           </div>
           <div class="column is-10">
-            <h4 class="title is-spaced is-4">{{ 'home.features-title-1' }}</h4>
-            <p class="subtitle is-6">{{ 'home.features-content-1' }}</p>
+            <h4 class="title is-spaced is-4">{{ t('home.features-title-1') }}</h4>
+            <p class="subtitle is-6">{{ t('home.features-content-1') }}</p>
           </div>
         </div>
       </div>
@@ -84,8 +84,8 @@ <h4 class="title is-spaced is-4">{{ 'home.features-title-1' }}</h4>
             <i class="image is-32x32 fas fa-ambulance"></i>
           </div>
           <div class="column is-10">
-            <h4 class="title is-spaced is-4">{{ 'home.features-title-2' }}</h4>
-            <p class="subtitle is-6">{{ 'home.features-content-2' }}</p>
+            <h4 class="title is-spaced is-4">{{ t('home.features-title-2') }}</h4>
+            <p class="subtitle is-6">{{ t('home.features-content-2') }}</p>
           </div>
         </div>
       </div>
@@ -95,8 +95,8 @@ <h4 class="title is-spaced is-4">{{ 'home.features-title-2' }}</h4>
             <i class="image is-32x32 fas fa-archive"></i>
           </div>
           <div class="column is-10">
-            <h4 class="title is-spaced is-4">{{ 'home.features-title-3' }}</h4>
-            <p class="subtitle is-6">{{ 'home.features-content-3' }}</p>
+            <h4 class="title is-spaced is-4">{{ t('home.features-title-3') }}</h4>
+            <p class="subtitle is-6">{{ t('home.features-content-3') }}</p>
           </div>
         </div>
       </div>
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index 8567a17e..f66ee361 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -36,7 +36,7 @@
                 <i class="mode-icon mode-mania"></i><span class="modetext"> osu!mania</span>
             </a>
         </div>
-        <div class="banner-text">{{ 'leaderboard.leaderboard' }}</div>
+        <div class="banner-text">{{ t('leaderboard.leaderboard') }}</div>
         <div class="selector">
             <div class="left">
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'pp' }"
@@ -116,7 +116,7 @@
             </div>
             <div v-else>
                 <div class="text-center">
-                    {{ 'leaderboard.there-are-no-players-to-display'}}
+                    {{ t('leaderboard.there-are-no-players-to-display') }}
                 </div>
             </div>
         </div>
diff --git a/templates/login.html b/templates/login.html
index e64806f8..70027576 100644
--- a/templates/login.html
+++ b/templates/login.html
@@ -10,7 +10,7 @@
 <div class="main-block is-marginless is-paddingless is-auth">
   <div class="columns is-reset is-weeb">
     <div class="column title-block">
-      <h1 class="title" id="regtitle">{{ 'global.log-in' }}</h1>
+      <h1 class="title" id="regtitle">{{ t('global.log-in') }}</h1>
     </div>
   </div>
   <div class="columns is-reset flex-lcenter is-block">
@@ -18,7 +18,7 @@ <h1 class="title" id="regtitle">{{ 'global.log-in' }}</h1>
      <div class="content">
     <form action="/login" method="post" class="form-content">
       <div class="field">
-        <label for="user" class="label">{{ 'login.username' }}</label>
+        <label for="user" class="label">{{ t('login.username') }}</label>
         <div class="control has-icons-left">
           <input id="user" type="text" name="username" placeholder="Username" class="input" autocomplete="username" required>
           <span class="icon is-small is-left">
@@ -27,7 +27,7 @@ <h1 class="title" id="regtitle">{{ 'global.log-in' }}</h1>
         </div>
       </div>
       <div class="field">
-        <label for="pass" class="label">{{ 'login.password' }}</label>
+        <label for="pass" class="label">{{ t('login.password') }}</label>
         <div class="control has-icons-left">
           <input id="pass" type="password" name="password" placeholder="Password" class="input" autocomplete="current-password" required>
           <span class="icon is-small is-left">
@@ -37,18 +37,18 @@ <h1 class="title" id="regtitle">{{ 'global.log-in' }}</h1>
       </div>
       <div class="mt-5"></div>
       <div class="dialog">
-          {{ 'login.dont-have-an-account'}}
+          {{ t('login.dont-have-an-account') }}
         <a href="/register">
-            {{ 'login.register' }}
+            {{ t('login.register') }}
         </a>
       </div>
       <div class="field flex-vcenter">
         <div class="buttons">
           <button type="submit" class="button is-primary">
-              {{ 'global.log-in' }}
+              {{ t('global.log-in') }}
           </button>
           <a href="/forgot" class="button is-info"> <!-- will probably have paths "/forgot/username" and "/forgot/password" -->
-              {{ 'login.forgot-login'}}
+              {{ t('login.forgot-login') }}
           </a>
         </div>
       </div>
diff --git a/templates/profile.html b/templates/profile.html
index 50b3f688..a4e9cab9 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -63,13 +63,13 @@
                 <h1 class="title">: (</h1>
             </div>
             <div class="column">
-                <h1 class="title is-6">{{ 'profile.no-scores-available'}}</h1>
-                <p class="subtitle is-7">{{ 'profile.try-playing-something'}}</p>
+                <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
+                <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
             </div>
         </div>
     </div>
     <div v-if="data.scores.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button" @click="AddLimit('{{ id }}score')">{{ 'profile.show-more'}}</a>
+        <a class="show-button" @click="AddLimit('{{ id }}score')">{{ t('profile.show-more') }}</a>
     </div>
 </div>
 {% endmacro %}
@@ -78,7 +78,7 @@ <h1 class="title is-6">{{ 'profile.no-scores-available'}}</h1>
 <div class="log-block" v-bind:class="{ 'load' : data.maps.{{ id }}.load }">
     <div class="header">
         <div class="title">
-            <i class="fas fa-address-book"></i> {{ 'profile.most-played-eatmaps'}}
+            <i class="fas fa-address-book"></i> {{ t('profile.most-played-eatmaps') }}
         </div>
     </div>
     <div v-if="data.maps.{{ id }}.out.length != 0" class="beatmaps">
@@ -111,13 +111,13 @@ <h1 class="title is-6">{{ 'profile.no-scores-available'}}</h1>
                 <h1 class="title">: (</h1>
             </div>
             <div class="column">
-                <h1 class="title is-6">{{ 'profile.no-beatmaps-available'}}</h1>
-                <p class="subtitle is-7">{{ 'profile.try-playing-something'}}</p>
+                <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
+                <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
             </div>
         </div>
     </div>
     <div v-if="data.maps.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button" @click="AddLimit('mostplay')">{{ 'profile.show-more'}}</a>
+        <a class="show-button" @click="AddLimit('mostplay')">{{ t('profile.show-more') }}</a>
     </div>
 </div>
 {% endmacro %}
@@ -149,10 +149,10 @@ <h1 class="title">
                 </h1>
                 <transition name="fade">
                     <div class="subtitle" v-if='data.status.online == false'>
-                        <a class='circle'>●</a> {{ 'global.offline' }}
+                        <a class='circle'>●</a> {{ t('global.offline') }}
                     </div>
                     <div class="subtitle" v-else-if='data.status.online == true'>
-                        <a class='circle green'>●</a> {{ 'global.online' }}
+                        <a class='circle green'>●</a> {{ t('global.online') }}
                     </div>
                 </transition>
             </div>
@@ -234,7 +234,7 @@ <h1 class="title">
                 </div>-->
                 <div class="header">
                     <div class="title">
-                        <i class="fas fa-chart-pie"></i> {{ 'profile.statistics' }}
+                        <i class="fas fa-chart-pie"></i> {{ t('profile.statistics') }}
                     </div>
                 </div>
                 <div class="stats-block">
diff --git a/templates/register.html b/templates/register.html
index 4c82c305..ff46f9e8 100644
--- a/templates/register.html
+++ b/templates/register.html
@@ -9,7 +9,7 @@
 <div class="main-block is-marginless is-paddingless is-auth">
   <div class="columns pm-reset is-weeb">
     <div class="column title-block">
-      <h1 class="title" id="regtitle">{{ 'register.registration' }}</h1>
+      <h1 class="title" id="regtitle">{{ t('register.registration') }}</h1>
     </div>
   </div>
   <div class="columns pm-reset flex-lcenter is-block">
@@ -17,7 +17,7 @@ <h1 class="title" id="regtitle">{{ 'register.registration' }}</h1>
       <div class="login-bg"></div>
       <form action="/register" method="post" class="form-content">
         <div class="field">
-          <label for="user" class="label">{{ 'register.username' }}</label>
+          <label for="user" class="label">{{ t('register.username') }}</label>
           <div class="control has-icons-left">
             <input id="user" type="text" name="username" placeholder="e.g. Aika" class="input" autocomplete="username" required>
             <span class="icon is-small is-left">
@@ -26,7 +26,7 @@ <h1 class="title" id="regtitle">{{ 'register.registration' }}</h1>
           </div>
         </div>
         <div class="field">
-          <label for="email" class="label">{{ 'register.email' }}</label>
+          <label for="email" class="label">{{ t('register.email') }}</label>
           <div class="control has-icons-left">
             <input id="email" type="email" name="email" placeholder="e.g. aika@gul.ag" class="input" autocomplete="email" required>
             <span class="icon is-small is-left">
@@ -35,7 +35,7 @@ <h1 class="title" id="regtitle">{{ 'register.registration' }}</h1>
           </div>
         </div>
         <div class="field">
-          <label for="pass" class="label">{{ 'register.password' }}</label>
+          <label for="pass" class="label">{{ t('register.password') }}</label>
           <div class="control has-icons-left">
             <input id="pass" type="password" name="password" placeholder="*************" class="input" autocomplete="new-password" required>
             <span class="icon is-small is-left">
@@ -45,7 +45,7 @@ <h1 class="title" id="regtitle">{{ 'register.registration' }}</h1>
         </div>
         <div class="mt-5"></div>
         <div class="dialog">
-            {{ 'register.already-have-an-account'}} <a href="/login">{{ 'global.log-in' }}</a>
+            {{ t('register.already-have-an-account') }} <a href="/login">{{ t('global.log-in') }}</a>
         </div>
         {% if not captchaKey() == 'changeme' %}
         <div class="field">
@@ -54,7 +54,7 @@ <h1 class="title" id="regtitle">{{ 'register.registration' }}</h1>
         {% endif %}
         <div class="field">
           <button type="submit" class="button is-primary">
-              {{ 'register.register' }}
+              {{ t('register.register') }}
           </button>
         </div>
       </form>

From 096b78f18fb57a8fb83561349cae67fa4d64279a Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Sun, 5 Jun 2022 16:19:28 +0800
Subject: [PATCH 052/278] fix formula format

---
 locales/home.en_GB.yml | 2 +-
 locales/home.en_US.yml | 2 +-
 locales/home.zh_CN.yml | 2 +-
 templates/home.html    | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/locales/home.en_GB.yml b/locales/home.en_GB.yml
index 78623936..683a0141 100644
--- a/locales/home.en_GB.yml
+++ b/locales/home.en_GB.yml
@@ -2,7 +2,7 @@ en_GB:
   subtitle-big: We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
   some-of-our-coolest-features: Some of our coolest features
   features-title-1: PP for Relax and Autopilot
-  features-content-1: Our server has unique pp formula for relax and autopilot.Good at waving your cursor or just smashing your keyboard? Join {{ appName() }} and get a fair reward foryour skills!
+  features-content-1: Our server has unique pp formula for relax and autopilot.Good at waving your cursor or just smashing your keyboard? Join %{appName} and get a fair reward foryour skills!
   features-title-2: Free osu!direct
   features-content-2: You won't have to pay for osu!supporter to have a convenient gameplay experience in the client - osu!direct is available for everyone! Keep in mind supporting us still grants a huge set of cool perks but absense of it doesn't affect your game sessions!
   features-title-3: Flexible library
diff --git a/locales/home.en_US.yml b/locales/home.en_US.yml
index 649522b6..482ac42e 100644
--- a/locales/home.en_US.yml
+++ b/locales/home.en_US.yml
@@ -2,7 +2,7 @@ en_US:
   subtitle-big: We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
   some-of-our-coolest-features: Some of our coolest features
   features-title-1: PP for Relax and Autopilot
-  features-content-1: Our server has unique pp formula for relax and autopilot.Good at waving your cursor or just smashing your keyboard? Join {{ appName() }} and get a fair reward foryour skills!
+  features-content-1: Our server has unique pp formula for relax and autopilot.Good at waving your cursor or just smashing your keyboard? Join %{appName} and get a fair reward foryour skills!
   features-title-2: Free osu!direct
   features-content-2: You won't have to pay for osu!supporter to have a convenient gameplay experience in the client - osu!direct is available for everyone! Keep in mind supporting us still grants a huge set of cool perks but absense of it doesn't affect your game sessions!
   features-title-3: Flexible library
diff --git a/locales/home.zh_CN.yml b/locales/home.zh_CN.yml
index a8db77dd..2b962f14 100644
--- a/locales/home.zh_CN.yml
+++ b/locales/home.zh_CN.yml
@@ -2,7 +2,7 @@ zh_CN:
   subtitle-big: 我们是一个从头搭建的 osu! 私人服务器,具有许多你曾未见识到的独特功能。--想了解更多信息,可以查看我们在Github 上的 gulag 和 guweb 项目 -- 我们完全开源
   some-of-our-coolest-features: 我们觉得最酷的一些功能
   features-title-1: 对Relax 和 Autopilot mod的PP计算
-  features-content-1: 我们的服务器针对RX和AP有专门的PP计算算法。有超高的AIM移动能力但是左手无力？又或者左手超强的手速speed却不会移动AIM? 在 {{ appName() }} 当中都可以完美发挥你的强项。
+  features-content-1: 我们的服务器针对RX和AP有专门的PP计算算法。有超高的AIM移动能力但是左手无力？又或者左手超强的手速speed却不会移动AIM? 在 %{appName} 当中都可以完美发挥你的强项。
   features-title-2: 免费的 osu!direct 服务
   features-content-2: 你不用特意成为 osu!supporter 以此来提高你在客户端下图方面的体验。osu!direct 对所有人开放(并且使用的是国内的sayo镜像站)! 虽然如此,如果你愿意支持我们,你仍然可以获得一些超酷的特权。只不过这些特权并不会影响到你的game sessions!
   features-title-3: Flexible library
diff --git a/templates/home.html b/templates/home.html
index 07554871..9b3772fc 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -74,7 +74,7 @@ <h2 class="title mb-6">{{ t('home.some-of-our-coolest-features') }}</h2>
           </div>
           <div class="column is-10">
             <h4 class="title is-spaced is-4">{{ t('home.features-title-1') }}</h4>
-            <p class="subtitle is-6">{{ t('home.features-content-1') }}</p>
+            <p class="subtitle is-6">{{ t('home.features-content-1', appName = appName()) }}</p>
           </div>
         </div>
       </div>

From 877808441193ad31a0f5430442cd214bdbb59da3 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 5 Jun 2022 21:55:18 +0900
Subject: [PATCH 053/278] i18n transpiler

---
 .gitignore                                  |  3 +
 {locales => .locales}/404.en_GB.yml         |  2 +-
 {locales => .locales}/404.en_US.yml         |  2 +-
 {locales => .locales}/404.zh_CN.yml         |  2 +-
 {locales => .locales}/global.en_GB.yml      |  2 +-
 {locales => .locales}/global.en_US.yml      |  2 +-
 {locales => .locales}/global.zh_CN.yml      |  2 +-
 .locales/home.en_GB.yml                     | 32 ++++++++
 .locales/home.en_US.yml                     | 28 +++++++
 .locales/home.zh_CN.yml                     | 23 ++++++
 {locales => .locales}/leaderboard.en_GB.yml |  2 +-
 {locales => .locales}/leaderboard.en_US.yml |  2 +-
 {locales => .locales}/leaderboard.zh_CN.yml |  2 +-
 {locales => .locales}/login.en_GB.yml       |  4 +-
 {locales => .locales}/login.en_US.yml       |  4 +-
 {locales => .locales}/login.zh_CN.yml       |  4 +-
 {locales => .locales}/navbar.en_GB.yml      |  2 +-
 {locales => .locales}/navbar.en_US.yml      |  2 +-
 {locales => .locales}/navbar.zh_CN.yml      |  2 +-
 {locales => .locales}/profile.en_GB.yml     |  2 +-
 {locales => .locales}/profile.en_US.yml     |  2 +-
 {locales => .locales}/profile.zh_CN.yml     |  2 +-
 {locales => .locales}/register.en_GB.yml    |  2 +-
 {locales => .locales}/register.en_US.yml    |  2 +-
 {locales => .locales}/register.zh_CN.yml    |  2 +-
 {locales => .locales}/verify.en_GB.yml      |  6 +-
 {locales => .locales}/verify.en_US.yml      |  6 +-
 {locales => .locales}/verify.zh_CN.yml      |  6 +-
 locales/404/en-GB.yml                       |  4 +
 locales/404/en-US.yml                       |  4 +
 locales/404/zh-CN.yml                       |  4 +
 locales/global/en-GB.yml                    |  4 +
 locales/global/en-US.yml                    |  4 +
 locales/global/zh-CN.yml                    |  4 +
 locales/home.en_GB.yml                      | 12 ---
 locales/home.en_US.yml                      | 12 ---
 locales/home.zh_CN.yml                      | 12 ---
 locales/home/en-GB.yml                      | 31 +++++++
 locales/home/en-US.yml                      | 27 ++++++
 locales/home/zh-CN.yml                      | 22 +++++
 locales/leaderboard/en-GB.yml               |  2 +
 locales/leaderboard/en-US.yml               |  2 +
 locales/leaderboard/zh-CN.yml               |  2 +
 locales/login/en-GB.yml                     |  5 ++
 locales/login/en-US.yml                     |  5 ++
 locales/login/zh-CN.yml                     |  5 ++
 locales/navbar/en-GB.yml                    |  4 +
 locales/navbar/en-US.yml                    |  4 +
 locales/navbar/zh-CN.yml                    |  4 +
 locales/profile/en-GB.yml                   |  6 ++
 locales/profile/en-US.yml                   |  6 ++
 locales/profile/zh-CN.yml                   |  6 ++
 locales/register/en-GB.yml                  |  5 ++
 locales/register/en-US.yml                  |  5 ++
 locales/register/zh-CN.yml                  |  5 ++
 locales/verify/en-GB.yml                    | 19 +++++
 locales/verify/en-US.yml                    | 19 +++++
 locales/verify/zh-CN.yml                    | 19 +++++
 main.py                                     |  2 +-
 package.json                                | 29 +++++++
 templates/base.html                         |  2 +-
 templates/home.html                         |  8 +-
 utils/i18n/adapt-to-i18n-editor.mjs         | 19 +++++
 utils/i18n/commands/compile.mjs             |  5 ++
 utils/i18n/commands/migrate.mjs             |  5 ++
 utils/i18n/config.mjs                       | 25 ++++++
 utils/i18n/original-reader.mjs              | 91 +++++++++++++++++++++
 utils/i18n/original-writer.mjs              | 59 +++++++++++++
 utils/i18n/reader.mjs                       | 64 +++++++++++++++
 utils/i18n/run.mjs                          |  2 +
 utils/i18n/writer.mjs                       | 39 +++++++++
 71 files changed, 693 insertions(+), 72 deletions(-)
 rename {locales => .locales}/404.en_GB.yml (89%)
 rename {locales => .locales}/404.en_US.yml (89%)
 rename {locales => .locales}/404.zh_CN.yml (96%)
 rename {locales => .locales}/global.en_GB.yml (78%)
 rename {locales => .locales}/global.en_US.yml (78%)
 rename {locales => .locales}/global.zh_CN.yml (77%)
 create mode 100644 .locales/home.en_GB.yml
 create mode 100644 .locales/home.en_US.yml
 create mode 100644 .locales/home.zh_CN.yml
 rename {locales => .locales}/leaderboard.en_GB.yml (96%)
 rename {locales => .locales}/leaderboard.en_US.yml (96%)
 rename {locales => .locales}/leaderboard.zh_CN.yml (84%)
 rename {locales => .locales}/login.en_GB.yml (53%)
 rename {locales => .locales}/login.en_US.yml (53%)
 rename {locales => .locales}/login.zh_CN.yml (52%)
 rename {locales => .locales}/navbar.en_GB.yml (83%)
 rename {locales => .locales}/navbar.en_US.yml (83%)
 rename {locales => .locales}/navbar.zh_CN.yml (83%)
 rename {locales => .locales}/profile.en_GB.yml (89%)
 rename {locales => .locales}/profile.en_US.yml (89%)
 rename {locales => .locales}/profile.zh_CN.yml (88%)
 rename {locales => .locales}/register.en_GB.yml (64%)
 rename {locales => .locales}/register.en_US.yml (64%)
 rename {locales => .locales}/register.zh_CN.yml (65%)
 rename {locales => .locales}/verify.en_GB.yml (84%)
 rename {locales => .locales}/verify.en_US.yml (84%)
 rename {locales => .locales}/verify.zh_CN.yml (85%)
 create mode 100644 locales/404/en-GB.yml
 create mode 100644 locales/404/en-US.yml
 create mode 100644 locales/404/zh-CN.yml
 create mode 100644 locales/global/en-GB.yml
 create mode 100644 locales/global/en-US.yml
 create mode 100644 locales/global/zh-CN.yml
 delete mode 100644 locales/home.en_GB.yml
 delete mode 100644 locales/home.en_US.yml
 delete mode 100644 locales/home.zh_CN.yml
 create mode 100644 locales/home/en-GB.yml
 create mode 100644 locales/home/en-US.yml
 create mode 100644 locales/home/zh-CN.yml
 create mode 100644 locales/leaderboard/en-GB.yml
 create mode 100644 locales/leaderboard/en-US.yml
 create mode 100644 locales/leaderboard/zh-CN.yml
 create mode 100644 locales/login/en-GB.yml
 create mode 100644 locales/login/en-US.yml
 create mode 100644 locales/login/zh-CN.yml
 create mode 100644 locales/navbar/en-GB.yml
 create mode 100644 locales/navbar/en-US.yml
 create mode 100644 locales/navbar/zh-CN.yml
 create mode 100644 locales/profile/en-GB.yml
 create mode 100644 locales/profile/en-US.yml
 create mode 100644 locales/profile/zh-CN.yml
 create mode 100644 locales/register/en-GB.yml
 create mode 100644 locales/register/en-US.yml
 create mode 100644 locales/register/zh-CN.yml
 create mode 100644 locales/verify/en-GB.yml
 create mode 100644 locales/verify/en-US.yml
 create mode 100644 locales/verify/zh-CN.yml
 create mode 100644 package.json
 create mode 100644 utils/i18n/adapt-to-i18n-editor.mjs
 create mode 100644 utils/i18n/commands/compile.mjs
 create mode 100644 utils/i18n/commands/migrate.mjs
 create mode 100644 utils/i18n/config.mjs
 create mode 100644 utils/i18n/original-reader.mjs
 create mode 100644 utils/i18n/original-writer.mjs
 create mode 100644 utils/i18n/reader.mjs
 create mode 100644 utils/i18n/run.mjs
 create mode 100644 utils/i18n/writer.mjs

diff --git a/.gitignore b/.gitignore
index 09ffb221..91abb311 100644
--- a/.gitignore
+++ b/.gitignore
@@ -143,3 +143,6 @@ config.py
 .data/*
 !.data/backgrounds/.gitkeep
 !.data/banners/.gitkeep
+
+node_modules/
+package-lock.json
\ No newline at end of file
diff --git a/locales/404.en_GB.yml b/.locales/404.en_GB.yml
similarity index 89%
rename from locales/404.en_GB.yml
rename to .locales/404.en_GB.yml
index d6e5cf3e..0bd22e57 100644
--- a/locales/404.en_GB.yml
+++ b/.locales/404.en_GB.yml
@@ -2,4 +2,4 @@ en_GB:
   page-not-found: Page not found
   where-am-i: Where am I?
   check-url: Check that the URL you entered is correct.
-  make-sure-visit: Make sure that the place you are visiting isn't under maintenance!
\ No newline at end of file
+  make-sure-visit: Make sure that the place you are visiting isn't under maintenance!
diff --git a/locales/404.en_US.yml b/.locales/404.en_US.yml
similarity index 89%
rename from locales/404.en_US.yml
rename to .locales/404.en_US.yml
index 685f7132..4ce2e89c 100644
--- a/locales/404.en_US.yml
+++ b/.locales/404.en_US.yml
@@ -2,4 +2,4 @@ en_US:
   page-not-found: Page not found
   where-am-i: Where am I?
   check-url: Check that the URL you entered is correct.
-  make-sure-visit: Make sure that the place you are visiting isn't under maintenance!
\ No newline at end of file
+  make-sure-visit: Make sure that the place you are visiting isn't under maintenance!
diff --git a/locales/404.zh_CN.yml b/.locales/404.zh_CN.yml
similarity index 96%
rename from locales/404.zh_CN.yml
rename to .locales/404.zh_CN.yml
index ca47db03..857a1214 100644
--- a/locales/404.zh_CN.yml
+++ b/.locales/404.zh_CN.yml
@@ -2,4 +2,4 @@ zh_CN:
   page-not-found: 404 查无此页
   where-am-i: 我是谁 我在哪 我在干什么?
   check-url: 请检查下你输入的链接是否正确。
-  make-sure-visit: 或者确保你想访问的地方没有在维护中!
\ No newline at end of file
+  make-sure-visit: 或者确保你想访问的地方没有在维护中!
diff --git a/locales/global.en_GB.yml b/.locales/global.en_GB.yml
similarity index 78%
rename from locales/global.en_GB.yml
rename to .locales/global.en_GB.yml
index b3407129..3a83eb8e 100644
--- a/locales/global.en_GB.yml
+++ b/.locales/global.en_GB.yml
@@ -2,4 +2,4 @@ en_GB:
   sign-up: Sign up
   log-in: Log in
   offline: Offline
-  online: Online
\ No newline at end of file
+  online: Online
diff --git a/locales/global.en_US.yml b/.locales/global.en_US.yml
similarity index 78%
rename from locales/global.en_US.yml
rename to .locales/global.en_US.yml
index 473c1621..3d3bdefa 100644
--- a/locales/global.en_US.yml
+++ b/.locales/global.en_US.yml
@@ -2,4 +2,4 @@ en_US:
   sign-up: Sign up
   log-in: Log in
   offline: Offline
-  online: Online
\ No newline at end of file
+  online: Online
diff --git a/locales/global.zh_CN.yml b/.locales/global.zh_CN.yml
similarity index 77%
rename from locales/global.zh_CN.yml
rename to .locales/global.zh_CN.yml
index 1aeaeb00..d7a9d7c5 100644
--- a/locales/global.zh_CN.yml
+++ b/.locales/global.zh_CN.yml
@@ -2,4 +2,4 @@ zh_CN:
   sign-up: 注册
   log-in: 登录
   offline: 离线
-  online: 在线
\ No newline at end of file
+  online: 在线
diff --git a/.locales/home.en_GB.yml b/.locales/home.en_GB.yml
new file mode 100644
index 00000000..15f39ef3
--- /dev/null
+++ b/.locales/home.en_GB.yml
@@ -0,0 +1,32 @@
+en_GB:
+  warning: Warning
+  notice: Notice
+  error: Uh oh! Be careful!
+  success: Hey! Listen!
+  subtitle-big: >-
+    We are an osu! private server built from the ground up with many unique
+    features not seen elsewhere - for more information, check out gulag and
+    guweb on GitHub - we're fully open source!
+  some-of-our-coolest-features: Some of our coolest features
+  features-title-1: PP for Relax and Autopilot
+  features-content-1: >-
+    Our server has unique pp formula for relax and autopilot.Good at waving your
+    cursor or just smashing your keyboard? Join %{appName} and get a fair reward
+    foryour skills!
+  features-title-2: Free osu!direct
+  features-content-2: >-
+    You won't have to pay for osu!supporter to have a convenient gameplay
+    experience in the client - osu!direct is available for everyone! Keep in
+    mind supporting us still grants a huge set of cool perks but absense of it
+    doesn't affect your game sessions!
+  features-title-3: Flexible library
+  features-content-3: >-
+    We're written on top of cmyui's multipurpose library allowing for a fully
+    asynchronous environment, both improving performance and the user's
+    experience in the long term!
+  what-are-you-waiting-for: What are you waiting for?
+  subtitle: >-
+    Join %{appName}! It's risk-free! You won't get your account banned on
+    official servers if you play here with us! And don't worry, as you can
+    always switch between the official servers and us at any time!
+  sign-up-for-free: Sign up for free
diff --git a/.locales/home.en_US.yml b/.locales/home.en_US.yml
new file mode 100644
index 00000000..6ecef70a
--- /dev/null
+++ b/.locales/home.en_US.yml
@@ -0,0 +1,28 @@
+en_US:
+  subtitle-big: >-
+    We are an osu! private server built from the ground up with many unique
+    features not seen elsewhere - for more information, check out gulag and
+    guweb on GitHub - we're fully open source!
+  some-of-our-coolest-features: Some of our coolest features
+  features-title-1: PP for Relax and Autopilot
+  features-content-1: >-
+    Our server has unique pp formula for relax and autopilot.Good at waving your
+    cursor or just smashing your keyboard? Join %{appName} and get a fair reward
+    foryour skills!
+  features-title-2: Free osu!direct
+  features-content-2: >-
+    You won't have to pay for osu!supporter to have a convenient gameplay
+    experience in the client - osu!direct is available for everyone! Keep in
+    mind supporting us still grants a huge set of cool perks but absense of it
+    doesn't affect your game sessions!
+  features-title-3: Flexible library
+  features-content-3: >-
+    We're written on top of cmyui's multipurpose library allowing for a fully
+    asynchronous environment, both improving performance and the user's
+    experience in the long term!
+  what-are-you-waiting-for: What are you waiting for?
+  subtitle: >-
+    Join %{appName}! It's risk-free! You won't get your account banned on
+    official servers if you play here with us! And don't worry, as you can
+    always switch between the official servers and us at any time!
+  sign-up-for-free: Sign up for free
diff --git a/.locales/home.zh_CN.yml b/.locales/home.zh_CN.yml
new file mode 100644
index 00000000..1439f859
--- /dev/null
+++ b/.locales/home.zh_CN.yml
@@ -0,0 +1,23 @@
+zh_CN:
+  subtitle-big: >-
+    我们是一个从头搭建的 osu! 私人服务器,具有许多你曾未见识到的独特功能。--想了解更多信息,可以查看我们在Github 上的 gulag 和
+    guweb 项目 -- 我们完全开源
+  some-of-our-coolest-features: 我们觉得最酷的一些功能
+  features-title-1: 对Relax 和 Autopilot mod的PP计算
+  features-content-1: >-
+    我们的服务器针对RX和AP有专门的PP计算算法。有超高的AIM移动能力但是左手无力？又或者左手超强的手速speed却不会移动AIM? 在
+    %{appName} 当中都可以完美发挥你的强项。
+  features-title-2: 免费的 osu!direct 服务
+  features-content-2: >-
+    你不用特意成为 osu!supporter 以此来提高你在客户端下图方面的体验。osu!direct 对所有人开放(并且使用的是国内的sayo镜像站)!
+    虽然如此,如果你愿意支持我们,你仍然可以获得一些超酷的特权。只不过这些特权并不会影响到你的game sessions!
+  features-title-3: Flexible library
+  features-content-3: >-
+    We're written on top of cmyui's multipurpose library allowing for a fully
+    asynchronous environment, both improving performance and the user's
+    experience in the long term!
+  what-are-you-waiting-for: 你 还 在 等 什 么?
+  subtitle: >-
+    赶紧加入到 %{appName} 当中吧! 没有风险!
+    并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
+  sign-up-for-free: 免 费 注 册！
diff --git a/locales/leaderboard.en_GB.yml b/.locales/leaderboard.en_GB.yml
similarity index 96%
rename from locales/leaderboard.en_GB.yml
rename to .locales/leaderboard.en_GB.yml
index 482d0e8c..6e2e15aa 100644
--- a/locales/leaderboard.en_GB.yml
+++ b/.locales/leaderboard.en_GB.yml
@@ -1,3 +1,3 @@
 en_GB:
   leaderboard: Leaderboard
-  there-are-no-players-to-display: there are no players to display!
\ No newline at end of file
+  there-are-no-players-to-display: there are no players to display!
diff --git a/locales/leaderboard.en_US.yml b/.locales/leaderboard.en_US.yml
similarity index 96%
rename from locales/leaderboard.en_US.yml
rename to .locales/leaderboard.en_US.yml
index 4d1d40fe..358619ab 100644
--- a/locales/leaderboard.en_US.yml
+++ b/.locales/leaderboard.en_US.yml
@@ -1,3 +1,3 @@
 en_US:
   leaderboard: Leaderboard
-  there-are-no-players-to-display: there are no players to display!
\ No newline at end of file
+  there-are-no-players-to-display: there are no players to display!
diff --git a/locales/leaderboard.zh_CN.yml b/.locales/leaderboard.zh_CN.yml
similarity index 84%
rename from locales/leaderboard.zh_CN.yml
rename to .locales/leaderboard.zh_CN.yml
index cb092c63..ee68e000 100644
--- a/locales/leaderboard.zh_CN.yml
+++ b/.locales/leaderboard.zh_CN.yml
@@ -1,3 +1,3 @@
 zh_CN:
   leaderboard: 排行榜
-  there-are-no-players-to-display: 这里没有符合条件的玩家可供显示!
\ No newline at end of file
+  there-are-no-players-to-display: 这里没有符合条件的玩家可供显示!
diff --git a/locales/login.en_GB.yml b/.locales/login.en_GB.yml
similarity index 53%
rename from locales/login.en_GB.yml
rename to .locales/login.en_GB.yml
index 395dcd82..8cec222e 100644
--- a/locales/login.en_GB.yml
+++ b/.locales/login.en_GB.yml
@@ -1,6 +1,6 @@
 en_GB:
-  dont-have-an-account : Don't have an account?
+  dont-have-an-account: Don't have an account?
   register: Register
   forgot-login: Forgot login?
   username: Username
-  password: Password
\ No newline at end of file
+  password: Password
diff --git a/locales/login.en_US.yml b/.locales/login.en_US.yml
similarity index 53%
rename from locales/login.en_US.yml
rename to .locales/login.en_US.yml
index 7e346364..5ce07ecf 100644
--- a/locales/login.en_US.yml
+++ b/.locales/login.en_US.yml
@@ -1,6 +1,6 @@
 en_US:
-  dont-have-an-account : Don't have an account?
+  dont-have-an-account: Don't have an account?
   register: Register
   forgot-login: Forgot login?
   username: Username
-  password: Password
\ No newline at end of file
+  password: Password
diff --git a/locales/login.zh_CN.yml b/.locales/login.zh_CN.yml
similarity index 52%
rename from locales/login.zh_CN.yml
rename to .locales/login.zh_CN.yml
index 3f7e6644..57d22c97 100644
--- a/locales/login.zh_CN.yml
+++ b/.locales/login.zh_CN.yml
@@ -1,6 +1,6 @@
 zh_CN:
-  dont-have-an-account : 还未拥有一个账号？
+  dont-have-an-account: 还未拥有一个账号？
   register: 注册
   forgot-login: 忘记账号?
   username: 你的用户名
-  password: 你的密码
\ No newline at end of file
+  password: 你的密码
diff --git a/locales/navbar.en_GB.yml b/.locales/navbar.en_GB.yml
similarity index 83%
rename from locales/navbar.en_GB.yml
rename to .locales/navbar.en_GB.yml
index 909dba09..be57f008 100644
--- a/locales/navbar.en_GB.yml
+++ b/.locales/navbar.en_GB.yml
@@ -2,4 +2,4 @@ en_GB:
   home: Home
   leaderboards: Leaderboards
   information: Information
-  admin: Admin
\ No newline at end of file
+  admin: Admin
diff --git a/locales/navbar.en_US.yml b/.locales/navbar.en_US.yml
similarity index 83%
rename from locales/navbar.en_US.yml
rename to .locales/navbar.en_US.yml
index 15747c8d..4631210f 100644
--- a/locales/navbar.en_US.yml
+++ b/.locales/navbar.en_US.yml
@@ -2,4 +2,4 @@ en_US:
   home: Home
   leaderboards: Leaderboards
   information: Information
-  admin: Admin
\ No newline at end of file
+  admin: Admin
diff --git a/locales/navbar.zh_CN.yml b/.locales/navbar.zh_CN.yml
similarity index 83%
rename from locales/navbar.zh_CN.yml
rename to .locales/navbar.zh_CN.yml
index 8081e449..81fe7bdd 100644
--- a/locales/navbar.zh_CN.yml
+++ b/.locales/navbar.zh_CN.yml
@@ -2,4 +2,4 @@ zh_CN:
   home: 主页
   leaderboards: 排行榜
   information: Information
-  admin: Admin
\ No newline at end of file
+  admin: Admin
diff --git a/locales/profile.en_GB.yml b/.locales/profile.en_GB.yml
similarity index 89%
rename from locales/profile.en_GB.yml
rename to .locales/profile.en_GB.yml
index 31699646..57f5a4fb 100644
--- a/locales/profile.en_GB.yml
+++ b/.locales/profile.en_GB.yml
@@ -4,4 +4,4 @@ en_GB:
   show-more: Show more
   most-played-beatmaps: Most Played Beatmaps
   no-beatmaps-available: No beatmaps available
-  statistics: Statistics
\ No newline at end of file
+  statistics: Statistics
diff --git a/locales/profile.en_US.yml b/.locales/profile.en_US.yml
similarity index 89%
rename from locales/profile.en_US.yml
rename to .locales/profile.en_US.yml
index e9ea6316..dd275207 100644
--- a/locales/profile.en_US.yml
+++ b/.locales/profile.en_US.yml
@@ -4,4 +4,4 @@ en_US:
   show-more: Show more
   most-played-beatmaps: Most Played Beatmaps
   no-beatmaps-available: No beatmaps available
-  statistics: Statistics
\ No newline at end of file
+  statistics: Statistics
diff --git a/locales/profile.zh_CN.yml b/.locales/profile.zh_CN.yml
similarity index 88%
rename from locales/profile.zh_CN.yml
rename to .locales/profile.zh_CN.yml
index be77629a..085756e3 100644
--- a/locales/profile.zh_CN.yml
+++ b/.locales/profile.zh_CN.yml
@@ -4,4 +4,4 @@ zh_CN:
   show-more: 展示更多
   most-played-beatmaps: 游玩最多的铺面
   no-beatmaps-available: 暂无有效铺面
-  statistics: 数据统计
\ No newline at end of file
+  statistics: 数据统计
diff --git a/locales/register.en_GB.yml b/.locales/register.en_GB.yml
similarity index 64%
rename from locales/register.en_GB.yml
rename to .locales/register.en_GB.yml
index cdd1850b..4fad455f 100644
--- a/locales/register.en_GB.yml
+++ b/.locales/register.en_GB.yml
@@ -3,4 +3,4 @@ en_GB:
   register: register
   email: Email
   password: Password
-  already-have-an-account: Already have an account?
\ No newline at end of file
+  already-have-an-account: Already have an account?
diff --git a/locales/register.en_US.yml b/.locales/register.en_US.yml
similarity index 64%
rename from locales/register.en_US.yml
rename to .locales/register.en_US.yml
index fcb09a03..ef8ba925 100644
--- a/locales/register.en_US.yml
+++ b/.locales/register.en_US.yml
@@ -3,4 +3,4 @@ en_US:
   register: register
   email: Email
   password: Password
-  already-have-an-account: Already have an account?
\ No newline at end of file
+  already-have-an-account: Already have an account?
diff --git a/locales/register.zh_CN.yml b/.locales/register.zh_CN.yml
similarity index 65%
rename from locales/register.zh_CN.yml
rename to .locales/register.zh_CN.yml
index a71a1403..2594850b 100644
--- a/locales/register.zh_CN.yml
+++ b/.locales/register.zh_CN.yml
@@ -3,4 +3,4 @@ zh_CN:
   register: 注册账号
   email: 电子邮箱
   password: 密码
-  already-have-an-account: 已经拥有账号了?
\ No newline at end of file
+  already-have-an-account: 已经拥有账号了?
diff --git a/locales/verify.en_GB.yml b/.locales/verify.en_GB.yml
similarity index 84%
rename from locales/verify.en_GB.yml
rename to .locales/verify.en_GB.yml
index 4dc15416..4acf10b9 100644
--- a/locales/verify.en_GB.yml
+++ b/.locales/verify.en_GB.yml
@@ -12,7 +12,9 @@ en_GB:
   login-to-your-account: Login to your account
   login-to-your-app-name-account: Login to your %{appName} account and you should be done!
   oh-crap-i-am-stuck: Oh crap! I'm stuck please help me!
-  need-help-join-discord-server: Need help? We've got you covered - join the Discord so our community can help you out!
+  need-help-join-discord-server: >-
+    Need help? We've got you covered - join the Discord so our community can
+    help you out!
   click-here-to-join-our-discord: Click here to join our Discord!
   waiting-for-verification: Waiting for verification!
-  follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
\ No newline at end of file
+  follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
diff --git a/locales/verify.en_US.yml b/.locales/verify.en_US.yml
similarity index 84%
rename from locales/verify.en_US.yml
rename to .locales/verify.en_US.yml
index 4c2e8ab7..aff970e1 100644
--- a/locales/verify.en_US.yml
+++ b/.locales/verify.en_US.yml
@@ -12,7 +12,9 @@ en_US:
   login-to-your-account: Login to your account
   login-to-your-app-name-account: Login to your %{appName} account and you should be done!
   oh-crap-i-am-stuck: Oh crap! I'm stuck please help me!
-  need-help-join-discord-server: Need help? We've got you covered - join the Discord so our community can help you out!
+  need-help-join-discord-server: >-
+    Need help? We've got you covered - join the Discord so our community can
+    help you out!
   click-here-to-join-our-discord: Click here to join our Discord!
   waiting-for-verification: Waiting for verification!
-  follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
\ No newline at end of file
+  follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
diff --git a/locales/verify.zh_CN.yml b/.locales/verify.zh_CN.yml
similarity index 85%
rename from locales/verify.zh_CN.yml
rename to .locales/verify.zh_CN.yml
index 103586b3..d1885ffd 100644
--- a/locales/verify.zh_CN.yml
+++ b/.locales/verify.zh_CN.yml
@@ -12,7 +12,9 @@ zh_CN:
   login-to-your-account: 登入你的账号
   login-to-your-app-name-account: 登录你的 %{appName} 账号,然后就应该万事大吉了!
   oh-crap-i-am-stuck: 妈的，我卡在这个步骤了,赶紧过来帮我一下
-  need-help-join-discord-server: Need help? We've got you covered - join the Discord so our community can help you out!
+  need-help-join-discord-server: >-
+    Need help? We've got you covered - join the Discord so our community can
+    help you out!
   click-here-to-join-our-discord: Click here to join our Discord!
   waiting-for-verification: 正在等待验证结果~
-  follow-the-simple-instructions: 只需按照上面的简单说明进行操作，完成后重新加载此页面！
\ No newline at end of file
+  follow-the-simple-instructions: 只需按照上面的简单说明进行操作，完成后重新加载此页面！
diff --git a/locales/404/en-GB.yml b/locales/404/en-GB.yml
new file mode 100644
index 00000000..7cc2f30a
--- /dev/null
+++ b/locales/404/en-GB.yml
@@ -0,0 +1,4 @@
+page-not-found: Page not found
+where-am-i: Where am I?
+check-url: Check that the URL you entered is correct.
+make-sure-visit: Make sure that the place you are visiting isn't under maintenance!
diff --git a/locales/404/en-US.yml b/locales/404/en-US.yml
new file mode 100644
index 00000000..7cc2f30a
--- /dev/null
+++ b/locales/404/en-US.yml
@@ -0,0 +1,4 @@
+page-not-found: Page not found
+where-am-i: Where am I?
+check-url: Check that the URL you entered is correct.
+make-sure-visit: Make sure that the place you are visiting isn't under maintenance!
diff --git a/locales/404/zh-CN.yml b/locales/404/zh-CN.yml
new file mode 100644
index 00000000..aeedcdbb
--- /dev/null
+++ b/locales/404/zh-CN.yml
@@ -0,0 +1,4 @@
+page-not-found: 404 查无此页
+where-am-i: 我是谁 我在哪 我在干什么?
+check-url: 请检查下你输入的链接是否正确。
+make-sure-visit: 或者确保你想访问的地方没有在维护中!
diff --git a/locales/global/en-GB.yml b/locales/global/en-GB.yml
new file mode 100644
index 00000000..c9fcc76f
--- /dev/null
+++ b/locales/global/en-GB.yml
@@ -0,0 +1,4 @@
+sign-up: Sign up
+log-in: Log in
+offline: Offline
+online: Online
diff --git a/locales/global/en-US.yml b/locales/global/en-US.yml
new file mode 100644
index 00000000..c9fcc76f
--- /dev/null
+++ b/locales/global/en-US.yml
@@ -0,0 +1,4 @@
+sign-up: Sign up
+log-in: Log in
+offline: Offline
+online: Online
diff --git a/locales/global/zh-CN.yml b/locales/global/zh-CN.yml
new file mode 100644
index 00000000..7acda31c
--- /dev/null
+++ b/locales/global/zh-CN.yml
@@ -0,0 +1,4 @@
+sign-up: 注册
+log-in: 登录
+offline: 离线
+online: 在线
diff --git a/locales/home.en_GB.yml b/locales/home.en_GB.yml
deleted file mode 100644
index 683a0141..00000000
--- a/locales/home.en_GB.yml
+++ /dev/null
@@ -1,12 +0,0 @@
-en_GB:
-  subtitle-big: We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
-  some-of-our-coolest-features: Some of our coolest features
-  features-title-1: PP for Relax and Autopilot
-  features-content-1: Our server has unique pp formula for relax and autopilot.Good at waving your cursor or just smashing your keyboard? Join %{appName} and get a fair reward foryour skills!
-  features-title-2: Free osu!direct
-  features-content-2: You won't have to pay for osu!supporter to have a convenient gameplay experience in the client - osu!direct is available for everyone! Keep in mind supporting us still grants a huge set of cool perks but absense of it doesn't affect your game sessions!
-  features-title-3: Flexible library
-  features-content-3: We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
-  what-are-you-waiting-for: What are you waiting for?
-  subtitle: Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
-  sign-up-for-free: Sign up for free
\ No newline at end of file
diff --git a/locales/home.en_US.yml b/locales/home.en_US.yml
deleted file mode 100644
index 482ac42e..00000000
--- a/locales/home.en_US.yml
+++ /dev/null
@@ -1,12 +0,0 @@
-en_US:
-  subtitle-big: We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
-  some-of-our-coolest-features: Some of our coolest features
-  features-title-1: PP for Relax and Autopilot
-  features-content-1: Our server has unique pp formula for relax and autopilot.Good at waving your cursor or just smashing your keyboard? Join %{appName} and get a fair reward foryour skills!
-  features-title-2: Free osu!direct
-  features-content-2: You won't have to pay for osu!supporter to have a convenient gameplay experience in the client - osu!direct is available for everyone! Keep in mind supporting us still grants a huge set of cool perks but absense of it doesn't affect your game sessions!
-  features-title-3: Flexible library
-  features-content-3: We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
-  what-are-you-waiting-for: What are you waiting for?
-  subtitle: Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
-  sign-up-for-free: Sign up for free
\ No newline at end of file
diff --git a/locales/home.zh_CN.yml b/locales/home.zh_CN.yml
deleted file mode 100644
index 2b962f14..00000000
--- a/locales/home.zh_CN.yml
+++ /dev/null
@@ -1,12 +0,0 @@
-zh_CN:
-  subtitle-big: 我们是一个从头搭建的 osu! 私人服务器,具有许多你曾未见识到的独特功能。--想了解更多信息,可以查看我们在Github 上的 gulag 和 guweb 项目 -- 我们完全开源
-  some-of-our-coolest-features: 我们觉得最酷的一些功能
-  features-title-1: 对Relax 和 Autopilot mod的PP计算
-  features-content-1: 我们的服务器针对RX和AP有专门的PP计算算法。有超高的AIM移动能力但是左手无力？又或者左手超强的手速speed却不会移动AIM? 在 %{appName} 当中都可以完美发挥你的强项。
-  features-title-2: 免费的 osu!direct 服务
-  features-content-2: 你不用特意成为 osu!supporter 以此来提高你在客户端下图方面的体验。osu!direct 对所有人开放(并且使用的是国内的sayo镜像站)! 虽然如此,如果你愿意支持我们,你仍然可以获得一些超酷的特权。只不过这些特权并不会影响到你的game sessions!
-  features-title-3: Flexible library
-  features-content-3: We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
-  what-are-you-waiting-for: 你 还 在 等 什 么?
-  subtitle: 赶紧加入到 %{appName} 当中吧! 没有风险! 并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
-  sign-up-for-free: 免 费 注 册！
\ No newline at end of file
diff --git a/locales/home/en-GB.yml b/locales/home/en-GB.yml
new file mode 100644
index 00000000..a1823e8c
--- /dev/null
+++ b/locales/home/en-GB.yml
@@ -0,0 +1,31 @@
+warning: Warning
+notice: Notice
+error: Uh oh! Be careful!
+success: Hey! Listen!
+subtitle-big: >-
+  We are an osu! private server built from the ground up with many unique
+  features not seen elsewhere - for more information, check out gulag and guweb
+  on GitHub - we're fully open source!
+some-of-our-coolest-features: Some of our coolest features
+features-title-1: PP for Relax and Autopilot
+features-content-1: >-
+  Our server has unique pp formula for relax and autopilot.Good at waving your
+  cursor or just smashing your keyboard? Join %{appName} and get a fair reward
+  foryour skills!
+features-title-2: Free osu!direct
+features-content-2: >-
+  You won't have to pay for osu!supporter to have a convenient gameplay
+  experience in the client - osu!direct is available for everyone! Keep in mind
+  supporting us still grants a huge set of cool perks but absense of it doesn't
+  affect your game sessions!
+features-title-3: Flexible library
+features-content-3: >-
+  We're written on top of cmyui's multipurpose library allowing for a fully
+  asynchronous environment, both improving performance and the user's experience
+  in the long term!
+what-are-you-waiting-for: What are you waiting for?
+subtitle: >-
+  Join %{appName}! It's risk-free! You won't get your account banned on official
+  servers if you play here with us! And don't worry, as you can always switch
+  between the official servers and us at any time!
+sign-up-for-free: Sign up for free
diff --git a/locales/home/en-US.yml b/locales/home/en-US.yml
new file mode 100644
index 00000000..9d602024
--- /dev/null
+++ b/locales/home/en-US.yml
@@ -0,0 +1,27 @@
+subtitle-big: >-
+  We are an osu! private server built from the ground up with many unique
+  features not seen elsewhere - for more information, check out gulag and guweb
+  on GitHub - we're fully open source!
+some-of-our-coolest-features: Some of our coolest features
+features-title-1: PP for Relax and Autopilot
+features-content-1: >-
+  Our server has unique pp formula for relax and autopilot.Good at waving your
+  cursor or just smashing your keyboard? Join %{appName} and get a fair reward
+  foryour skills!
+features-title-2: Free osu!direct
+features-content-2: >-
+  You won't have to pay for osu!supporter to have a convenient gameplay
+  experience in the client - osu!direct is available for everyone! Keep in mind
+  supporting us still grants a huge set of cool perks but absense of it doesn't
+  affect your game sessions!
+features-title-3: Flexible library
+features-content-3: >-
+  We're written on top of cmyui's multipurpose library allowing for a fully
+  asynchronous environment, both improving performance and the user's experience
+  in the long term!
+what-are-you-waiting-for: What are you waiting for?
+subtitle: >-
+  Join %{appName}! It's risk-free! You won't get your account banned on official
+  servers if you play here with us! And don't worry, as you can always switch
+  between the official servers and us at any time!
+sign-up-for-free: Sign up for free
diff --git a/locales/home/zh-CN.yml b/locales/home/zh-CN.yml
new file mode 100644
index 00000000..7c7ce3bf
--- /dev/null
+++ b/locales/home/zh-CN.yml
@@ -0,0 +1,22 @@
+subtitle-big: >-
+  我们是一个从头搭建的 osu! 私人服务器,具有许多你曾未见识到的独特功能。--想了解更多信息,可以查看我们在Github 上的 gulag 和 guweb
+  项目 -- 我们完全开源
+some-of-our-coolest-features: 我们觉得最酷的一些功能
+features-title-1: 对Relax 和 Autopilot mod的PP计算
+features-content-1: >-
+  我们的服务器针对RX和AP有专门的PP计算算法。有超高的AIM移动能力但是左手无力？又或者左手超强的手速speed却不会移动AIM? 在
+  %{appName} 当中都可以完美发挥你的强项。
+features-title-2: 免费的 osu!direct 服务
+features-content-2: >-
+  你不用特意成为 osu!supporter 以此来提高你在客户端下图方面的体验。osu!direct 对所有人开放(并且使用的是国内的sayo镜像站)!
+  虽然如此,如果你愿意支持我们,你仍然可以获得一些超酷的特权。只不过这些特权并不会影响到你的game sessions!
+features-title-3: Flexible library
+features-content-3: >-
+  We're written on top of cmyui's multipurpose library allowing for a fully
+  asynchronous environment, both improving performance and the user's experience
+  in the long term!
+what-are-you-waiting-for: 你 还 在 等 什 么?
+subtitle: >-
+  赶紧加入到 %{appName} 当中吧! 没有风险!
+  并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
+sign-up-for-free: 免 费 注 册！
diff --git a/locales/leaderboard/en-GB.yml b/locales/leaderboard/en-GB.yml
new file mode 100644
index 00000000..c925c4ef
--- /dev/null
+++ b/locales/leaderboard/en-GB.yml
@@ -0,0 +1,2 @@
+leaderboard: Leaderboard
+there-are-no-players-to-display: there are no players to display!
diff --git a/locales/leaderboard/en-US.yml b/locales/leaderboard/en-US.yml
new file mode 100644
index 00000000..c925c4ef
--- /dev/null
+++ b/locales/leaderboard/en-US.yml
@@ -0,0 +1,2 @@
+leaderboard: Leaderboard
+there-are-no-players-to-display: there are no players to display!
diff --git a/locales/leaderboard/zh-CN.yml b/locales/leaderboard/zh-CN.yml
new file mode 100644
index 00000000..f7cc6fc1
--- /dev/null
+++ b/locales/leaderboard/zh-CN.yml
@@ -0,0 +1,2 @@
+leaderboard: 排行榜
+there-are-no-players-to-display: 这里没有符合条件的玩家可供显示!
diff --git a/locales/login/en-GB.yml b/locales/login/en-GB.yml
new file mode 100644
index 00000000..3f512d58
--- /dev/null
+++ b/locales/login/en-GB.yml
@@ -0,0 +1,5 @@
+dont-have-an-account: Don't have an account?
+register: Register
+forgot-login: Forgot login?
+username: Username
+password: Password
diff --git a/locales/login/en-US.yml b/locales/login/en-US.yml
new file mode 100644
index 00000000..3f512d58
--- /dev/null
+++ b/locales/login/en-US.yml
@@ -0,0 +1,5 @@
+dont-have-an-account: Don't have an account?
+register: Register
+forgot-login: Forgot login?
+username: Username
+password: Password
diff --git a/locales/login/zh-CN.yml b/locales/login/zh-CN.yml
new file mode 100644
index 00000000..6c935624
--- /dev/null
+++ b/locales/login/zh-CN.yml
@@ -0,0 +1,5 @@
+dont-have-an-account: 还未拥有一个账号？
+register: 注册
+forgot-login: 忘记账号?
+username: 你的用户名
+password: 你的密码
diff --git a/locales/navbar/en-GB.yml b/locales/navbar/en-GB.yml
new file mode 100644
index 00000000..d8be2d51
--- /dev/null
+++ b/locales/navbar/en-GB.yml
@@ -0,0 +1,4 @@
+home: Home
+leaderboards: Leaderboards
+information: Information
+admin: Admin
diff --git a/locales/navbar/en-US.yml b/locales/navbar/en-US.yml
new file mode 100644
index 00000000..d8be2d51
--- /dev/null
+++ b/locales/navbar/en-US.yml
@@ -0,0 +1,4 @@
+home: Home
+leaderboards: Leaderboards
+information: Information
+admin: Admin
diff --git a/locales/navbar/zh-CN.yml b/locales/navbar/zh-CN.yml
new file mode 100644
index 00000000..5786b730
--- /dev/null
+++ b/locales/navbar/zh-CN.yml
@@ -0,0 +1,4 @@
+home: 主页
+leaderboards: 排行榜
+information: Information
+admin: Admin
diff --git a/locales/profile/en-GB.yml b/locales/profile/en-GB.yml
new file mode 100644
index 00000000..e808fa1d
--- /dev/null
+++ b/locales/profile/en-GB.yml
@@ -0,0 +1,6 @@
+no-scores-available: No scores available
+try-playing-something: Try playing something
+show-more: Show more
+most-played-beatmaps: Most Played Beatmaps
+no-beatmaps-available: No beatmaps available
+statistics: Statistics
diff --git a/locales/profile/en-US.yml b/locales/profile/en-US.yml
new file mode 100644
index 00000000..e808fa1d
--- /dev/null
+++ b/locales/profile/en-US.yml
@@ -0,0 +1,6 @@
+no-scores-available: No scores available
+try-playing-something: Try playing something
+show-more: Show more
+most-played-beatmaps: Most Played Beatmaps
+no-beatmaps-available: No beatmaps available
+statistics: Statistics
diff --git a/locales/profile/zh-CN.yml b/locales/profile/zh-CN.yml
new file mode 100644
index 00000000..9462f102
--- /dev/null
+++ b/locales/profile/zh-CN.yml
@@ -0,0 +1,6 @@
+no-scores-available: 暂无有效成绩
+try-playing-something: 尝试去游玩一会吧！
+show-more: 展示更多
+most-played-beatmaps: 游玩最多的铺面
+no-beatmaps-available: 暂无有效铺面
+statistics: 数据统计
diff --git a/locales/register/en-GB.yml b/locales/register/en-GB.yml
new file mode 100644
index 00000000..8b9142d5
--- /dev/null
+++ b/locales/register/en-GB.yml
@@ -0,0 +1,5 @@
+registration: Registration
+register: register
+email: Email
+password: Password
+already-have-an-account: Already have an account?
diff --git a/locales/register/en-US.yml b/locales/register/en-US.yml
new file mode 100644
index 00000000..8b9142d5
--- /dev/null
+++ b/locales/register/en-US.yml
@@ -0,0 +1,5 @@
+registration: Registration
+register: register
+email: Email
+password: Password
+already-have-an-account: Already have an account?
diff --git a/locales/register/zh-CN.yml b/locales/register/zh-CN.yml
new file mode 100644
index 00000000..84323f13
--- /dev/null
+++ b/locales/register/zh-CN.yml
@@ -0,0 +1,5 @@
+registration: 注册
+register: 注册账号
+email: 电子邮箱
+password: 密码
+already-have-an-account: 已经拥有账号了?
diff --git a/locales/verify/en-GB.yml b/locales/verify/en-GB.yml
new file mode 100644
index 00000000..06060fa0
--- /dev/null
+++ b/locales/verify/en-GB.yml
@@ -0,0 +1,19 @@
+verification: Verification
+how-to-verify-your-account: How to verify your account
+what-do-you-mean-this-must-be-easy-right: What do you mean? This must be easy right?
+follow-these-three-simple-steps: Follow these three simple steps to get started playing %{appName} !
+osu-shortcut: Osu shortcut
+find-your-shortcut: Find your shortcut to osu on desktop and copy it!
+edit-it: Edit it
+right-click-properties: Right click -> Properties
+find-target-element-box: Find "Target element" Box
+add-domain: Add -devserver %{domain} at the end of it
+login-to-your-account: Login to your account
+login-to-your-app-name-account: Login to your %{appName} account and you should be done!
+oh-crap-i-am-stuck: Oh crap! I'm stuck please help me!
+need-help-join-discord-server: >-
+  Need help? We've got you covered - join the Discord so our community can help
+  you out!
+click-here-to-join-our-discord: Click here to join our Discord!
+waiting-for-verification: Waiting for verification!
+follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
diff --git a/locales/verify/en-US.yml b/locales/verify/en-US.yml
new file mode 100644
index 00000000..06060fa0
--- /dev/null
+++ b/locales/verify/en-US.yml
@@ -0,0 +1,19 @@
+verification: Verification
+how-to-verify-your-account: How to verify your account
+what-do-you-mean-this-must-be-easy-right: What do you mean? This must be easy right?
+follow-these-three-simple-steps: Follow these three simple steps to get started playing %{appName} !
+osu-shortcut: Osu shortcut
+find-your-shortcut: Find your shortcut to osu on desktop and copy it!
+edit-it: Edit it
+right-click-properties: Right click -> Properties
+find-target-element-box: Find "Target element" Box
+add-domain: Add -devserver %{domain} at the end of it
+login-to-your-account: Login to your account
+login-to-your-app-name-account: Login to your %{appName} account and you should be done!
+oh-crap-i-am-stuck: Oh crap! I'm stuck please help me!
+need-help-join-discord-server: >-
+  Need help? We've got you covered - join the Discord so our community can help
+  you out!
+click-here-to-join-our-discord: Click here to join our Discord!
+waiting-for-verification: Waiting for verification!
+follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
diff --git a/locales/verify/zh-CN.yml b/locales/verify/zh-CN.yml
new file mode 100644
index 00000000..f4d76542
--- /dev/null
+++ b/locales/verify/zh-CN.yml
@@ -0,0 +1,19 @@
+verification: 认证账号
+how-to-verify-your-account: 如何来认证你的账号
+what-do-you-mean-this-must-be-easy-right: 别想太复杂, 肯定很简单拉~。
+follow-these-three-simple-steps: 跟随以下三个简单的步骤即可游玩 %{appName} 了!
+osu-shortcut: Osu! 快捷方式
+find-your-shortcut: 在桌面上寻找你的osu!快捷方式并复制一份 (如果没有，可以去osu!目录里创建一份)
+edit-it: Edit it
+right-click-properties: 右键快捷方式,在菜单中找到 "属性" 选项,(一般在最下边)
+find-target-element-box: 找到 "目标" 这一行
+add-domain: 在文本的末尾添加 -devserver %{domain}
+login-to-your-account: 登入你的账号
+login-to-your-app-name-account: 登录你的 %{appName} 账号,然后就应该万事大吉了!
+oh-crap-i-am-stuck: 妈的，我卡在这个步骤了,赶紧过来帮我一下
+need-help-join-discord-server: >-
+  Need help? We've got you covered - join the Discord so our community can help
+  you out!
+click-here-to-join-our-discord: Click here to join our Discord!
+waiting-for-verification: 正在等待验证结果~
+follow-the-simple-instructions: 只需按照上面的简单说明进行操作，完成后重新加载此页面！
diff --git a/main.py b/main.py
index afe909fe..7f996ac5 100755
--- a/main.py
+++ b/main.py
@@ -81,5 +81,5 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    i18n.load_path.append(os.getcwd() + '/locales')
+    i18n.load_path.append(os.getcwd() + '/.locales')
     app.run(port=8000, debug=glob.config.debug)  # blocking call
diff --git a/package.json b/package.json
new file mode 100644
index 00000000..22591833
--- /dev/null
+++ b/package.json
@@ -0,0 +1,29 @@
+{
+  "name": "guweb",
+  "version": "1.0.0",
+  "description": "Table of Contents ================== - [Table of Contents](#table-of-contents)   - [What is guweb?](#what-is-guweb)   - [Requirements](#requirements)   - [Setup](#setup)   - [Directory Structure](#directory-structure)   - [The team](#the-team)   - [The End](#the-end)",
+  "main": "",
+  "directories": {
+    "doc": "docs"
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "i18n:compile": "node utils/i18n/commands/compile.mjs",
+    "i18n:make-sure-you-understand-what-you-are-doing:migrate": "node utils/i18n/commands/migrate.mjs",
+    "i18n": "node utils/i18n/run"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ppy-sb/guweb.git"
+  },
+  "author": "",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/ppy-sb/guweb/issues"
+  },
+  "homepage": "https://github.com/ppy-sb/guweb#readme",
+  "dependencies": {
+    "glob": "^8.0.3",
+    "js-yaml": "^4.1.0"
+  }
+}
diff --git a/templates/base.html b/templates/base.html
index bab95059..8a5ec25a 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -50,7 +50,7 @@
   {% include 'components/footer.html' %}
 
   <!-- Main JS script -->
-  <script src="/static/js/main.js" crossorigin="anonymous"></script>
+  <script src="/static/js/main.js?v=<% serverStartTime %>" crossorigin="anonymous"></script>
 
   <!-- Customisation -->
   {% block bottom %}{% endblock %}
diff --git a/templates/home.html b/templates/home.html
index 9b3772fc..633ad0c3 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -15,16 +15,16 @@
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-          Warning
+          {{ t('home.warning') }}
           {% elif status=='success' %}
-          Notice
+          {{ t('home.notice') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          Uh oh! Be careful!
+          {{ t('home.error') }}
           {% elif status=='success' %}
-          Hey! Listen!
+          {{ t('home.success') }}
           {% endif %}
         </div>
       </div>
diff --git a/utils/i18n/adapt-to-i18n-editor.mjs b/utils/i18n/adapt-to-i18n-editor.mjs
new file mode 100644
index 00000000..db63588f
--- /dev/null
+++ b/utils/i18n/adapt-to-i18n-editor.mjs
@@ -0,0 +1,19 @@
+export function toI18nEditor(locales) {
+    const rtn = {}
+    for (const locale in locales) {
+        const namespaces = locales[locale]
+        for (const namespace in namespaces) {
+            const entries = namespaces[namespace]
+            const context = {
+                locale,
+                namespace,
+                extension: 'yml'
+            }
+        }
+    }
+    return rtn
+}
+
+export function fromI18nEditor(locales) {
+
+}
\ No newline at end of file
diff --git a/utils/i18n/commands/compile.mjs b/utils/i18n/commands/compile.mjs
new file mode 100644
index 00000000..d3e1a4e9
--- /dev/null
+++ b/utils/i18n/commands/compile.mjs
@@ -0,0 +1,5 @@
+
+import { readLocales } from '../reader.mjs'
+import { writeToDisk } from '../original-writer.mjs'
+
+readLocales().then(locales => writeToDisk(locales))
\ No newline at end of file
diff --git a/utils/i18n/commands/migrate.mjs b/utils/i18n/commands/migrate.mjs
new file mode 100644
index 00000000..4d239184
--- /dev/null
+++ b/utils/i18n/commands/migrate.mjs
@@ -0,0 +1,5 @@
+
+import { readLocales } from '../original-reader.mjs'
+import { writeToDisk } from '../writer.mjs'
+
+readLocales().then(locales => writeToDisk(locales))
\ No newline at end of file
diff --git a/utils/i18n/config.mjs b/utils/i18n/config.mjs
new file mode 100644
index 00000000..bd10a480
--- /dev/null
+++ b/utils/i18n/config.mjs
@@ -0,0 +1,25 @@
+import { join } from 'path'
+import { dirname } from 'path';
+import { fileURLToPath } from 'url';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+
+export const compiledFileNameSchema = ['namespace', 'locale', 'extension']
+export const compiledFileSchema = ['locale', 'entries']
+export const compiled = join(__dirname, '../../.locales')
+export const path = join(__dirname, '../../locales')
+export const divider = '.'
+
+export const contextToFileName = function generateFileName(context) {
+    return `${context.namespace}/${context.locale}.${context.extension || 'yml'}`
+}
+export const contextFromFileName = function generateContext(fileName) {
+    const split = fileName.split('/')
+    const namespace = split[0]
+    const [locale, extension] = split[1].split(divider)
+    return {
+        namespace,
+        locale: locale.replace('_', '-'),
+        extension
+    }
+}
\ No newline at end of file
diff --git a/utils/i18n/original-reader.mjs b/utils/i18n/original-reader.mjs
new file mode 100644
index 00000000..eb738805
--- /dev/null
+++ b/utils/i18n/original-reader.mjs
@@ -0,0 +1,91 @@
+import glob from 'glob'
+import path from 'path'
+import fs from 'fs'
+import yaml from 'js-yaml'
+
+import { compiledFileNameSchema, compiledFileSchema, compiled as translationPath, divider } from './config.mjs'
+
+const parseFileName = (file) => {
+    const fileName = path.relative(translationPath, file)
+    const parts = fileName.split(divider)
+    return compiledFileNameSchema.reduce((acc, part, index) => {
+        acc[part] = parts[index]
+        return acc
+    }, {})
+}
+
+const parseLocale = (file, context) => {
+    const locale = yaml.load(fs.readFileSync(file, 'utf8'))
+    const _parse = (locale) => {
+        const rtn = {
+            // [context.namespace]: {
+            //     [context.locale]: null,
+            // }
+            [context.locale]: {
+                [context.namespace]: null
+            }
+        }
+        let current = locale
+        let currentLocale = undefined
+        compiledFileSchema.forEach(part => {
+            switch (part) {
+                case 'locale': {
+                    currentLocale = context.locale
+                    current = current[currentLocale]
+                    break
+                }
+                case 'entries': {
+                    rtn[currentLocale][context.namespace] = current
+                    break
+                }
+                default: {
+                    throw new Error('unknown type of file')
+                }
+            }
+        })
+        return rtn
+    }
+    if (Array.isArray(locale)) {
+        const toMerge = locale.forEach(_parse)
+        let rtn = {}
+        for (const item of toMerge) {
+            rtn = {
+                ...rtn,
+                ...item
+            }
+        }
+    } else {
+        return _parse(locale)
+    }
+}
+/* ----------------------------------------------------------------
+** return format: {
+  [locale]: {
+      [namespace]: {
+          ...entries
+      }
+  }    
+}
+*/
+export const readLocales = () => new Promise((resolve, reject) => {
+    glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
+        if (err) throw err
+        const locales = await matches.reduce(async (acc, match) => {
+            try {
+                acc = await acc
+                const name = parseFileName(match)
+                const data = await parseLocale(match, name)
+                if (!acc[name.locale]) acc[name.locale] = {}
+                acc[name.locale] = {
+                    ...acc[name.locale],
+                    ...data[name.locale]
+                }
+                return acc
+            } catch (error) {
+                reject(error)
+            }
+        }, {})
+
+        resolve(locales)
+    })
+})
diff --git a/utils/i18n/original-writer.mjs b/utils/i18n/original-writer.mjs
new file mode 100644
index 00000000..dbf986c2
--- /dev/null
+++ b/utils/i18n/original-writer.mjs
@@ -0,0 +1,59 @@
+import { compiledFileNameSchema, compiledFileSchema, compiled as translationPath, divider } from './config.mjs'
+import yaml from 'js-yaml'
+import { join, dirname } from 'path'
+import fs from 'fs/promises'
+import { existsSync, mkdirSync } from 'fs'
+
+export function formatLocaleData(locale, context) {
+    const current = locale[context.locale][context.namespace]
+    // transform schema
+    let write = {}
+    const path = []
+    compiledFileSchema.forEach(k => {
+        switch (k) {
+            case 'locale': {
+                write = {
+                    [context.locale.replace('-','_')]: write
+                }
+                path.push(context.locale.replace('-','_'))
+                break
+            }
+            case 'entries': {
+                const readonly = [...path]
+                const last = readonly.pop()
+                const target = readonly.reduce((acc, cur) => {
+                    return acc[cur]
+                }, write)
+                target[last] = current
+            }
+        }
+    })
+
+    return yaml.dump(write)
+}
+
+export function generateFileName(context) {
+    return compiledFileNameSchema.map(k => context[k].replace('-','_')).join(divider)
+}
+
+export function writeToDisk(locales) {
+    for (const locale in locales) {
+        const namespaces = locales[locale]
+        for (const namespace in namespaces) {
+            const entries = namespaces[namespace]
+            const context = {
+                locale,
+                namespace,
+                extension: 'yml'
+            }
+            const fileName = generateFileName(context)
+            const yaml = formatLocaleData(locales, context)
+            const path = join(translationPath, fileName)
+            const dir = dirname(path)
+            if (!existsSync(path)) {
+                mkdirSync(dir, {recursive: true})
+            }
+            fs.writeFile(path, yaml, 'utf8')
+        }
+    }
+}
diff --git a/utils/i18n/reader.mjs b/utils/i18n/reader.mjs
new file mode 100644
index 00000000..9f9976b7
--- /dev/null
+++ b/utils/i18n/reader.mjs
@@ -0,0 +1,64 @@
+import glob from 'glob'
+import path from 'path'
+import fs from 'fs'
+import yaml from 'js-yaml'
+
+import { compiledFileSchema, path as translationPath, contextFromFileName } from './config.mjs'
+
+
+const parseLocale = (file, context) => {
+    const locale = yaml.load(fs.readFileSync(file, 'utf8'))
+    const _parse = (locale) => {
+        const rtn = {
+            [context.locale]: {
+                [context.namespace]: locale
+            }
+        }
+        return rtn
+    }
+    if (Array.isArray(locale)) {
+        const toMerge = locale.forEach(_parse)
+        let rtn = {}
+        for (const item of toMerge) {
+            rtn = {
+                ...rtn,
+                ...item
+            }
+        }
+    } else {
+        return _parse(locale)
+    }
+}
+/* ----------------------------------------------------------------
+** return format: {
+  [locale]: {
+      [namespace]: {
+          ...entries
+      }
+  }    
+}
+*/
+export const readLocales = () => new Promise((resolve, reject) => {
+    glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
+        if (err) throw err
+        const locales = await matches.reduce(async (acc, match) => {
+            try {
+                acc = await acc
+
+                const relative = path.relative(translationPath, match)
+                const context = contextFromFileName(relative)
+                const data = await parseLocale(match, context)
+                if (!acc[context.locale]) acc[context.locale] = {}
+                acc[context.locale] = {
+                    ...acc[context.locale],
+                    ...data[context.locale]
+                }
+                return acc
+            } catch (error) {
+                reject(error)
+            }
+        }, {})
+
+        resolve(locales)
+    })
+})
diff --git a/utils/i18n/run.mjs b/utils/i18n/run.mjs
new file mode 100644
index 00000000..447a2ca5
--- /dev/null
+++ b/utils/i18n/run.mjs
@@ -0,0 +1,2 @@
+import locale from './original-reader.mjs'
+
diff --git a/utils/i18n/writer.mjs b/utils/i18n/writer.mjs
new file mode 100644
index 00000000..c3a478d4
--- /dev/null
+++ b/utils/i18n/writer.mjs
@@ -0,0 +1,39 @@
+import {
+    compiledFileNameSchema,
+    compiledFileSchema,
+    path as translationPath,
+    divider,
+    contextToFileName
+} from './config.mjs'
+import yaml from 'js-yaml'
+import { join } from 'path'
+import fs from 'fs/promises'
+import _path from 'path'
+import { existsSync, mkdirSync } from 'fs'
+
+export function formatLocaleData(locale, context) {
+    const current = locale[context.locale][context.namespace]
+    return yaml.dump(current)
+}
+
+export function writeToDisk(locales) {
+    for (const locale in locales) {
+        const namespaces = locales[locale]
+        for (const namespace in namespaces) {
+            const entries = namespaces[namespace]
+            const context = {
+                locale,
+                namespace,
+                extension: 'yml'
+            }
+            const fileName = contextToFileName(context)
+            const yaml = formatLocaleData(locales, context)
+            const path = join(translationPath, fileName)
+            const dir = _path.dirname(path)
+            if (!existsSync(path)) {
+                mkdirSync(dir, {recursive: true})
+            }
+            fs.writeFile(path, yaml, 'utf8')
+        }
+    }
+}

From 636b1a475f01ef2d8df2e40b3f85c1d692127e20 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 5 Jun 2022 21:58:31 +0900
Subject: [PATCH 054/278] add vsode config

---
 .gitignore                             |  1 -
 .vscode/i18n-ally-custom-framework.yml | 28 ++++++++++++++++++++++++++
 .vscode/settings.json                  | 12 +++++++++++
 3 files changed, 40 insertions(+), 1 deletion(-)
 create mode 100644 .vscode/i18n-ally-custom-framework.yml
 create mode 100644 .vscode/settings.json

diff --git a/.gitignore b/.gitignore
index 91abb311..e457592f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -139,7 +139,6 @@ cython_debug/
 
 # Project specific
 config.py
-.vscode/
 .data/*
 !.data/backgrounds/.gitkeep
 !.data/banners/.gitkeep
diff --git a/.vscode/i18n-ally-custom-framework.yml b/.vscode/i18n-ally-custom-framework.yml
new file mode 100644
index 00000000..142de182
--- /dev/null
+++ b/.vscode/i18n-ally-custom-framework.yml
@@ -0,0 +1,28 @@
+# .vscode/i18n-ally-custom-framework.yml
+
+# An array of strings which contain Language Ids defined by VS Code
+# You can check avaliable language ids here: https://code.visualstudio.com/docs/languages/overview#_language-id
+languageIds:
+  - html
+  
+
+# An array of RegExes to find the key usage. **The key should be captured in the first match group**.
+# You should unescape RegEx strings in order to fit in the YAML file
+# To help with this, you can use https://www.freeformatter.com/json-escape.html
+usageMatchRegex:
+  # The following example shows how to detect `t("your.i18n.keys")`
+  # the `{key}` will be placed by a proper keypath matching regex,
+  # you can ignore it and use your own matching rules as well
+  - "[^\\w\\d]t\\(['\"`]({key})['\"`]"
+
+
+# An array of strings containing refactor templates.
+# The "$1" will be replaced by the keypath specified.
+# Optional: uncomment the following two lines to use
+
+refactorTemplates:
+ - t("$1")
+
+
+# If set to true, only enables this custom framework (will disable all built-in frameworks)
+monopoly: true
\ No newline at end of file
diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 00000000..3e258a8c
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,12 @@
+{
+    "nuxt.isNuxtApp": false,
+    "i18n-ally.namespace": true,
+    "i18n-ally.pathMatcher": "{namespace}/{locale}.{ext}",
+    "i18n-ally.localesPaths": "locales",
+    "i18n-ally.extract.keygenStyle": "kebab-case",
+    "i18n-ally.extract.keyMaxLength": 50,
+    "i18n-ally.extract.parsers.html": {
+        "attributes": ["text", "title", "alt", "placeholder", "label", "aria-label", "content", "empty-text", "prev-text", "next-text", "confirmText", "range-separator", "start-placeholder", "end-placeholder"]
+    },
+    "i18n-ally.extract.autoDetect": false,
+}
\ No newline at end of file

From 36c744841ca6e6d9906cff197f9cea8e6bbf4e84 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 5 Jun 2022 22:08:42 +0900
Subject: [PATCH 055/278] fix typo

---
 .locales/register.en_GB.yml |  1 +
 .vscode/settings.json       | 53 +++++++++++++++++++++++++++++--------
 locales/register/en-GB.yml  |  1 +
 templates/profile.html      |  2 +-
 4 files changed, 45 insertions(+), 12 deletions(-)

diff --git a/.locales/register.en_GB.yml b/.locales/register.en_GB.yml
index 4fad455f..51de046b 100644
--- a/.locales/register.en_GB.yml
+++ b/.locales/register.en_GB.yml
@@ -4,3 +4,4 @@ en_GB:
   email: Email
   password: Password
   already-have-an-account: Already have an account?
+  username: Username
diff --git a/.vscode/settings.json b/.vscode/settings.json
index 3e258a8c..2b00844e 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,12 +1,43 @@
 {
-    "nuxt.isNuxtApp": false,
-    "i18n-ally.namespace": true,
-    "i18n-ally.pathMatcher": "{namespace}/{locale}.{ext}",
-    "i18n-ally.localesPaths": "locales",
-    "i18n-ally.extract.keygenStyle": "kebab-case",
-    "i18n-ally.extract.keyMaxLength": 50,
-    "i18n-ally.extract.parsers.html": {
-        "attributes": ["text", "title", "alt", "placeholder", "label", "aria-label", "content", "empty-text", "prev-text", "next-text", "confirmText", "range-separator", "start-placeholder", "end-placeholder"]
-    },
-    "i18n-ally.extract.autoDetect": false,
-}
\ No newline at end of file
+  "nuxt.isNuxtApp": false,
+  "i18n-ally.namespace": true,
+  "i18n-ally.pathMatcher": "{namespace}/{locale}.{ext}",
+  "i18n-ally.localesPaths": "locales",
+  "i18n-ally.extract.keygenStyle": "kebab-case",
+  "i18n-ally.extract.keyMaxLength": 50,
+  "i18n-ally.extract.parsers.html": {
+    "attributes": [
+      "text",
+      "title",
+      "alt",
+      "placeholder",
+      "label",
+      "aria-label",
+      "content",
+      "empty-text",
+      "prev-text",
+      "next-text",
+      "confirmText",
+      "range-separator",
+      "start-placeholder",
+      "end-placeholder"
+    ],
+    "ignoredTags": ["script", "style"],
+    "vBind": true,
+    "inlineText": true
+  },
+  "i18n-ally.extract.autoDetect": true,
+  // Make sure that particular refactoring templates would be picked up be the bulk extraction depending on the context
+  "i18n-ally.refactor.templates": [
+    {
+      // affect scope (optional)
+      // see https://github.com/lokalise/i18n-ally/blob/master/src/core/types.ts#L156-L156
+      "source": "html-attribute",
+      "templates": ["i18n.t('{key}'{args})", "custom.t('{key}'{args})"],
+      // accept globs, resolved to project root (optional)
+      "include": ["templates/**/*.html"],
+    }
+    // ...
+  ],
+  "i18n-ally.keystyle": "nested"
+}
diff --git a/locales/register/en-GB.yml b/locales/register/en-GB.yml
index 8b9142d5..3aa8a758 100644
--- a/locales/register/en-GB.yml
+++ b/locales/register/en-GB.yml
@@ -3,3 +3,4 @@ register: register
 email: Email
 password: Password
 already-have-an-account: Already have an account?
+username: Username
diff --git a/templates/profile.html b/templates/profile.html
index a4e9cab9..c009b1dd 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -78,7 +78,7 @@ <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
 <div class="log-block" v-bind:class="{ 'load' : data.maps.{{ id }}.load }">
     <div class="header">
         <div class="title">
-            <i class="fas fa-address-book"></i> {{ t('profile.most-played-eatmaps') }}
+            <i class="fas fa-address-book"></i> {{ t('profile.most-played-beatmaps') }}
         </div>
     </div>
     <div v-if="data.maps.{{ id }}.out.length != 0" class="beatmaps">

From 77be3c5dd65cf92e360c4c08305a8b9ad0c5a612 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 5 Jun 2022 22:17:17 +0900
Subject: [PATCH 056/278] readme

---
 README.md    | 24 +++++++++++++++++++++++-
 package.json |  2 +-
 2 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 9242423c..a5b6adbd 100644
--- a/README.md
+++ b/README.md
@@ -1,9 +1,13 @@
 Table of Contents
 ==================
 - [Table of Contents](#table-of-contents)
-  - [What is guweb?](#what-is-guweb)
+  - [What is ppy-sb-guweb?](#what-is-ppy-sb-guweb)
   - [Requirements](#requirements)
   - [Setup](#setup)
+  - [Translation](#translation)
+    - [requirements](#requirements-1)
+    - [prepare](#prepare)
+    - [how to](#how-to)
   - [Directory Structure](#directory-structure)
   - [The team](#the-team)
   - [The End](#the-end)
@@ -67,6 +71,23 @@ python3.9 main.py # Run directly to access debug features for development!
 hypercorn main.py # Please run guweb with hypercorn when in production! It will improve performance drastically by disabling all of the debug features a developer would need!
 ```
 
+Translation
+------
+
+### requirements
+- VSCode (recommend)
+- VSCode plugin: i18n-ally (recommend)
+- Node
+  
+### prepare
+`npm install -D`
+
+### how to
+- open any html files with i18n-ally plugin enabled.
+- translate keys
+- run `npm run i18n:compile` to generate files for python-i18n
+
+
 Directory Structure
 ------
 
@@ -76,6 +97,7 @@ Directory Structure
     ├── ext          # External files from guweb's primary operation.
     ├── objects      # Code for representing privileges, global objects, and more.
     ├── static       # Code or content that is not modified or processed by guweb itself.
+    ├── locales      # translations
     ├── templates    # HTML that contains content that is rendered after the page has loaded.
         ├── admin    # Templated content for the admin panel (/admin).
         ├── settings # Templated content for settings (/settings).
diff --git a/package.json b/package.json
index 22591833..c2a4b167 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,7 @@
     "url": "https://github.com/ppy-sb/guweb/issues"
   },
   "homepage": "https://github.com/ppy-sb/guweb#readme",
-  "dependencies": {
+  "devDependencies": {
     "glob": "^8.0.3",
     "js-yaml": "^4.1.0"
   }

From 715ba6e201c5b57dd3fb68816ddd6d0aa099f238 Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Sun, 5 Jun 2022 17:25:39 +0800
Subject: [PATCH 057/278] fix structure

add settings localization key
change some key to global key,
and add main page title to global key
---
 locales/settings.eu_GB.yml       | 20 ++++++++++++++++++++
 locales/settings.eu_US.yml       | 20 ++++++++++++++++++++
 locales/settings.zh_CN.yml       | 20 ++++++++++++++++++++
 templates/leaderboard.html       |  2 +-
 templates/login.html             |  2 +-
 templates/profile.html           |  2 +-
 templates/register.html          |  2 +-
 templates/settings/avatar.html   | 24 +++++++++++-------------
 templates/settings/custom.html   | 26 +++++++++++++-------------
 templates/settings/password.html | 18 +++++++++---------
 templates/settings/profile.html  | 18 +++++++++---------
 templates/settings/sidebar.html  | 10 +++++-----
 templates/verify.html            |  2 +-
 13 files changed, 112 insertions(+), 54 deletions(-)
 create mode 100644 locales/settings.eu_GB.yml
 create mode 100644 locales/settings.eu_US.yml
 create mode 100644 locales/settings.zh_CN.yml

diff --git a/locales/settings.eu_GB.yml b/locales/settings.eu_GB.yml
new file mode 100644
index 00000000..a06671e5
--- /dev/null
+++ b/locales/settings.eu_GB.yml
@@ -0,0 +1,20 @@
+eu_GB:
+  settings: Settings
+  preview: Preview
+  save: Save
+  choose-file: Choose file
+  avatar-description: We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG, JPG under 5MB
+  avatar: Avatar
+  customisation: Customisation
+  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
+  profile-background: Profile Background
+  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+  password: Password
+  password-change: Password Change
+  old-password: Old Password
+  new-password: New Password
+  repeat-password: Repeat Password
+  profile: Profile
+  user-information: User Information
+  username: Username
+  email: Email
\ No newline at end of file
diff --git a/locales/settings.eu_US.yml b/locales/settings.eu_US.yml
new file mode 100644
index 00000000..68a1d6de
--- /dev/null
+++ b/locales/settings.eu_US.yml
@@ -0,0 +1,20 @@
+en_US:
+  settings: Settings
+  preview: Preview
+  save: Save
+  choose-file: Choose file
+  avatar-description: We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG, JPG under 5MB
+  avatar: Avatar
+  customisation: Customisation
+  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
+  profile-background: Profile Background
+  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+  password: Password
+  password-change: Password Change
+  old-password: Old Password
+  new-password: New Password
+  repeat-password: Repeat Password
+  profile: Profile
+  user-information: User Information
+  username: Username
+  email: Email
\ No newline at end of file
diff --git a/locales/settings.zh_CN.yml b/locales/settings.zh_CN.yml
new file mode 100644
index 00000000..1e63f7cc
--- /dev/null
+++ b/locales/settings.zh_CN.yml
@@ -0,0 +1,20 @@
+zh_CN:
+  settings: Settings
+  preview: Preview
+  save: Save
+  choose-file: Choose file
+  avatar-description: We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG, JPG under 5MB
+  avatar: Avatar
+  customisation: Customisation
+  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
+  profile-background: Profile Background
+  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+  password: Password
+  password-change: Password Change
+  old-password: Old Password
+  new-password: New Password
+  repeat-password: Repeat Password
+  profile: Profile
+  user-information: User Information
+  username: Username
+  email: Email
\ No newline at end of file
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index f66ee361..9071c8ea 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} Leaderboard {% endblock %}
+{% block title %} {{ t('global.leaderboard') }} {% endblock %}
 
 {% block header %}
 <script src="/static/js/asserts/vue.js"></script>
diff --git a/templates/login.html b/templates/login.html
index 70027576..5fccf233 100644
--- a/templates/login.html
+++ b/templates/login.html
@@ -1,5 +1,5 @@
 {% extends "base.html" %}
-{% block title %} Login {% endblock %}
+{% block title %} {{ t('global.login') }} {% endblock %}
 
 {% block header %}
 <link rel="stylesheet" href="/static/css/pages/auth.css">
diff --git a/templates/profile.html b/templates/profile.html
index c009b1dd..623d0a1c 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} Profile {% endblock %}
+{% block title %} {{ t('global.profile') }} {% endblock %}
 
 {% macro scores(title, id) %}
 <div class="log-block" v-bind:class="{ 'load' : data.scores.{{ id }}.load }">
diff --git a/templates/register.html b/templates/register.html
index ff46f9e8..e97becc9 100644
--- a/templates/register.html
+++ b/templates/register.html
@@ -1,5 +1,5 @@
 {% extends "base.html" %}
-{% block title %} Register {% endblock %}
+{% block title %} {{ t('global.register') }} {% endblock %}
 
 {% block header %}
 <link rel="stylesheet" href="/static/css/pages/auth.css">
diff --git a/templates/settings/avatar.html b/templates/settings/avatar.html
index d832b39b..3658b298 100644
--- a/templates/settings/avatar.html
+++ b/templates/settings/avatar.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} Avatar {% endblock %}
+{% block title %} {{ t('settings.avatar') }} {% endblock %}
 
 {% block content %}
 <link rel="stylesheet" href="/static/css/pages/settings/style.css">
@@ -9,23 +9,21 @@
   <div class="block-content right" id="settings-content">
     <div class="single-right-block">
       <div class="right-block-header">
-        Avatar
+          {{ t('setting.avatar') }}
       </div>
       <div class="right-block-content">
         <div class="flex avatar-flex">
           <div class="column">
             <div class="single-block-content avatar-block-content">
-              <h4 class="mb-4">Avatar</h4>
-              <div class="subtitle">We recommend an image of at least 512x512 (or 1:1 ratio).
-                You can upload a PNG, JPG under 5MB
-              </div>
+              <h4 class="mb-4">{{ t('settings.avatar') }}</h4>
+              <div class="subtitle">{{ t('settings.avatar-description') }}</div>
               <form id="upload-profile" action="/settings/avatar" method="post" enctype="multipart/form-data">
                 <div class="buttons margin-top" id="selection">
                   <label class="file-label">
                     <input class="file-input" id="file" type="file" accept="image/jpeg" name="avatar">
                     <span class="file-cta">
                       <span class="file-label">
-                        Choose file
+                        {{ t('settings.choose-file')}}
                       </span>
                       <span class="file-icon">
                         <i class="fa fa-upload"></i>
@@ -33,14 +31,14 @@ <h4 class="mb-4">Avatar</h4>
                     </span>
                   </label>
                   <button class="button is-primary" type="submit">
-                    <span class="icon is-small"><i class="fas fa-check"></i></span><span>Save</span>
+                    <span class="icon is-small"><i class="fas fa-check"></i></span><span>{{ t('settings.save') }}</span>
                   </button>
                 </div>
               </form>
             </div>
           </div>
           <div class="column">
-            <h4 class="mb-4">Preview</h4>
+            <h4 class="mb-4">{{ t('settings.preview') }}</h4>
             <div class="preview-block" id="avatar">
               <div class="top-block"></div>
               <div class="bottom-block">
@@ -79,16 +77,16 @@ <h4 class="mb-4">Preview</h4>
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-          Warning
+            {{ t('global.warning') }}
           {% elif status=='success' %}
-          Notice
+            {{ t('global.notice') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          Uh oh! Be careful!
+            {{ t('global.uh-oh-be-careful')}}
           {% elif status=='success' %}
-          Hey! Listen!
+            {{ t('global.hey-listen')}}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/custom.html b/templates/settings/custom.html
index 48defe52..fd5eaba7 100644
--- a/templates/settings/custom.html
+++ b/templates/settings/custom.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} Avatar {% endblock %}
+{% block title %} {{ t('settings.avatar') }} {% endblock %}
 
 {% block content %}
 <link rel="stylesheet" href="/static/css/pages/settings/style.css">
@@ -9,21 +9,21 @@
   <div class="block-content right" id="settings-content">
     <div class="single-right-block">
       <div class="right-block-header">
-        Customisation
+          {{ t('settings.customisation') }}
       </div>
       <div class="right-block-content">
         <div class="flex avatar-flex">
           <div class="column">
             <form id="upload-profile" action="/settings/custom" method="post" enctype="multipart/form-data">
               <div class="single-block-content avatar-block-content mb-6">
-                <h4 class="mb-4">Banner</h4>
-                <div class="subtitle">Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG</div>
+                <h4 class="mb-4">{{ t('settings.banner') }}</h4>
+                <div class="subtitle">{{ t('settings.banner-description') }}</div>
                 <div class="buttons margin-top" id="selection">
                   <label class="file-label">
                     <input class="file-input" id="file-bn" type="file" name="banner">
                     <span class="file-cta">
                       <span class="file-label">
-                        Choose file
+                        {{ t('settings.choose-file')}}
                       </span>
                       <span class="file-icon">
                         <i class="fa fa-upload"></i>
@@ -33,16 +33,16 @@ <h4 class="mb-4">Banner</h4>
                 </div>
               </div>
               <div class="single-block-content avatar-block-content">
-                <h4 class="mb-4">Profile Background</h4>
+                <h4 class="mb-4">{{ t('settings.profile-background')}}</h4>
                 <div class="subtitle">
-                  Recommend with 16:9 ratio with PNG, JPG, JPEG
+                    {{ t('profile-background-description')}}
                 </div>
                 <div class="buttons margin-top" id="selection">
                   <label class="file-label">
                     <input class="file-input" id="file-bg" type="file" name="background">
                     <span class="file-cta">
                       <span class="file-label">
-                        Choose file
+                        {{ t('settings.choose-file')}}
                       </span>
                       <span class="file-icon">
                         <i class="fa fa-upload"></i>
@@ -57,7 +57,7 @@ <h4 class="mb-4">Profile Background</h4>
             </form>
           </div>
           <div class="column">
-            <h4 class="mb-4">Preview</h4>
+            <h4 class="mb-4">{{ t('settings.preview') }}</h4>
             <div class="preview-block" id="avatar">
               <div class="top-block" {% if customizations['banner'] == True %}style="background: linear-gradient(hsl(var(--main), 25%, 25%, 20%), hsl(var(--main), 25%, 25%, 60%)), url(/profbanner/{{ session['user_data']['id'] }}); background-size: cover"{% endif %}></div>
               <div class="bottom-block">
@@ -109,16 +109,16 @@ <h4 class="mb-4">Preview</h4>
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-          Warning
+            {{ t('global.warning') }}
           {% elif status=='success' %}
-          Notice
+            {{ t('global.notice') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          Uh oh! Be careful!
+          {{ t('global.uh-oh-be-careful') }}
           {% elif status=='success' %}
-          Hey! Listen!
+          {{ t('global.hey-listen')}}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/password.html b/templates/settings/password.html
index b795372d..3729d37c 100644
--- a/templates/settings/password.html
+++ b/templates/settings/password.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} Password {% endblock %}
+{% block title %} {{ t('settings.password') }} {% endblock %}
 
 {% block content %}
 <link rel="stylesheet" href="/static/css/pages/settings/style.css">
@@ -9,13 +9,13 @@
   <div class="block-content right" id="settings-content">
     <div id="general" class="single-right-block">
       <div class="right-block-header">
-        Password Change
+          {{ t('settings.password-change')}}
       </div>
       <form action="/settings/password" method="post" class="right-block-content">
         <div class="single-block-content">
           <div class="block-content--left">
             <div class="field-label is-normal">
-              <label class="label">Old Password</label>
+              <label class="label">{{ t('settings.old-password')}}</label>
             </div>
           </div>
           <div class="block-content--right">
@@ -31,7 +31,7 @@
         <div class="single-block-content">
             <div class="block-content--left">
               <div class="field-label is-normal">
-                <label class="label">New Password</label>
+                <label class="label">{{ t('settings.new-password')}}</label>
               </div>
             </div>
             <div class="block-content--right">
@@ -47,7 +47,7 @@
           <div class="single-block-content">
             <div class="block-content--left">
               <div class="field-label is-normal">
-                <label class="label">Repeat Password</label>
+                <label class="label">{{ t('settings.repeat-password')}}</label>
               </div>
             </div>
             <div class="block-content--right">
@@ -74,16 +74,16 @@
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-          Warning
+            {{ t('global.warning') }}
           {% elif status=='success' %}
-          Notice
+            {{ t('global.notice') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          Uh oh! Be careful!
+          {{ t('global.uh-oh-be-careful') }}
           {% elif status=='success' %}
-          Hey! Listen!
+            {{ t('global.hey-listen')}}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/profile.html b/templates/settings/profile.html
index 14a59ac3..8bd706ee 100644
--- a/templates/settings/profile.html
+++ b/templates/settings/profile.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} Profile {% endblock %}
+{% block title %} {{ t('settings.profile') }} {% endblock %}
 
 {% block content %}
 <link rel="stylesheet" href="/static/css/pages/settings/style.css">
@@ -9,13 +9,13 @@
   <div class="block-content right">
     <div id="general" class="single-right-block">
       <div class="right-block-header">
-        User Infomation
+          {{ t('settings.user-information')}}
       </div>
       <form action="/settings/profile" method="post" class="setting-block-content">
         <div class="single-block-content">
           <div class="block-content--left">
             <div class="field-label is-normal">
-              <label class="label">Username</label>
+              <label class="label">{{ t('settings.username') }}</label>
             </div>
           </div>
           <div class="block-content--right">
@@ -32,7 +32,7 @@
         <div class="single-block-content">
           <div class="block-content--left">
             <div class="field-label is-normal">
-              <label class="label">Email</label>
+              <label class="label">{{ t('login.email') }}</label>
             </div>
           </div>
           <div class="block-content--right">
@@ -63,7 +63,7 @@
           </div>
         </div>
         -->
-        <button class='button is-primary' type='submit'><span>Save</span><span class='icon is-small'><i class='fas fa-check'></i></span></button>
+        <button class='button is-primary' type='submit'><span>{{ t('settings.save') }}</span><span class='icon is-small'><i class='fas fa-check'></i></span></button>
       </form>
     </div>
   </div>
@@ -77,16 +77,16 @@
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-          Warning
+            {{ t('global.warning') }}
           {% elif status=='success' %}
-          Notice
+            {{ t('global.notice') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          Uh oh! Be careful!
+          {{ t('global.uh-oh-be-careful') }}
           {% elif status=='success' %}
-          Hey! Listen!
+            {{ t('global.hey-listen')}}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/sidebar.html b/templates/settings/sidebar.html
index 460a09f6..cfa0809b 100644
--- a/templates/settings/sidebar.html
+++ b/templates/settings/sidebar.html
@@ -4,21 +4,21 @@
             style="background-image: url(https://a.{{ domain() }}/{{ session.user_data['id']}});"></a>
         <div class="welcome-text">
             <span class="username pink-bold">{{ session.user_data['name']}}</span>
-            <span class="welcome">Settings</span>
+            <span class="welcome">{{ ('settings.settings') }}</span>
         </div>
     </div>
     <div class="left-selector">
         <a class="single-menu single-menu--active router-link" href="/settings/profile">
-            <i class="fas fa-user"></i><span class="single-menu--text"> Profile </span>
+            <i class="fas fa-user"></i><span class="single-menu--text"> {{ t('settings.profile') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/avatar">
-            <i class="fas fa-brush"></i><span class="single-menu--text"> Avatar </span>
+            <i class="fas fa-brush"></i><span class="single-menu--text"> {{ t('settings.avatar') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/password">
-            <i class="fas fa-lock"></i><span class="single-menu--text"> Password </span>
+            <i class="fas fa-lock"></i><span class="single-menu--text"> {{ t('settings.password') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/custom">
-            <i class="fas fa-air-freshener"></i><span class="single-menu--text"> Customisation </span>
+            <i class="fas fa-air-freshener"></i><span class="single-menu--text"> {{ t('settings.customisation') }} </span>
         </a>
     </div>
 </div>
diff --git a/templates/verify.html b/templates/verify.html
index afcb3a89..ae8994cb 100644
--- a/templates/verify.html
+++ b/templates/verify.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} Verify {% endblock %}
+{% block title %} {{ t('global.verify') }} {% endblock %}
 
 {% block header %}
 <link rel="stylesheet" href="/static/css/pages/verify.css">

From 554c8ddd17e4a95c61f7e64961921043607158d5 Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Sun, 5 Jun 2022 21:12:47 +0800
Subject: [PATCH 058/278] change structure

---
 locales/settings.eu_GB.yml | 20 --------------------
 locales/settings.eu_US.yml | 20 --------------------
 locales/settings.zh_CN.yml | 20 --------------------
 3 files changed, 60 deletions(-)
 delete mode 100644 locales/settings.eu_GB.yml
 delete mode 100644 locales/settings.eu_US.yml
 delete mode 100644 locales/settings.zh_CN.yml

diff --git a/locales/settings.eu_GB.yml b/locales/settings.eu_GB.yml
deleted file mode 100644
index a06671e5..00000000
--- a/locales/settings.eu_GB.yml
+++ /dev/null
@@ -1,20 +0,0 @@
-eu_GB:
-  settings: Settings
-  preview: Preview
-  save: Save
-  choose-file: Choose file
-  avatar-description: We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG, JPG under 5MB
-  avatar: Avatar
-  customisation: Customisation
-  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
-  profile-background: Profile Background
-  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password: Password
-  password-change: Password Change
-  old-password: Old Password
-  new-password: New Password
-  repeat-password: Repeat Password
-  profile: Profile
-  user-information: User Information
-  username: Username
-  email: Email
\ No newline at end of file
diff --git a/locales/settings.eu_US.yml b/locales/settings.eu_US.yml
deleted file mode 100644
index 68a1d6de..00000000
--- a/locales/settings.eu_US.yml
+++ /dev/null
@@ -1,20 +0,0 @@
-en_US:
-  settings: Settings
-  preview: Preview
-  save: Save
-  choose-file: Choose file
-  avatar-description: We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG, JPG under 5MB
-  avatar: Avatar
-  customisation: Customisation
-  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
-  profile-background: Profile Background
-  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password: Password
-  password-change: Password Change
-  old-password: Old Password
-  new-password: New Password
-  repeat-password: Repeat Password
-  profile: Profile
-  user-information: User Information
-  username: Username
-  email: Email
\ No newline at end of file
diff --git a/locales/settings.zh_CN.yml b/locales/settings.zh_CN.yml
deleted file mode 100644
index 1e63f7cc..00000000
--- a/locales/settings.zh_CN.yml
+++ /dev/null
@@ -1,20 +0,0 @@
-zh_CN:
-  settings: Settings
-  preview: Preview
-  save: Save
-  choose-file: Choose file
-  avatar-description: We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG, JPG under 5MB
-  avatar: Avatar
-  customisation: Customisation
-  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
-  profile-background: Profile Background
-  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password: Password
-  password-change: Password Change
-  old-password: Old Password
-  new-password: New Password
-  repeat-password: Repeat Password
-  profile: Profile
-  user-information: User Information
-  username: Username
-  email: Email
\ No newline at end of file

From ef0ad0d99916173f7c80c151a43533ea98c129af Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Sun, 5 Jun 2022 22:43:24 +0800
Subject: [PATCH 059/278] completed structure

Add localization key to settings page
---
 locales/global/en-GB.yml       |  9 +++++++++
 locales/global/en-US.yml       |  9 +++++++++
 locales/global/zh-CN.yml       |  9 +++++++++
 locales/home/en-US.yml         |  4 ++++
 locales/home/zh-CN.yml         |  4 ++++
 locales/login/en-GB.yml        |  1 +
 locales/login/en-US.yml        |  1 +
 locales/login/zh-CN.yml        |  1 +
 locales/register/en-US.yml     |  1 +
 locales/register/zh-CN.yml     |  1 +
 locales/settings/en_GB.yml     | 21 +++++++++++++++++++++
 locales/settings/en_US.yml     | 20 ++++++++++++++++++++
 locales/settings/zh_CN.yml     | 20 ++++++++++++++++++++
 templates/settings/avatar.html |  2 +-
 templates/settings/custom.html |  2 +-
 15 files changed, 103 insertions(+), 2 deletions(-)
 create mode 100644 locales/settings/en_GB.yml
 create mode 100644 locales/settings/en_US.yml
 create mode 100644 locales/settings/zh_CN.yml

diff --git a/locales/global/en-GB.yml b/locales/global/en-GB.yml
index c9fcc76f..be6998b6 100644
--- a/locales/global/en-GB.yml
+++ b/locales/global/en-GB.yml
@@ -2,3 +2,12 @@ sign-up: Sign up
 log-in: Log in
 offline: Offline
 online: Online
+leaderboard: Leaderboard
+login: Login
+profile: Profile
+register: Register
+warning: Warning
+notice: Notice
+uh-oh-be-careful: uh oh! Be careful!
+hey-listen: Hey! Listen!
+verify: Verify
diff --git a/locales/global/en-US.yml b/locales/global/en-US.yml
index c9fcc76f..94b343de 100644
--- a/locales/global/en-US.yml
+++ b/locales/global/en-US.yml
@@ -2,3 +2,12 @@ sign-up: Sign up
 log-in: Log in
 offline: Offline
 online: Online
+leaderboard: Leaderboard
+login: Login
+profile: Profile
+register: Register
+notice: Notice
+warning: Warning
+uh-oh-be-careful: uh oh! Be careful!
+hey-listen: Hey! Listen!
+verify: Verify
diff --git a/locales/global/zh-CN.yml b/locales/global/zh-CN.yml
index 7acda31c..5d8482c0 100644
--- a/locales/global/zh-CN.yml
+++ b/locales/global/zh-CN.yml
@@ -2,3 +2,12 @@ sign-up: 注册
 log-in: 登录
 offline: 离线
 online: 在线
+leaderboard: Leaderboard
+login: Login
+profile: Profile
+register: Register
+notice: Notice
+warning: Warning
+uh-oh-be-careful: uh oh! Be careful!
+hey-listen: Hey! Listen!
+verify: Verify
diff --git a/locales/home/en-US.yml b/locales/home/en-US.yml
index 9d602024..94410f05 100644
--- a/locales/home/en-US.yml
+++ b/locales/home/en-US.yml
@@ -25,3 +25,7 @@ subtitle: >-
   servers if you play here with us! And don't worry, as you can always switch
   between the official servers and us at any time!
 sign-up-for-free: Sign up for free
+error: Uh oh! Be careful!
+success: Hey! Listen!
+notice: Notice
+warning: Warning
diff --git a/locales/home/zh-CN.yml b/locales/home/zh-CN.yml
index 7c7ce3bf..0962131e 100644
--- a/locales/home/zh-CN.yml
+++ b/locales/home/zh-CN.yml
@@ -20,3 +20,7 @@ subtitle: >-
   赶紧加入到 %{appName} 当中吧! 没有风险!
   并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
 sign-up-for-free: 免 费 注 册！
+error: Uh oh! Be careful!
+success: Hey! Listen!
+notice: Notice
+warning: Warning
diff --git a/locales/login/en-GB.yml b/locales/login/en-GB.yml
index 3f512d58..7ea8f054 100644
--- a/locales/login/en-GB.yml
+++ b/locales/login/en-GB.yml
@@ -3,3 +3,4 @@ register: Register
 forgot-login: Forgot login?
 username: Username
 password: Password
+email: Email
diff --git a/locales/login/en-US.yml b/locales/login/en-US.yml
index 3f512d58..7ea8f054 100644
--- a/locales/login/en-US.yml
+++ b/locales/login/en-US.yml
@@ -3,3 +3,4 @@ register: Register
 forgot-login: Forgot login?
 username: Username
 password: Password
+email: Email
diff --git a/locales/login/zh-CN.yml b/locales/login/zh-CN.yml
index 6c935624..f2dfd434 100644
--- a/locales/login/zh-CN.yml
+++ b/locales/login/zh-CN.yml
@@ -3,3 +3,4 @@ register: 注册
 forgot-login: 忘记账号?
 username: 你的用户名
 password: 你的密码
+email: Email
diff --git a/locales/register/en-US.yml b/locales/register/en-US.yml
index 8b9142d5..3aa8a758 100644
--- a/locales/register/en-US.yml
+++ b/locales/register/en-US.yml
@@ -3,3 +3,4 @@ register: register
 email: Email
 password: Password
 already-have-an-account: Already have an account?
+username: Username
diff --git a/locales/register/zh-CN.yml b/locales/register/zh-CN.yml
index 84323f13..647aa7a9 100644
--- a/locales/register/zh-CN.yml
+++ b/locales/register/zh-CN.yml
@@ -3,3 +3,4 @@ register: 注册账号
 email: 电子邮箱
 password: 密码
 already-have-an-account: 已经拥有账号了?
+username: Username
diff --git a/locales/settings/en_GB.yml b/locales/settings/en_GB.yml
new file mode 100644
index 00000000..fc6b20f9
--- /dev/null
+++ b/locales/settings/en_GB.yml
@@ -0,0 +1,21 @@
+avatar: Avatar
+avatar-description: >-
+  We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG,
+  JPG under 5MB
+choose-file: Choose file
+save: Save
+preview: Preview
+customisation: Customisation
+banner: Banner
+banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
+profile-background: Profile Background
+profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+password: Password
+password-change: Password Change
+old-password: Old Password
+new-password: New Password
+repeat-password: Repeat Password
+profile: Profile
+user-information: User Infomation
+username: Username
+
diff --git a/locales/settings/en_US.yml b/locales/settings/en_US.yml
new file mode 100644
index 00000000..4e44f0f4
--- /dev/null
+++ b/locales/settings/en_US.yml
@@ -0,0 +1,20 @@
+avatar: Avatar
+avatar-description: >-
+  We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG,
+  JPG under 5MB
+choose-file: Choose file
+save: Save
+preview: Preview
+customisation: Customisation
+banner: Banner
+banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
+profile-background: Profile Background
+profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+password: Password
+password-change: Password Change
+old-password: Old Password
+new-password: New Password
+repeat-password: Repeat Password
+profile: Profile
+user-information: User Infomation
+username: Username
diff --git a/locales/settings/zh_CN.yml b/locales/settings/zh_CN.yml
new file mode 100644
index 00000000..4e44f0f4
--- /dev/null
+++ b/locales/settings/zh_CN.yml
@@ -0,0 +1,20 @@
+avatar: Avatar
+avatar-description: >-
+  We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG,
+  JPG under 5MB
+choose-file: Choose file
+save: Save
+preview: Preview
+customisation: Customisation
+banner: Banner
+banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
+profile-background: Profile Background
+profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+password: Password
+password-change: Password Change
+old-password: Old Password
+new-password: New Password
+repeat-password: Repeat Password
+profile: Profile
+user-information: User Infomation
+username: Username
diff --git a/templates/settings/avatar.html b/templates/settings/avatar.html
index 3658b298..476a7c3a 100644
--- a/templates/settings/avatar.html
+++ b/templates/settings/avatar.html
@@ -9,7 +9,7 @@
   <div class="block-content right" id="settings-content">
     <div class="single-right-block">
       <div class="right-block-header">
-          {{ t('setting.avatar') }}
+          {{ t('settings.avatar') }}
       </div>
       <div class="right-block-content">
         <div class="flex avatar-flex">
diff --git a/templates/settings/custom.html b/templates/settings/custom.html
index fd5eaba7..4911f5a4 100644
--- a/templates/settings/custom.html
+++ b/templates/settings/custom.html
@@ -35,7 +35,7 @@ <h4 class="mb-4">{{ t('settings.banner') }}</h4>
               <div class="single-block-content avatar-block-content">
                 <h4 class="mb-4">{{ t('settings.profile-background')}}</h4>
                 <div class="subtitle">
-                    {{ t('profile-background-description')}}
+                    {{ t('settings.profile-background-description')}}
                 </div>
                 <div class="buttons margin-top" id="selection">
                   <label class="file-label">

From 01a2691980cb60b642aa002f11d146a94dc5156d Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Mon, 6 Jun 2022 08:19:01 +0800
Subject: [PATCH 060/278] no redirect

---
 blueprints/frontend.py | 24 ------------------------
 1 file changed, 24 deletions(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 898d46f3..8eba328a 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -569,30 +569,6 @@ async def logout():
     # render login
     return await flash('success', 'Successfully logged out!', 'login')
 
-# social media redirections
-
-@frontend.route('/github')
-@frontend.route('/gh')
-async def github_redirect():
-    return redirect(glob.config.github)
-
-@frontend.route('/discord')
-async def discord_redirect():
-    return redirect(glob.config.discord_server)
-
-@frontend.route('/youtube')
-@frontend.route('/yt')
-async def youtube_redirect():
-    return redirect(glob.config.youtube)
-
-@frontend.route('/twitter')
-async def twitter_redirect():
-    return redirect(glob.config.twitter)
-
-@frontend.route('/instagram')
-@frontend.route('/ig')
-async def instagram_redirect():
-    return redirect(glob.config.instagram)
 
 # profile customisation
 BANNERS_PATH = Path.cwd() / '.data/banners'

From 6a0f5cbadc85500b3ee9eb9b1986072b3a0b0b61 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Tue, 7 Jun 2022 14:58:01 +0800
Subject: [PATCH 061/278] some changes

---
 locales/home/zh-CN.yml           |   4 +-
 static/css/pages/home.css        |  17 +++--
 static/css/style.css             | 114 ++++++++++++++++++++++++++++---
 templates/admin/base.html        |   4 +-
 templates/base.html              |   9 +--
 templates/components/navbar.html |   8 +--
 templates/home.html              |  13 ++--
 7 files changed, 136 insertions(+), 33 deletions(-)

diff --git a/locales/home/zh-CN.yml b/locales/home/zh-CN.yml
index 0962131e..45a9b08f 100644
--- a/locales/home/zh-CN.yml
+++ b/locales/home/zh-CN.yml
@@ -1,6 +1,6 @@
 subtitle-big: >-
-  我们是一个从头搭建的 osu! 私人服务器,具有许多你曾未见识到的独特功能。--想了解更多信息,可以查看我们在Github 上的 gulag 和 guweb
-  项目 -- 我们完全开源
+  欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务.
+  详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
 some-of-our-coolest-features: 我们觉得最酷的一些功能
 features-title-1: 对Relax 和 Autopilot mod的PP计算
 features-content-1: >-
diff --git a/static/css/pages/home.css b/static/css/pages/home.css
index 51307169..19a0de62 100644
--- a/static/css/pages/home.css
+++ b/static/css/pages/home.css
@@ -1,13 +1,13 @@
 /* gulag mascot/avatar */
 
 .gulag-avatar {
-  background-image: url("/static/images/pippi.png");
+  background-image: url("/static/images/gulag.png");
   background-repeat: no-repeat;
   /*     available avatar widths & heights      */
   /* gulag.png:   width: 512px; height: 363px;  */
   /* pippi.png:   width: 372px; height: 432px;  */
-  width: 365px;
-  height: 579px;
+  width: 363px;
+  height: 512px;
   left: 50px;
   margin: 0;
   padding: 0;
@@ -24,7 +24,8 @@
   max-width: inherit;
 }
 
-#title, #mascot {
+#title,
+#mascot {
   animation: appear 0.4s ease;
 }
 
@@ -33,6 +34,7 @@
     -webkit-transform: translateY(-50px);
     opacity: 0;
   }
+
   100% {
     -webkit-transform: translateY(0);
     opacity: 1;
@@ -43,19 +45,24 @@
   .gulag-avatar {
     display: none;
   }
+
   #home-hero .columns.flex-vcenter {
     padding: 0 20px;
   }
+
   .main-block {
     width: initial;
     height: 285px;
   }
+
   #mascot {
     display: none !important;
   }
+
   .my-con {
     margin: 60px 0 0 0;
   }
+
   #home-hero {
     height: 300px;
   }
@@ -67,4 +74,4 @@
 
 .footer {
   margin: 0;
-}
+}
\ No newline at end of file
diff --git a/static/css/style.css b/static/css/style.css
index dd025aaf..1150943c 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -5,6 +5,95 @@
   src: url(/static/fonts/extra.ttf) format("truetype")
 }
 
+body * {
+  font-family: Quicksand, Noto Sans SC, -apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Helvetica, Arial, PingFang SC, Hiragino Sans GB, Microsoft YaHei, SimSun, sans-serif
+}
+
+body {
+  color: #fff;
+  box-sizing: border-box;
+  accent-color: #fff;
+  scroll-behavior: smooth;
+  color: #fff;
+  padding: 0;
+  margin: 0
+}
+
+#head {
+  height: 100vh;
+  text-align: center;
+  display: flex;
+  flex-direction: column;
+  flex-wrap: nowrap;
+  align-items: center;
+  justify-content: center
+}
+
+#title {
+  font-size: 6.5rem
+}
+
+#subtitle {
+  font-size: 2rem;
+  margin-bottom: 2rem
+}
+
+#head a {
+  background: #ff66ab;
+  font-size: 2rem;
+  color: #fff;
+  border: none;
+  border-radius: 6px;
+  padding: .5rem 2rem;
+  transition: all .2s ease;
+  text-decoration: none;
+  user-select: none
+}
+
+#head a:hover {
+  transform: scale(1.1)
+}
+
+#head a:active {
+  transform: scale(1)
+}
+
+*::selection {
+  background: #ff66ab33
+}
+
+.github-corner:hover .octo-arm {
+  animation: octocat-wave .56s ease-in-out
+}
+
+@keyframes octocat-wave {
+
+  0%,
+  to {
+    transform: rotate(0)
+  }
+
+  20%,
+  60% {
+    transform: rotate(-25deg)
+  }
+
+  40%,
+  80% {
+    transform: rotate(10deg)
+  }
+}
+
+@media (max-width:500px) {
+  .github-corner:hover .octo-arm {
+    animation: none
+  }
+
+  .github-corner .octo-arm {
+    animation: octocat-wave .56s ease-in-out
+  }
+}
+
 /* layout */
 
 body {
@@ -112,6 +201,7 @@ a.foot-link {
     -webkit-transform: translateY(5px);
     opacity: 0;
   }
+
   100% {
     -webkit-transform: translateY(0);
     opacity: 1;
@@ -157,12 +247,13 @@ a.foot-link {
 
 #app {
   width: 96vw;
-  transition: 0.2s ease; /* for responsive animation */
+  transition: 0.2s ease;
+  /* for responsive animation */
 }
 
 @media (min-width: 1140px) {
   #app {
-      width: 1140px;
+    width: 1140px;
   }
 }
 
@@ -232,23 +323,23 @@ a.foot-link {
 .navbar.is-primary .navbar-end .navbar-link.is-active,
 .navbar.is-primary .navbar-end .navbar-link:focus,
 .navbar.is-primary .navbar-end .navbar-link:hover,
-.navbar.is-primary .navbar-end > a.navbar-item.is-active,
-.navbar.is-primary .navbar-end > a.navbar-item:focus,
-.navbar.is-primary .navbar-end > a.navbar-item:hover,
+.navbar.is-primary .navbar-end>a.navbar-item.is-active,
+.navbar.is-primary .navbar-end>a.navbar-item:focus,
+.navbar.is-primary .navbar-end>a.navbar-item:hover,
 .navbar.is-primary .navbar-item.has-dropdown.is-active .navbar-link,
 .navbar.is-primary .navbar-item.has-dropdown:focus .navbar-link,
 .navbar.is-primary .navbar-item.has-dropdown:hover .navbar-link,
 .navbar.is-primary .navbar-start .navbar-link.is-active,
 .navbar.is-primary .navbar-start .navbar-link:focus,
 .navbar.is-primary .navbar-start .navbar-link:hover,
-.navbar.is-primary .navbar-start > a.navbar-item.is-active,
-.navbar.is-primary .navbar-start > a.navbar-item:focus,
-.navbar.is-primary .navbar-start > a.navbar-item:hover {
+.navbar.is-primary .navbar-start>a.navbar-item.is-active,
+.navbar.is-primary .navbar-start>a.navbar-item:focus,
+.navbar.is-primary .navbar-start>a.navbar-item:hover {
   background-color: transparent;
   color: #fff;
 }
 
-.navbar.is-primary .navbar-brand > a.navbar-item:hover {
+.navbar.is-primary .navbar-brand>a.navbar-item:hover {
   background-color: transparent;
   color: #fff;
 }
@@ -288,7 +379,7 @@ a.foot-link {
 }
 
 .bg-seccond {
-  background-color: hsl(var(--main),10%,15%);
+  background-color: hsl(var(--main), 10%, 15%);
 }
 
 /* auth notification */
@@ -424,9 +515,11 @@ a.foot-link {
   .noti-col-icon {
     display: none;
   }
+
   .noti-col-label {
     padding-bottom: 0;
   }
+
   .noti-col-label:after {
     height: 0px;
   }
@@ -726,6 +819,7 @@ body::-webkit-scrollbar {
   background-color: hsl(var(--main), 10%, 25%);
   border-bottom-right-radius: 8px;
 }
+
 body::-webkit-scrollbar-thumb {
   border-radius: 10px;
   background-color: hsl(var(--main), 15%, 40%);
diff --git a/templates/admin/base.html b/templates/admin/base.html
index 6cbb483b..0b084364 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -24,7 +24,7 @@
     crossorigin="anonymous"></script>
 
   <!-- bulma -->
-  <link rel="stylesheet" href="https://fastly.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/bulma.min-v6.css" />
+  <link rel="stylesheet" href="/static/css/bulma.css?v={{ rand() }}" />
 
   <!-- font awesome -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
@@ -92,4 +92,4 @@ <h2 class="section-title">Dashboard</h2>
   <script src="/static/js/main.js" crossorigin="anonymous"></script>
 </body>
 
-</html>
+</html>
\ No newline at end of file
diff --git a/templates/base.html b/templates/base.html
index 8a5ec25a..448e774b 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -24,13 +24,14 @@
     crossorigin="anonymous"></script>
 
   <!-- Bulma -->
-  <link rel="stylesheet" href="https://fastly.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/bulma.min-v7.css" />
+  <link rel="stylesheet" href="/static/css/bulma.css?v={{ rand() }}" />
+
 
   <!-- Font awesome -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
 
   <!-- Custom style -->
-  <link rel="stylesheet" href="/static/css/style.css">
+  <link rel="stylesheet" href="/static/css/style.css?v={{ rand() }}">
 
   {% block header %}
   {% endblock %}
@@ -50,10 +51,10 @@
   {% include 'components/footer.html' %}
 
   <!-- Main JS script -->
-  <script src="/static/js/main.js?v=<% serverStartTime %>" crossorigin="anonymous"></script>
+  <script src="/static/js/main.js?v={{ rand() }}" crossorigin="anonymous"></script>
 
   <!-- Customisation -->
   {% block bottom %}{% endblock %}
 </body>
 
-</html>
+</html>
\ No newline at end of file
diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index fe2b4790..3f741316 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -26,21 +26,21 @@
                     {{ t('navbar.information') }}
                 </a>
                 <div class="navbar-dropdown">
-                    <a class="navbar-item" href="/doc/rules">
+                    <a class="navbar-item">
                         Todo...
                     </a>
                 </div>
             </div>
 
             {% if session.authenticated and session.user_data['is_staff'] %}
-            <a class="navbar-item" href="/admin">
+            <a class=" navbar-item" href="/admin">
                 {{ t('navbar.admin') }}
             </a>
             {% endif %}
         </div>
 
         <div class="navbar-end">
-            <div class="navbar-item has-dropdown is-hoverable" >
+            <div class="navbar-item has-dropdown is-hoverable">
                 <i style="display: flex;" class="fa fa-globe navbar-link"></i>
                 <div class="navbar-dropdown">
                     <a class="navbar-item" href="/language/zh_CN">
@@ -92,4 +92,4 @@
         </div>
     </div>
     </div>
-</nav>
+</nav>
\ No newline at end of file
diff --git a/templates/home.html b/templates/home.html
index 633ad0c3..61d1fefe 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -42,7 +42,7 @@
       <div class="column flex-vcenter flex-lcenter is-size-2-desktop is-size-1-fullhd" id="title">
         <h1 class="title is-spaced is-size-2-desktop is-size-1-fullhd">{{ appName() }}</h1>
         <h2 class="subtitle">
-            {{ t('home.subtitle-big') }}
+          {{ t('home.subtitle-big') }}
 
         </h2>
         {% if not session.authenticated %}
@@ -63,7 +63,7 @@ <h2 class="subtitle">
   </div>
 </div>
 
-<section class="section">
+<section class="section" style="display: none;">
   <div class="container has-text-centered py-4">
     <h2 class="title mb-6">{{ t('home.some-of-our-coolest-features') }}</h2>
     <div class="columns has-text-left mb-6">
@@ -105,16 +105,17 @@ <h4 class="title is-spaced is-4">{{ t('home.features-title-3') }}</h4>
 </section>
 
 {% if not session.authenticated %}
-<section class="hero splash">
+<section class="hero splash" style="display: none;">
   <div class="hero-body">
     <div class="container has-text-centered">
       <h1 class="title is-spaced">{{ t('home.what-are-you-waiting-for') }}</h1>
       <h2 class="subtitle">{{ t('home.subtitle', appName = appName()) }}</h2>
-      <div class="buttons is-centered"><a class="control button is-primary" href="/register">{{ t('home.sign-up-for-free') }}</a><a
-          class="control button is-light" href="/login">{{ t('global.log-in') }}</a></div>
+      <div class="buttons is-centered"><a class="control button is-primary" href="/register">{{
+          t('home.sign-up-for-free') }}</a><a class="control button is-light" href="/login">{{ t('global.log-in') }}</a>
+      </div>
     </div>
   </div>
 </section>
 {% endif %}
 
-{% endblock %}
+{% endblock %}
\ No newline at end of file

From cc022600aecd3bf6043c9c04d614116cf3bc5d56 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Tue, 7 Jun 2022 15:02:48 +0800
Subject: [PATCH 062/278] update rand()

---
 main.py | 20 ++++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

diff --git a/main.py b/main.py
index 53197dde..f3afbee9 100755
--- a/main.py
+++ b/main.py
@@ -4,16 +4,19 @@
 __all__ = ()
 
 import os
+import random
 
 import aiohttp
+import i18n
 import orjson
-from quart import Quart
+from quart import Quart, session
 from quart import render_template
 
 from cmyui.logging import Ansi
 from cmyui.logging import log
 from cmyui.mysql import AsyncSQLPool
 from cmyui.version import Version
+from requests import cookies
 
 from objects import glob
 
@@ -46,10 +49,22 @@ async def shutdown() -> None:
 def appVersion() -> str:
     return repr(version)
 
+@app.template_global()
+def t(key, **kwargs) -> str:
+    kwargs['locale'] = session.get('lang', 'zh_CN')
+    try:
+        return i18n.t(key, **kwargs)
+    except:
+        return key
+
 @app.template_global()
 def appName() -> str:
     return glob.config.app_name
 
+@app.template_global()
+def rand() -> str:
+    return str(random.randint(0,100000))
+
 @app.template_global()
 def captchaKey() -> str:
     return glob.config.hCaptcha_sitekey
@@ -71,4 +86,5 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    app.run(port=8000, debug=glob.config.debug) # blocking call
+    i18n.load_path.append(os.getcwd() + '/.locales')
+    app.run(port=8000, debug=glob.config.debug)  # blocking call

From 416d47977b665d42870085d20ab0a67d21a0c0c5 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Tue, 7 Jun 2022 15:05:43 +0800
Subject: [PATCH 063/278] forget bulma.css

---
 static/css/bulma.css | 11829 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 11829 insertions(+)
 create mode 100644 static/css/bulma.css

diff --git a/static/css/bulma.css b/static/css/bulma.css
new file mode 100644
index 00000000..a9a7be14
--- /dev/null
+++ b/static/css/bulma.css
@@ -0,0 +1,11829 @@
+@font-face {
+    font-family: Rubik;
+    src: url(https://fastly.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/Rubik.woff2) format("woff2 supports variations"), url(https://fastly.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/Rubik.woff2) format("woff2-variations");
+    font-weight: 100 1000;
+    font-stretch: 25% 151%
+}
+
+html {
+    --main: 215;
+    --blue: #007bff;
+    --indigo: #6610f2;
+    --purple: #6f42c1;
+    --pink: #e83e8c;
+    --red: #dc3545;
+    --orange: #fd7e14;
+    --yellow: #ffc107;
+    --green: #28a745;
+    --teal: #20c997;
+    --cyan: #17a2b8;
+    --white: #fff;
+    --gray: #6c757d;
+    --gray-dark: #343a40;
+    --primary: #007bff;
+    --secondary: #6c757d;
+    --success: #28a745;
+    --info: #17a2b8;
+    --warning: #ffc107;
+    --danger: #dc3545;
+    --light: #f8f9fa;
+    --dark: #343a40
+}
+
+@-webkit-keyframes spinAround {
+    0% {
+        transform: rotate(0)
+    }
+
+    to {
+        transform: rotate(359deg)
+    }
+}
+
+@keyframes spinAround {
+    0% {
+        transform: rotate(0)
+    }
+
+    to {
+        transform: rotate(359deg)
+    }
+}
+
+.breadcrumb,
+.button,
+.delete,
+.file,
+.is-unselectable,
+.modal-close,
+.pagination-ellipsis,
+.pagination-link,
+.pagination-next,
+.pagination-previous,
+.tabs {
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none
+}
+
+.navbar-link:not(.is-arrowless)::after,
+.select:not(.is-multiple):not(.is-loading)::after {
+    border: 3px solid transparent;
+    border-radius: 2px;
+    border-right: 0;
+    border-top: 0;
+    content: " ";
+    display: block;
+    height: .625em;
+    margin-top: -.4375em;
+    pointer-events: none;
+    position: absolute;
+    top: 50%;
+    transform: rotate(-45deg);
+    transform-origin: center;
+    width: .625em
+}
+
+.block:not(:last-child),
+.box:not(:last-child),
+.breadcrumb:not(:last-child),
+.content:not(:last-child),
+.highlight:not(:last-child),
+.level:not(:last-child),
+.list:not(:last-child),
+.message:not(:last-child),
+.notification:not(:last-child),
+.pagination:not(:last-child),
+.progress:not(:last-child),
+.subtitle:not(:last-child),
+.table-container:not(:last-child),
+.table:not(:last-child),
+.tabs:not(:last-child),
+.title:not(:last-child) {
+    margin-bottom: 1.5rem
+}
+
+.delete,
+.modal-close {
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    background-color: rgba(10, 10, 10, .2);
+    border: 0;
+    border-radius: 290486px;
+    cursor: pointer;
+    pointer-events: auto;
+    display: inline-block;
+    flex-grow: 0;
+    flex-shrink: 0;
+    font-size: 0;
+    height: 20px;
+    max-height: 20px;
+    max-width: 20px;
+    min-height: 20px;
+    min-width: 20px;
+    outline: 0;
+    position: relative;
+    vertical-align: top;
+    width: 20px
+}
+
+.delete::after,
+.delete::before,
+.modal-close::after,
+.modal-close::before {
+    background-color: #fff;
+    content: "";
+    display: block;
+    left: 50%;
+    position: absolute;
+    top: 50%;
+    transform: translateX(-50%) translateY(-50%) rotate(45deg);
+    transform-origin: center center
+}
+
+.delete::before,
+.modal-close::before {
+    height: 2px;
+    width: 50%
+}
+
+.delete::after,
+.modal-close::after {
+    height: 50%;
+    width: 2px
+}
+
+.delete:focus,
+.delete:hover,
+.modal-close:focus,
+.modal-close:hover {
+    background-color: rgba(10, 10, 10, .3)
+}
+
+.delete:active,
+.modal-close:active {
+    background-color: rgba(10, 10, 10, .4)
+}
+
+.is-small.delete,
+.is-small.modal-close {
+    height: 16px;
+    max-height: 16px;
+    max-width: 16px;
+    min-height: 16px;
+    min-width: 16px;
+    width: 16px
+}
+
+.is-medium.delete,
+.is-medium.modal-close {
+    height: 24px;
+    max-height: 24px;
+    max-width: 24px;
+    min-height: 24px;
+    min-width: 24px;
+    width: 24px
+}
+
+.is-large.delete,
+.is-large.modal-close {
+    height: 32px;
+    max-height: 32px;
+    max-width: 32px;
+    min-height: 32px;
+    min-width: 32px;
+    width: 32px
+}
+
+.button.is-loading::after,
+.control.is-loading::after,
+.loader,
+.select.is-loading::after {
+    -webkit-animation: spinAround .5s infinite linear;
+    animation: spinAround .5s infinite linear;
+    border: 2px solid #dbdee0;
+    border-radius: 290486px;
+    border-right-color: transparent;
+    border-top-color: transparent;
+    content: "";
+    display: block;
+    height: 1em;
+    position: relative;
+    width: 1em
+}
+
+.hero-video,
+.image.is-16by9 .has-ratio,
+.image.is-16by9 img,
+.image.is-1by1 .has-ratio,
+.image.is-1by1 img,
+.image.is-1by2 .has-ratio,
+.image.is-1by2 img,
+.image.is-1by3 .has-ratio,
+.image.is-1by3 img,
+.image.is-2by1 .has-ratio,
+.image.is-2by1 img,
+.image.is-2by3 .has-ratio,
+.image.is-2by3 img,
+.image.is-3by1 .has-ratio,
+.image.is-3by1 img,
+.image.is-3by2 .has-ratio,
+.image.is-3by2 img,
+.image.is-3by4 .has-ratio,
+.image.is-3by4 img,
+.image.is-3by5 .has-ratio,
+.image.is-3by5 img,
+.image.is-4by3 .has-ratio,
+.image.is-4by3 img,
+.image.is-4by5 .has-ratio,
+.image.is-4by5 img,
+.image.is-5by3 .has-ratio,
+.image.is-5by3 img,
+.image.is-5by4 .has-ratio,
+.image.is-5by4 img,
+.image.is-9by16 .has-ratio,
+.image.is-9by16 img,
+.image.is-square .has-ratio,
+.image.is-square img,
+.is-overlay,
+.modal,
+.modal-background {
+    bottom: 0;
+    left: 0;
+    position: absolute;
+    right: 0;
+    top: 0
+}
+
+.button,
+.file-cta,
+.file-name,
+.input,
+.pagination-ellipsis,
+.pagination-link,
+.pagination-next,
+.pagination-previous,
+.select select,
+.textarea {
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    align-items: center;
+    border: 1px solid transparent;
+    border-radius: .4em;
+    box-shadow: none;
+    display: inline-flex;
+    font-size: 15px;
+    height: 2.5em;
+    justify-content: flex-start;
+    line-height: 1.5;
+    padding: calc(.5em - 1px) calc(.75em - 1px);
+    position: relative;
+    vertical-align: top
+}
+
+.button:active,
+.button:focus,
+.file-cta:active,
+.file-cta:focus,
+.file-name:active,
+.file-name:focus,
+.input:active,
+.input:focus,
+.is-active.button,
+.is-active.file-cta,
+.is-active.file-name,
+.is-active.input,
+.is-active.pagination-ellipsis,
+.is-active.pagination-link,
+.is-active.pagination-next,
+.is-active.pagination-previous,
+.is-active.textarea,
+.is-focused.button,
+.is-focused.file-cta,
+.is-focused.file-name,
+.is-focused.input,
+.is-focused.pagination-ellipsis,
+.is-focused.pagination-link,
+.is-focused.pagination-next,
+.is-focused.pagination-previous,
+.is-focused.textarea,
+.pagination-ellipsis:active,
+.pagination-ellipsis:focus,
+.pagination-link:active,
+.pagination-link:focus,
+.pagination-next:active,
+.pagination-next:focus,
+.pagination-previous:active,
+.pagination-previous:focus,
+.select select.is-active,
+.select select.is-focused,
+.select select:active,
+.select select:focus,
+.textarea:active,
+.textarea:focus {
+    outline: 0
+}
+
+.button[disabled],
+.file-cta[disabled],
+.file-name[disabled],
+.input[disabled],
+.pagination-ellipsis[disabled],
+.pagination-link[disabled],
+.pagination-next[disabled],
+.pagination-previous[disabled],
+.select fieldset[disabled] select,
+.select select[disabled],
+.textarea[disabled],
+fieldset[disabled] .button,
+fieldset[disabled] .file-cta,
+fieldset[disabled] .file-name,
+fieldset[disabled] .input,
+fieldset[disabled] .pagination-ellipsis,
+fieldset[disabled] .pagination-link,
+fieldset[disabled] .pagination-next,
+fieldset[disabled] .pagination-previous,
+fieldset[disabled] .select select,
+fieldset[disabled] .textarea {
+    cursor: not-allowed
+}
+
+@-webkit-keyframes moveIndeterminate {
+    0% {
+        background-position: 200% 0
+    }
+
+    to {
+        background-position: -200% 0
+    }
+}
+
+@keyframes moveIndeterminate {
+    0% {
+        background-position: 200% 0
+    }
+
+    to {
+        background-position: -200% 0
+    }
+}
+
+blockquote,
+body,
+dd,
+dl,
+dt,
+fieldset,
+figure,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+html,
+iframe,
+legend,
+li,
+ol,
+p,
+pre,
+ul {
+    margin: 0;
+    padding: 0
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-size: 100%;
+    font-weight: 400
+}
+
+ul {
+    list-style: none
+}
+
+button,
+input,
+select,
+textarea {
+    margin: 0
+}
+
+html {
+    box-sizing: border-box;
+    background-color: hsl(var(--main), 10%, 10%);
+    font-size: 15px;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    min-width: 300px;
+    overflow-x: hidden;
+    overflow-y: scroll;
+    text-rendering: optimizeLegibility;
+    -webkit-text-size-adjust: 100%;
+    -moz-text-size-adjust: 100%;
+    -ms-text-size-adjust: 100%;
+    text-size-adjust: 100%
+}
+
+*,
+::after,
+::before {
+    box-sizing: inherit
+}
+
+img,
+video {
+    height: auto;
+    max-width: 100%
+}
+
+fieldset,
+iframe {
+    border: 0
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0
+}
+
+td,
+textarea,
+th {
+    padding: 0
+}
+
+.content table th:not([align]),
+table td:not([align]),
+table th:not([align]),
+td:not([align]),
+th:not([align]) {
+    text-align: left
+}
+
+article,
+aside,
+figure,
+footer,
+header,
+hgroup,
+section {
+    display: block
+}
+
+body,
+button,
+input,
+select,
+textarea {
+    font-family: Rubik, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif
+}
+
+code,
+pre {
+    -moz-osx-font-smoothing: auto;
+    -webkit-font-smoothing: auto;
+    font-family: Inconsolata, Consolas, Monaco, monospace
+}
+
+body,
+code {
+    font-weight: 400
+}
+
+body {
+    font-size: 1em;
+    line-height: 1.5;
+    color: #fff
+}
+
+a {
+    color: hsl(var(--main), 65%, 70%);
+    cursor: pointer;
+    text-decoration: none;
+    transition: all .2s ease
+}
+
+a strong,
+pre code {
+    color: currentColor
+}
+
+a:hover {
+    color: hsl(var(--main), 90%, 90%)
+}
+
+code {
+    color: #e74c3c;
+    padding: .25em .5em
+}
+
+code,
+hr,
+pre {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+hr {
+    border: 0;
+    display: block;
+    margin: 1.5rem 0;
+    height: 2px
+}
+
+input[type=checkbox],
+input[type=radio] {
+    vertical-align: baseline
+}
+
+code,
+pre,
+small {
+    font-size: .875em
+}
+
+span {
+    font-style: inherit;
+    font-weight: inherit
+}
+
+strong {
+    font-weight: 700
+}
+
+pre {
+    -webkit-overflow-scrolling: touch;
+    color: #fff;
+    overflow-x: auto;
+    padding: 1.25rem 1.5rem;
+    white-space: pre;
+    word-wrap: normal
+}
+
+pre code {
+    background-color: transparent;
+    font-size: 1em;
+    padding: 0
+}
+
+table td,
+table th {
+    vertical-align: top
+}
+
+strong,
+table th {
+    color: #f2f2f2
+}
+
+.is-clearfix::after {
+    clear: both;
+    content: " ";
+    display: table
+}
+
+.is-pulled-left {
+    float: left !important
+}
+
+.is-pulled-right {
+    float: right !important
+}
+
+.is-clipped {
+    overflow: hidden !important
+}
+
+.is-size-1 {
+    font-size: 3rem !important
+}
+
+.is-size-2 {
+    font-size: 2.5rem !important
+}
+
+.is-size-3 {
+    font-size: 2rem !important
+}
+
+.is-size-4 {
+    font-size: 1.5rem !important
+}
+
+.is-size-5 {
+    font-size: 1.25rem !important
+}
+
+.is-size-6 {
+    font-size: 15px !important
+}
+
+.is-size-7 {
+    font-size: .85em !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-size-1-mobile {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-mobile {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-mobile {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-mobile {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-mobile {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-mobile {
+        font-size: 15px !important
+    }
+
+    .is-size-7-mobile {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-size-1-tablet {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-tablet {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-tablet {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-tablet {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-tablet {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-tablet {
+        font-size: 15px !important
+    }
+
+    .is-size-7-tablet {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-size-1-touch {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-touch {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-touch {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-touch {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-touch {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-touch {
+        font-size: 15px !important
+    }
+
+    .is-size-7-touch {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-size-1-desktop {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-desktop {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-desktop {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-desktop {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-desktop {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-desktop {
+        font-size: 15px !important
+    }
+
+    .is-size-7-desktop {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-size-1-widescreen {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-widescreen {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-widescreen {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-widescreen {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-widescreen {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-widescreen {
+        font-size: 15px !important
+    }
+
+    .is-size-7-widescreen {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-size-1-fullhd {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-fullhd {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-fullhd {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-fullhd {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-fullhd {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-fullhd {
+        font-size: 15px !important
+    }
+
+    .is-size-7-fullhd {
+        font-size: .85em !important
+    }
+}
+
+.has-text-centered {
+    text-align: center !important
+}
+
+.has-text-justified {
+    text-align: justify !important
+}
+
+.has-text-left {
+    text-align: left !important
+}
+
+.has-text-right {
+    text-align: right !important
+}
+
+@media screen and (max-width: 768px) {
+    .has-text-centered-mobile {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .has-text-centered-tablet {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .has-text-centered-tablet-only {
+        text-align: center !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .has-text-centered-touch {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .has-text-centered-desktop {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .has-text-centered-desktop-only {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .has-text-centered-widescreen {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .has-text-centered-widescreen-only {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .has-text-centered-fullhd {
+        text-align: center !important
+    }
+}
+
+@media screen and (max-width: 768px) {
+    .has-text-justified-mobile {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .has-text-justified-tablet {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .has-text-justified-tablet-only {
+        text-align: justify !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .has-text-justified-touch {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .has-text-justified-desktop {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .has-text-justified-desktop-only {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .has-text-justified-widescreen {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .has-text-justified-widescreen-only {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .has-text-justified-fullhd {
+        text-align: justify !important
+    }
+}
+
+@media screen and (max-width: 768px) {
+    .has-text-left-mobile {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .has-text-left-tablet {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .has-text-left-tablet-only {
+        text-align: left !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .has-text-left-touch {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .has-text-left-desktop {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .has-text-left-desktop-only {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .has-text-left-widescreen {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .has-text-left-widescreen-only {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .has-text-left-fullhd {
+        text-align: left !important
+    }
+}
+
+@media screen and (max-width: 768px) {
+    .has-text-right-mobile {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .has-text-right-tablet {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .has-text-right-tablet-only {
+        text-align: right !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .has-text-right-touch {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .has-text-right-desktop {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .has-text-right-desktop-only {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .has-text-right-widescreen {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .has-text-right-widescreen-only {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .has-text-right-fullhd {
+        text-align: right !important
+    }
+}
+
+.is-capitalized {
+    text-transform: capitalize !important
+}
+
+.is-lowercase {
+    text-transform: lowercase !important
+}
+
+.is-uppercase {
+    text-transform: uppercase !important
+}
+
+.is-italic {
+    font-style: italic !important
+}
+
+.has-text-white {
+    color: #fff !important
+}
+
+a.has-text-white:focus,
+a.has-text-white:hover {
+    color: #e6e6e6 !important
+}
+
+.has-background-white {
+    background-color: #fff !important
+}
+
+.has-text-black {
+    color: #0a0a0a !important
+}
+
+a.has-text-black:focus,
+a.has-text-black:hover {
+    color: #000 !important
+}
+
+.has-background-black {
+    background-color: #0a0a0a !important
+}
+
+.has-text-light {
+    color: #ecf0f1 !important
+}
+
+a.has-text-light:focus,
+a.has-text-light:hover {
+    color: #cfd9db !important
+}
+
+.has-background-light {
+    background-color: #ecf0f1 !important
+}
+
+.has-text-dark {
+    color: hsl(var(--main), 10%, 15%) !important
+}
+
+a.has-text-dark:focus,
+a.has-text-dark:hover {
+    color: #111414 !important
+}
+
+.has-background-dark {
+    background-color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-text-primary {
+    color: hsl(var(--main), 45%, 45%) !important
+}
+
+a.has-text-primary:focus,
+a.has-text-primary:hover {
+    color: hsl(var(--main), 45%, 35%) !important
+}
+
+.has-background-primary {
+    background-color: hsl(var(--main), 45%, 45%) !important
+}
+
+.has-text-link {
+    color: hsl(var(--main), 45%, 45%) !important
+}
+
+a.has-text-link:focus,
+a.has-text-link:hover {
+    color: #148f77 !important
+}
+
+.has-background-link {
+    background-color: hsl(var(--main), 45%, 45%) !important
+}
+
+.has-text-info {
+    color: #3298dc !important
+}
+
+a.has-text-info:focus,
+a.has-text-info:hover {
+    color: #207dbc !important
+}
+
+.has-background-info {
+    background-color: #3298dc !important
+}
+
+.has-text-success {
+    color: #2ecc71 !important
+}
+
+a.has-text-success:focus,
+a.has-text-success:hover {
+    color: #25a25a !important
+}
+
+.has-background-success {
+    background-color: #2ecc71 !important
+}
+
+.has-text-warning {
+    color: #f1b70e !important
+}
+
+a.has-text-warning:focus,
+a.has-text-warning:hover {
+    color: #c1920b !important
+}
+
+.has-background-warning {
+    background-color: #f1b70e !important
+}
+
+.has-text-danger {
+    color: #e74c3c !important
+}
+
+a.has-text-danger:focus,
+a.has-text-danger:hover {
+    color: #d62c1a !important
+}
+
+.has-background-danger {
+    background-color: #e74c3c !important
+}
+
+.has-text-black-bis {
+    color: #121212 !important
+}
+
+.has-background-black-bis {
+    background-color: #121212 !important
+}
+
+.has-text-black-ter {
+    color: #242424 !important
+}
+
+.has-background-black-ter {
+    background-color: #242424 !important
+}
+
+.has-text-grey-darker {
+    color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-background-grey-darker {
+    background-color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-text-grey-dark {
+    color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-background-grey-dark {
+    background-color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-text-grey {
+    color: #5e6d6f !important
+}
+
+.has-background-grey {
+    background-color: #5e6d6f !important
+}
+
+.has-text-grey-light {
+    color: #8c9b9d !important
+}
+
+.has-background-grey-light {
+    background-color: #8c9b9d !important
+}
+
+.has-text-grey-lighter {
+    color: #dbdee0 !important
+}
+
+.has-background-grey-lighter {
+    background-color: #dbdee0 !important
+}
+
+.has-text-white-ter {
+    color: #ecf0f1 !important
+}
+
+.has-background-white-ter {
+    background-color: #ecf0f1 !important
+}
+
+.has-text-white-bis {
+    color: #fafafa !important
+}
+
+.has-background-white-bis {
+    background-color: #fafafa !important
+}
+
+.has-text-weight-light {
+    font-weight: 300 !important
+}
+
+.has-text-weight-normal {
+    font-weight: 400 !important
+}
+
+.has-text-weight-medium {
+    font-weight: 500 !important
+}
+
+.has-text-weight-semibold {
+    font-weight: 600 !important
+}
+
+.has-text-weight-bold {
+    font-weight: 700 !important
+}
+
+.is-family-primary,
+.is-family-sans-serif,
+.is-family-secondary {
+    font-family: Rubik, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif !important
+}
+
+.is-family-code,
+.is-family-monospace {
+    font-family: Inconsolata, Consolas, Monaco, monospace !important
+}
+
+.is-block {
+    display: block !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-block-mobile {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-block-tablet {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-block-tablet-only {
+        display: block !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-block-touch {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-block-desktop {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-block-desktop-only {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-block-widescreen {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-block-widescreen-only {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-block-fullhd {
+        display: block !important
+    }
+}
+
+.is-flex {
+    display: flex !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-flex-mobile {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-flex-tablet {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-flex-tablet-only {
+        display: flex !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-flex-touch {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-flex-desktop {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-flex-desktop-only {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-flex-widescreen {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-flex-widescreen-only {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-flex-fullhd {
+        display: flex !important
+    }
+}
+
+.is-inline {
+    display: inline !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-inline-mobile {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-inline-tablet {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-inline-tablet-only {
+        display: inline !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-inline-touch {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-inline-desktop {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-inline-desktop-only {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-inline-widescreen {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-inline-widescreen-only {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-inline-fullhd {
+        display: inline !important
+    }
+}
+
+.is-inline-block {
+    display: inline-block !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-inline-block-mobile {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-inline-block-tablet {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-inline-block-tablet-only {
+        display: inline-block !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-inline-block-touch {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-inline-block-desktop {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-inline-block-desktop-only {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-inline-block-widescreen {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-inline-block-widescreen-only {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-inline-block-fullhd {
+        display: inline-block !important
+    }
+}
+
+.is-inline-flex {
+    display: inline-flex !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-inline-flex-mobile {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-inline-flex-tablet {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-inline-flex-tablet-only {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-inline-flex-touch {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-inline-flex-desktop {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-inline-flex-desktop-only {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-inline-flex-widescreen {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-inline-flex-widescreen-only {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-inline-flex-fullhd {
+        display: inline-flex !important
+    }
+}
+
+.is-hidden {
+    display: none !important
+}
+
+.is-sr-only {
+    border: 0 !important;
+    clip: rect(0, 0, 0, 0) !important;
+    height: .01em !important;
+    overflow: hidden !important;
+    padding: 0 !important;
+    position: absolute !important;
+    white-space: nowrap !important;
+    width: .01em !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-hidden-mobile {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-hidden-tablet {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-hidden-tablet-only {
+        display: none !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-hidden-touch {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-hidden-desktop {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-hidden-desktop-only {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-hidden-widescreen {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-hidden-widescreen-only {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-hidden-fullhd {
+        display: none !important
+    }
+}
+
+.is-invisible {
+    visibility: hidden !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-invisible-mobile {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-invisible-tablet {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-invisible-tablet-only {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-invisible-touch {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-invisible-desktop {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-invisible-desktop-only {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-invisible-widescreen {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-invisible-widescreen-only {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-invisible-fullhd {
+        visibility: hidden !important
+    }
+}
+
+.is-marginless {
+    margin: 0 !important
+}
+
+.is-paddingless {
+    padding: 0 !important
+}
+
+.is-radiusless {
+    border-radius: 0 !important
+}
+
+.is-shadowless {
+    box-shadow: none !important
+}
+
+.is-relative {
+    position: relative !important
+}
+
+.box {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: 8px;
+    box-shadow: none;
+    color: #fff;
+    display: block;
+    padding: 1.25rem
+}
+
+a.box:focus,
+a.box:hover {
+    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px hsl(var(--main), 45%, 45%)
+}
+
+a.box:active {
+    box-shadow: inset 0 1px 2px rgba(10, 10, 10, .2), 0 0 0 1px hsl(var(--main), 45%, 45%)
+}
+
+.button {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: #4c5759;
+    cursor: pointer;
+    justify-content: center;
+    padding-bottom: calc(.5em - 1px);
+    padding-left: 1em;
+    padding-right: 1em;
+    padding-top: calc(.5em - 1px);
+    text-align: center;
+    white-space: nowrap
+}
+
+.button strong {
+    color: inherit
+}
+
+.button .icon,
+.button .icon.is-large,
+.button .icon.is-medium,
+.button .icon.is-small {
+    height: 1.5em;
+    width: 1.5em
+}
+
+.button .icon:first-child:not(:last-child) {
+    margin-left: calc(-.5em - 1px);
+    margin-right: .25em
+}
+
+.button .icon:last-child:not(:first-child) {
+    margin-left: .25em;
+    margin-right: calc(-.5em - 1px)
+}
+
+.button .icon:first-child:last-child {
+    margin-left: calc(-.5em - 1px);
+    margin-right: calc(-.5em - 1px)
+}
+
+.button.is-hovered,
+.button:hover {
+    border-color: #8c9b9d;
+    color: #f2f2f2
+}
+
+.button.is-focused,
+.button:focus {
+    border-color: #8c9b9d;
+    color: hsl(var(--main), 75%, 80%)
+}
+
+.button.is-focused:not(:active),
+.button:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(26, 188, 156, .25)
+}
+
+.button.is-active,
+.button:active {
+    border-color: hsl(var(--main), 10%, 15%);
+    color: #f2f2f2
+}
+
+.button.is-text {
+    background-color: transparent;
+    border-color: transparent;
+    color: #fff;
+    text-decoration: underline
+}
+
+.button.is-text.is-focused,
+.button.is-text.is-hovered,
+.button.is-text:focus,
+.button.is-text:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #f2f2f2
+}
+
+.button.is-text.is-active,
+.button.is-text:active {
+    background-color: #1d2122;
+    color: #f2f2f2
+}
+
+.button.is-text[disabled],
+fieldset[disabled] .button.is-text {
+    background-color: transparent;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-white {
+    background-color: #fff
+}
+
+.button.is-white,
+.button.is-white.is-hovered,
+.button.is-white:hover {
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.button.is-white.is-focused,
+.button.is-white:focus {
+    color: #0a0a0a
+}
+
+.button.is-white.is-focused:not(:active),
+.button.is-white:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(255, 255, 255, .25)
+}
+
+.button.is-white.is-active,
+.button.is-white:active {
+    background-color: #f2f2f2;
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.button.is-white[disabled],
+fieldset[disabled] .button.is-white {
+    background-color: #fff;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-white.is-loading::after {
+    border-color: transparent transparent #0a0a0a #0a0a0a !important
+}
+
+.button.is-white.is-outlined {
+    background-color: transparent;
+    border-color: #fff;
+    color: #fff
+}
+
+.button.is-white.is-outlined.is-focused,
+.button.is-white.is-outlined.is-hovered,
+.button.is-white.is-outlined:focus,
+.button.is-white.is-outlined:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #0a0a0a
+}
+
+.button.is-white.is-outlined.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-white.is-outlined.is-loading.is-focused::after,
+.button.is-white.is-outlined.is-loading.is-hovered::after,
+.button.is-white.is-outlined.is-loading:focus::after,
+.button.is-white.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #0a0a0a #0a0a0a !important
+}
+
+.button.is-white.is-outlined[disabled],
+fieldset[disabled] .button.is-white.is-outlined {
+    background-color: transparent;
+    border-color: #fff;
+    box-shadow: none;
+    color: #fff
+}
+
+.button.is-black {
+    background-color: #0a0a0a
+}
+
+.button.is-black,
+.button.is-black.is-hovered,
+.button.is-black:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-black.is-focused,
+.button.is-black:focus {
+    color: #fff
+}
+
+.button.is-black.is-focused:not(:active),
+.button.is-black:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(10, 10, 10, .25)
+}
+
+.button.is-black.is-active,
+.button.is-black:active {
+    background-color: #000;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-black[disabled],
+fieldset[disabled] .button.is-black {
+    background-color: #0a0a0a;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-black.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-black.is-outlined {
+    background-color: transparent;
+    border-color: #0a0a0a;
+    color: #0a0a0a
+}
+
+.button.is-black.is-outlined.is-focused,
+.button.is-black.is-outlined.is-hovered,
+.button.is-black.is-outlined:focus,
+.button.is-black.is-outlined:hover {
+    background-color: #0a0a0a;
+    border-color: #0a0a0a;
+    color: #fff
+}
+
+.button.is-black.is-outlined.is-loading::after {
+    border-color: transparent transparent #0a0a0a #0a0a0a !important
+}
+
+.button.is-black.is-outlined.is-loading.is-focused::after,
+.button.is-black.is-outlined.is-loading.is-hovered::after,
+.button.is-black.is-outlined.is-loading:focus::after,
+.button.is-black.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-black.is-outlined[disabled],
+fieldset[disabled] .button.is-black.is-outlined {
+    background-color: transparent;
+    border-color: #0a0a0a;
+    box-shadow: none;
+    color: #0a0a0a
+}
+
+.button.is-light {
+    background-color: #ecf0f1
+}
+
+.button.is-light,
+.button.is-light.is-hovered,
+.button.is-light:hover {
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-light.is-focused,
+.button.is-light:focus {
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-light.is-focused:not(:active),
+.button.is-light:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(236, 240, 241, .25)
+}
+
+.button.is-light.is-active,
+.button.is-light:active {
+    background-color: #dde4e6;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-light[disabled],
+fieldset[disabled] .button.is-light {
+    background-color: #ecf0f1;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-light.is-loading::after {
+    border-color: transparent transparent rgba(0, 0, 0, .7) rgba(0, 0, 0, .7) !important
+}
+
+.button.is-light.is-outlined {
+    background-color: transparent;
+    border-color: #ecf0f1;
+    color: #ecf0f1
+}
+
+.button.is-light.is-outlined.is-focused,
+.button.is-light.is-outlined.is-hovered,
+.button.is-light.is-outlined:focus,
+.button.is-light.is-outlined:hover {
+    background-color: #ecf0f1;
+    border-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-light.is-outlined.is-loading::after {
+    border-color: transparent transparent #ecf0f1 #ecf0f1 !important
+}
+
+.button.is-light.is-outlined.is-loading.is-focused::after,
+.button.is-light.is-outlined.is-loading.is-hovered::after,
+.button.is-light.is-outlined.is-loading:focus::after,
+.button.is-light.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent rgba(0, 0, 0, .7) rgba(0, 0, 0, .7) !important
+}
+
+.button.is-light.is-outlined[disabled],
+fieldset[disabled] .button.is-light.is-outlined {
+    background-color: transparent;
+    border-color: #ecf0f1;
+    box-shadow: none;
+    color: #ecf0f1
+}
+
+.button.is-dark {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.button.is-dark,
+.button.is-dark.is-hovered,
+.button.is-dark:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-dark.is-focused,
+.button.is-dark:focus {
+    color: #fff
+}
+
+.button.is-dark.is-focused:not(:active),
+.button.is-dark:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(40, 47, 47, .25)
+}
+
+.button.is-dark.is-active,
+.button.is-dark:active {
+    background-color: #1d2122;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-dark[disabled],
+fieldset[disabled] .button.is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-dark.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-dark.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 10%, 15%);
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.button.is-dark.is-outlined.is-focused,
+.button.is-dark.is-outlined.is-hovered,
+.button.is-dark.is-outlined:focus,
+.button.is-dark.is-outlined:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.button.is-dark.is-outlined.is-loading::after {
+    border-color: transparent transparent hsl(var(--main), 10%, 15%) hsl(var(--main), 10%, 15%) !important
+}
+
+.button.is-dark.is-outlined.is-loading.is-focused::after,
+.button.is-dark.is-outlined.is-loading.is-hovered::after,
+.button.is-dark.is-outlined.is-loading:focus::after,
+.button.is-dark.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-dark.is-outlined[disabled],
+fieldset[disabled] .button.is-dark.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 10%, 15%);
+    box-shadow: none;
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.button.is-primary {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-primary,
+.button.is-primary.is-hovered,
+.button.is-primary:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-primary.is-focused,
+.button.is-primary:focus {
+    color: #fff
+}
+
+.button.is-primary.is-focused:not(:active),
+.button.is-primary:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(55, 90, 127, .25)
+}
+
+.button.is-primary.is-active,
+.button.is-primary:active {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-primary[disabled],
+fieldset[disabled] .button.is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-primary.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-primary.is-outlined {
+    background-color: transparent;
+    border-color: #fff;
+    color: #fff
+}
+
+.button.is-primary.is-outlined.is-focused,
+.button.is-primary.is-outlined.is-hovered,
+.button.is-primary.is-outlined:focus,
+.button.is-primary.is-outlined:hover {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.button.is-primary.is-outlined.is-loading::after {
+    border-color: transparent transparent hsl(var(--main), 45%, 45%) hsl(var(--main), 45%, 45%) !important
+}
+
+.button.is-primary.is-outlined.is-loading.is-focused::after,
+.button.is-primary.is-outlined.is-loading.is-hovered::after,
+.button.is-primary.is-outlined.is-loading:focus::after,
+.button.is-primary.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-primary.is-outlined[disabled],
+fieldset[disabled] .button.is-primary.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 45%, 45%);
+    box-shadow: none;
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-primary.is-light {
+    background-color: #f1f5f9;
+    color: hsl(var(--main), 65%, 35%)
+}
+
+.button.is-primary.is-light.is-hovered,
+.button.is-primary.is-light:hover {
+    background-color: #e8eef5;
+    border-color: transparent;
+    color: hsl(var(--main), 65%, 35%)
+}
+
+.button.is-primary.is-light.is-active,
+.button.is-primary.is-light:active {
+    background-color: #dfe8f1;
+    border-color: transparent;
+    color: #4d7eb2
+}
+
+.button.is-link {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-link,
+.button.is-link.is-hovered,
+.button.is-link:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-link.is-focused,
+.button.is-link:focus {
+    color: #fff
+}
+
+.button.is-link.is-focused:not(:active),
+.button.is-link:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(26, 188, 156, .25)
+}
+
+.button.is-link.is-active,
+.button.is-link:active {
+    background-color: hsl(var(--main), 75%, 80%);
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-link[disabled],
+fieldset[disabled] .button.is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-link.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-link.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 45%, 45%);
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-link.is-outlined.is-focused,
+.button.is-link.is-outlined.is-hovered,
+.button.is-link.is-outlined:focus,
+.button.is-link.is-outlined:hover {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.button.is-link.is-outlined.is-loading::after {
+    border-color: transparent transparent hsl(var(--main), 45%, 45%) hsl(var(--main), 45%, 45%) !important
+}
+
+.button.is-link.is-outlined.is-loading.is-focused::after,
+.button.is-link.is-outlined.is-loading.is-hovered::after,
+.button.is-link.is-outlined.is-loading:focus::after,
+.button.is-link.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-link.is-outlined[disabled],
+fieldset[disabled] .button.is-link.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 45%, 45%);
+    box-shadow: none;
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-link.is-light {
+    background-color: #edfdf9;
+    color: #15987e
+}
+
+.button.is-link.is-light.is-hovered,
+.button.is-link.is-light:hover {
+    background-color: #e2fbf6;
+    border-color: transparent;
+    color: #15987e
+}
+
+.button.is-link.is-light.is-active,
+.button.is-link.is-light:active {
+    background-color: #d7f9f3;
+    border-color: transparent;
+    color: #15987e
+}
+
+.button.is-info {
+    background-color: #3298dc
+}
+
+.button.is-info,
+.button.is-info.is-hovered,
+.button.is-info:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-info.is-focused,
+.button.is-info:focus {
+    color: #fff
+}
+
+.button.is-info.is-focused:not(:active),
+.button.is-info:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(50, 152, 220, .25)
+}
+
+.button.is-info.is-active,
+.button.is-info:active {
+    background-color: #238cd1;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-info[disabled],
+fieldset[disabled] .button.is-info {
+    background-color: #3298dc;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-info.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-info.is-outlined {
+    background-color: transparent;
+    border-color: #3298dc;
+    color: #3298dc
+}
+
+.button.is-info.is-outlined.is-focused,
+.button.is-info.is-outlined.is-hovered,
+.button.is-info.is-outlined:focus,
+.button.is-info.is-outlined:hover {
+    background-color: #3298dc;
+    border-color: #3298dc;
+    color: #fff
+}
+
+.button.is-info.is-outlined.is-loading::after {
+    border-color: transparent transparent #3298dc #3298dc !important
+}
+
+.button.is-info.is-outlined.is-loading.is-focused::after,
+.button.is-info.is-outlined.is-loading.is-hovered::after,
+.button.is-info.is-outlined.is-loading:focus::after,
+.button.is-info.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-info.is-outlined[disabled],
+fieldset[disabled] .button.is-info.is-outlined {
+    background-color: transparent;
+    border-color: #3298dc;
+    box-shadow: none;
+    color: #3298dc
+}
+
+.button.is-info.is-light {
+    background-color: #eef6fc;
+    color: #1d72aa
+}
+
+.button.is-info.is-light.is-hovered,
+.button.is-info.is-light:hover {
+    background-color: #e3f1fa;
+    border-color: transparent;
+    color: #1d72aa
+}
+
+.button.is-info.is-light.is-active,
+.button.is-info.is-light:active {
+    background-color: #d8ebf8;
+    border-color: transparent;
+    color: #1d72aa
+}
+
+.button.is-success {
+    background-color: #2ecc71
+}
+
+.button.is-success,
+.button.is-success.is-hovered,
+.button.is-success:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-success.is-focused,
+.button.is-success:focus {
+    color: #fff
+}
+
+.button.is-success.is-focused:not(:active),
+.button.is-success:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(46, 204, 113, .25)
+}
+
+.button.is-success.is-active,
+.button.is-success:active {
+    background-color: #29b765;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-success[disabled],
+fieldset[disabled] .button.is-success {
+    background-color: #2ecc71;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-success.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-success.is-outlined {
+    background-color: transparent;
+    border-color: #2ecc71;
+    color: #2ecc71
+}
+
+.button.is-success.is-outlined.is-focused,
+.button.is-success.is-outlined.is-hovered,
+.button.is-success.is-outlined:focus,
+.button.is-success.is-outlined:hover {
+    background-color: #2ecc71;
+    border-color: #2ecc71;
+    color: #fff
+}
+
+.button.is-success.is-outlined.is-loading::after {
+    border-color: transparent transparent #2ecc71 #2ecc71 !important
+}
+
+.button.is-success.is-outlined.is-loading.is-focused::after,
+.button.is-success.is-outlined.is-loading.is-hovered::after,
+.button.is-success.is-outlined.is-loading:focus::after,
+.button.is-success.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-success.is-outlined[disabled],
+fieldset[disabled] .button.is-success.is-outlined {
+    background-color: transparent;
+    border-color: #2ecc71;
+    box-shadow: none;
+    color: #2ecc71
+}
+
+.button.is-success.is-light {
+    background-color: #eefbf4;
+    color: #1d8147
+}
+
+.button.is-success.is-light.is-hovered,
+.button.is-success.is-light:hover {
+    background-color: #e4f9ed;
+    border-color: transparent;
+    color: #1d8147
+}
+
+.button.is-success.is-light.is-active,
+.button.is-success.is-light:active {
+    background-color: #daf7e6;
+    border-color: transparent;
+    color: #1d8147
+}
+
+.button.is-warning {
+    background-color: #f1b70e
+}
+
+.button.is-warning,
+.button.is-warning.is-hovered,
+.button.is-warning:hover {
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-warning.is-focused,
+.button.is-warning:focus {
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-warning.is-focused:not(:active),
+.button.is-warning:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(241, 183, 14, .25)
+}
+
+.button.is-warning.is-active,
+.button.is-warning:active {
+    background-color: #d9a50d;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-warning[disabled],
+fieldset[disabled] .button.is-warning {
+    background-color: #f1b70e;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-warning.is-loading::after {
+    border-color: transparent transparent rgba(0, 0, 0, .7) rgba(0, 0, 0, .7) !important
+}
+
+.button.is-warning.is-outlined {
+    background-color: transparent;
+    border-color: #f1b70e;
+    color: #f1b70e
+}
+
+.button.is-warning.is-outlined.is-focused,
+.button.is-warning.is-outlined.is-hovered,
+.button.is-warning.is-outlined:focus,
+.button.is-warning.is-outlined:hover {
+    background-color: #f1b70e;
+    border-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-warning.is-outlined.is-loading::after {
+    border-color: transparent transparent #f1b70e #f1b70e !important
+}
+
+.button.is-warning.is-outlined.is-loading.is-focused::after,
+.button.is-warning.is-outlined.is-loading.is-hovered::after,
+.button.is-warning.is-outlined.is-loading:focus::after,
+.button.is-warning.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent rgba(0, 0, 0, .7) rgba(0, 0, 0, .7) !important
+}
+
+.button.is-warning.is-outlined[disabled],
+fieldset[disabled] .button.is-warning.is-outlined {
+    background-color: transparent;
+    border-color: #f1b70e;
+    box-shadow: none;
+    color: #f1b70e
+}
+
+.button.is-warning.is-light {
+    background-color: #fef9ec;
+    color: #8c6a08
+}
+
+.button.is-warning.is-light.is-hovered,
+.button.is-warning.is-light:hover {
+    background-color: #fdf6e0;
+    border-color: transparent;
+    color: #8c6a08
+}
+
+.button.is-warning.is-light.is-active,
+.button.is-warning.is-light:active {
+    background-color: #fcf2d4;
+    border-color: transparent;
+    color: #8c6a08
+}
+
+.button.is-danger {
+    background-color: #e74c3c
+}
+
+.button.is-danger,
+.button.is-danger.is-hovered,
+.button.is-danger:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-danger.is-focused,
+.button.is-danger:focus {
+    color: #fff
+}
+
+.button.is-danger.is-focused:not(:active),
+.button.is-danger:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(231, 76, 60, .25)
+}
+
+.button.is-danger.is-active,
+.button.is-danger:active {
+    background-color: #e43725;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-danger[disabled],
+fieldset[disabled] .button.is-danger {
+    background-color: #e74c3c;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-danger.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-danger.is-outlined {
+    background-color: transparent;
+    border-color: #e74c3c;
+    color: #e74c3c
+}
+
+.button.is-danger.is-outlined.is-focused,
+.button.is-danger.is-outlined.is-hovered,
+.button.is-danger.is-outlined:focus,
+.button.is-danger.is-outlined:hover {
+    background-color: #e74c3c;
+    border-color: #e74c3c;
+    color: #fff
+}
+
+.button.is-danger.is-outlined.is-loading::after {
+    border-color: transparent transparent #e74c3c #e74c3c !important
+}
+
+.button.is-danger.is-outlined.is-loading.is-focused::after,
+.button.is-danger.is-outlined.is-loading.is-hovered::after,
+.button.is-danger.is-outlined.is-loading:focus::after,
+.button.is-danger.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-danger.is-outlined[disabled],
+fieldset[disabled] .button.is-danger.is-outlined {
+    background-color: transparent;
+    border-color: #e74c3c;
+    box-shadow: none;
+    color: #e74c3c
+}
+
+.button.is-danger.is-light {
+    background-color: #fdeeed;
+    color: #c32818
+}
+
+.button.is-danger.is-light.is-hovered,
+.button.is-danger.is-light:hover {
+    background-color: #fbe4e1;
+    border-color: transparent;
+    color: #c32818
+}
+
+.button.is-danger.is-light.is-active,
+.button.is-danger.is-light:active {
+    background-color: #fad9d6;
+    border-color: transparent;
+    color: #c32818
+}
+
+.button.is-small {
+    border-radius: 3px;
+    font-size: .85em
+}
+
+.button.is-normal {
+    font-size: 15px
+}
+
+.button.is-medium {
+    font-size: 1.25rem
+}
+
+.button.is-large {
+    font-size: 1.5rem
+}
+
+.button[disabled],
+fieldset[disabled] .button {
+    background-color: #8c9b9d;
+    border-color: #5e6d6f;
+    box-shadow: none;
+    opacity: .5
+}
+
+.button.is-fullwidth {
+    display: flex;
+    width: 100%
+}
+
+.button.is-loading {
+    color: transparent !important;
+    pointer-events: none
+}
+
+.button.is-loading::after {
+    left: calc(50% - (1em / 2));
+    top: calc(50% - (1em / 2));
+    position: absolute !important
+}
+
+.button.is-static {
+    background-color: #ecf0f1;
+    border-color: #5e6d6f;
+    color: #fff;
+    box-shadow: none;
+    pointer-events: none
+}
+
+.button.is-rounded {
+    border-radius: 290486px;
+    padding-left: calc(1em + .25em);
+    padding-right: calc(1em + .25em)
+}
+
+.buttons {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start
+}
+
+.buttons .button {
+    margin-bottom: .5rem
+}
+
+.buttons .button:not(:last-child):not(.is-fullwidth) {
+    margin-right: .5rem
+}
+
+.buttons:last-child {
+    margin-bottom: -.5rem
+}
+
+.buttons:not(:last-child) {
+    margin-bottom: 1rem
+}
+
+.buttons.are-small .button:not(.is-normal):not(.is-medium):not(.is-large) {
+    border-radius: 3px;
+    font-size: .85em
+}
+
+.buttons.are-medium .button:not(.is-small):not(.is-normal):not(.is-large) {
+    font-size: 1.25rem
+}
+
+.buttons.are-large .button:not(.is-small):not(.is-normal):not(.is-medium) {
+    font-size: 1.5rem
+}
+
+.buttons.has-addons .button:not(:first-child) {
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0
+}
+
+.buttons.has-addons .button:not(:last-child) {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0;
+    margin-right: -1px
+}
+
+.buttons.has-addons .button:last-child {
+    margin-right: 0
+}
+
+.buttons.has-addons .button.is-hovered,
+.buttons.has-addons .button:hover {
+    z-index: 2
+}
+
+.buttons.has-addons .button.is-active,
+.buttons.has-addons .button.is-focused,
+.buttons.has-addons .button.is-selected,
+.buttons.has-addons .button:active,
+.buttons.has-addons .button:focus {
+    z-index: 3
+}
+
+.buttons.has-addons .button.is-active:hover,
+.buttons.has-addons .button.is-focused:hover,
+.buttons.has-addons .button.is-selected:hover,
+.buttons.has-addons .button:active:hover,
+.buttons.has-addons .button:focus:hover {
+    z-index: 4
+}
+
+.buttons.has-addons .button.is-expanded {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.buttons.is-centered {
+    justify-content: center
+}
+
+.buttons.is-centered:not(.has-addons) .button:not(.is-fullwidth),
+.buttons.is-right:not(.has-addons) .button:not(.is-fullwidth) {
+    margin-left: .25rem;
+    margin-right: .25rem
+}
+
+.buttons.is-right {
+    justify-content: flex-end
+}
+
+.container {
+    flex-grow: 1;
+    margin: 0 auto;
+    position: relative;
+    width: auto
+}
+
+.container.is-fluid {
+    max-width: none;
+    padding-left: 32px;
+    padding-right: 32px;
+    width: 100%
+}
+
+@media screen and (min-width: 1024px) {
+    .container {
+        max-width: 960px
+    }
+}
+
+@media screen and (max-width: 1215px) {
+    .container.is-widescreen {
+        max-width: 1152px
+    }
+}
+
+@media screen and (max-width: 1407px) {
+    .container.is-fullhd {
+        max-width: 1344px
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .container {
+        max-width: 1152px
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .container {
+        max-width: 1344px
+    }
+}
+
+.content li+li {
+    margin-top: .25em
+}
+
+.content blockquote:not(:last-child),
+.content dl:not(:last-child),
+.content ol:not(:last-child),
+.content p:not(:last-child),
+.content pre:not(:last-child),
+.content table:not(:last-child),
+.content ul:not(:last-child) {
+    margin-bottom: 1em
+}
+
+.content h1,
+.content h2,
+.content h3,
+.content h4,
+.content h5,
+.content h6 {
+    color: #f2f2f2;
+    font-weight: 600;
+    line-height: 1.125
+}
+
+.content h1 {
+    font-size: 2em;
+    margin-bottom: .5em
+}
+
+.content h1:not(:first-child) {
+    margin-top: 1em
+}
+
+.content h2 {
+    font-size: 1.75em;
+    margin-bottom: .5714em
+}
+
+.content h2:not(:first-child) {
+    margin-top: 1.1428em
+}
+
+.content h3 {
+    font-size: 1.5em;
+    margin-bottom: .6666em
+}
+
+.content h3:not(:first-child) {
+    margin-top: 1.3333em
+}
+
+.content h4 {
+    font-size: 1.25em;
+    margin-bottom: .8em
+}
+
+.content h5 {
+    font-size: 1.125em;
+    margin-bottom: .8888em
+}
+
+.content h6 {
+    font-size: 1em;
+    margin-bottom: 1em
+}
+
+.content blockquote {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-left: 5px solid #5e6d6f;
+    padding: 1.25em 1.5em
+}
+
+.content ol {
+    list-style-position: outside;
+    margin-left: 2em;
+    margin-top: 1em
+}
+
+.content ol:not([type]) {
+    list-style-type: decimal
+}
+
+.content ol:not([type]).is-lower-alpha {
+    list-style-type: lower-alpha
+}
+
+.content ol:not([type]).is-lower-roman {
+    list-style-type: lower-roman
+}
+
+.content ol:not([type]).is-upper-alpha {
+    list-style-type: upper-alpha
+}
+
+.content ol:not([type]).is-upper-roman {
+    list-style-type: upper-roman
+}
+
+.content ul {
+    list-style: disc outside;
+    margin-top: 1em
+}
+
+.content ul ul {
+    list-style-type: circle;
+    margin-top: .5em
+}
+
+.content ul ul ul {
+    list-style-type: square
+}
+
+.content dd,
+.content ul {
+    margin-left: 2em
+}
+
+.content figure {
+    margin-left: 2em;
+    margin-right: 2em;
+    text-align: center
+}
+
+.content figure:not(:first-child) {
+    margin-top: 2em
+}
+
+.content figure:not(:last-child) {
+    margin-bottom: 2em
+}
+
+.content figure img {
+    display: inline-block
+}
+
+.content figure figcaption {
+    font-style: italic
+}
+
+.content pre {
+    -webkit-overflow-scrolling: touch;
+    overflow-x: auto;
+    padding: 1.25em 1.5em;
+    white-space: pre;
+    word-wrap: normal
+}
+
+.content sub,
+.content sup {
+    font-size: 75%
+}
+
+.content table {
+    width: 100%
+}
+
+.content table td,
+.content table th,
+.table td,
+.table th {
+    border-width: 0 0 1px;
+    padding: .5em .75em;
+    vertical-align: top
+}
+
+.content table th,
+.table th {
+    color: #f2f2f2
+}
+
+.content table thead td,
+.content table thead th,
+.table thead td,
+.table thead th {
+    border-width: 0 0 2px;
+    color: #f2f2f2
+}
+
+.content table tfoot td,
+.content table tfoot th,
+.table tfoot td,
+.table tfoot th {
+    border-width: 2px 0 0;
+    color: #f2f2f2
+}
+
+.content table tbody tr:last-child td,
+.content table tbody tr:last-child th,
+.table tbody tr:last-child td,
+.table tbody tr:last-child th {
+    border-bottom-width: 0
+}
+
+.content .tabs li+li {
+    margin-top: 0
+}
+
+.content.is-small {
+    font-size: .85em
+}
+
+.content.is-medium {
+    font-size: 1.25rem
+}
+
+.content.is-large {
+    font-size: 1.5rem
+}
+
+.icon {
+    align-items: center;
+    display: inline-flex;
+    justify-content: center;
+    height: 1.5rem;
+    width: 1.5rem
+}
+
+.icon.is-small {
+    height: 1rem;
+    width: 1rem
+}
+
+.icon.is-medium {
+    height: 2rem;
+    width: 2rem
+}
+
+.icon.is-large {
+    height: 3rem;
+    width: 3rem
+}
+
+.image {
+    display: block;
+    position: relative
+}
+
+.image img {
+    display: block;
+    height: auto;
+    width: 100%
+}
+
+.image img.is-rounded {
+    border-radius: 290486px
+}
+
+.image.is-fullwidth {
+    width: 100%
+}
+
+.image.is-16by9 .has-ratio,
+.image.is-16by9 img,
+.image.is-1by1 .has-ratio,
+.image.is-1by1 img,
+.image.is-1by2 .has-ratio,
+.image.is-1by2 img,
+.image.is-1by3 .has-ratio,
+.image.is-1by3 img,
+.image.is-2by1 .has-ratio,
+.image.is-2by1 img,
+.image.is-2by3 .has-ratio,
+.image.is-2by3 img,
+.image.is-3by1 .has-ratio,
+.image.is-3by1 img,
+.image.is-3by2 .has-ratio,
+.image.is-3by2 img,
+.image.is-3by4 .has-ratio,
+.image.is-3by4 img,
+.image.is-3by5 .has-ratio,
+.image.is-3by5 img,
+.image.is-4by3 .has-ratio,
+.image.is-4by3 img,
+.image.is-4by5 .has-ratio,
+.image.is-4by5 img,
+.image.is-5by3 .has-ratio,
+.image.is-5by3 img,
+.image.is-5by4 .has-ratio,
+.image.is-5by4 img,
+.image.is-9by16 .has-ratio,
+.image.is-9by16 img,
+.image.is-square .has-ratio,
+.image.is-square img {
+    height: 100%;
+    width: 100%
+}
+
+.image.is-1by1,
+.image.is-square {
+    padding-top: 100%
+}
+
+.image.is-5by4 {
+    padding-top: 80%
+}
+
+.image.is-4by3 {
+    padding-top: 75%
+}
+
+.image.is-3by2 {
+    padding-top: 66.6666%
+}
+
+.image.is-5by3 {
+    padding-top: 60%
+}
+
+.image.is-16by9 {
+    padding-top: 56.25%
+}
+
+.image.is-2by1 {
+    padding-top: 50%
+}
+
+.image.is-3by1 {
+    padding-top: 33.3333%
+}
+
+.image.is-4by5 {
+    padding-top: 125%
+}
+
+.image.is-3by4 {
+    padding-top: 133.3333%
+}
+
+.image.is-2by3 {
+    padding-top: 150%
+}
+
+.image.is-3by5 {
+    padding-top: 166.6666%
+}
+
+.image.is-9by16 {
+    padding-top: 177.7777%
+}
+
+.image.is-1by2 {
+    padding-top: 200%
+}
+
+.image.is-1by3 {
+    padding-top: 300%
+}
+
+.image.is-16x16 {
+    height: 16px;
+    width: 16px
+}
+
+.image.is-24x24 {
+    height: 24px;
+    width: 24px
+}
+
+.image.is-32x32 {
+    height: 32px;
+    width: 32px
+}
+
+.image.is-48x48 {
+    height: 48px;
+    width: 48px
+}
+
+.image.is-64x64 {
+    height: 64px;
+    width: 64px
+}
+
+.image.is-96x96 {
+    height: 96px;
+    width: 96px
+}
+
+.image.is-128x128 {
+    height: 128px;
+    width: 128px
+}
+
+.notification {
+    border-radius: .4em;
+    padding: 1.25rem 2.5rem 1.25rem 1.5rem;
+    position: relative
+}
+
+.message a:not(.button):not(.tag):not(.dropdown-item),
+.notification a:not(.button):not(.dropdown-item) {
+    color: currentColor;
+    text-decoration: underline
+}
+
+.notification code,
+.notification pre {
+    background: #fff
+}
+
+.notification pre code {
+    background: 0 0
+}
+
+.notification>.delete {
+    position: absolute;
+    right: .5rem;
+    top: .5rem
+}
+
+.notification .content,
+.notification .subtitle,
+.notification .title,
+.notification strong,
+.table td.is-selected a,
+.table td.is-selected strong,
+.table th.is-selected a,
+.table th.is-selected strong,
+.table tr.is-selected a,
+.table tr.is-selected strong {
+    color: currentColor
+}
+
+.notification.is-white {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.notification.is-black {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.notification.is-light {
+    background-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.notification.is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.notification.is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.notification.is-primary.is-light {
+    background-color: #f1f5f9;
+    color: #4d7eb2
+}
+
+.notification.is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.notification.is-link.is-light {
+    background-color: #edfdf9;
+    color: #15987e
+}
+
+.notification.is-info {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.notification.is-info.is-light {
+    background-color: #eef6fc;
+    color: #1d72aa
+}
+
+.notification.is-success {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.notification.is-success.is-light {
+    background-color: #eefbf4;
+    color: #1d8147
+}
+
+.notification.is-warning {
+    background-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.notification.is-warning.is-light {
+    background-color: #fef9ec;
+    color: #8c6a08
+}
+
+.notification.is-danger {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.notification.is-danger.is-light {
+    background-color: #fdeeed;
+    color: #c32818
+}
+
+.progress {
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    border: 0;
+    border-radius: 290486px;
+    display: block;
+    height: 15px;
+    overflow: hidden;
+    padding: 0;
+    width: 100%
+}
+
+.progress::-webkit-progress-bar {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.progress::-webkit-progress-value {
+    background-color: #dbdee0
+}
+
+.progress::-moz-progress-bar {
+    background-color: #dbdee0
+}
+
+.progress::-ms-fill {
+    background-color: #dbdee0;
+    border: 0
+}
+
+.progress.is-white::-webkit-progress-value {
+    background-color: #fff
+}
+
+.progress.is-white::-moz-progress-bar {
+    background-color: #fff
+}
+
+.progress.is-white::-ms-fill {
+    background-color: #fff
+}
+
+.progress.is-white:indeterminate {
+    background-image: linear-gradient(to right, #fff 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-black::-webkit-progress-value {
+    background-color: #0a0a0a
+}
+
+.progress.is-black::-moz-progress-bar {
+    background-color: #0a0a0a
+}
+
+.progress.is-black::-ms-fill {
+    background-color: #0a0a0a
+}
+
+.progress.is-black:indeterminate {
+    background-image: linear-gradient(to right, #0a0a0a 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-light::-webkit-progress-value {
+    background-color: #ecf0f1
+}
+
+.progress.is-light::-moz-progress-bar {
+    background-color: #ecf0f1
+}
+
+.progress.is-light::-ms-fill {
+    background-color: #ecf0f1
+}
+
+.progress.is-light:indeterminate {
+    background-image: linear-gradient(to right, #ecf0f1 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-dark::-webkit-progress-value {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.progress.is-dark::-moz-progress-bar {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.progress.is-dark::-ms-fill {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.progress.is-dark:indeterminate {
+    background-image: linear-gradient(to right, #6a6a6a 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-primary::-webkit-progress-value {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-primary::-moz-progress-bar {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-primary::-ms-fill {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-primary:indeterminate {
+    background-image: linear-gradient(to right, hsl(var(--main), 45%, 45%) 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-link::-webkit-progress-value {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-link::-moz-progress-bar {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-link::-ms-fill {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-link:indeterminate {
+    background-image: linear-gradient(to right, hsl(var(--main), 45%, 45%) 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-info::-webkit-progress-value {
+    background-color: #3298dc
+}
+
+.progress.is-info::-moz-progress-bar {
+    background-color: #3298dc
+}
+
+.progress.is-info::-ms-fill {
+    background-color: #3298dc
+}
+
+.progress.is-info:indeterminate {
+    background-image: linear-gradient(to right, #3298dc 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-success::-webkit-progress-value {
+    background-color: #2ecc71
+}
+
+.progress.is-success::-moz-progress-bar {
+    background-color: #2ecc71
+}
+
+.progress.is-success::-ms-fill {
+    background-color: #2ecc71
+}
+
+.progress.is-success:indeterminate {
+    background-image: linear-gradient(to right, #2ecc71 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-warning::-webkit-progress-value {
+    background-color: #f1b70e
+}
+
+.progress.is-warning::-moz-progress-bar {
+    background-color: #f1b70e
+}
+
+.progress.is-warning::-ms-fill {
+    background-color: #f1b70e
+}
+
+.progress.is-warning:indeterminate {
+    background-image: linear-gradient(to right, #f1b70e 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-danger::-webkit-progress-value {
+    background-color: #e74c3c
+}
+
+.progress.is-danger::-moz-progress-bar {
+    background-color: #e74c3c
+}
+
+.progress.is-danger::-ms-fill {
+    background-color: #e74c3c
+}
+
+.progress.is-danger:indeterminate {
+    background-image: linear-gradient(to right, #e74c3c 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress:indeterminate {
+    -webkit-animation-duration: 1.5s;
+    animation-duration: 1.5s;
+    -webkit-animation-iteration-count: infinite;
+    animation-iteration-count: infinite;
+    -webkit-animation-name: moveIndeterminate;
+    animation-name: moveIndeterminate;
+    -webkit-animation-timing-function: linear;
+    animation-timing-function: linear;
+    background-color: hsl(var(--main), 10%, 15%);
+    background-image: linear-gradient(to right, #fff 30%, hsl(var(--main), 10%, 15%) 30%);
+    background-position: top left;
+    background-repeat: no-repeat;
+    background-size: 150% 150%
+}
+
+.progress:indeterminate::-webkit-progress-bar {
+    background-color: transparent
+}
+
+.progress:indeterminate::-moz-progress-bar {
+    background-color: transparent
+}
+
+.progress.is-small {
+    height: .85em
+}
+
+.progress.is-medium {
+    height: 1.25rem
+}
+
+.progress.is-large {
+    height: 1.5rem
+}
+
+.table {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.table td.is-white,
+.table th.is-white {
+    background-color: #fff;
+    border-color: #fff;
+    color: #0a0a0a
+}
+
+.hero.is-white .tabs.is-boxed li.is-active a,
+.hero.is-white .tabs.is-boxed li.is-active a:hover,
+.hero.is-white .tabs.is-toggle li.is-active a,
+.hero.is-white .tabs.is-toggle li.is-active a:hover,
+.table td.is-black,
+.table th.is-black {
+    background-color: #0a0a0a;
+    border-color: #0a0a0a;
+    color: #fff
+}
+
+.table td.is-light,
+.table th.is-light {
+    background-color: #ecf0f1;
+    border-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.table td.is-dark,
+.table th.is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.table td.is-primary,
+.table th.is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.table td.is-link,
+.table th.is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.table td.is-info,
+.table th.is-info {
+    background-color: #3298dc;
+    border-color: #3298dc;
+    color: #fff
+}
+
+.table td.is-success,
+.table th.is-success {
+    background-color: #2ecc71;
+    border-color: #2ecc71;
+    color: #fff
+}
+
+.table td.is-warning,
+.table th.is-warning {
+    background-color: #f1b70e;
+    border-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.table td.is-danger,
+.table th.is-danger {
+    background-color: #e74c3c;
+    border-color: #e74c3c;
+    color: #fff
+}
+
+.table td.is-narrow,
+.table th.is-narrow {
+    white-space: nowrap;
+    width: 1%
+}
+
+.table td.is-selected,
+.table th.is-selected,
+.table tr.is-selected {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.table th:not([align]) {
+    text-align: left
+}
+
+.table tr.is-selected td,
+.table tr.is-selected th {
+    border-color: #fff;
+    color: currentColor
+}
+
+.message-body pre code,
+.table tbody,
+.table tfoot,
+.table thead {
+    background-color: transparent
+}
+
+.table.is-bordered td,
+.table.is-bordered th {
+    border-width: 1px
+}
+
+.table.is-bordered tr:last-child td,
+.table.is-bordered tr:last-child th {
+    border-bottom-width: 1px
+}
+
+.table.is-fullwidth {
+    width: 100%
+}
+
+.table.is-hoverable tbody tr:not(.is-selected):hover,
+.table.is-hoverable.is-striped tbody tr:not(.is-selected):hover {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.table.is-hoverable.is-striped tbody tr:not(.is-selected):hover:nth-child(even) {
+    background-color: #2d3435
+}
+
+.table.is-narrow td,
+.table.is-narrow th {
+    padding: .25em .5em
+}
+
+.table.is-striped tbody tr:not(.is-selected):nth-child(even) {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.table-container {
+    -webkit-overflow-scrolling: touch;
+    overflow: auto;
+    overflow-y: hidden;
+    max-width: 100%
+}
+
+.tags {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start
+}
+
+.tags .tag {
+    margin-bottom: .5rem
+}
+
+.tags .tag:not(:last-child) {
+    margin-right: .5rem
+}
+
+.tags:last-child {
+    margin-bottom: -.5rem
+}
+
+.tags:not(:last-child) {
+    margin-bottom: 1rem
+}
+
+.tags.are-medium .tag:not(.is-normal):not(.is-large) {
+    font-size: 15px
+}
+
+.tags.are-large .tag:not(.is-normal):not(.is-medium) {
+    font-size: 1.25rem
+}
+
+.tags.is-centered {
+    justify-content: center
+}
+
+.tags.is-centered .tag {
+    margin-right: .25rem;
+    margin-left: .25rem
+}
+
+.tags.is-right {
+    justify-content: flex-end
+}
+
+.tags.is-right .tag:not(:first-child) {
+    margin-left: .5rem
+}
+
+.tags.is-right .tag:not(:last-child) {
+    margin-right: 0
+}
+
+.tags.has-addons .tag {
+    margin-right: 0
+}
+
+.tags.has-addons .tag:not(:first-child) {
+    margin-left: 0;
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0
+}
+
+.tags.has-addons .tag:not(:last-child) {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0
+}
+
+.tag:not(body) {
+    align-items: center;
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: .4em;
+    color: #fff;
+    display: inline-flex;
+    font-size: .85em;
+    height: 2em;
+    justify-content: center;
+    line-height: 1.5;
+    padding-left: .75em;
+    padding-right: .75em;
+    white-space: nowrap
+}
+
+.tag:not(body) .delete {
+    margin-left: .25rem;
+    margin-right: -.375rem
+}
+
+.tag:not(body).is-white {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.tag:not(body).is-black {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.tag:not(body).is-light {
+    background-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.tag:not(body).is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.tag:not(body).is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.tag:not(body).is-primary.is-light {
+    background-color: #f1f5f9;
+    color: #4d7eb2
+}
+
+.tag:not(body).is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.tag:not(body).is-link.is-light {
+    background-color: #edfdf9;
+    color: #15987e
+}
+
+.tag:not(body).is-info {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.tag:not(body).is-info.is-light {
+    background-color: #eef6fc;
+    color: #1d72aa
+}
+
+.tag:not(body).is-success {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.tag:not(body).is-success.is-light {
+    background-color: #eefbf4;
+    color: #1d8147
+}
+
+.tag:not(body).is-warning {
+    background-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.tag:not(body).is-warning.is-light {
+    background-color: #fef9ec;
+    color: #8c6a08
+}
+
+.tag:not(body).is-danger {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.tag:not(body).is-danger.is-light {
+    background-color: #fdeeed;
+    color: #c32818
+}
+
+.tag:not(body).is-normal {
+    font-size: .85em
+}
+
+.tag:not(body).is-medium {
+    font-size: 15px
+}
+
+.tag:not(body).is-large {
+    font-size: 1.25rem
+}
+
+.tag:not(body) .icon:first-child:not(:last-child) {
+    margin-left: -.375em;
+    margin-right: .1875em
+}
+
+.tag:not(body) .icon:last-child:not(:first-child) {
+    margin-left: .1875em;
+    margin-right: -.375em
+}
+
+.tag:not(body) .icon:first-child:last-child {
+    margin-left: -.375em;
+    margin-right: -.375em
+}
+
+.tag:not(body).is-delete {
+    margin-left: 1px;
+    padding: 0;
+    position: relative;
+    width: 2em
+}
+
+.tag:not(body).is-delete::after,
+.tag:not(body).is-delete::before {
+    background-color: currentColor;
+    content: "";
+    display: block;
+    left: 50%;
+    position: absolute;
+    top: 50%;
+    transform: translateX(-50%) translateY(-50%) rotate(45deg);
+    transform-origin: center center
+}
+
+.tag:not(body).is-delete::before {
+    height: 1px;
+    width: 50%
+}
+
+.tag:not(body).is-delete::after {
+    height: 50%;
+    width: 1px
+}
+
+.tag:not(body).is-delete:focus,
+.tag:not(body).is-delete:hover {
+    background-color: #1d2122
+}
+
+.tag:not(body).is-delete:active {
+    background-color: #111414
+}
+
+.tag:not(body).is-rounded {
+    border-radius: 290486px
+}
+
+a.tag:hover {
+    text-decoration: underline
+}
+
+.subtitle,
+.title {
+    word-break: break-word
+}
+
+.subtitle em,
+.subtitle span,
+.title em,
+.title span,
+.title strong {
+    font-weight: inherit
+}
+
+.subtitle sub,
+.subtitle sup,
+.title sub,
+.title sup {
+    font-size: .75em
+}
+
+.subtitle .tag,
+.title .tag {
+    vertical-align: middle
+}
+
+.title {
+    color: #fff;
+    font-size: 2rem;
+    font-weight: 500;
+    line-height: 1.125
+}
+
+.title strong {
+    color: inherit
+}
+
+.title+.highlight {
+    margin-top: -.75rem
+}
+
+.subtitle:not(.is-spaced)+.title,
+.title:not(.is-spaced)+.subtitle {
+    margin-top: -1.25rem
+}
+
+.title.is-1 {
+    font-size: 3rem
+}
+
+.title.is-2 {
+    font-size: 2.5rem
+}
+
+.title.is-3 {
+    font-size: 2rem
+}
+
+.title.is-4 {
+    font-size: 1.5rem
+}
+
+.subtitle,
+.title.is-5 {
+    font-size: 1.25rem
+}
+
+.title.is-6 {
+    font-size: 15px
+}
+
+.title.is-7 {
+    font-size: .85em
+}
+
+.subtitle {
+    color: #d4d4d4;
+    font-weight: 400;
+    line-height: 1.25
+}
+
+.subtitle strong {
+    color: #8c9b9d;
+    font-weight: 600
+}
+
+.subtitle.is-1 {
+    font-size: 3rem
+}
+
+.subtitle.is-2 {
+    font-size: 2.5rem
+}
+
+.subtitle.is-3 {
+    font-size: 2rem
+}
+
+.subtitle.is-4 {
+    font-size: 1.5rem
+}
+
+.subtitle.is-5 {
+    font-size: 1.25rem
+}
+
+.subtitle.is-6 {
+    font-size: 15px
+}
+
+.subtitle.is-7 {
+    font-size: .85em
+}
+
+.heading {
+    display: block;
+    font-size: 11px;
+    letter-spacing: 1px;
+    margin-bottom: 5px;
+    text-transform: uppercase
+}
+
+.highlight {
+    font-weight: 400;
+    max-width: 100%;
+    overflow: hidden;
+    padding: 0
+}
+
+.highlight pre {
+    overflow: auto;
+    max-width: 100%
+}
+
+.number {
+    align-items: center;
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: 290486px;
+    display: inline-flex;
+    font-size: 1.25rem;
+    height: 2em;
+    justify-content: center;
+    margin-right: 1.5rem;
+    min-width: 2.5em;
+    padding: .25rem .5rem;
+    text-align: center;
+    vertical-align: top
+}
+
+.input,
+.select select,
+.textarea {
+    border: none;
+    background-color: hsl(var(--main), 15%, 15%);
+    border-radius: .4em;
+    color: #fff
+}
+
+.input:-moz-placeholder,
+.input::-moz-placeholder,
+.select select:-moz-placeholder,
+.select select::-moz-placeholder,
+.textarea:-moz-placeholder,
+.textarea::-moz-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input::-webkit-input-placeholder,
+.select select::-webkit-input-placeholder,
+.textarea::-webkit-input-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input:-ms-input-placeholder,
+.select select:-ms-input-placeholder,
+.textarea:-ms-input-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input:hover,
+.is-hovered.input,
+.is-hovered.textarea,
+.select select.is-hovered,
+.select select:hover,
+.textarea:hover {
+    border-color: hsl(var(--main), 15%, 15%)
+}
+
+.input:active,
+.input:focus,
+.is-active.input,
+.is-active.textarea,
+.is-focused.input,
+.is-focused.textarea,
+.select select.is-active,
+.select select.is-focused,
+.select select:active,
+.select select:focus,
+.textarea:active,
+.textarea:focus {
+    border-color: hsl(var(--main), 45%, 45%);
+    box-shadow: 0 0 0 .125em hsl(var(--main), 25%, 45%, 45%)
+}
+
+.input[disabled],
+.select fieldset[disabled] select,
+.select select[disabled],
+.textarea[disabled],
+fieldset[disabled] .input,
+fieldset[disabled] .select select,
+fieldset[disabled] .textarea {
+    background-color: hsl(var(--main), 15%, 15%);
+    border-color: hsl(var(--main), 10%, 15%);
+    box-shadow: none;
+    color: #fff;
+    opacity: .9
+}
+
+.input[disabled]:-moz-placeholder,
+.input[disabled]::-moz-placeholder,
+.select fieldset[disabled] select:-moz-placeholder,
+.select fieldset[disabled] select::-moz-placeholder,
+.select select[disabled]:-moz-placeholder,
+.select select[disabled]::-moz-placeholder,
+.textarea[disabled]:-moz-placeholder,
+.textarea[disabled]::-moz-placeholder,
+fieldset[disabled] .input:-moz-placeholder,
+fieldset[disabled] .input::-moz-placeholder,
+fieldset[disabled] .select select:-moz-placeholder,
+fieldset[disabled] .select select::-moz-placeholder,
+fieldset[disabled] .textarea:-moz-placeholder,
+fieldset[disabled] .textarea::-moz-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input[disabled]::-webkit-input-placeholder,
+.select fieldset[disabled] select::-webkit-input-placeholder,
+.select select[disabled]::-webkit-input-placeholder,
+.textarea[disabled]::-webkit-input-placeholder,
+fieldset[disabled] .input::-webkit-input-placeholder,
+fieldset[disabled] .select select::-webkit-input-placeholder,
+fieldset[disabled] .textarea::-webkit-input-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input[disabled]:-ms-input-placeholder,
+.select fieldset[disabled] select:-ms-input-placeholder,
+.select select[disabled]:-ms-input-placeholder,
+.textarea[disabled]:-ms-input-placeholder,
+fieldset[disabled] .input:-ms-input-placeholder,
+fieldset[disabled] .select select:-ms-input-placeholder,
+fieldset[disabled] .textarea:-ms-input-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input {
+    max-width: 100%
+}
+
+.input,
+.textarea {
+    box-shadow: inset 0 .0625em .125em rgba(10, 10, 10, .05);
+    width: 100%
+}
+
+.input[readonly],
+.textarea[readonly] {
+    box-shadow: none
+}
+
+.is-white.input,
+.is-white.textarea {
+    border-color: #fff
+}
+
+.is-white.input:active,
+.is-white.input:focus,
+.is-white.is-active.input,
+.is-white.is-active.textarea,
+.is-white.is-focused.input,
+.is-white.is-focused.textarea,
+.is-white.textarea:active,
+.is-white.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(255, 255, 255, .25)
+}
+
+.is-black.input,
+.is-black.textarea {
+    border-color: #0a0a0a
+}
+
+.is-black.input:active,
+.is-black.input:focus,
+.is-black.is-active.input,
+.is-black.is-active.textarea,
+.is-black.is-focused.input,
+.is-black.is-focused.textarea,
+.is-black.textarea:active,
+.is-black.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(10, 10, 10, .25)
+}
+
+.is-light.input,
+.is-light.textarea {
+    border-color: #ecf0f1
+}
+
+.is-light.input:active,
+.is-light.input:focus,
+.is-light.is-active.input,
+.is-light.is-active.textarea,
+.is-light.is-focused.input,
+.is-light.is-focused.textarea,
+.is-light.textarea:active,
+.is-light.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(236, 240, 241, .25)
+}
+
+.is-dark.input,
+.is-dark.textarea,
+.select select[disabled]:hover,
+fieldset[disabled] .select select:hover {
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.is-dark.input:active,
+.is-dark.input:focus,
+.is-dark.is-active.input,
+.is-dark.is-active.textarea,
+.is-dark.is-focused.input,
+.is-dark.is-focused.textarea,
+.is-dark.textarea:active,
+.is-dark.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(40, 47, 47, .25)
+}
+
+.is-primary.input,
+.is-primary.textarea {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.is-primary.input:active,
+.is-primary.input:focus,
+.is-primary.is-active.input,
+.is-primary.is-active.textarea,
+.is-primary.is-focused.input,
+.is-primary.is-focused.textarea,
+.is-primary.textarea:active,
+.is-primary.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(55, 90, 127, .25)
+}
+
+.is-link.input,
+.is-link.textarea {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.is-link.input:active,
+.is-link.input:focus,
+.is-link.is-active.input,
+.is-link.is-active.textarea,
+.is-link.is-focused.input,
+.is-link.is-focused.textarea,
+.is-link.textarea:active,
+.is-link.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(26, 188, 156, .25)
+}
+
+.is-info.input,
+.is-info.textarea {
+    border-color: #3298dc
+}
+
+.is-info.input:active,
+.is-info.input:focus,
+.is-info.is-active.input,
+.is-info.is-active.textarea,
+.is-info.is-focused.input,
+.is-info.is-focused.textarea,
+.is-info.textarea:active,
+.is-info.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(50, 152, 220, .25)
+}
+
+.is-success.input,
+.is-success.textarea {
+    border-color: #2ecc71
+}
+
+.is-success.input:active,
+.is-success.input:focus,
+.is-success.is-active.input,
+.is-success.is-active.textarea,
+.is-success.is-focused.input,
+.is-success.is-focused.textarea,
+.is-success.textarea:active,
+.is-success.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(46, 204, 113, .25)
+}
+
+.is-warning.input,
+.is-warning.textarea {
+    border-color: #f1b70e
+}
+
+.is-warning.input:active,
+.is-warning.input:focus,
+.is-warning.is-active.input,
+.is-warning.is-active.textarea,
+.is-warning.is-focused.input,
+.is-warning.is-focused.textarea,
+.is-warning.textarea:active,
+.is-warning.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(241, 183, 14, .25)
+}
+
+.is-danger.input,
+.is-danger.textarea {
+    border-color: #e74c3c
+}
+
+.is-danger.input:active,
+.is-danger.input:focus,
+.is-danger.is-active.input,
+.is-danger.is-active.textarea,
+.is-danger.is-focused.input,
+.is-danger.is-focused.textarea,
+.is-danger.textarea:active,
+.is-danger.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(231, 76, 60, .25)
+}
+
+.is-small.input,
+.is-small.textarea {
+    border-radius: 3px;
+    font-size: .85em
+}
+
+.is-medium.input,
+.is-medium.textarea {
+    font-size: 1.25rem
+}
+
+.is-large.input,
+.is-large.textarea {
+    font-size: 1.5rem
+}
+
+.is-fullwidth.input,
+.is-fullwidth.textarea {
+    display: block;
+    width: 100%
+}
+
+.is-inline.input,
+.is-inline.textarea {
+    display: inline;
+    width: auto
+}
+
+.input.is-rounded {
+    border-radius: 290486px;
+    padding-left: calc(calc(.75em - 1px) + .375em);
+    padding-right: calc(calc(.75em - 1px) + .375em)
+}
+
+.input.is-static {
+    background-color: transparent;
+    border-color: transparent;
+    box-shadow: none;
+    padding-left: 0;
+    padding-right: 0
+}
+
+.textarea {
+    display: block;
+    max-width: 100%;
+    min-width: 100%;
+    padding: calc(.75em - 1px);
+    resize: vertical
+}
+
+.textarea:not([rows]) {
+    max-height: 40em;
+    min-height: 8em
+}
+
+.textarea[rows] {
+    height: initial
+}
+
+.textarea.has-fixed-size {
+    resize: none
+}
+
+.checkbox,
+.radio,
+.select {
+    display: inline-block;
+    position: relative
+}
+
+.checkbox,
+.radio {
+    cursor: pointer;
+    line-height: 1.25
+}
+
+.checkbox input,
+.radio input {
+    cursor: pointer
+}
+
+.checkbox:hover,
+.radio:hover {
+    color: #8c9b9d
+}
+
+.checkbox[disabled],
+.radio[disabled],
+fieldset[disabled] .checkbox,
+fieldset[disabled] .radio {
+    color: #fff;
+    cursor: not-allowed
+}
+
+.radio+.radio {
+    margin-left: .5em
+}
+
+.select {
+    max-width: 100%;
+    vertical-align: top
+}
+
+.select:not(.is-multiple) {
+    height: 2.5em
+}
+
+.select:not(.is-multiple):not(.is-loading)::after {
+    border-color: #fff;
+    right: 1.125em;
+    z-index: 4
+}
+
+.select.is-rounded select {
+    border-radius: 290486px;
+    padding-left: 1em
+}
+
+.select select {
+    cursor: pointer;
+    display: block;
+    font-size: 1em;
+    max-width: 100%;
+    outline: 0
+}
+
+.select select::-ms-expand {
+    display: none
+}
+
+.select select:not([multiple]) {
+    padding-right: 2.5em
+}
+
+.select select[multiple] {
+    height: auto;
+    padding: 0
+}
+
+.select select[multiple] option {
+    padding: .5em 1em
+}
+
+.select:not(.is-multiple):not(.is-loading):hover::after {
+    border-color: #8c9b9d
+}
+
+.select.is-white:not(:hover)::after {
+    border-color: #fff
+}
+
+.select.is-disabled::after,
+.select.is-white select {
+    border-color: #fff
+}
+
+.select.is-white select.is-hovered,
+.select.is-white select:hover {
+    border-color: #f2f2f2
+}
+
+.select.is-white select.is-active,
+.select.is-white select.is-focused,
+.select.is-white select:active,
+.select.is-white select:focus {
+    box-shadow: 0 0 0 .125em rgba(255, 255, 255, .25)
+}
+
+.select.is-black:not(:hover)::after {
+    border-color: #0a0a0a
+}
+
+.select.is-black select {
+    border-color: #0a0a0a
+}
+
+.select.is-black select.is-hovered,
+.select.is-black select:hover {
+    border-color: #000
+}
+
+.select.is-black select.is-active,
+.select.is-black select.is-focused,
+.select.is-black select:active,
+.select.is-black select:focus {
+    box-shadow: 0 0 0 .125em rgba(10, 10, 10, .25)
+}
+
+.select.is-light:not(:hover)::after {
+    border-color: #ecf0f1
+}
+
+.select.is-light select {
+    border-color: #ecf0f1
+}
+
+.select.is-light select.is-hovered,
+.select.is-light select:hover {
+    border-color: #dde4e6
+}
+
+.select.is-light select.is-active,
+.select.is-light select.is-focused,
+.select.is-light select:active,
+.select.is-light select:focus {
+    box-shadow: 0 0 0 .125em rgba(236, 240, 241, .25)
+}
+
+.select.is-dark:not(:hover)::after {
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.select.is-dark select {
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.select.is-dark select.is-hovered,
+.select.is-dark select:hover {
+    border-color: #1d2122
+}
+
+.select.is-dark select.is-active,
+.select.is-dark select.is-focused,
+.select.is-dark select:active,
+.select.is-dark select:focus {
+    box-shadow: 0 0 0 .125em rgba(40, 47, 47, .25)
+}
+
+.select.is-primary:not(:hover)::after {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.select.is-primary select {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.select.is-primary select.is-hovered,
+.select.is-primary select:hover {
+    border-color: #2f4d6d
+}
+
+.select.is-primary select.is-active,
+.select.is-primary select.is-focused,
+.select.is-primary select:active,
+.select.is-primary select:focus {
+    box-shadow: 0 0 0 .125em rgba(55, 90, 127, .25)
+}
+
+.select.is-link:not(:hover)::after {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.select.is-link select {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.select.is-link select.is-hovered,
+.select.is-link select:hover {
+    border-color: hsl(var(--main), 75%, 80%)
+}
+
+.select.is-link select.is-active,
+.select.is-link select.is-focused,
+.select.is-link select:active,
+.select.is-link select:focus {
+    box-shadow: 0 0 0 .125em rgba(26, 188, 156, .25)
+}
+
+.select.is-info:not(:hover)::after {
+    border-color: #3298dc
+}
+
+.select.is-info select {
+    border-color: #3298dc
+}
+
+.select.is-info select.is-hovered,
+.select.is-info select:hover {
+    border-color: #238cd1
+}
+
+.select.is-info select.is-active,
+.select.is-info select.is-focused,
+.select.is-info select:active,
+.select.is-info select:focus {
+    box-shadow: 0 0 0 .125em rgba(50, 152, 220, .25)
+}
+
+.select.is-success:not(:hover)::after {
+    border-color: #2ecc71
+}
+
+.select.is-success select {
+    border-color: #2ecc71
+}
+
+.select.is-success select.is-hovered,
+.select.is-success select:hover {
+    border-color: #29b765
+}
+
+.select.is-success select.is-active,
+.select.is-success select.is-focused,
+.select.is-success select:active,
+.select.is-success select:focus {
+    box-shadow: 0 0 0 .125em rgba(46, 204, 113, .25)
+}
+
+.select.is-warning:not(:hover)::after {
+    border-color: #f1b70e
+}
+
+.select.is-warning select {
+    border-color: #f1b70e
+}
+
+.select.is-warning select.is-hovered,
+.select.is-warning select:hover {
+    border-color: #d9a50d
+}
+
+.select.is-warning select.is-active,
+.select.is-warning select.is-focused,
+.select.is-warning select:active,
+.select.is-warning select:focus {
+    box-shadow: 0 0 0 .125em rgba(241, 183, 14, .25)
+}
+
+.select.is-danger:not(:hover)::after {
+    border-color: #e74c3c
+}
+
+.select.is-danger select {
+    border-color: #e74c3c
+}
+
+.select.is-danger select.is-hovered,
+.select.is-danger select:hover {
+    border-color: #e43725
+}
+
+.select.is-danger select.is-active,
+.select.is-danger select.is-focused,
+.select.is-danger select:active,
+.select.is-danger select:focus {
+    box-shadow: 0 0 0 .125em rgba(231, 76, 60, .25)
+}
+
+.select.is-small {
+    border-radius: 3px;
+    font-size: .85em
+}
+
+.select.is-medium {
+    font-size: 1.25rem
+}
+
+.select.is-large {
+    font-size: 1.5rem
+}
+
+.select.is-fullwidth,
+.select.is-fullwidth select {
+    width: 100%
+}
+
+.select.is-loading::after {
+    margin-top: 0;
+    position: absolute;
+    right: .625em;
+    top: .625em;
+    transform: none
+}
+
+.file.is-small,
+.select.is-loading.is-small:after {
+    font-size: .85em
+}
+
+.file.is-medium,
+.select.is-loading.is-medium:after {
+    font-size: 1.25rem
+}
+
+.file.is-large,
+.select.is-loading.is-large:after {
+    font-size: 1.5rem
+}
+
+.file {
+    align-items: stretch;
+    display: flex;
+    justify-content: flex-start;
+    position: relative
+}
+
+.file.is-white .file-cta {
+    background-color: #fff;
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.file.is-white.is-hovered .file-cta,
+.file.is-white:hover .file-cta {
+    background-color: #f9f9f9;
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.file.is-white.is-focused .file-cta,
+.file.is-white:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(255, 255, 255, .25);
+    color: #0a0a0a
+}
+
+.file.is-white.is-active .file-cta,
+.file.is-white:active .file-cta {
+    background-color: #f2f2f2;
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.file.is-black .file-cta {
+    background-color: #0a0a0a;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-black.is-hovered .file-cta,
+.file.is-black:hover .file-cta {
+    background-color: #040404;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-black.is-focused .file-cta,
+.file.is-black:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(10, 10, 10, .25);
+    color: #fff
+}
+
+.file.is-black.is-active .file-cta,
+.file.is-black:active .file-cta {
+    background-color: #000;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-light .file-cta {
+    background-color: #ecf0f1;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-light.is-hovered .file-cta,
+.file.is-light:hover .file-cta {
+    background-color: #e5eaec;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-light.is-focused .file-cta,
+.file.is-light:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(236, 240, 241, .25);
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-light.is-active .file-cta,
+.file.is-light:active .file-cta {
+    background-color: #dde4e6;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-dark .file-cta {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-dark.is-hovered .file-cta,
+.file.is-dark:hover .file-cta {
+    background-color: #232829;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-dark.is-focused .file-cta,
+.file.is-dark:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(40, 47, 47, .25);
+    color: #fff
+}
+
+.file.is-dark.is-active .file-cta,
+.file.is-dark:active .file-cta,
+.file.is-primary .file-cta {
+    background-color: #1d2122;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-primary .file-cta {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.file.is-primary.is-hovered .file-cta,
+.file.is-primary:hover .file-cta {
+    background-color: #335476;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-primary.is-focused .file-cta,
+.file.is-primary:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(55, 90, 127, .25);
+    color: #fff
+}
+
+.file.is-link .file-cta,
+.file.is-primary.is-active .file-cta,
+.file.is-primary:active .file-cta {
+    background-color: #2f4d6d;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-link .file-cta {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.file.is-link.is-hovered .file-cta,
+.file.is-link:hover .file-cta {
+    background-color: #18b193;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-link.is-focused .file-cta,
+.file.is-link:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(26, 188, 156, .25);
+    color: #fff
+}
+
+.file.is-info .file-cta,
+.file.is-link.is-active .file-cta,
+.file.is-link:active .file-cta {
+    background-color: hsl(var(--main), 75%, 80%);
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-info .file-cta {
+    background-color: #3298dc
+}
+
+.file.is-info.is-hovered .file-cta,
+.file.is-info:hover .file-cta {
+    background-color: #2793da;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-info.is-focused .file-cta,
+.file.is-info:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(50, 152, 220, .25);
+    color: #fff
+}
+
+.file.is-info.is-active .file-cta,
+.file.is-info:active .file-cta,
+.file.is-success .file-cta {
+    background-color: #238cd1;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-success .file-cta {
+    background-color: #2ecc71
+}
+
+.file.is-success.is-hovered .file-cta,
+.file.is-success:hover .file-cta {
+    background-color: #2cc26b;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-success.is-focused .file-cta,
+.file.is-success:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(46, 204, 113, .25);
+    color: #fff
+}
+
+.file.is-success.is-active .file-cta,
+.file.is-success:active .file-cta {
+    background-color: #29b765;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-warning .file-cta {
+    background-color: #f1b70e;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-warning.is-hovered .file-cta,
+.file.is-warning:hover .file-cta {
+    background-color: #e5ae0d;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-warning.is-focused .file-cta,
+.file.is-warning:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(241, 183, 14, .25);
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-warning.is-active .file-cta,
+.file.is-warning:active .file-cta {
+    background-color: #d9a50d;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-danger .file-cta {
+    background-color: #e74c3c;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-danger.is-hovered .file-cta,
+.file.is-danger:hover .file-cta {
+    background-color: #e64231;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-danger.is-focused .file-cta,
+.file.is-danger:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(231, 76, 60, .25);
+    color: #fff
+}
+
+.file.is-danger.is-active .file-cta,
+.file.is-danger:active .file-cta {
+    background-color: #e43725;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-medium .file-icon .fa {
+    font-size: 21px
+}
+
+.file.is-large .file-icon .fa {
+    font-size: 28px
+}
+
+.file.has-name .file-cta {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0
+}
+
+.file.has-name .file-name {
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0
+}
+
+.file.has-name.is-empty .file-cta,
+.level code {
+    border-radius: .4em
+}
+
+.file.has-name.is-empty .file-name {
+    display: none
+}
+
+.file.is-boxed .file-label {
+    flex-direction: column
+}
+
+.file.is-boxed .file-cta {
+    flex-direction: column;
+    height: auto;
+    padding: 1em 3em
+}
+
+.file.is-boxed .file-name {
+    border-width: 0 1px 1px
+}
+
+.file.is-boxed .file-icon {
+    height: 1.5em;
+    width: 1.5em
+}
+
+.file.is-boxed .file-icon .fa {
+    font-size: 21px
+}
+
+.file.is-boxed.is-small .file-icon .fa {
+    font-size: 14px
+}
+
+.file.is-boxed.is-medium .file-icon .fa {
+    font-size: 28px
+}
+
+.file.is-boxed.is-large .file-icon .fa {
+    font-size: 35px
+}
+
+.card .card-image img,
+.file.is-boxed.has-name .file-cta {
+    border-radius: .4em .4em 0 0
+}
+
+.file.is-boxed.has-name .file-name {
+    border-radius: 0 0 .4em .4em;
+    border-width: 0 1px 1px
+}
+
+.file.is-centered {
+    justify-content: center
+}
+
+.file.is-fullwidth .file-label {
+    width: 100%
+}
+
+.file.is-fullwidth .file-name {
+    flex-grow: 1;
+    max-width: none
+}
+
+.file.is-right {
+    justify-content: flex-end
+}
+
+.file.is-right .file-cta {
+    border-radius: 0 .4em .4em 0
+}
+
+.file.is-right .file-name {
+    border-radius: .4em 0 0 .4em;
+    border-width: 1px 0 1px 1px;
+    order: -1
+}
+
+.file-label {
+    align-items: stretch;
+    display: flex;
+    cursor: pointer;
+    justify-content: flex-start;
+    overflow: hidden;
+    position: relative
+}
+
+.file-label:hover .file-cta {
+    background-color: #232829;
+    color: #f2f2f2
+}
+
+.file-label:hover .file-name {
+    border-color: #596668
+}
+
+.file-label:active .file-cta {
+    background-color: #1d2122;
+    color: #f2f2f2
+}
+
+.file-label:active .file-name {
+    border-color: #535f61
+}
+
+.file-input {
+    height: 100%;
+    left: 0;
+    opacity: 0;
+    outline: 0;
+    position: absolute;
+    top: 0;
+    width: 100%
+}
+
+.file-cta {
+    border-color: #5e6d6f
+}
+
+.file-cta,
+.file-name {
+    border-radius: .4em;
+    font-size: 1em;
+    padding-left: 1em;
+    padding-right: 1em;
+    white-space: nowrap
+}
+
+.file-cta {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.file-name {
+    border-color: #5e6d6f;
+    border-style: solid;
+    border-width: 1px 1px 1px 0;
+    display: block;
+    max-width: 16em;
+    overflow: hidden;
+    text-align: left;
+    text-overflow: ellipsis
+}
+
+.file-icon {
+    align-items: center;
+    display: flex;
+    height: 1em;
+    justify-content: center;
+    margin-right: .5em;
+    width: 1em
+}
+
+.file-icon .fa {
+    font-size: 14px
+}
+
+.label {
+    display: block;
+    font-size: 15px;
+    font-weight: 700
+}
+
+.label:not(:last-child) {
+    margin-bottom: .5em
+}
+
+.help,
+.label.is-small {
+    font-size: .85em
+}
+
+.label.is-medium {
+    font-size: 1.25rem
+}
+
+.label.is-large {
+    font-size: 1.5rem
+}
+
+.help {
+    display: block;
+    margin-top: .25rem
+}
+
+.help.is-white {
+    color: #fff
+}
+
+.help.is-black {
+    color: #0a0a0a
+}
+
+.help.is-light {
+    color: #ecf0f1
+}
+
+.help.is-dark {
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.help.is-primary {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.help.is-link {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.help.is-info {
+    color: #3298dc
+}
+
+.help.is-success {
+    color: #2ecc71
+}
+
+.help.is-warning {
+    color: #f1b70e
+}
+
+.help.is-danger {
+    color: #e74c3c
+}
+
+.field:not(:last-child) {
+    margin-bottom: .75rem
+}
+
+.field.has-addons,
+.field.is-grouped {
+    display: flex;
+    justify-content: flex-start
+}
+
+.field.has-addons .control:not(:last-child) {
+    margin-right: -1px
+}
+
+.field.has-addons .control:not(:first-child):not(:last-child) .button,
+.field.has-addons .control:not(:first-child):not(:last-child) .input,
+.field.has-addons .control:not(:first-child):not(:last-child) .select select {
+    border-radius: 0
+}
+
+.field.has-addons .control:first-child:not(:only-child) .button,
+.field.has-addons .control:first-child:not(:only-child) .input,
+.field.has-addons .control:first-child:not(:only-child) .select select {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0
+}
+
+.field.has-addons .control:last-child:not(:only-child) .button,
+.field.has-addons .control:last-child:not(:only-child) .input,
+.field.has-addons .control:last-child:not(:only-child) .select select {
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0
+}
+
+.field.has-addons .control .button:not([disabled]).is-hovered,
+.field.has-addons .control .button:not([disabled]):hover,
+.field.has-addons .control .input:not([disabled]).is-hovered,
+.field.has-addons .control .input:not([disabled]):hover,
+.field.has-addons .control .select select:not([disabled]).is-hovered,
+.field.has-addons .control .select select:not([disabled]):hover {
+    z-index: 2
+}
+
+.field.has-addons .control .button:not([disabled]).is-active,
+.field.has-addons .control .button:not([disabled]).is-focused,
+.field.has-addons .control .button:not([disabled]):active,
+.field.has-addons .control .button:not([disabled]):focus,
+.field.has-addons .control .input:not([disabled]).is-active,
+.field.has-addons .control .input:not([disabled]).is-focused,
+.field.has-addons .control .input:not([disabled]):active,
+.field.has-addons .control .input:not([disabled]):focus,
+.field.has-addons .control .select select:not([disabled]).is-active,
+.field.has-addons .control .select select:not([disabled]).is-focused,
+.field.has-addons .control .select select:not([disabled]):active,
+.field.has-addons .control .select select:not([disabled]):focus {
+    z-index: 3
+}
+
+.field.has-addons .control .button:not([disabled]).is-active:hover,
+.field.has-addons .control .button:not([disabled]).is-focused:hover,
+.field.has-addons .control .button:not([disabled]):active:hover,
+.field.has-addons .control .button:not([disabled]):focus:hover,
+.field.has-addons .control .input:not([disabled]).is-active:hover,
+.field.has-addons .control .input:not([disabled]).is-focused:hover,
+.field.has-addons .control .input:not([disabled]):active:hover,
+.field.has-addons .control .input:not([disabled]):focus:hover,
+.field.has-addons .control .select select:not([disabled]).is-active:hover,
+.field.has-addons .control .select select:not([disabled]).is-focused:hover,
+.field.has-addons .control .select select:not([disabled]):active:hover,
+.field.has-addons .control .select select:not([disabled]):focus:hover {
+    z-index: 4
+}
+
+.field.has-addons .control.is-expanded {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.field.has-addons.has-addons-centered {
+    justify-content: center
+}
+
+.field.has-addons.has-addons-right {
+    justify-content: flex-end
+}
+
+.field.has-addons.has-addons-fullwidth .control,
+.tabs.is-fullwidth li {
+    flex-grow: 1;
+    flex-shrink: 0
+}
+
+.field.is-grouped>.control {
+    flex-shrink: 0
+}
+
+.field.is-grouped>.control:not(:last-child) {
+    margin-bottom: 0;
+    margin-right: .75rem
+}
+
+.field.is-grouped>.control.is-expanded {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.breadcrumb.is-centered ol,
+.breadcrumb.is-centered ul,
+.field.is-grouped.is-grouped-centered {
+    justify-content: center
+}
+
+.breadcrumb.is-right ol,
+.breadcrumb.is-right ul,
+.field.is-grouped.is-grouped-right {
+    justify-content: flex-end
+}
+
+.field.is-grouped.is-grouped-multiline {
+    flex-wrap: wrap
+}
+
+.field.is-grouped.is-grouped-multiline>.control:last-child,
+.field.is-grouped.is-grouped-multiline>.control:not(:last-child) {
+    margin-bottom: .75rem
+}
+
+.field.is-grouped.is-grouped-multiline:last-child {
+    margin-bottom: -.75rem
+}
+
+.field.is-grouped.is-grouped-multiline:not(:last-child) {
+    margin-bottom: 0
+}
+
+@media screen and (min-width: 769px),
+print {
+    .field.is-horizontal {
+        display: flex
+    }
+}
+
+.field-label .label {
+    font-size: inherit
+}
+
+@media screen and (max-width: 768px) {
+    .field-label {
+        margin-bottom: .5rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .field-label {
+        flex-basis: 0;
+        flex-grow: 1;
+        flex-shrink: 0;
+        margin-right: 1.5rem;
+        text-align: right
+    }
+
+    .field-label.is-small {
+        font-size: .85em;
+        padding-top: .375em
+    }
+
+    .field-label.is-normal {
+        padding-top: .375em
+    }
+
+    .field-label.is-medium {
+        font-size: 1.25rem;
+        padding-top: .375em
+    }
+
+    .field-label.is-large {
+        font-size: 1.5rem;
+        padding-top: .375em
+    }
+}
+
+.field-body .field .field {
+    margin-bottom: 0
+}
+
+@media screen and (min-width: 769px),
+print {
+    .field-body {
+        display: flex;
+        flex-basis: 0;
+        flex-grow: 5
+    }
+
+    .field-body .field {
+        margin-bottom: 0
+    }
+
+    .field-body,
+    .field-body>.field {
+        flex-shrink: 1
+    }
+
+    .field-body>.field:not(.is-narrow) {
+        flex-grow: 1
+    }
+
+    .field-body>.field:not(:last-child) {
+        margin-right: .75rem
+    }
+}
+
+.control {
+    box-sizing: border-box;
+    clear: both;
+    font-size: 15px;
+    position: relative;
+    text-align: left
+}
+
+.control.has-icons-left .input:focus~.icon,
+.control.has-icons-left .select:focus~.icon,
+.control.has-icons-right .input:focus~.icon,
+.control.has-icons-right .select:focus~.icon {
+    color: #d4d4d4
+}
+
+.breadcrumb.is-small,
+.control.has-icons-left .input.is-small~.icon,
+.control.has-icons-left .select.is-small~.icon,
+.control.has-icons-right .input.is-small~.icon,
+.control.has-icons-right .select.is-small~.icon,
+.control.is-loading.is-small:after {
+    font-size: .85em
+}
+
+.breadcrumb.is-medium,
+.control.has-icons-left .input.is-medium~.icon,
+.control.has-icons-left .select.is-medium~.icon,
+.control.has-icons-right .input.is-medium~.icon,
+.control.has-icons-right .select.is-medium~.icon,
+.control.is-loading.is-medium:after {
+    font-size: 1.25rem
+}
+
+.breadcrumb.is-large,
+.control.has-icons-left .input.is-large~.icon,
+.control.has-icons-left .select.is-large~.icon,
+.control.has-icons-right .input.is-large~.icon,
+.control.has-icons-right .select.is-large~.icon,
+.control.is-loading.is-large:after {
+    font-size: 1.5rem
+}
+
+.control.has-icons-left .icon,
+.control.has-icons-right .icon {
+    color: #d4d4d4;
+    height: 2.5em;
+    pointer-events: none;
+    position: absolute;
+    top: 0;
+    width: 2.5em;
+    z-index: 4
+}
+
+.control.has-icons-left .input,
+.control.has-icons-left .select select {
+    padding-left: 2.5em
+}
+
+.control.has-icons-left .icon.is-left {
+    left: 0
+}
+
+.control.has-icons-right .input,
+.control.has-icons-right .select select {
+    padding-right: 2.5em
+}
+
+.control.has-icons-right .icon.is-right {
+    right: 0
+}
+
+.control.is-loading::after {
+    position: absolute !important;
+    right: .625em;
+    top: .625em;
+    z-index: 4
+}
+
+.breadcrumb {
+    font-size: 15px;
+    white-space: nowrap
+}
+
+.breadcrumb a {
+    justify-content: center;
+    padding: 0 .75em
+}
+
+.breadcrumb a:hover {
+    color: hsl(var(--main), 75%, 90%)
+}
+
+.breadcrumb a,
+.breadcrumb li {
+    align-items: center;
+    display: flex
+}
+
+.breadcrumb li:first-child a {
+    padding-left: 0
+}
+
+.breadcrumb li.is-active a {
+    color: #f2f2f2;
+    cursor: default;
+    pointer-events: none
+}
+
+.breadcrumb li+li::before {
+    color: #8c9b9d;
+    content: "\0002f"
+}
+
+.breadcrumb ol,
+.breadcrumb ul {
+    align-items: flex-start;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start
+}
+
+.breadcrumb .icon:first-child {
+    margin-right: .5em
+}
+
+.breadcrumb .icon:last-child {
+    margin-left: .5em
+}
+
+.breadcrumb.has-arrow-separator li+li::before {
+    content: "\02192"
+}
+
+.breadcrumb.has-bullet-separator li+li::before {
+    content: "\02022"
+}
+
+.breadcrumb.has-dot-separator li+li::before {
+    content: "\000b7"
+}
+
+.breadcrumb.has-succeeds-separator li+li::before {
+    content: "\0227B"
+}
+
+.card {
+    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .02);
+    color: #fff;
+    max-width: 100%;
+    position: relative
+}
+
+.card-header {
+    background-color: transparent;
+    align-items: stretch;
+    box-shadow: 0 .125em .25em rgba(10, 10, 10, .1);
+    display: flex
+}
+
+.card-header-title {
+    align-items: center;
+    color: #f2f2f2;
+    display: flex;
+    flex-grow: 1;
+    font-weight: 700;
+    padding: .75rem 1rem
+}
+
+.card-header-icon,
+.card-header-title.is-centered {
+    justify-content: center
+}
+
+.card-header-icon {
+    align-items: center;
+    cursor: pointer;
+    display: flex;
+    padding: .75rem 1rem
+}
+
+.card-image {
+    display: block;
+    position: relative
+}
+
+.card-content,
+.card-footer {
+    background-color: transparent
+}
+
+.card-content {
+    padding: 1.5rem
+}
+
+.card-footer {
+    border-top: 1px solid #ededed;
+    align-items: stretch;
+    display: flex
+}
+
+.card-footer-item {
+    align-items: center;
+    display: flex;
+    flex-basis: 0;
+    flex-grow: 1;
+    flex-shrink: 0;
+    justify-content: center;
+    padding: .75rem
+}
+
+.card-footer-item:not(:last-child) {
+    border-right: 1px solid #ededed
+}
+
+.card .media:not(:last-child) {
+    margin-bottom: 1.5rem
+}
+
+.dropdown {
+    display: inline-flex;
+    position: relative;
+    vertical-align: top
+}
+
+.dropdown.is-active .dropdown-menu,
+.dropdown.is-hoverable:hover .dropdown-menu {
+    display: block
+}
+
+.dropdown.is-right .dropdown-menu {
+    left: auto;
+    right: 0
+}
+
+.dropdown.is-up .dropdown-menu {
+    bottom: 100%;
+    padding-bottom: 4px;
+    padding-top: initial;
+    top: auto
+}
+
+.dropdown-menu {
+    display: none;
+    left: 0;
+    min-width: 12rem;
+    padding-top: 4px;
+    position: absolute;
+    top: 100%;
+    z-index: 20
+}
+
+.dropdown-content {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: .4em;
+    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .02);
+    padding-bottom: .5rem;
+    padding-top: .5rem
+}
+
+.dropdown-item {
+    color: #fff;
+    display: block;
+    font-size: .875rem;
+    line-height: 1.5;
+    padding: .375rem 1rem;
+    position: relative
+}
+
+a.dropdown-item,
+button.dropdown-item {
+    padding-right: 3rem;
+    text-align: left;
+    white-space: nowrap;
+    width: 100%
+}
+
+a.dropdown-item:hover,
+button.dropdown-item:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #0a0a0a
+}
+
+a.dropdown-item.is-active,
+button.dropdown-item.is-active {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.dropdown-divider {
+    background-color: #ededed;
+    border: 0;
+    display: block;
+    height: 1px;
+    margin: .5rem 0
+}
+
+.level {
+    align-items: center;
+    justify-content: space-between
+}
+
+.level img {
+    display: inline-block;
+    vertical-align: top
+}
+
+.level.is-mobile,
+.level.is-mobile .level-left,
+.level.is-mobile .level-right {
+    display: flex
+}
+
+.level.is-mobile .level-left+.level-right {
+    margin-top: 0
+}
+
+.level.is-mobile .level-item:not(:last-child) {
+    margin-bottom: 0;
+    margin-right: .75rem
+}
+
+.level.is-mobile .level-item:not(.is-narrow) {
+    flex-grow: 1
+}
+
+@media screen and (min-width: 769px),
+print {
+    .level {
+        display: flex
+    }
+
+    .level>.level-item:not(.is-narrow) {
+        flex-grow: 1
+    }
+}
+
+.level-item {
+    align-items: center;
+    display: flex;
+    justify-content: center
+}
+
+.level-item .subtitle,
+.level-item .title {
+    margin-bottom: 0
+}
+
+@media screen and (max-width: 768px) {
+    .level-item:not(:last-child) {
+        margin-bottom: .75rem
+    }
+}
+
+.level-item,
+.level-left,
+.level-right {
+    flex-basis: auto;
+    flex-grow: 0;
+    flex-shrink: 0
+}
+
+.level-left .level-item.is-flexible,
+.level-right .level-item.is-flexible {
+    flex-grow: 1
+}
+
+@media screen and (min-width: 769px),
+print {
+
+    .level-left .level-item:not(:last-child),
+    .level-right .level-item:not(:last-child) {
+        margin-right: .75rem
+    }
+}
+
+.level-left {
+    align-items: center;
+    justify-content: flex-start
+}
+
+@media screen and (max-width: 768px) {
+    .level-left+.level-right {
+        margin-top: 1.5rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .level-left {
+        display: flex
+    }
+}
+
+.level-right {
+    align-items: center;
+    justify-content: flex-end
+}
+
+@media screen and (min-width: 769px),
+print {
+    .level-right {
+        display: flex
+    }
+}
+
+.list {
+    background-color: #fff;
+    border-radius: .4em;
+    box-shadow: 0 2px 3px rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .1)
+}
+
+.list-item {
+    display: block;
+    padding: .5em 1em
+}
+
+.list-item:not(a) {
+    color: #fff
+}
+
+.list-item:first-child {
+    border-top-left-radius: .4em;
+    border-top-right-radius: .4em
+}
+
+.list-item:last-child {
+    border-bottom-left-radius: .4em;
+    border-bottom-right-radius: .4em
+}
+
+.list-item:not(:last-child) {
+    border-bottom: 1px solid #5e6d6f
+}
+
+.list-item.is-active {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+a.list-item {
+    background-color: hsl(var(--main), 10%, 15%);
+    cursor: pointer
+}
+
+.media {
+    align-items: flex-start;
+    display: flex;
+    text-align: left
+}
+
+.media .content:not(:last-child) {
+    margin-bottom: .75rem
+}
+
+.media .media {
+    border-top: 1px solid rgba(94, 109, 111, .5);
+    display: flex;
+    padding-top: .75rem
+}
+
+.media .media .content:not(:last-child),
+.media .media .control:not(:last-child) {
+    margin-bottom: .5rem
+}
+
+.media .media .media {
+    padding-top: .5rem
+}
+
+.media .media .media+.media {
+    margin-top: .5rem
+}
+
+.media+.media {
+    border-top: 1px solid rgba(94, 109, 111, .5);
+    margin-top: 1rem;
+    padding-top: 1rem
+}
+
+.media.is-large+.media {
+    margin-top: 1.5rem;
+    padding-top: 1.5rem
+}
+
+.media-left,
+.media-right {
+    flex-basis: auto;
+    flex-grow: 0;
+    flex-shrink: 0
+}
+
+.media-left {
+    margin-right: 1rem
+}
+
+.media-right {
+    margin-left: 1rem
+}
+
+.media-content {
+    flex-basis: auto;
+    flex-grow: 1;
+    flex-shrink: 1;
+    text-align: left
+}
+
+@media screen and (max-width: 768px) {
+    .media-content {
+        overflow-x: auto
+    }
+}
+
+.menu {
+    font-size: 15px
+}
+
+.menu.is-small {
+    font-size: .85em
+}
+
+.menu.is-medium {
+    font-size: 1.25rem
+}
+
+.menu.is-large {
+    font-size: 1.5rem
+}
+
+.menu-list {
+    line-height: 1.25
+}
+
+.menu-list a {
+    border-radius: 3px;
+    color: #fff;
+    display: block;
+    padding: .5em .75em
+}
+
+.menu-list a:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #f2f2f2
+}
+
+.menu-list a.is-active {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.menu-list li ul {
+    border-left: 1px solid #5e6d6f;
+    margin: .75em;
+    padding-left: .75em
+}
+
+.menu-label {
+    color: #fff;
+    font-size: .75em;
+    letter-spacing: .1em;
+    text-transform: uppercase
+}
+
+.menu-label:not(:first-child) {
+    margin-top: 1em
+}
+
+.menu-label:not(:last-child) {
+    margin-bottom: 1em
+}
+
+.message {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: .4em;
+    font-size: 15px
+}
+
+.message strong {
+    color: currentColor
+}
+
+.message.is-small {
+    font-size: .85em
+}
+
+.message.is-medium {
+    font-size: 1.25rem
+}
+
+.message.is-large {
+    font-size: 1.5rem
+}
+
+.message-body code,
+.message-body pre,
+.message.is-white {
+    background-color: #fff
+}
+
+.message.is-white .message-header {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.message.is-white .message-body {
+    border-color: #fff;
+    color: #000
+}
+
+.message.is-black {
+    background-color: #fafafa
+}
+
+.message.is-black .message-header {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.message.is-black .message-body,
+.navbar.is-white .navbar-brand .navbar-link::after {
+    border-color: #0a0a0a;
+    color: #000
+}
+
+.message.is-light {
+    background-color: #f9fafb
+}
+
+.message.is-light .message-header {
+    background-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.message.is-light .message-body {
+    border-color: #ecf0f1;
+    color: #000
+}
+
+.message.is-dark {
+    background-color: #f9fafa
+}
+
+.message.is-dark .message-header {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.message.is-dark .message-body {
+    border-color: hsl(var(--main), 10%, 15%);
+    color: #000
+}
+
+.message.is-primary {
+    background-color: hsl(var(--main), 50%, 90%)
+}
+
+.message.is-primary .message-header {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.message.is-primary .message-body {
+    border-color: hsl(var(--main), 45%, 45%);
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.message.is-info {
+    background-color: #eef6fc
+}
+
+.message.is-info .message-header {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.message.is-info .message-body {
+    border-color: #3298dc;
+    color: #1d72aa
+}
+
+.message.is-success {
+    background-color: #eefbf4
+}
+
+.message.is-success .message-header {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.message.is-success .message-body {
+    border-color: #2ecc71;
+    color: #1d8147
+}
+
+.message.is-warning {
+    background-color: #fef9ec
+}
+
+.message.is-warning .message-header {
+    background-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.message.is-warning .message-body {
+    border-color: #f1b70e;
+    color: #8c6a08
+}
+
+.message.is-danger {
+    background-color: #fdeeed
+}
+
+.message.is-danger .message-header {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.message.is-danger .message-body {
+    border-color: #e74c3c;
+    color: #c32818
+}
+
+.message-header {
+    align-items: center;
+    border-radius: .4em .4em 0 0;
+    color: rgba(0, 0, 0, .7);
+    display: flex;
+    justify-content: space-between;
+    line-height: 1.25;
+    padding: .75em 1em;
+    position: relative
+}
+
+.message-header .delete {
+    flex-grow: 0;
+    flex-shrink: 0;
+    margin-left: .75em
+}
+
+.message-header+.message-body {
+    border-width: 0;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0
+}
+
+.message-body {
+    border-radius: .4em;
+    border-style: solid;
+    color: #fff;
+    padding: 1.25em 1.5em
+}
+
+.modal {
+    align-items: center;
+    display: none;
+    flex-direction: column;
+    justify-content: center;
+    overflow: hidden;
+    position: fixed;
+    z-index: 40
+}
+
+.modal.is-active {
+    display: flex
+}
+
+.modal-background {
+    background-color: rgba(10, 10, 10, .86)
+}
+
+.modal-content {
+    max-height: calc(100vh - 160px);
+    overflow: auto
+}
+
+.modal-card,
+.modal-content {
+    margin: 0 20px;
+    position: relative;
+    width: 100%
+}
+
+@media screen and (min-width: 769px),
+print {
+
+    .modal-card,
+    .modal-content {
+        margin: 0 auto;
+        max-height: calc(100vh - 40px);
+        width: 640px
+    }
+}
+
+.modal-close {
+    background: 0 0;
+    height: 40px;
+    position: fixed;
+    right: 20px;
+    top: 20px;
+    width: 40px
+}
+
+.modal-card {
+    display: flex;
+    flex-direction: column;
+    max-height: calc(100vh - 40px);
+    overflow: hidden;
+    -ms-overflow-y: visible
+}
+
+.modal-card-foot,
+.modal-card-head {
+    align-items: center;
+    background-color: hsl(var(--main), 10%, 15%);
+    display: flex;
+    flex-shrink: 0;
+    justify-content: flex-start;
+    padding: 20px;
+    position: relative
+}
+
+.modal-card-head {
+    border-bottom: 1px solid #5e6d6f;
+    border-top-left-radius: 8px;
+    border-top-right-radius: 8px
+}
+
+.modal-card-title {
+    color: #f2f2f2;
+    flex-grow: 1;
+    flex-shrink: 0;
+    font-size: 1.5rem;
+    line-height: 1
+}
+
+.modal-card-foot {
+    border-bottom-left-radius: 8px;
+    border-bottom-right-radius: 8px;
+    border-top: 1px solid #5e6d6f
+}
+
+.modal-card-foot .button:not(:last-child) {
+    margin-right: .5em
+}
+
+.modal-card-body {
+    -webkit-overflow-scrolling: touch;
+    flex-grow: 1;
+    flex-shrink: 1;
+    overflow: auto;
+    padding: 20px
+}
+
+.navbar {
+    background-color: hsl(var(--main), 45%, 45%);
+    min-height: 4rem;
+    position: relative;
+    z-index: 30
+}
+
+.navbar>.container {
+    align-items: stretch;
+    display: flex;
+    min-height: 4rem;
+    width: 100%
+}
+
+.navbar.has-shadow {
+    box-shadow: 0 2px 0 0 hsl(var(--main), 10%, 15%)
+}
+
+.navbar.is-fixed-bottom,
+.navbar.is-fixed-top {
+    left: 0;
+    position: fixed;
+    right: 0;
+    z-index: 30
+}
+
+.navbar.is-fixed-bottom {
+    bottom: 0
+}
+
+.navbar.is-fixed-bottom.has-shadow {
+    box-shadow: 0 -2px 0 0 hsl(var(--main), 10%, 15%)
+}
+
+.navbar.is-fixed-top {
+    top: 0
+}
+
+body.has-navbar-fixed-top,
+html.has-navbar-fixed-top {
+    padding-top: 4rem
+}
+
+body.has-navbar-fixed-bottom,
+html.has-navbar-fixed-bottom {
+    padding-bottom: 4rem
+}
+
+.navbar-brand,
+.navbar-tabs {
+    align-items: stretch;
+    display: flex;
+    flex-shrink: 0;
+    min-height: 4rem
+}
+
+.navbar-brand a.navbar-item:focus,
+.navbar-brand a.navbar-item:hover {
+    background-color: transparent
+}
+
+.navbar-tabs {
+    -webkit-overflow-scrolling: touch;
+    max-width: 100vw;
+    overflow-x: auto;
+    overflow-y: hidden
+}
+
+.navbar-burger {
+    color: #fff;
+    cursor: pointer;
+    display: block;
+    height: 4rem;
+    position: relative;
+    width: 4rem;
+    margin-left: auto
+}
+
+.navbar-burger span {
+    background-color: currentColor;
+    display: block;
+    height: 1px;
+    left: calc(50% - 8px);
+    position: absolute;
+    transform-origin: center;
+    transition-duration: 86ms;
+    transition-property: background-color, opacity, transform;
+    transition-timing-function: ease-out;
+    width: 16px
+}
+
+.navbar-burger span:nth-child(1) {
+    top: calc(50% - 6px)
+}
+
+.navbar-burger span:nth-child(2) {
+    top: calc(50% - 1px)
+}
+
+.navbar-burger span:nth-child(3) {
+    top: calc(50% + 4px)
+}
+
+.navbar-burger:hover {
+    background-color: rgba(0, 0, 0, .05)
+}
+
+.navbar-burger.is-active span:nth-child(1) {
+    transform: translateY(5px) rotate(45deg)
+}
+
+.navbar-burger.is-active span:nth-child(2) {
+    opacity: 0
+}
+
+.navbar-burger.is-active span:nth-child(3) {
+    transform: translateY(-5px) rotate(-45deg)
+}
+
+.navbar-menu {
+    display: none
+}
+
+.navbar-item,
+.navbar-link {
+    color: #fff;
+    display: block;
+    line-height: 1.5;
+    padding: .5rem .75rem;
+    position: relative
+}
+
+.navbar-item .icon:only-child,
+.navbar-link .icon:only-child {
+    margin-left: -.25rem;
+    margin-right: -.25rem
+}
+
+.navbar-link,
+a.navbar-item {
+    cursor: pointer
+}
+
+.navbar-link.is-active,
+.navbar-link:focus,
+.navbar-link:focus-within,
+.navbar-link:hover,
+a.navbar-item.is-active,
+a.navbar-item:focus,
+a.navbar-item:focus-within,
+a.navbar-item:hover {
+    background-color: transparent;
+    color: hsl(var(--main), 50%, 75%)
+}
+
+.navbar-item {
+    flex-grow: 0;
+    flex-shrink: 0
+}
+
+.navbar-item img {
+    max-height: 1.75rem
+}
+
+.navbar-item.has-dropdown {
+    padding: 0
+}
+
+.navbar-content,
+.navbar-item.is-expanded {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.navbar-item.is-tab {
+    border-bottom: 1px solid transparent;
+    min-height: 4rem;
+    padding-bottom: calc(.5rem - 1px)
+}
+
+.navbar-item.is-tab:focus,
+.navbar-item.is-tab:hover {
+    background-color: transparent;
+    border-bottom-color: hsl(var(--main), 45%, 45%)
+}
+
+.navbar-item.is-tab.is-active {
+    background-color: transparent;
+    border-bottom-color: hsl(var(--main), 45%, 45%);
+    border-bottom-style: solid;
+    border-bottom-width: 3px;
+    color: hsl(var(--main), 45%, 45%);
+    padding-bottom: calc(.5rem - 3px)
+}
+
+.navbar-link:not(.is-arrowless) {
+    padding-right: 2.5em
+}
+
+.navbar-link:not(.is-arrowless)::after {
+    border-color: #fff;
+    margin-top: -.375em;
+    right: 1.125em
+}
+
+.navbar-dropdown {
+    font-size: .875rem;
+    padding-bottom: .5rem;
+    padding-top: .5rem
+}
+
+.navbar-dropdown .navbar-item {
+    padding-left: 1.5rem;
+    padding-right: 1.5rem
+}
+
+.navbar-divider {
+    background-color: rgba(0, 0, 0, .2);
+    border: 0;
+    display: none;
+    height: 2px;
+    margin: .5rem 0
+}
+
+@media screen and (max-width: 1023px) {
+    .navbar>.container {
+        display: block
+    }
+
+    .navbar-brand .navbar-item,
+    .navbar-tabs .navbar-item {
+        align-items: center;
+        display: flex
+    }
+
+    .navbar-link::after {
+        display: none
+    }
+
+    .navbar-menu {
+        background-color: hsl(var(--main), 45%, 45%);
+        box-shadow: 0 8px 16px rgba(10, 10, 10, .1);
+        padding: .5rem 0
+    }
+
+    .navbar-menu.is-active {
+        display: block
+    }
+
+    .navbar.is-fixed-bottom-touch,
+    .navbar.is-fixed-top-touch {
+        left: 0;
+        position: fixed;
+        right: 0;
+        z-index: 30
+    }
+
+    .navbar.is-fixed-bottom-touch {
+        bottom: 0
+    }
+
+    .navbar.is-fixed-bottom-touch.has-shadow {
+        box-shadow: 0 -2px 3px rgba(10, 10, 10, .1)
+    }
+
+    .navbar.is-fixed-top-touch {
+        top: 0
+    }
+
+    .navbar.is-fixed-top .navbar-menu,
+    .navbar.is-fixed-top-touch .navbar-menu {
+        -webkit-overflow-scrolling: touch;
+        max-height: calc(100vh - 4rem);
+        overflow: auto
+    }
+
+    body.has-navbar-fixed-top-touch,
+    html.has-navbar-fixed-top-touch {
+        padding-top: 4rem
+    }
+
+    body.has-navbar-fixed-bottom-touch,
+    html.has-navbar-fixed-bottom-touch {
+        padding-bottom: 4rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+
+    .navbar,
+    .navbar-end,
+    .navbar-menu,
+    .navbar-start {
+        align-items: stretch;
+        display: flex
+    }
+
+    .navbar {
+        min-height: 4rem
+    }
+
+    .navbar.is-spaced {
+        padding: 1rem 2rem
+    }
+
+    .navbar.is-spaced .navbar-end,
+    .navbar.is-spaced .navbar-start {
+        align-items: center
+    }
+
+    .navbar.is-spaced .navbar-link,
+    .navbar.is-spaced a.navbar-item {
+        border-radius: .4em
+    }
+
+    .navbar.is-transparent .navbar-link.is-active,
+    .navbar.is-transparent .navbar-link:focus,
+    .navbar.is-transparent .navbar-link:hover,
+    .navbar.is-transparent a.navbar-item.is-active,
+    .navbar.is-transparent a.navbar-item:focus,
+    .navbar.is-transparent a.navbar-item:hover {
+        background-color: transparent !important
+    }
+
+    .navbar.is-transparent .navbar-item.has-dropdown.is-active .navbar-link,
+    .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:focus .navbar-link,
+    .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:focus-within .navbar-link,
+    .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:hover .navbar-link {
+        background-color: transparent !important
+    }
+
+    .navbar-dropdown a.navbar-item:focus,
+    .navbar-dropdown a.navbar-item:hover,
+    .navbar.is-transparent .navbar-dropdown a.navbar-item:focus,
+    .navbar.is-transparent .navbar-dropdown a.navbar-item:hover {
+        background-color: transparent;
+        color: #dbdee0
+    }
+
+    .navbar-dropdown a.navbar-item.is-active,
+    .navbar.is-transparent .navbar-dropdown a.navbar-item.is-active {
+        background-color: transparent;
+        color: hsl(var(--main), 45%, 45%)
+    }
+
+    .navbar-burger {
+        display: none
+    }
+
+    .navbar-item,
+    .navbar-link {
+        align-items: center
+    }
+
+    .navbar-link {
+        display: flex
+    }
+
+    .navbar-item {
+        display: flex
+    }
+
+    .navbar-item.has-dropdown {
+        align-items: stretch
+    }
+
+    .navbar-item.has-dropdown-up .navbar-link::after {
+        transform: rotate(135deg) translate(.25em, -.25em)
+    }
+
+    .navbar-item.has-dropdown-up .navbar-dropdown {
+        border-bottom: 1px solid rgba(0, 0, 0, .2);
+        border-radius: 8px 8px 0 0;
+        border-top: none;
+        bottom: 100%;
+        box-shadow: 0 -8px 8px rgba(10, 10, 10, .1);
+        top: auto
+    }
+
+    .navbar-item.is-active .navbar-dropdown,
+    .navbar-item.is-hoverable:focus .navbar-dropdown,
+    .navbar-item.is-hoverable:focus-within .navbar-dropdown,
+    .navbar-item.is-hoverable:hover .navbar-dropdown {
+        display: block
+    }
+
+    .navbar-item.is-active .navbar-dropdown.is-boxed,
+    .navbar-item.is-hoverable:focus .navbar-dropdown.is-boxed,
+    .navbar-item.is-hoverable:focus-within .navbar-dropdown.is-boxed,
+    .navbar-item.is-hoverable:hover .navbar-dropdown.is-boxed,
+    .navbar.is-spaced .navbar-item.is-active .navbar-dropdown,
+    .navbar.is-spaced .navbar-item.is-hoverable:focus .navbar-dropdown,
+    .navbar.is-spaced .navbar-item.is-hoverable:focus-within .navbar-dropdown,
+    .navbar.is-spaced .navbar-item.is-hoverable:hover .navbar-dropdown {
+        opacity: 1;
+        pointer-events: auto;
+        transform: translateY(0)
+    }
+
+    .navbar-menu {
+        flex-grow: 1;
+        flex-shrink: 0
+    }
+
+    .navbar-start {
+        justify-content: flex-start;
+        margin-right: auto
+    }
+
+    .navbar-end {
+        justify-content: flex-end;
+        margin-left: auto
+    }
+
+    .navbar-dropdown {
+        background-color: hsl(var(--main), 45%, 45%);
+        border-bottom-left-radius: 8px;
+        border-bottom-right-radius: 8px;
+        border-top: 1px solid rgba(0, 0, 0, .2);
+        box-shadow: 0 8px 8px rgba(10, 10, 10, .1);
+        display: none;
+        font-size: .875rem;
+        left: 0;
+        min-width: 100%;
+        position: absolute;
+        top: 100%;
+        z-index: 20
+    }
+
+    .navbar-dropdown .navbar-item {
+        padding: .375rem 1rem;
+        white-space: nowrap
+    }
+
+    .navbar-dropdown a.navbar-item {
+        padding-right: 3rem
+    }
+
+    .navbar-dropdown.is-boxed,
+    .navbar.is-spaced .navbar-dropdown {
+        border-radius: 8px;
+        border-top: none;
+        box-shadow: 0 8px 8px rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .1);
+        display: block;
+        opacity: 0;
+        pointer-events: none;
+        top: calc(100% + (-4px));
+        transform: translateY(-5px);
+        transition-duration: 86ms;
+        transition-property: opacity, transform
+    }
+
+    .navbar-dropdown.is-right {
+        left: auto;
+        right: 0
+    }
+
+    .navbar-divider {
+        display: block
+    }
+
+    .container>.navbar .navbar-brand,
+    .navbar>.container .navbar-brand {
+        margin-left: -.75rem
+    }
+
+    .container>.navbar .navbar-menu,
+    .navbar>.container .navbar-menu {
+        margin-right: -.75rem
+    }
+
+    .navbar.is-fixed-bottom-desktop,
+    .navbar.is-fixed-top-desktop {
+        left: 0;
+        position: fixed;
+        right: 0;
+        z-index: 30
+    }
+
+    .navbar.is-fixed-bottom-desktop {
+        bottom: 0
+    }
+
+    .navbar.is-fixed-bottom-desktop.has-shadow {
+        box-shadow: 0 -2px 3px rgba(10, 10, 10, .1)
+    }
+
+    .navbar.is-fixed-top-desktop {
+        top: 0
+    }
+
+    body.has-navbar-fixed-top-desktop,
+    html.has-navbar-fixed-top-desktop {
+        padding-top: 4rem
+    }
+
+    body.has-navbar-fixed-bottom-desktop,
+    html.has-navbar-fixed-bottom-desktop {
+        padding-bottom: 4rem
+    }
+
+    body.has-spaced-navbar-fixed-top,
+    html.has-spaced-navbar-fixed-top {
+        padding-top: 6rem
+    }
+
+    body.has-spaced-navbar-fixed-bottom,
+    html.has-spaced-navbar-fixed-bottom {
+        padding-bottom: 6rem
+    }
+
+    .navbar-link.is-active,
+    a.navbar-item.is-active {
+        color: hsl(var(--main), 45%, 85%)
+    }
+
+    .navbar-link.is-active:not(:focus):not(:hover),
+    a.navbar-item.is-active:not(:focus):not(:hover) {
+        background-color: transparent
+    }
+
+    .navbar-item.has-dropdown.is-active .navbar-link,
+    .navbar-item.has-dropdown:focus .navbar-link,
+    .navbar-item.has-dropdown:hover .navbar-link {
+        background-color: transparent
+    }
+}
+
+.hero.is-fullheight-with-navbar {
+    min-height: calc(100vh - 4rem)
+}
+
+.pagination {
+    font-size: 15px;
+    margin: -.25rem
+}
+
+.pagination.is-small {
+    font-size: .85em
+}
+
+.pagination.is-medium {
+    font-size: 1.25rem
+}
+
+.pagination.is-large {
+    font-size: 1.5rem
+}
+
+.pagination.is-rounded .pagination-next,
+.pagination.is-rounded .pagination-previous {
+    padding-left: 1em;
+    padding-right: 1em;
+    border-radius: 290486px
+}
+
+.pagination.is-rounded .pagination-link {
+    border-radius: 290486px
+}
+
+.pagination,
+.pagination-list {
+    align-items: center;
+    display: flex;
+    justify-content: center;
+    text-align: center
+}
+
+.pagination-ellipsis,
+.pagination-link,
+.pagination-next,
+.pagination-previous {
+    font-size: 1em;
+    justify-content: center;
+    margin: .25rem;
+    text-align: center
+}
+
+.pagination-ellipsis,
+.pagination-link {
+    padding-left: .5em;
+    padding-right: .5em
+}
+
+.pagination-link,
+.pagination-next,
+.pagination-previous {
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff;
+    background: hsl(var(--main), 45%, 45%);
+    min-width: 2.5em
+}
+
+.pagination-link:hover,
+.pagination-next:hover,
+.pagination-previous:hover {
+    border-color: hsl(var(--main), 85%, 85%);
+    color: hsl(var(--main), 65%, 85%)
+}
+
+.pagination-link:focus,
+.pagination-next:focus,
+.pagination-previous:focus {
+    border-color: #8c9b9d
+}
+
+.pagination-link:active,
+.pagination-next:active,
+.pagination-previous:active {
+    box-shadow: inset 0 1px 2px rgb(10 10 10 / 20%)
+}
+
+.pagination-link[disabled],
+.pagination-next[disabled],
+.pagination-previous[disabled] {
+    background-color: #5e6d6f;
+    border-color: #5e6d6f;
+    box-shadow: none;
+    color: #fff;
+    opacity: .5
+}
+
+.pagination-next,
+.pagination-previous {
+    padding-left: .75em;
+    padding-right: .75em;
+    white-space: nowrap
+}
+
+.pagination-link.is-current {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.pagination-ellipsis {
+    color: #8c9b9d;
+    pointer-events: none
+}
+
+.pagination-list {
+    flex-wrap: wrap
+}
+
+@media screen and (max-width: 768px) {
+    .pagination {
+        flex-wrap: wrap
+    }
+
+    .pagination-list li,
+    .pagination-next,
+    .pagination-previous {
+        flex-grow: 1;
+        flex-shrink: 1
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .pagination-list {
+        flex-grow: 1;
+        flex-shrink: 1;
+        justify-content: flex-start;
+        order: 1
+    }
+
+    .pagination-previous {
+        order: 2
+    }
+
+    .pagination-next {
+        order: 3
+    }
+
+    .pagination {
+        justify-content: space-between
+    }
+
+    .pagination.is-centered .pagination-previous {
+        order: 1
+    }
+
+    .pagination.is-centered .pagination-list {
+        justify-content: center;
+        order: 2
+    }
+
+    .pagination.is-centered .pagination-next {
+        order: 3
+    }
+
+    .pagination.is-right .pagination-previous {
+        order: 1
+    }
+
+    .pagination.is-right .pagination-next {
+        order: 2
+    }
+
+    .pagination.is-right .pagination-list {
+        justify-content: flex-end;
+        order: 3
+    }
+}
+
+.panel {
+    border-radius: 8px;
+    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .02);
+    font-size: 15px;
+    background: hsl(var(--main), 15%, 12%)
+}
+
+.panel:not(:last-child) {
+    margin-bottom: 1.5rem
+}
+
+.panel.is-white .panel-heading {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.panel.is-white .panel-tabs a.is-active {
+    border-bottom-color: #fff
+}
+
+.panel.is-white .panel-block.is-active .panel-icon {
+    color: #fff
+}
+
+.panel.is-black .panel-heading {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.panel.is-black .panel-tabs a.is-active {
+    border-bottom-color: #0a0a0a
+}
+
+.panel.is-black .panel-block.is-active .panel-icon {
+    color: #0a0a0a
+}
+
+.panel.is-light .panel-heading {
+    background-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.panel.is-light .panel-tabs a.is-active {
+    border-bottom-color: #ecf0f1
+}
+
+.panel.is-light .panel-block.is-active .panel-icon {
+    color: #ecf0f1
+}
+
+.panel.is-dark .panel-heading {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.panel.is-dark .panel-tabs a.is-active {
+    border-bottom-color: hsl(var(--main), 10%, 15%)
+}
+
+.panel.is-dark .panel-block.is-active .panel-icon {
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.panel.is-primary .panel-heading {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.panel.is-primary .panel-tabs a.is-active {
+    border-bottom-color: hsl(var(--main), 45%, 45%)
+}
+
+.panel.is-primary .panel-block.is-active .panel-icon {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.panel.is-link .panel-heading {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.panel.is-link .panel-tabs a.is-active {
+    border-bottom-color: hsl(var(--main), 45%, 45%)
+}
+
+.panel.is-link .panel-block.is-active .panel-icon {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.panel.is-info .panel-heading {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.panel.is-info .panel-tabs a.is-active {
+    border-bottom-color: #3298dc
+}
+
+.panel.is-info .panel-block.is-active .panel-icon {
+    color: #3298dc
+}
+
+.panel.is-success .panel-heading {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.panel.is-success .panel-tabs a.is-active {
+    border-bottom-color: #2ecc71
+}
+
+.panel.is-success .panel-block.is-active .panel-icon {
+    color: #2ecc71
+}
+
+.panel.is-warning .panel-heading {
+    background-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.panel.is-warning .panel-tabs a.is-active {
+    border-bottom-color: #f1b70e
+}
+
+.panel.is-warning .panel-block.is-active .panel-icon {
+    color: #f1b70e
+}
+
+.panel.is-danger .panel-heading {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.panel.is-danger .panel-tabs a.is-active {
+    border-bottom-color: #e74c3c
+}
+
+.panel.is-danger .panel-block.is-active .panel-icon {
+    color: #e74c3c
+}
+
+.panel-heading {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: 8px 8px 0 0;
+    color: #f2f2f2;
+    font-size: 1.25em;
+    line-height: 1.25;
+    padding: .75em 1em
+}
+
+.panel-tabs {
+    align-items: flex-end;
+    display: flex;
+    font-size: .875em;
+    justify-content: center
+}
+
+.panel-tabs a {
+    border-bottom: 1px solid #5e6d6f;
+    padding: .5em
+}
+
+.panel-tabs a.is-active {
+    color: hsl(var(--main), 75%, 80%)
+}
+
+.panel-list a {
+    color: #fff
+}
+
+.panel-list a:hover {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.panel-block {
+    align-items: center;
+    color: #f2f2f2;
+    display: flex;
+    justify-content: flex-start;
+    padding: .5em 1.15em
+}
+
+.panel-block input[type=checkbox] {
+    margin-right: .75em
+}
+
+.panel-block>.control {
+    flex-grow: 1;
+    flex-shrink: 1;
+    width: 100%
+}
+
+.panel-block.is-wrapped {
+    flex-wrap: wrap
+}
+
+.panel-block.is-active {
+    border-left-color: hsl(var(--main), 45%, 45%);
+    color: hsl(var(--main), 75%, 80%)
+}
+
+.panel-block:last-child {
+    border-bottom-left-radius: 8px;
+    border-bottom-right-radius: 8px
+}
+
+a.panel-block,
+label.panel-block {
+    cursor: pointer
+}
+
+a.panel-block:hover,
+label.panel-block:hover {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.panel-icon {
+    display: inline-block;
+    font-size: 14px;
+    height: 1em;
+    line-height: 1em;
+    text-align: center;
+    vertical-align: top;
+    width: 1em;
+    color: #fff;
+    margin-right: .75em
+}
+
+.panel-icon .fa {
+    font-size: inherit;
+    line-height: inherit
+}
+
+.tabs {
+    -webkit-overflow-scrolling: touch;
+    align-items: stretch;
+    display: flex;
+    font-size: 15px;
+    justify-content: space-between;
+    overflow: hidden;
+    overflow-x: auto;
+    white-space: nowrap
+}
+
+.tabs a,
+.tabs ul {
+    align-items: center;
+    border-bottom-color: #5e6d6f;
+    border-bottom-style: solid;
+    display: flex
+}
+
+.tabs a {
+    color: #fff;
+    padding: .5em 1em;
+    vertical-align: top;
+    justify-content: center
+}
+
+.tabs a:hover {
+    border-bottom-color: #f2f2f2;
+    color: #f2f2f2
+}
+
+.tabs li {
+    display: block
+}
+
+.tabs li.is-active a {
+    border-bottom-color: hsl(var(--main), 45%, 45%);
+    color: hsl(var(--main), 65%, 65%)
+}
+
+.tabs ul {
+    flex-grow: 1;
+    flex-shrink: 0;
+    justify-content: flex-start;
+    border-bottom-width: 2px
+}
+
+.tabs ul.is-center,
+.tabs ul.is-left {
+    padding-right: .75em
+}
+
+.tabs ul.is-center {
+    flex: none;
+    justify-content: center;
+    padding-left: .75em
+}
+
+.tabs ul.is-right {
+    justify-content: flex-end;
+    padding-left: .75em
+}
+
+.tabs .icon:first-child {
+    margin-right: .5em
+}
+
+.tabs .icon:last-child {
+    margin-left: .5em
+}
+
+.tabs.is-centered ul {
+    justify-content: center
+}
+
+.tabs.is-right ul {
+    justify-content: flex-end
+}
+
+.tabs.is-boxed a {
+    border: 1px solid transparent;
+    border-radius: .4em .4em 0 0
+}
+
+.tabs.is-boxed a:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-bottom-color: #5e6d6f
+}
+
+.tabs.is-boxed li.is-active a {
+    border-color: #5e6d6f;
+    border-bottom-color: transparent !important
+}
+
+.tabs.is-toggle a {
+    border-color: #5e6d6f;
+    border-style: solid;
+    border-width: 1px;
+    margin-bottom: 0;
+    position: relative
+}
+
+.tabs.is-toggle a:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: #8c9b9d;
+    z-index: 2
+}
+
+.tabs.is-toggle li+li {
+    margin-left: -2px
+}
+
+.tabs.is-toggle li:first-child a {
+    border-radius: .4em 0 0 .4em
+}
+
+.tabs.is-toggle li:last-child a {
+    border-radius: 0 .4em .4em 0
+}
+
+.tabs.is-toggle li.is-active a {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff;
+    z-index: 1
+}
+
+.hero .tabs ul,
+.tabs.is-toggle ul {
+    border-bottom: none
+}
+
+.tabs.is-toggle.is-toggle-rounded li:first-child a {
+    border-bottom-left-radius: 290486px;
+    border-top-left-radius: 290486px;
+    padding-left: 1.25em
+}
+
+.tabs.is-toggle.is-toggle-rounded li:last-child a {
+    border-bottom-right-radius: 290486px;
+    border-top-right-radius: 290486px;
+    padding-right: 1.25em
+}
+
+.tabs.is-small {
+    font-size: .85em
+}
+
+.tabs.is-medium {
+    font-size: 1.25rem
+}
+
+.tabs.is-large {
+    font-size: 1.5rem
+}
+
+.column {
+    display: block;
+    flex-basis: 0;
+    flex-grow: 1;
+    flex-shrink: 1;
+    padding: .75rem
+}
+
+.columns.is-mobile>.column.is-narrow {
+    flex: none
+}
+
+.columns.is-mobile>.column.is-full {
+    flex: none;
+    width: 100%
+}
+
+.columns.is-mobile>.column.is-three-quarters {
+    flex: none;
+    width: 75%
+}
+
+.columns.is-mobile>.column.is-two-thirds {
+    flex: none;
+    width: 66.6666%
+}
+
+.columns.is-mobile>.column.is-half {
+    flex: none;
+    width: 50%
+}
+
+.columns.is-mobile>.column.is-one-third {
+    flex: none;
+    width: 33.3333%
+}
+
+.columns.is-mobile>.column.is-one-quarter {
+    flex: none;
+    width: 25%
+}
+
+.columns.is-mobile>.column.is-one-fifth {
+    flex: none;
+    width: 20%
+}
+
+.columns.is-mobile>.column.is-two-fifths {
+    flex: none;
+    width: 40%
+}
+
+.columns.is-mobile>.column.is-three-fifths {
+    flex: none;
+    width: 60%
+}
+
+.columns.is-mobile>.column.is-four-fifths {
+    flex: none;
+    width: 80%
+}
+
+.columns.is-mobile>.column.is-offset-three-quarters {
+    margin-left: 75%
+}
+
+.columns.is-mobile>.column.is-offset-two-thirds {
+    margin-left: 66.6666%
+}
+
+.columns.is-mobile>.column.is-offset-half {
+    margin-left: 50%
+}
+
+.columns.is-mobile>.column.is-offset-one-third {
+    margin-left: 33.3333%
+}
+
+.columns.is-mobile>.column.is-offset-one-quarter {
+    margin-left: 25%
+}
+
+.columns.is-mobile>.column.is-offset-one-fifth {
+    margin-left: 20%
+}
+
+.columns.is-mobile>.column.is-offset-two-fifths {
+    margin-left: 40%
+}
+
+.columns.is-mobile>.column.is-offset-three-fifths {
+    margin-left: 60%
+}
+
+.columns.is-mobile>.column.is-offset-four-fifths {
+    margin-left: 80%
+}
+
+.columns.is-mobile>.column.is-0 {
+    flex: none;
+    width: 0%
+}
+
+.columns.is-mobile>.column.is-offset-0 {
+    margin-left: 0
+}
+
+.columns.is-mobile>.column.is-1 {
+    flex: none;
+    width: 8.33333%
+}
+
+.columns.is-mobile>.column.is-offset-1 {
+    margin-left: 8.33333%
+}
+
+.columns.is-mobile>.column.is-2 {
+    flex: none;
+    width: 16.66667%
+}
+
+.columns.is-mobile>.column.is-offset-2 {
+    margin-left: 16.66667%
+}
+
+.columns.is-mobile>.column.is-3 {
+    flex: none;
+    width: 25%
+}
+
+.columns.is-mobile>.column.is-offset-3 {
+    margin-left: 25%
+}
+
+.columns.is-mobile>.column.is-4 {
+    flex: none;
+    width: 33.33333%
+}
+
+.columns.is-mobile>.column.is-offset-4 {
+    margin-left: 33.33333%
+}
+
+.columns.is-mobile>.column.is-5 {
+    flex: none;
+    width: 41.66667%
+}
+
+.columns.is-mobile>.column.is-offset-5 {
+    margin-left: 41.66667%
+}
+
+.columns.is-mobile>.column.is-6 {
+    flex: none;
+    width: 50%
+}
+
+.columns.is-mobile>.column.is-offset-6 {
+    margin-left: 50%
+}
+
+.columns.is-mobile>.column.is-7 {
+    flex: none;
+    width: 58.33333%
+}
+
+.columns.is-mobile>.column.is-offset-7 {
+    margin-left: 58.33333%
+}
+
+.columns.is-mobile>.column.is-8 {
+    flex: none;
+    width: 66.66667%
+}
+
+.columns.is-mobile>.column.is-offset-8 {
+    margin-left: 66.66667%
+}
+
+.columns.is-mobile>.column.is-9 {
+    flex: none;
+    width: 75%
+}
+
+.columns.is-mobile>.column.is-offset-9 {
+    margin-left: 75%
+}
+
+.columns.is-mobile>.column.is-10 {
+    flex: none;
+    width: 83.33333%
+}
+
+.columns.is-mobile>.column.is-offset-10 {
+    margin-left: 83.33333%
+}
+
+.columns.is-mobile>.column.is-11 {
+    flex: none;
+    width: 91.66667%
+}
+
+.columns.is-mobile>.column.is-offset-11 {
+    margin-left: 91.66667%
+}
+
+.columns.is-mobile>.column.is-12 {
+    flex: none;
+    width: 100%
+}
+
+.columns.is-mobile>.column.is-offset-12 {
+    margin-left: 100%
+}
+
+@media screen and (max-width: 768px) {
+    .column.is-narrow-mobile {
+        flex: none
+    }
+
+    .column.is-full-mobile {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-mobile {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-mobile {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-mobile {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-mobile {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-mobile {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-mobile {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-mobile {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-mobile {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-mobile {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-mobile {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-mobile {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-mobile {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-mobile {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-mobile {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-mobile {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-mobile {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-mobile {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-mobile {
+        margin-left: 80%
+    }
+
+    .column.is-0-mobile {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-mobile {
+        margin-left: 0
+    }
+
+    .column.is-1-mobile {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-mobile {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-mobile {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-mobile {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-mobile {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-mobile {
+        margin-left: 25%
+    }
+
+    .column.is-4-mobile {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-mobile {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-mobile {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-mobile {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-mobile {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-mobile {
+        margin-left: 50%
+    }
+
+    .column.is-7-mobile {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-mobile {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-mobile {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-mobile {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-mobile {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-mobile {
+        margin-left: 75%
+    }
+
+    .column.is-10-mobile {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-mobile {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-mobile {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-mobile {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-mobile {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-mobile {
+        margin-left: 100%
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+
+    .column.is-narrow,
+    .column.is-narrow-tablet {
+        flex: none
+    }
+
+    .column.is-full,
+    .column.is-full-tablet {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters,
+    .column.is-three-quarters-tablet {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds,
+    .column.is-two-thirds-tablet {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half,
+    .column.is-half-tablet {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third,
+    .column.is-one-third-tablet {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter,
+    .column.is-one-quarter-tablet {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth,
+    .column.is-one-fifth-tablet {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths,
+    .column.is-two-fifths-tablet {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths,
+    .column.is-three-fifths-tablet {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths,
+    .column.is-four-fifths-tablet {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters,
+    .column.is-offset-three-quarters-tablet {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds,
+    .column.is-offset-two-thirds-tablet {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half,
+    .column.is-offset-half-tablet {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third,
+    .column.is-offset-one-third-tablet {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter,
+    .column.is-offset-one-quarter-tablet {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth,
+    .column.is-offset-one-fifth-tablet {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths,
+    .column.is-offset-two-fifths-tablet {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths,
+    .column.is-offset-three-fifths-tablet {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths,
+    .column.is-offset-four-fifths-tablet {
+        margin-left: 80%
+    }
+
+    .column.is-0,
+    .column.is-0-tablet {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0,
+    .column.is-offset-0-tablet {
+        margin-left: 0
+    }
+
+    .column.is-1,
+    .column.is-1-tablet {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1,
+    .column.is-offset-1-tablet {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2,
+    .column.is-2-tablet {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2,
+    .column.is-offset-2-tablet {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3,
+    .column.is-3-tablet {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3,
+    .column.is-offset-3-tablet {
+        margin-left: 25%
+    }
+
+    .column.is-4,
+    .column.is-4-tablet {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4,
+    .column.is-offset-4-tablet {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5,
+    .column.is-5-tablet {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5,
+    .column.is-offset-5-tablet {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6,
+    .column.is-6-tablet {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6,
+    .column.is-offset-6-tablet {
+        margin-left: 50%
+    }
+
+    .column.is-7,
+    .column.is-7-tablet {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7,
+    .column.is-offset-7-tablet {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8,
+    .column.is-8-tablet {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8,
+    .column.is-offset-8-tablet {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9,
+    .column.is-9-tablet {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9,
+    .column.is-offset-9-tablet {
+        margin-left: 75%
+    }
+
+    .column.is-10,
+    .column.is-10-tablet {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10,
+    .column.is-offset-10-tablet {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11,
+    .column.is-11-tablet {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11,
+    .column.is-offset-11-tablet {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12,
+    .column.is-12-tablet {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12,
+    .column.is-offset-12-tablet {
+        margin-left: 100%
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .column.is-narrow-touch {
+        flex: none
+    }
+
+    .column.is-full-touch {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-touch {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-touch {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-touch {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-touch {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-touch {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-touch {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-touch {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-touch {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-touch {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-touch {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-touch {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-touch {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-touch {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-touch {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-touch {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-touch {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-touch {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-touch {
+        margin-left: 80%
+    }
+
+    .column.is-0-touch {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-touch {
+        margin-left: 0
+    }
+
+    .column.is-1-touch {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-touch {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-touch {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-touch {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-touch {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-touch {
+        margin-left: 25%
+    }
+
+    .column.is-4-touch {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-touch {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-touch {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-touch {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-touch {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-touch {
+        margin-left: 50%
+    }
+
+    .column.is-7-touch {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-touch {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-touch {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-touch {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-touch {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-touch {
+        margin-left: 75%
+    }
+
+    .column.is-10-touch {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-touch {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-touch {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-touch {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-touch {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-touch {
+        margin-left: 100%
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .column.is-narrow-desktop {
+        flex: none
+    }
+
+    .column.is-full-desktop {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-desktop {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-desktop {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-desktop {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-desktop {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-desktop {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-desktop {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-desktop {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-desktop {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-desktop {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-desktop {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-desktop {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-desktop {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-desktop {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-desktop {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-desktop {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-desktop {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-desktop {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-desktop {
+        margin-left: 80%
+    }
+
+    .column.is-0-desktop {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-desktop {
+        margin-left: 0
+    }
+
+    .column.is-1-desktop {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-desktop {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-desktop {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-desktop {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-desktop {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-desktop {
+        margin-left: 25%
+    }
+
+    .column.is-4-desktop {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-desktop {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-desktop {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-desktop {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-desktop {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-desktop {
+        margin-left: 50%
+    }
+
+    .column.is-7-desktop {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-desktop {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-desktop {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-desktop {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-desktop {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-desktop {
+        margin-left: 75%
+    }
+
+    .column.is-10-desktop {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-desktop {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-desktop {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-desktop {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-desktop {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-desktop {
+        margin-left: 100%
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .column.is-narrow-widescreen {
+        flex: none
+    }
+
+    .column.is-full-widescreen {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-widescreen {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-widescreen {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-widescreen {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-widescreen {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-widescreen {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-widescreen {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-widescreen {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-widescreen {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-widescreen {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-widescreen {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-widescreen {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-widescreen {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-widescreen {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-widescreen {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-widescreen {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-widescreen {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-widescreen {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-widescreen {
+        margin-left: 80%
+    }
+
+    .column.is-0-widescreen {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-widescreen {
+        margin-left: 0
+    }
+
+    .column.is-1-widescreen {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-widescreen {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-widescreen {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-widescreen {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-widescreen {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-widescreen {
+        margin-left: 25%
+    }
+
+    .column.is-4-widescreen {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-widescreen {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-widescreen {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-widescreen {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-widescreen {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-widescreen {
+        margin-left: 50%
+    }
+
+    .column.is-7-widescreen {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-widescreen {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-widescreen {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-widescreen {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-widescreen {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-widescreen {
+        margin-left: 75%
+    }
+
+    .column.is-10-widescreen {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-widescreen {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-widescreen {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-widescreen {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-widescreen {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-widescreen {
+        margin-left: 100%
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .column.is-narrow-fullhd {
+        flex: none
+    }
+
+    .column.is-full-fullhd {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-fullhd {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-fullhd {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-fullhd {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-fullhd {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-fullhd {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-fullhd {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-fullhd {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-fullhd {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-fullhd {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-fullhd {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-fullhd {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-fullhd {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-fullhd {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-fullhd {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-fullhd {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-fullhd {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-fullhd {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-fullhd {
+        margin-left: 80%
+    }
+
+    .column.is-0-fullhd {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-fullhd {
+        margin-left: 0
+    }
+
+    .column.is-1-fullhd {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-fullhd {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-fullhd {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-fullhd {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-fullhd {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-fullhd {
+        margin-left: 25%
+    }
+
+    .column.is-4-fullhd {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-fullhd {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-fullhd {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-fullhd {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-fullhd {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-fullhd {
+        margin-left: 50%
+    }
+
+    .column.is-7-fullhd {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-fullhd {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-fullhd {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-fullhd {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-fullhd {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-fullhd {
+        margin-left: 75%
+    }
+
+    .column.is-10-fullhd {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-fullhd {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-fullhd {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-fullhd {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-fullhd {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-fullhd {
+        margin-left: 100%
+    }
+}
+
+.columns {
+    margin-left: -.75rem;
+    margin-right: -.75rem;
+    margin-top: -.75rem
+}
+
+.columns:last-child {
+    margin-bottom: -.75rem
+}
+
+.columns:not(:last-child) {
+    margin-bottom: calc(1.5rem - .75rem)
+}
+
+.columns.is-centered {
+    justify-content: center
+}
+
+.columns.is-gapless {
+    margin-left: 0;
+    margin-right: 0;
+    margin-top: 0
+}
+
+.columns.is-gapless>.column {
+    margin: 0;
+    padding: 0 !important
+}
+
+.columns.is-gapless:not(:last-child) {
+    margin-bottom: 1.5rem
+}
+
+.columns.is-gapless:last-child {
+    margin-bottom: 0
+}
+
+.columns.is-mobile {
+    display: flex
+}
+
+.columns.is-multiline {
+    flex-wrap: wrap
+}
+
+.columns.is-vcentered {
+    align-items: center
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns:not(.is-desktop) {
+        display: flex
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-desktop {
+        display: flex
+    }
+}
+
+.columns.is-variable {
+    --columnGap: 0.75rem;
+    margin-left: calc(-1 * var(--columnGap));
+    margin-right: calc(-1 * var(--columnGap))
+}
+
+.columns.is-variable .column {
+    padding-left: var(--columnGap);
+    padding-right: var(--columnGap)
+}
+
+.columns.is-variable.is-0 {
+    --columnGap: 0rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-0-mobile {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-0-tablet {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-0-tablet-only {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-0-touch {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-0-desktop {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-0-desktop-only {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-0-widescreen {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-0-widescreen-only {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-0-fullhd {
+        --columnGap: 0rem
+    }
+}
+
+.columns.is-variable.is-1 {
+    --columnGap: 0.25rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-1-mobile {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-1-tablet {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-1-tablet-only {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-1-touch {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-1-desktop {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-1-desktop-only {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-1-widescreen {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-1-widescreen-only {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-1-fullhd {
+        --columnGap: 0.25rem
+    }
+}
+
+.columns.is-variable.is-2 {
+    --columnGap: 0.5rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-2-mobile {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-2-tablet {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-2-tablet-only {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-2-touch {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-2-desktop {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-2-desktop-only {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-2-widescreen {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-2-widescreen-only {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-2-fullhd {
+        --columnGap: 0.5rem
+    }
+}
+
+.columns.is-variable.is-3 {
+    --columnGap: 0.75rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-3-mobile {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-3-tablet {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-3-tablet-only {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-3-touch {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-3-desktop {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-3-desktop-only {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-3-widescreen {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-3-widescreen-only {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-3-fullhd {
+        --columnGap: 0.75rem
+    }
+}
+
+.columns.is-variable.is-4 {
+    --columnGap: 1rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-4-mobile {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-4-tablet {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-4-tablet-only {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-4-touch {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-4-desktop {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-4-desktop-only {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-4-widescreen {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-4-widescreen-only {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-4-fullhd {
+        --columnGap: 1rem
+    }
+}
+
+.columns.is-variable.is-5 {
+    --columnGap: 1.25rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-5-mobile {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-5-tablet {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-5-tablet-only {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-5-touch {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-5-desktop {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-5-desktop-only {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-5-widescreen {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-5-widescreen-only {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-5-fullhd {
+        --columnGap: 1.25rem
+    }
+}
+
+.columns.is-variable.is-6 {
+    --columnGap: 1.5rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-6-mobile {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-6-tablet {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-6-tablet-only {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-6-touch {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-6-desktop {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-6-desktop-only {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-6-widescreen {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-6-widescreen-only {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-6-fullhd {
+        --columnGap: 1.5rem
+    }
+}
+
+.columns.is-variable.is-7 {
+    --columnGap: 1.75rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-7-mobile {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-7-tablet {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-7-tablet-only {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-7-touch {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-7-desktop {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-7-desktop-only {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-7-widescreen {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-7-widescreen-only {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-7-fullhd {
+        --columnGap: 1.75rem
+    }
+}
+
+.columns.is-variable.is-8 {
+    --columnGap: 2rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-8-mobile {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-8-tablet {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-8-tablet-only {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-8-touch {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-8-desktop {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-8-desktop-only {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-8-widescreen {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-8-widescreen-only {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-8-fullhd {
+        --columnGap: 2rem
+    }
+}
+
+.tile {
+    align-items: stretch;
+    display: block;
+    flex-basis: 0;
+    flex-grow: 1;
+    flex-shrink: 1;
+    min-height: -webkit-min-content;
+    min-height: -moz-min-content;
+    min-height: min-content
+}
+
+.tile.is-ancestor {
+    margin-left: -.75rem;
+    margin-right: -.75rem;
+    margin-top: -.75rem
+}
+
+.tile.is-ancestor:last-child {
+    margin-bottom: -.75rem
+}
+
+.tile.is-ancestor:not(:last-child) {
+    margin-bottom: .75rem
+}
+
+.tile.is-child {
+    margin: 0 !important
+}
+
+.tile.is-parent {
+    padding: .75rem
+}
+
+.tile.is-vertical {
+    flex-direction: column
+}
+
+.tile.is-vertical>.tile.is-child:not(:last-child) {
+    margin-bottom: 1.5rem !important
+}
+
+@media screen and (min-width: 769px),
+print {
+    .tile:not(.is-child) {
+        display: flex
+    }
+
+    .tile.is-1 {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .tile.is-2 {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .tile.is-3 {
+        flex: none;
+        width: 25%
+    }
+
+    .tile.is-4 {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .tile.is-5 {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .tile.is-6 {
+        flex: none;
+        width: 50%
+    }
+
+    .tile.is-7 {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .tile.is-8 {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .tile.is-9 {
+        flex: none;
+        width: 75%
+    }
+
+    .tile.is-10 {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .tile.is-11 {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .tile.is-12 {
+        flex: none;
+        width: 100%
+    }
+}
+
+.hero {
+    align-items: stretch;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between
+}
+
+.hero .navbar {
+    background: 0 0
+}
+
+.hero.is-white {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.hero.is-black a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-black strong,
+.hero.is-danger a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-danger strong,
+.hero.is-dark a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-dark strong,
+.hero.is-info a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-info strong,
+.hero.is-light a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-light strong,
+.hero.is-link a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-link strong,
+.hero.is-primary a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-primary strong,
+.hero.is-success a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-success strong,
+.hero.is-warning a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-warning strong,
+.hero.is-white a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-white strong {
+    color: inherit
+}
+
+.hero.is-white .title {
+    color: #0a0a0a
+}
+
+.hero.is-white .subtitle {
+    color: rgba(10, 10, 10, .9)
+}
+
+.hero.is-white .subtitle a:not(.button),
+.hero.is-white .subtitle strong {
+    color: #0a0a0a
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-white .navbar-menu {
+        background-color: #fff
+    }
+}
+
+.hero.is-white .navbar-item,
+.hero.is-white .navbar-link {
+    color: rgba(10, 10, 10, .7)
+}
+
+.hero.is-white .navbar-link.is-active,
+.hero.is-white .navbar-link:hover,
+.hero.is-white a.navbar-item.is-active,
+.hero.is-white a.navbar-item:hover {
+    background-color: #f2f2f2;
+    color: #0a0a0a
+}
+
+.hero.is-white .tabs a {
+    color: #0a0a0a;
+    opacity: .9
+}
+
+.hero.is-white .tabs a:hover,
+.hero.is-white .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-white .tabs.is-boxed a,
+.hero.is-white .tabs.is-toggle a {
+    color: #0a0a0a
+}
+
+.hero.is-black .tabs.is-boxed a:hover,
+.hero.is-black .tabs.is-toggle a:hover,
+.hero.is-danger .tabs.is-boxed a:hover,
+.hero.is-danger .tabs.is-toggle a:hover,
+.hero.is-dark .tabs.is-boxed a:hover,
+.hero.is-dark .tabs.is-toggle a:hover,
+.hero.is-info .tabs.is-boxed a:hover,
+.hero.is-info .tabs.is-toggle a:hover,
+.hero.is-light .tabs.is-boxed a:hover,
+.hero.is-light .tabs.is-toggle a:hover,
+.hero.is-link .tabs.is-boxed a:hover,
+.hero.is-link .tabs.is-toggle a:hover,
+.hero.is-primary .tabs.is-boxed a:hover,
+.hero.is-primary .tabs.is-toggle a:hover,
+.hero.is-success .tabs.is-boxed a:hover,
+.hero.is-success .tabs.is-toggle a:hover,
+.hero.is-warning .tabs.is-boxed a:hover,
+.hero.is-warning .tabs.is-toggle a:hover,
+.hero.is-white .tabs.is-boxed a:hover,
+.hero.is-white .tabs.is-toggle a:hover {
+    background-color: rgba(10, 10, 10, .1)
+}
+
+.hero.is-white.is-bold {
+    background-image: linear-gradient(141deg, #e6e6e6 0, #fff 71%, #fff 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-white.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #e6e6e6 0, #fff 71%, #fff 100%)
+    }
+}
+
+.hero.is-black {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.hero.is-black .title {
+    color: #fff
+}
+
+.hero.is-black .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-black .subtitle a:not(.button),
+.hero.is-black .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-black .navbar-menu {
+        background-color: #0a0a0a
+    }
+}
+
+.hero.is-black .navbar-item,
+.hero.is-black .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-black .navbar-link.is-active,
+.hero.is-black .navbar-link:hover,
+.hero.is-black a.navbar-item.is-active,
+.hero.is-black a.navbar-item:hover {
+    background-color: #000;
+    color: #fff
+}
+
+.hero.is-black .tabs a {
+    color: #fff;
+    opacity: .9
+}
+
+.hero.is-black .tabs a:hover,
+.hero.is-black .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-black .tabs.is-boxed a,
+.hero.is-black .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-black .tabs.is-boxed li.is-active a,
+.hero.is-black .tabs.is-boxed li.is-active a:hover,
+.hero.is-black .tabs.is-toggle li.is-active a,
+.hero.is-black .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #0a0a0a
+}
+
+.hero.is-black.is-bold {
+    background-image: linear-gradient(141deg, #000 0, #0a0a0a 71%, #181616 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-black.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #000 0, #0a0a0a 71%, #181616 100%)
+    }
+}
+
+.hero.is-light {
+    background-color: #ecf0f1
+}
+
+.hero.is-light,
+.hero.is-light .title {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-light .subtitle {
+    color: rgba(0, 0, 0, .9)
+}
+
+.hero.is-light .subtitle a:not(.button),
+.hero.is-light .subtitle strong {
+    color: rgba(0, 0, 0, .7)
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-light .navbar-menu {
+        background-color: #ecf0f1
+    }
+}
+
+.hero.is-light .navbar-item,
+.hero.is-light .navbar-link {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-light .navbar-link.is-active,
+.hero.is-light .navbar-link:hover,
+.hero.is-light a.navbar-item.is-active,
+.hero.is-light a.navbar-item:hover {
+    background-color: #dde4e6;
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-light .tabs a {
+    color: rgba(0, 0, 0, .7);
+    opacity: .9
+}
+
+.hero.is-light .tabs a:hover,
+.hero.is-light .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-light .tabs.is-boxed a,
+.hero.is-light .tabs.is-toggle a {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-light .tabs.is-boxed li.is-active a,
+.hero.is-light .tabs.is-boxed li.is-active a:hover,
+.hero.is-light .tabs.is-toggle li.is-active a,
+.hero.is-light .tabs.is-toggle li.is-active a:hover {
+    background-color: rgba(0, 0, 0, .7);
+    border-color: rgba(0, 0, 0, .7);
+    color: #ecf0f1
+}
+
+.hero.is-light.is-bold {
+    background-image: linear-gradient(141deg, #cadfe0 0, #ecf0f1 71%, #fafbfc 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-light.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #cadfe0 0, #ecf0f1 71%, #fafbfc 100%)
+    }
+}
+
+.hero.is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.hero.is-dark .title {
+    color: #fff
+}
+
+.hero.is-dark .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-dark .subtitle a:not(.button),
+.hero.is-dark .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-dark .navbar-menu {
+        background-color: hsl(var(--main), 10%, 15%)
+    }
+}
+
+.hero.is-dark .navbar-item,
+.hero.is-dark .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-dark .navbar-link.is-active,
+.hero.is-dark .navbar-link:hover,
+.hero.is-dark a.navbar-item.is-active,
+.hero.is-dark a.navbar-item:hover {
+    background-color: #1d2122;
+    color: #fff
+}
+
+.hero.is-dark .tabs a,
+.hero.is-info .tabs a,
+.hero.is-link .tabs a,
+.hero.is-primary .tabs a,
+.hero.is-success .tabs a {
+    color: #fff;
+    opacity: .9
+}
+
+.hero.is-dark .tabs a:hover,
+.hero.is-dark .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-dark .tabs.is-boxed li.is-active a,
+.hero.is-dark .tabs.is-boxed li.is-active a:hover,
+.hero.is-dark .tabs.is-toggle li.is-active a,
+.hero.is-dark .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.hero.is-dark.is-bold {
+    background-image: linear-gradient(141deg, #0f1615 0, hsl(var(--main), 10%, 15%) 71%, #313c40 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-dark.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #0f1615 0, hsl(var(--main), 10%, 15%) 71%, #313c40 100%)
+    }
+}
+
+.hero.is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.hero.is-dark .tabs.is-boxed a,
+.hero.is-dark .tabs.is-toggle a,
+.hero.is-primary .title {
+    color: #fff
+}
+
+.hero.is-primary .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-primary .subtitle a:not(.button),
+.hero.is-primary .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-primary .navbar-menu {
+        background-color: hsl(var(--main), 45%, 45%)
+    }
+}
+
+.hero.is-primary .navbar-item,
+.hero.is-primary .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-primary .navbar-link.is-active,
+.hero.is-primary .navbar-link:hover,
+.hero.is-primary a.navbar-item.is-active,
+.hero.is-primary a.navbar-item:hover {
+    background-color: #2f4d6d;
+    color: #fff
+}
+
+.hero.is-primary .tabs a:hover,
+.hero.is-primary .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-primary .tabs.is-boxed li.is-active a,
+.hero.is-primary .tabs.is-boxed li.is-active a:hover,
+.hero.is-primary .tabs.is-toggle li.is-active a,
+.hero.is-primary .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.hero.is-primary.is-bold {
+    background-image: linear-gradient(141deg, #214b62 0, hsl(var(--main), 45%, 45%) 71%, #3a5796 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-primary.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #214b62 0, hsl(var(--main), 45%, 45%) 71%, #3a5796 100%)
+    }
+}
+
+.hero.is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.hero.is-link .title,
+.hero.is-primary .tabs.is-boxed a,
+.hero.is-primary .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-link .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-link .subtitle a:not(.button),
+.hero.is-link .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-link .navbar-menu {
+        background-color: hsl(var(--main), 45%, 45%)
+    }
+}
+
+.hero.is-link .navbar-item,
+.hero.is-link .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-link .navbar-link.is-active,
+.hero.is-link .navbar-link:hover,
+.hero.is-link a.navbar-item.is-active,
+.hero.is-link a.navbar-item:hover {
+    background-color: hsl(var(--main), 75%, 80%);
+    color: #fff
+}
+
+.hero.is-link .tabs a:hover,
+.hero.is-link .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-link .tabs.is-boxed li.is-active a,
+.hero.is-link .tabs.is-boxed li.is-active a:hover,
+.hero.is-link .tabs.is-toggle li.is-active a,
+.hero.is-link .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.hero.is-link.is-bold {
+    background-image: linear-gradient(141deg, #0c9764 0, hsl(var(--main), 45%, 45%) 71%, #17d8d2 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-link.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #0c9764 0, hsl(var(--main), 45%, 45%) 71%, #17d8d2 100%)
+    }
+}
+
+.hero.is-info {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.hero.is-info .title,
+.hero.is-link .tabs.is-boxed a,
+.hero.is-link .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-info .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-info .subtitle a:not(.button),
+.hero.is-info .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-info .navbar-menu {
+        background-color: #3298dc
+    }
+}
+
+.hero.is-info .navbar-item,
+.hero.is-info .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-info .navbar-link.is-active,
+.hero.is-info .navbar-link:hover,
+.hero.is-info a.navbar-item.is-active,
+.hero.is-info a.navbar-item:hover {
+    background-color: #238cd1;
+    color: #fff
+}
+
+.hero.is-info .tabs a:hover,
+.hero.is-info .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-info .tabs.is-boxed li.is-active a,
+.hero.is-info .tabs.is-boxed li.is-active a:hover,
+.hero.is-info .tabs.is-toggle li.is-active a,
+.hero.is-info .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #3298dc
+}
+
+.hero.is-info.is-bold {
+    background-image: linear-gradient(141deg, #159dc6 0, #3298dc 71%, #4389e5 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-info.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #159dc6 0, #3298dc 71%, #4389e5 100%)
+    }
+}
+
+.hero.is-success {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.hero.is-info .tabs.is-boxed a,
+.hero.is-info .tabs.is-toggle a,
+.hero.is-success .title {
+    color: #fff
+}
+
+.hero.is-success .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-success .subtitle a:not(.button),
+.hero.is-success .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-success .navbar-menu {
+        background-color: #2ecc71
+    }
+}
+
+.hero.is-success .navbar-item,
+.hero.is-success .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-success .navbar-link.is-active,
+.hero.is-success .navbar-link:hover,
+.hero.is-success a.navbar-item.is-active,
+.hero.is-success a.navbar-item:hover {
+    background-color: #29b765;
+    color: #fff
+}
+
+.hero.is-success .tabs a:hover,
+.hero.is-success .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-success .tabs.is-boxed a,
+.hero.is-success .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-success .tabs.is-boxed li.is-active a,
+.hero.is-success .tabs.is-boxed li.is-active a:hover,
+.hero.is-success .tabs.is-toggle li.is-active a,
+.hero.is-success .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #2ecc71
+}
+
+.hero.is-success.is-bold {
+    background-image: linear-gradient(141deg, #1bac40 0, #2ecc71 71%, #3ada98 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-success.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #1bac40 0, #2ecc71 71%, #3ada98 100%)
+    }
+}
+
+.hero.is-warning {
+    background-color: #f1b70e
+}
+
+.hero.is-warning,
+.hero.is-warning .title {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-warning .subtitle {
+    color: rgba(0, 0, 0, .9)
+}
+
+.hero.is-warning .subtitle a:not(.button),
+.hero.is-warning .subtitle strong {
+    color: rgba(0, 0, 0, .7)
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-warning .navbar-menu {
+        background-color: #f1b70e
+    }
+}
+
+.hero.is-warning .navbar-item,
+.hero.is-warning .navbar-link {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-warning .navbar-link.is-active,
+.hero.is-warning .navbar-link:hover,
+.hero.is-warning a.navbar-item.is-active,
+.hero.is-warning a.navbar-item:hover {
+    background-color: #d9a50d;
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-warning .tabs a {
+    color: rgba(0, 0, 0, .7);
+    opacity: .9
+}
+
+.hero.is-warning .tabs a:hover,
+.hero.is-warning .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-warning .tabs.is-boxed a,
+.hero.is-warning .tabs.is-toggle a {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-warning .tabs.is-boxed li.is-active a,
+.hero.is-warning .tabs.is-boxed li.is-active a:hover,
+.hero.is-warning .tabs.is-toggle li.is-active a,
+.hero.is-warning .tabs.is-toggle li.is-active a:hover {
+    background-color: rgba(0, 0, 0, .7);
+    border-color: rgba(0, 0, 0, .7);
+    color: #f1b70e
+}
+
+.hero.is-warning.is-bold {
+    background-image: linear-gradient(141deg, #cb7601 0, #f1b70e 71%, #f8e520 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-warning.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #cb7601 0, #f1b70e 71%, #f8e520 100%)
+    }
+}
+
+.hero.is-danger {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.hero.is-danger .title {
+    color: #fff
+}
+
+.hero.is-danger .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-danger .subtitle a:not(.button),
+.hero.is-danger .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-danger .navbar-menu {
+        background-color: #e74c3c
+    }
+}
+
+.hero.is-danger .navbar-item,
+.hero.is-danger .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-danger .navbar-link.is-active,
+.hero.is-danger .navbar-link:hover,
+.hero.is-danger a.navbar-item.is-active,
+.hero.is-danger a.navbar-item:hover {
+    background-color: #e43725;
+    color: #fff
+}
+
+.hero.is-danger .tabs a {
+    color: #fff;
+    opacity: .9
+}
+
+.hero.is-danger .tabs a:hover,
+.hero.is-danger .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-danger .tabs.is-boxed a,
+.hero.is-danger .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-danger .tabs.is-boxed li.is-active a,
+.hero.is-danger .tabs.is-boxed li.is-active a:hover,
+.hero.is-danger .tabs.is-toggle li.is-active a,
+.hero.is-danger .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #e74c3c
+}
+
+.hero.is-danger.is-bold {
+    background-image: linear-gradient(141deg, #e20e1e 0, #e74c3c 71%, #ef784e 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-danger.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #e20e1e 0, #e74c3c 71%, #ef784e 100%)
+    }
+}
+
+.hero.is-small .hero-body {
+    padding: 1.5rem
+}
+
+@media screen and (min-width: 769px),
+print {
+    .hero.is-medium .hero-body {
+        padding: 9rem 1.5rem
+    }
+
+    .hero.is-large .hero-body {
+        padding: 18rem 1.5rem
+    }
+}
+
+.hero.is-fullheight .hero-body,
+.hero.is-fullheight-with-navbar .hero-body,
+.hero.is-halfheight .hero-body {
+    align-items: center;
+    display: flex
+}
+
+.hero.is-fullheight .hero-body>.container,
+.hero.is-fullheight-with-navbar .hero-body>.container,
+.hero.is-halfheight .hero-body>.container {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.hero.is-halfheight {
+    min-height: 50vh
+}
+
+.hero.is-fullheight {
+    min-height: 100vh
+}
+
+.hero-video {
+    overflow: hidden
+}
+
+.hero-video video {
+    left: 50%;
+    min-height: 100%;
+    min-width: 100%;
+    position: absolute;
+    top: 50%;
+    transform: translate3d(-50%, -50%, 0)
+}
+
+.hero-video.is-transparent {
+    opacity: .3
+}
+
+@media screen and (max-width: 768px) {
+    .hero-video {
+        display: none
+    }
+}
+
+.hero-buttons {
+    margin-top: 1.5rem
+}
+
+@media screen and (max-width: 768px) {
+    .hero-buttons .button {
+        display: flex
+    }
+
+    .hero-buttons .button:not(:last-child) {
+        margin-bottom: .75rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .hero-buttons {
+        display: flex;
+        justify-content: center
+    }
+
+    .hero-buttons .button:not(:last-child) {
+        margin-right: 1.5rem
+    }
+}
+
+.hero-body,
+.hero-foot,
+.hero-head {
+    flex-grow: 0;
+    flex-shrink: 0
+}
+
+.hero-body {
+    flex-grow: 1
+}
+
+.hero-body,
+.section {
+    padding: 3rem 1.5rem
+}
+
+@media screen and (min-width: 1024px) {
+    .section.is-medium {
+        padding: 9rem 1.5rem
+    }
+
+    .section.is-large {
+        padding: 18rem 1.5rem
+    }
+}
+
+.footer {
+    background-color: hsl(var(--main), 10%, 15%);
+    padding: 3rem 1.5rem 6rem
+}
+
+h6 {
+    text-transform: uppercase;
+    letter-spacing: .5px
+}
+
+.hero {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.button {
+    transition: all .2s ease;
+    border-width: 2px;
+    color: #fff
+}
+
+.button.is-active,
+.button.is-focused,
+.button:active,
+.button:focus {
+    box-shadow: 0 0 0 2px rgba(140, 155, 157, .5)
+}
+
+.button.is-white.is-hovered,
+.button.is-white:hover {
+    background-color: #fff
+}
+
+.button.is-white.is-active,
+.button.is-white.is-focused,
+.button.is-white:active,
+.button.is-white:focus {
+    border-color: #fff;
+    box-shadow: 0 0 0 2px rgba(255, 255, 255, .5)
+}
+
+.button.is-black.is-hovered,
+.button.is-black:hover {
+    background-color: #1d1d1d
+}
+
+.button.is-black.is-active,
+.button.is-black.is-focused,
+.button.is-black:active,
+.button.is-black:focus {
+    border-color: #0a0a0a;
+    box-shadow: 0 0 0 2px rgba(10, 10, 10, .5)
+}
+
+.button.is-light.is-hovered,
+.button.is-light:hover {
+    background-color: #fff
+}
+
+.button.is-light.is-active,
+.button.is-light.is-focused,
+.button.is-light:active,
+.button.is-light:focus {
+    border-color: #ecf0f1;
+    box-shadow: 0 0 0 2px rgba(236, 240, 241, .5)
+}
+
+.button.is-dark.is-hovered,
+.button.is-dark:hover {
+    background-color: #3a4344
+}
+
+.button.is-dark.is-active,
+.button.is-dark.is-focused,
+.button.is-dark:active,
+.button.is-dark:focus {
+    border-color: hsl(var(--main), 10%, 15%);
+    box-shadow: 0 0 0 2px rgba(40, 47, 47, .5)
+}
+
+.button.is-primary.is-hovered,
+.button.is-primary:hover {
+    background-color: hsl(var(--main), 65%, 35%)
+}
+
+.button.is-primary.is-active,
+.button.is-primary.is-focused,
+.button.is-primary:active,
+.button.is-primary:focus {
+    box-shadow: 0 0 0 2px rgb(140 155 157 / 50%)
+}
+
+.button.is-link.is-hovered,
+.button.is-link:hover {
+    background-color: #1fdeb8
+}
+
+.button.is-link.is-active,
+.button.is-link.is-focused,
+.button.is-link:active,
+.button.is-link:focus {
+    border-color: hsl(var(--main), 45%, 45%);
+    box-shadow: 0 0 0 2px rgba(26, 188, 156, .5)
+}
+
+.button.is-info.is-hovered,
+.button.is-info:hover {
+    background-color: #53a9e2
+}
+
+.button.is-info.is-active,
+.button.is-info.is-focused,
+.button.is-info:active,
+.button.is-info:focus {
+    border-color: #3298dc;
+    box-shadow: 0 0 0 2px rgba(50, 152, 220, .5)
+}
+
+.button.is-success.is-hovered,
+.button.is-success:hover {
+    background-color: #4ad685
+}
+
+.button.is-success.is-active,
+.button.is-success.is-focused,
+.button.is-success:active,
+.button.is-success:focus {
+    border-color: #2ecc71;
+    box-shadow: 0 0 0 2px rgba(46, 204, 113, .5)
+}
+
+.button.is-warning.is-hovered,
+.button.is-warning:hover {
+    background-color: #f3c232
+}
+
+.button.is-warning.is-active,
+.button.is-warning.is-focused,
+.button.is-warning:active,
+.button.is-warning:focus {
+    border-color: #f1b70e;
+    box-shadow: 0 0 0 2px rgba(241, 183, 14, .5)
+}
+
+.button.is-danger.is-hovered,
+.button.is-danger:hover {
+    background-color: #eb6b5e
+}
+
+.button.is-danger.is-active,
+.button.is-danger.is-focused,
+.button.is-danger:active,
+.button.is-danger:focus {
+    border-color: #e74c3c;
+    box-shadow: 0 0 0 2px rgba(231, 76, 60, .5)
+}
+
+.label {
+    color: #dbdee0
+}
+
+.input,
+.textarea {
+    transition: all .2s ease;
+    box-shadow: none;
+    border-width: 2px;
+    padding-left: 1em;
+    padding-right: 1em
+}
+
+.select select,
+.select:after {
+    border-width: 2px
+}
+
+.control.has-addons .button,
+.control.has-addons .input,
+.control.has-addons .select {
+    margin-right: -2px
+}
+
+.notification {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.card {
+    box-shadow: none;
+    border: 2px solid hsl(var(--main), 10%, 15%);
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: .4em
+}
+
+.card .card-header {
+    box-shadow: none;
+    border-radius: .4em .4em 0 0
+}
+
+.card .card-footer,
+.card .card-header {
+    background-color: rgba(18, 18, 18, .2)
+}
+
+.card .card-footer,
+.card .card-footer-item {
+    border-width: 2px;
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.notification.is-white a:not(.button) {
+    color: #0a0a0a;
+    text-decoration: underline
+}
+
+.notification.is-black a:not(.button) {
+    color: #fff;
+    text-decoration: underline
+}
+
+.notification.is-light a:not(.button) {
+    color: rgba(0, 0, 0, .7);
+    text-decoration: underline
+}
+
+.notification.is-dark a:not(.button),
+.notification.is-info a:not(.button),
+.notification.is-link a:not(.button),
+.notification.is-primary a:not(.button),
+.notification.is-success a:not(.button) {
+    color: #fff;
+    text-decoration: underline
+}
+
+.notification.is-warning a:not(.button) {
+    color: rgba(0, 0, 0, .7);
+    text-decoration: underline
+}
+
+.notification.is-danger a:not(.button) {
+    color: #fff;
+    text-decoration: underline
+}
+
+.tag {
+    border-radius: .4em
+}
+
+.menu-list a {
+    transition: all .3s ease
+}
+
+.modal-card-body {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.modal-card-foot,
+.modal-card-head {
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.message-header {
+    font-weight: 700;
+    background-color: hsl(var(--main), 30%, 20%);
+    color: #fff
+}
+
+.message-body {
+    border-width: 2px;
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.navbar.is-transparent {
+    background: 0 0
+}
+
+.navbar.is-primary .navbar-dropdown a.navbar-item.is-active {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+@media screen and (max-width: 1023px) {
+    .navbar .navbar-menu {
+        background-color: hsl(var(--main), 45%, 45%);
+        border-radius: 0 0 .4em .4em
+    }
+}
+
+.hero .navbar,
+body>.navbar {
+    border-radius: 0
+}
+
+.pagination-link,
+.pagination-next,
+.pagination-previous,
+.panel-block,
+.panel-heading,
+.panel-tabs {
+    border-width: 2px
+}
+
+.panel-block:first-child,
+.panel-heading:first-child,
+.panel-tabs:first-child {
+    border-top-width: 2px
+}
+
+.panel-heading {
+    font-weight: 700
+}
+
+.panel-tabs a {
+    border-width: 2px;
+    margin-bottom: -2px
+}
+
+.panel-tabs a.is-active {
+    border-bottom-color: hsl(var(--main), 75%, 80%)
+}
+
+.panel-block:hover,
+.panel-block:hover .panel-icon {
+    color: hsl(var(--main), 85%, 95%)
+}
+
+.panel-block.is-active .panel-icon {
+    color: hsl(var(--main), 75%, 80%)
+}
+
+.tabs a {
+    border-bottom-width: 2px;
+    margin-bottom: -2px
+}
+
+.tabs.is-boxed a {
+    border-width: 2px
+}
+
+.tabs.is-boxed li.is-active a {
+    background-color: hsl(var(--main), 10%, 10%)
+}
+
+.tabs.is-toggle li a {
+    border-width: 2px;
+    margin-bottom: 0
+}
+
+.hero.is-black .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-danger .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-dark .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-info .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-light .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-link .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-primary .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-success .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-warning .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-white .navbar .navbar-dropdown .navbar-item:hover {
+    background-color: transparent
+}
+
+.is-flex-direction-row {
+    flex-direction: row !important
+}
+
+.is-flex-direction-row-reverse {
+    flex-direction: row-reverse !important
+}
+
+.is-flex-direction-column {
+    flex-direction: column !important
+}
+
+.is-flex-direction-column-reverse {
+    flex-direction: column-reverse !important
+}
+
+.is-flex-wrap-nowrap {
+    flex-wrap: nowrap !important
+}
+
+.is-flex-wrap-wrap {
+    flex-wrap: wrap !important
+}
+
+.is-flex-wrap-wrap-reverse {
+    flex-wrap: wrap-reverse !important
+}
+
+.is-justify-content-flex-start {
+    justify-content: flex-start !important
+}
+
+.is-justify-content-flex-end {
+    justify-content: flex-end !important
+}
+
+.is-justify-content-center {
+    justify-content: center !important
+}
+
+.is-justify-content-space-between {
+    justify-content: space-between !important
+}
+
+.is-justify-content-space-around {
+    justify-content: space-around !important
+}
+
+.is-justify-content-space-evenly {
+    justify-content: space-evenly !important
+}
+
+.is-justify-content-start {
+    justify-content: start !important
+}
+
+.is-justify-content-end {
+    justify-content: end !important
+}
+
+.is-justify-content-left {
+    justify-content: left !important
+}
+
+.is-justify-content-right {
+    justify-content: right !important
+}
+
+.is-align-content-flex-start {
+    align-content: flex-start !important
+}
+
+.is-align-content-flex-end {
+    align-content: flex-end !important
+}
+
+.is-align-content-center {
+    align-content: center !important
+}
+
+.is-align-content-space-between {
+    align-content: space-between !important
+}
+
+.is-align-content-space-around {
+    align-content: space-around !important
+}
+
+.is-align-content-space-evenly {
+    align-content: space-evenly !important
+}
+
+.is-align-content-stretch {
+    align-content: stretch !important
+}
+
+.is-align-content-start {
+    align-content: start !important
+}
+
+.is-align-content-end {
+    align-content: end !important
+}
+
+.is-align-content-baseline {
+    align-content: baseline !important
+}
+
+.is-align-items-stretch {
+    align-items: stretch !important
+}
+
+.is-align-items-flex-start {
+    align-items: flex-start !important
+}
+
+.is-align-items-flex-end {
+    align-items: flex-end !important
+}
+
+.is-align-items-center {
+    align-items: center !important
+}
+
+.is-align-items-baseline {
+    align-items: baseline !important
+}
+
+.is-align-items-start {
+    align-items: start !important
+}
+
+.is-align-items-end {
+    align-items: end !important
+}
+
+.is-align-items-self-start {
+    align-items: self-start !important
+}
+
+.is-align-items-self-end {
+    align-items: self-end !important
+}
+
+.is-align-self-auto {
+    align-self: auto !important
+}
+
+.is-align-self-flex-start {
+    align-self: flex-start !important
+}
+
+.is-align-self-flex-end {
+    align-self: flex-end !important
+}
+
+.is-align-self-center {
+    align-self: center !important
+}
+
+.is-align-self-baseline {
+    align-self: baseline !important
+}
+
+.is-align-self-stretch {
+    align-self: stretch !important
+}
+
+.is-flex-grow-0 {
+    flex-grow: 0 !important
+}
+
+.is-flex-grow-1 {
+    flex-grow: 1 !important
+}
+
+.is-flex-grow-2 {
+    flex-grow: 2 !important
+}
+
+.is-flex-grow-3 {
+    flex-grow: 3 !important
+}
+
+.is-flex-grow-4 {
+    flex-grow: 4 !important
+}
+
+.is-flex-grow-5 {
+    flex-grow: 5 !important
+}
+
+.is-flex-shrink-0 {
+    flex-shrink: 0 !important
+}
+
+.is-flex-shrink-1 {
+    flex-shrink: 1 !important
+}
+
+.is-flex-shrink-2 {
+    flex-shrink: 2 !important
+}
+
+.is-flex-shrink-3 {
+    flex-shrink: 3 !important
+}
+
+.is-flex-shrink-4 {
+    flex-shrink: 4 !important
+}
+
+.is-flex-shrink-5 {
+    flex-shrink: 5 !important
+}
+
+.is-clearfix::after {
+    clear: both;
+    content: " ";
+    display: table
+}
+
+.is-pulled-left {
+    float: left !important
+}
+
+.is-pulled-right {
+    float: right !important
+}
+
+.is-radiusless {
+    border-radius: 0 !important
+}
+
+.is-shadowless {
+    box-shadow: none !important
+}
+
+.is-clickable {
+    cursor: pointer !important
+}
+
+.is-clipped {
+    overflow: hidden !important
+}
+
+.is-relative {
+    position: relative !important
+}
+
+.is-marginless {
+    margin: 0 !important
+}
+
+.is-paddingless {
+    padding: 0 !important
+}
+
+.m-0 {
+    margin: 0 !important
+}
+
+.mt-0 {
+    margin-top: 0 !important
+}
+
+.mr-0 {
+    margin-right: 0 !important
+}
+
+.mb-0 {
+    margin-bottom: 0 !important
+}
+
+.ml-0 {
+    margin-left: 0 !important
+}
+
+.mx-0 {
+    margin-left: 0 !important;
+    margin-right: 0 !important
+}
+
+.my-0 {
+    margin-top: 0 !important;
+    margin-bottom: 0 !important
+}
+
+.m-1 {
+    margin: .25rem !important
+}
+
+.mt-1 {
+    margin-top: .25rem !important
+}
+
+.mr-1 {
+    margin-right: .25rem !important
+}
+
+.mb-1 {
+    margin-bottom: .25rem !important
+}
+
+.ml-1 {
+    margin-left: .25rem !important
+}
+
+.mx-1 {
+    margin-left: .25rem !important;
+    margin-right: .25rem !important
+}
+
+.my-1 {
+    margin-top: .25rem !important;
+    margin-bottom: .25rem !important
+}
+
+.m-2 {
+    margin: .5rem !important
+}
+
+.mt-2 {
+    margin-top: .5rem !important
+}
+
+.mr-2 {
+    margin-right: .5rem !important
+}
+
+.mb-2 {
+    margin-bottom: .5rem !important
+}
+
+.ml-2 {
+    margin-left: .5rem !important
+}
+
+.mx-2 {
+    margin-left: .5rem !important;
+    margin-right: .5rem !important
+}
+
+.my-2 {
+    margin-top: .5rem !important;
+    margin-bottom: .5rem !important
+}
+
+.m-3 {
+    margin: .75rem !important
+}
+
+.mt-3 {
+    margin-top: .75rem !important
+}
+
+.mr-3 {
+    margin-right: .75rem !important
+}
+
+.mb-3 {
+    margin-bottom: .75rem !important
+}
+
+.ml-3 {
+    margin-left: .75rem !important
+}
+
+.mx-3 {
+    margin-left: .75rem !important;
+    margin-right: .75rem !important
+}
+
+.my-3 {
+    margin-top: .75rem !important;
+    margin-bottom: .75rem !important
+}
+
+.m-4 {
+    margin: 1rem !important
+}
+
+.mt-4 {
+    margin-top: 1rem !important
+}
+
+.mr-4 {
+    margin-right: 1rem !important
+}
+
+.mb-4 {
+    margin-bottom: 1rem !important
+}
+
+.ml-4 {
+    margin-left: 1rem !important
+}
+
+.mx-4 {
+    margin-left: 1rem !important;
+    margin-right: 1rem !important
+}
+
+.my-4 {
+    margin-top: 1rem !important;
+    margin-bottom: 1rem !important
+}
+
+.m-5 {
+    margin: 1.5rem !important
+}
+
+.mt-5 {
+    margin-top: 1.5rem !important
+}
+
+.mr-5 {
+    margin-right: 1.5rem !important
+}
+
+.mb-5 {
+    margin-bottom: 1.5rem !important
+}
+
+.ml-5 {
+    margin-left: 1.5rem !important
+}
+
+.mx-5 {
+    margin-left: 1.5rem !important;
+    margin-right: 1.5rem !important
+}
+
+.my-5 {
+    margin-top: 1.5rem !important;
+    margin-bottom: 1.5rem !important
+}
+
+.m-6 {
+    margin: 3rem !important
+}
+
+.mt-6 {
+    margin-top: 3rem !important
+}
+
+.mr-6 {
+    margin-right: 3rem !important
+}
+
+.mb-6 {
+    margin-bottom: 3rem !important
+}
+
+.ml-6 {
+    margin-left: 3rem !important
+}
+
+.mx-6 {
+    margin-left: 3rem !important;
+    margin-right: 3rem !important
+}
+
+.my-6 {
+    margin-top: 3rem !important;
+    margin-bottom: 3rem !important
+}
+
+.p-0 {
+    padding: 0 !important
+}
+
+.pt-0 {
+    padding-top: 0 !important
+}
+
+.pr-0 {
+    padding-right: 0 !important
+}
+
+.pb-0 {
+    padding-bottom: 0 !important
+}
+
+.pl-0 {
+    padding-left: 0 !important
+}
+
+.px-0 {
+    padding-left: 0 !important;
+    padding-right: 0 !important
+}
+
+.py-0 {
+    padding-top: 0 !important;
+    padding-bottom: 0 !important
+}
+
+.p-1 {
+    padding: .25rem !important
+}
+
+.pt-1 {
+    padding-top: .25rem !important
+}
+
+.pr-1 {
+    padding-right: .25rem !important
+}
+
+.pb-1 {
+    padding-bottom: .25rem !important
+}
+
+.pl-1 {
+    padding-left: .25rem !important
+}
+
+.px-1 {
+    padding-left: .25rem !important;
+    padding-right: .25rem !important
+}
+
+.py-1 {
+    padding-top: .25rem !important;
+    padding-bottom: .25rem !important
+}
+
+.p-2 {
+    padding: .5rem !important
+}
+
+.pt-2 {
+    padding-top: .5rem !important
+}
+
+.pr-2 {
+    padding-right: .5rem !important
+}
+
+.pb-2 {
+    padding-bottom: .5rem !important
+}
+
+.pl-2 {
+    padding-left: .5rem !important
+}
+
+.px-2 {
+    padding-left: .5rem !important;
+    padding-right: .5rem !important
+}
+
+.py-2 {
+    padding-top: .5rem !important;
+    padding-bottom: .5rem !important
+}
+
+.p-3 {
+    padding: .75rem !important
+}
+
+.pt-3 {
+    padding-top: .75rem !important
+}
+
+.pr-3 {
+    padding-right: .75rem !important
+}
+
+.pb-3 {
+    padding-bottom: .75rem !important
+}
+
+.pl-3 {
+    padding-left: .75rem !important
+}
+
+.px-3 {
+    padding-left: .75rem !important;
+    padding-right: .75rem !important
+}
+
+.py-3 {
+    padding-top: .75rem !important;
+    padding-bottom: .75rem !important
+}
+
+.p-4 {
+    padding: 1rem !important
+}
+
+.pt-4 {
+    padding-top: 1rem !important
+}
+
+.pr-4 {
+    padding-right: 1rem !important
+}
+
+.pb-4 {
+    padding-bottom: 1rem !important
+}
+
+.pl-4 {
+    padding-left: 1rem !important
+}
+
+.px-4 {
+    padding-left: 1rem !important;
+    padding-right: 1rem !important
+}
+
+.py-4 {
+    padding-top: 1rem !important;
+    padding-bottom: 1rem !important
+}
+
+.p-5 {
+    padding: 1.5rem !important
+}
+
+.pt-5 {
+    padding-top: 1.5rem !important
+}
+
+.pr-5 {
+    padding-right: 1.5rem !important
+}
+
+.pb-5 {
+    padding-bottom: 1.5rem !important
+}
+
+.pl-5 {
+    padding-left: 1.5rem !important
+}
+
+.px-5 {
+    padding-left: 1.5rem !important;
+    padding-right: 1.5rem !important
+}
+
+.py-5 {
+    padding-top: 1.5rem !important;
+    padding-bottom: 1.5rem !important
+}
+
+.p-6 {
+    padding: 3rem !important
+}
+
+.pt-6 {
+    padding-top: 3rem !important
+}
+
+.pr-6 {
+    padding-right: 3rem !important
+}
+
+.pb-6 {
+    padding-bottom: 3rem !important
+}
+
+.pl-6 {
+    padding-left: 3rem !important
+}
+
+.px-6 {
+    padding-left: 3rem !important;
+    padding-right: 3rem !important
+}
+
+.py-6 {
+    padding-top: 3rem !important;
+    padding-bottom: 3rem !important
+}
+
+.is-size-1 {
+    font-size: 3rem !important
+}
+
+.is-size-2 {
+    font-size: 2.5rem !important
+}
+
+.is-size-3 {
+    font-size: 2rem !important
+}
+
+.is-size-4 {
+    font-size: 1.5rem !important
+}
+
+.is-size-5 {
+    font-size: 1.25rem !important
+}
+
+.is-size-6 {
+    font-size: 1rem !important
+}
+
+.is-size-7 {
+    font-size: .75rem !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-size-1-mobile {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-mobile {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-mobile {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-mobile {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-mobile {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-mobile {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-mobile {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-size-1-tablet {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-tablet {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-tablet {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-tablet {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-tablet {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-tablet {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-tablet {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-size-1-touch {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-touch {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-touch {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-touch {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-touch {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-touch {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-touch {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-size-1-desktop {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-desktop {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-desktop {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-desktop {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-desktop {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-desktop {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-desktop {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-size-1-widescreen {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-widescreen {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-widescreen {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-widescreen {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-widescreen {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-widescreen {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-widescreen {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-size-1-fullhd {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-fullhd {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-fullhd {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-fullhd {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-fullhd {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-fullhd {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-fullhd {
+        font-size: .75rem !important
+    }
+}
+
+.has-text-centered {
+    text-align: center !important
+}
+
+.has-text-justified {
+    text-align: justify !important
+}
+
+.has-text-left {
+    text-align: left !important
+}
+
+.has-text-right {
+    text-align: right !important
+}
\ No newline at end of file

From 47cf90d163dea907fb71a3495272fe7ac6dbf318 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Tue, 7 Jun 2022 15:12:31 +0800
Subject: [PATCH 064/278] fix hypercorn

---
 main.py | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/main.py b/main.py
index f3afbee9..f597bc84 100755
--- a/main.py
+++ b/main.py
@@ -34,6 +34,10 @@ async def mysql_conn() -> None:
     await glob.db.connect(glob.config.mysql) # type: ignore
     log('Connected to MySQL!', Ansi.LGREEN)
 
+@app.before_serving
+async def load_lang():
+    i18n.load_path.append(os.getcwd() + '/.locales')
+
 @app.before_serving
 async def http_conn() -> None:
     glob.http = aiohttp.ClientSession(json_serialize=lambda x: orjson.dumps(x).decode())
@@ -86,5 +90,4 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    i18n.load_path.append(os.getcwd() + '/.locales')
     app.run(port=8000, debug=glob.config.debug)  # blocking call

From 905d407799a0a8f6c57181230cdf348a961134a4 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Tue, 7 Jun 2022 15:17:09 +0800
Subject: [PATCH 065/278] fix gulag avatar

---
 .locales/home.zh_CN.yml   | 5 +++--
 static/css/pages/home.css | 2 +-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/.locales/home.zh_CN.yml b/.locales/home.zh_CN.yml
index 1439f859..dc1f2135 100644
--- a/.locales/home.zh_CN.yml
+++ b/.locales/home.zh_CN.yml
@@ -1,7 +1,8 @@
 zh_CN:
   subtitle-big: >-
-    我们是一个从头搭建的 osu! 私人服务器,具有许多你曾未见识到的独特功能。--想了解更多信息,可以查看我们在Github 上的 gulag 和
-    guweb 项目 -- 我们完全开源
+    欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会
+    群内的兽耳机器人24小时为您提供成绩查询等服务.详情请加QQ群: 792778662. 
+    ppysb新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
   some-of-our-coolest-features: 我们觉得最酷的一些功能
   features-title-1: 对Relax 和 Autopilot mod的PP计算
   features-content-1: >-
diff --git a/static/css/pages/home.css b/static/css/pages/home.css
index 19a0de62..0ee29619 100644
--- a/static/css/pages/home.css
+++ b/static/css/pages/home.css
@@ -1,7 +1,7 @@
 /* gulag mascot/avatar */
 
 .gulag-avatar {
-  background-image: url("/static/images/gulag.png");
+  background-image: url("/static/images/gulag.png?v=1.0");
   background-repeat: no-repeat;
   /*     available avatar widths & heights      */
   /* gulag.png:   width: 512px; height: 363px;  */

From cd5d7a258b64cd02d4da408e25d181bce72e919f Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Tue, 7 Jun 2022 15:19:01 +0800
Subject: [PATCH 066/278] fix home.css

---
 templates/home.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/home.html b/templates/home.html
index 61d1fefe..27df86c8 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -2,7 +2,7 @@
 {% block title %} Home {% endblock %}
 
 {% block header %}
-<link rel="stylesheet" href="/static/css/pages/home.css">
+<link rel="stylesheet" href="/static/css/pages/home.css?v={{ rand() }}">
 {% endblock %}
 
 {% block content %}

From 4ba1ba3c484d8641271a63c8166c553638b74db0 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Tue, 7 Jun 2022 21:48:04 +0900
Subject: [PATCH 067/278] update

---
 .locales/global.en_GB.yml   |  9 +++++++++
 .locales/global.en_US.yml   |  9 +++++++++
 .locales/global.zh_CN.yml   |  9 +++++++++
 .locales/home.en_US.yml     |  4 ++++
 .locales/home.zh_CN.yml     |  9 +++++++--
 .locales/login.en_GB.yml    |  1 +
 .locales/login.en_US.yml    |  1 +
 .locales/login.zh_CN.yml    |  1 +
 .locales/register.en_US.yml |  1 +
 .locales/register.zh_CN.yml |  1 +
 .locales/settings.en_GB.yml | 21 +++++++++++++++++++++
 .locales/settings.en_US.yml | 21 +++++++++++++++++++++
 .locales/settings.zh_CN.yml | 21 +++++++++++++++++++++
 package.json                |  3 +++
 utils/i18n/config.mjs       |  9 +++++----
 utils/i18n/reader.mjs       | 16 ++++++++++++++--
 16 files changed, 128 insertions(+), 8 deletions(-)
 create mode 100644 .locales/settings.en_GB.yml
 create mode 100644 .locales/settings.en_US.yml
 create mode 100644 .locales/settings.zh_CN.yml

diff --git a/.locales/global.en_GB.yml b/.locales/global.en_GB.yml
index 3a83eb8e..28cefcbe 100644
--- a/.locales/global.en_GB.yml
+++ b/.locales/global.en_GB.yml
@@ -3,3 +3,12 @@ en_GB:
   log-in: Log in
   offline: Offline
   online: Online
+  leaderboard: Leaderboard
+  login: Login
+  profile: Profile
+  register: Register
+  warning: Warning
+  notice: Notice
+  uh-oh-be-careful: uh oh! Be careful!
+  hey-listen: Hey! Listen!
+  verify: Verify
diff --git a/.locales/global.en_US.yml b/.locales/global.en_US.yml
index 3d3bdefa..2b9ca6eb 100644
--- a/.locales/global.en_US.yml
+++ b/.locales/global.en_US.yml
@@ -3,3 +3,12 @@ en_US:
   log-in: Log in
   offline: Offline
   online: Online
+  leaderboard: Leaderboard
+  login: Login
+  profile: Profile
+  register: Register
+  notice: Notice
+  warning: Warning
+  uh-oh-be-careful: uh oh! Be careful!
+  hey-listen: Hey! Listen!
+  verify: Verify
diff --git a/.locales/global.zh_CN.yml b/.locales/global.zh_CN.yml
index d7a9d7c5..53befdae 100644
--- a/.locales/global.zh_CN.yml
+++ b/.locales/global.zh_CN.yml
@@ -3,3 +3,12 @@ zh_CN:
   log-in: 登录
   offline: 离线
   online: 在线
+  leaderboard: Leaderboard
+  login: Login
+  profile: Profile
+  register: Register
+  notice: Notice
+  warning: Warning
+  uh-oh-be-careful: uh oh! Be careful!
+  hey-listen: Hey! Listen!
+  verify: Verify
diff --git a/.locales/home.en_US.yml b/.locales/home.en_US.yml
index 6ecef70a..e6e783b4 100644
--- a/.locales/home.en_US.yml
+++ b/.locales/home.en_US.yml
@@ -26,3 +26,7 @@ en_US:
     official servers if you play here with us! And don't worry, as you can
     always switch between the official servers and us at any time!
   sign-up-for-free: Sign up for free
+  error: Uh oh! Be careful!
+  success: Hey! Listen!
+  notice: Notice
+  warning: Warning
diff --git a/.locales/home.zh_CN.yml b/.locales/home.zh_CN.yml
index 1439f859..6641fa25 100644
--- a/.locales/home.zh_CN.yml
+++ b/.locales/home.zh_CN.yml
@@ -1,7 +1,8 @@
 zh_CN:
   subtitle-big: >-
-    我们是一个从头搭建的 osu! 私人服务器,具有许多你曾未见识到的独特功能。--想了解更多信息,可以查看我们在Github 上的 gulag 和
-    guweb 项目 -- 我们完全开源
+    欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜,
+    以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段,
+    如出现问题或有改进建议, 欢迎与我们联系与沟通.
   some-of-our-coolest-features: 我们觉得最酷的一些功能
   features-title-1: 对Relax 和 Autopilot mod的PP计算
   features-content-1: >-
@@ -21,3 +22,7 @@ zh_CN:
     赶紧加入到 %{appName} 当中吧! 没有风险!
     并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
   sign-up-for-free: 免 费 注 册！
+  error: Uh oh! Be careful!
+  success: Hey! Listen!
+  notice: Notice
+  warning: Warning
diff --git a/.locales/login.en_GB.yml b/.locales/login.en_GB.yml
index 8cec222e..bcd941bf 100644
--- a/.locales/login.en_GB.yml
+++ b/.locales/login.en_GB.yml
@@ -4,3 +4,4 @@ en_GB:
   forgot-login: Forgot login?
   username: Username
   password: Password
+  email: Email
diff --git a/.locales/login.en_US.yml b/.locales/login.en_US.yml
index 5ce07ecf..56c54b50 100644
--- a/.locales/login.en_US.yml
+++ b/.locales/login.en_US.yml
@@ -4,3 +4,4 @@ en_US:
   forgot-login: Forgot login?
   username: Username
   password: Password
+  email: Email
diff --git a/.locales/login.zh_CN.yml b/.locales/login.zh_CN.yml
index 57d22c97..7f3bdba9 100644
--- a/.locales/login.zh_CN.yml
+++ b/.locales/login.zh_CN.yml
@@ -4,3 +4,4 @@ zh_CN:
   forgot-login: 忘记账号?
   username: 你的用户名
   password: 你的密码
+  email: Email
diff --git a/.locales/register.en_US.yml b/.locales/register.en_US.yml
index ef8ba925..4f5d9ea4 100644
--- a/.locales/register.en_US.yml
+++ b/.locales/register.en_US.yml
@@ -4,3 +4,4 @@ en_US:
   email: Email
   password: Password
   already-have-an-account: Already have an account?
+  username: Username
diff --git a/.locales/register.zh_CN.yml b/.locales/register.zh_CN.yml
index 2594850b..fce75283 100644
--- a/.locales/register.zh_CN.yml
+++ b/.locales/register.zh_CN.yml
@@ -4,3 +4,4 @@ zh_CN:
   email: 电子邮箱
   password: 密码
   already-have-an-account: 已经拥有账号了?
+  username: Username
diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
new file mode 100644
index 00000000..fa7046e4
--- /dev/null
+++ b/.locales/settings.en_GB.yml
@@ -0,0 +1,21 @@
+en_GB:
+  avatar: Avatar
+  avatar-description: >-
+    We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a
+    PNG, JPG under 5MB
+  choose-file: Choose file
+  save: Save
+  preview: Preview
+  customisation: Customisation
+  banner: Banner
+  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
+  profile-background: Profile Background
+  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+  password: Password
+  password-change: Password Change
+  old-password: Old Password
+  new-password: New Password
+  repeat-password: Repeat Password
+  profile: Profile
+  user-information: User Infomation
+  username: Username
diff --git a/.locales/settings.en_US.yml b/.locales/settings.en_US.yml
new file mode 100644
index 00000000..0a6d35dd
--- /dev/null
+++ b/.locales/settings.en_US.yml
@@ -0,0 +1,21 @@
+en_US:
+  avatar: Avatar
+  avatar-description: >-
+    We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a
+    PNG, JPG under 5MB
+  choose-file: Choose file
+  save: Save
+  preview: Preview
+  customisation: Customisation
+  banner: Banner
+  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
+  profile-background: Profile Background
+  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+  password: Password
+  password-change: Password Change
+  old-password: Old Password
+  new-password: New Password
+  repeat-password: Repeat Password
+  profile: Profile
+  user-information: User Infomation
+  username: Username
diff --git a/.locales/settings.zh_CN.yml b/.locales/settings.zh_CN.yml
new file mode 100644
index 00000000..b856e629
--- /dev/null
+++ b/.locales/settings.zh_CN.yml
@@ -0,0 +1,21 @@
+zh_CN:
+  avatar: Avatar
+  avatar-description: >-
+    We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a
+    PNG, JPG under 5MB
+  choose-file: Choose file
+  save: Save
+  preview: Preview
+  customisation: Customisation
+  banner: Banner
+  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
+  profile-background: Profile Background
+  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+  password: Password
+  password-change: Password Change
+  old-password: Old Password
+  new-password: New Password
+  repeat-password: Repeat Password
+  profile: Profile
+  user-information: User Infomation
+  username: Username
diff --git a/package.json b/package.json
index c2a4b167..04f71a1d 100644
--- a/package.json
+++ b/package.json
@@ -25,5 +25,8 @@
   "devDependencies": {
     "glob": "^8.0.3",
     "js-yaml": "^4.1.0"
+  },
+  "dependencies": {
+    "nodemon": "^2.0.16"
   }
 }
diff --git a/utils/i18n/config.mjs b/utils/i18n/config.mjs
index bd10a480..070b3436 100644
--- a/utils/i18n/config.mjs
+++ b/utils/i18n/config.mjs
@@ -14,11 +14,12 @@ export const contextToFileName = function generateFileName(context) {
     return `${context.namespace}/${context.locale}.${context.extension || 'yml'}`
 }
 export const contextFromFileName = function generateContext(fileName) {
-    const split = fileName.split('/')
-    const namespace = split[0]
-    const [locale, extension] = split[1].split(divider)
+    const split = fileName.split('/').join(divider).split(divider)
+    const namespaces = split.slice(0, split.length - 2)
+    const [locale, extension] = split.slice(-2)
     return {
-        namespace,
+        namespace: namespaces.join('.'),
+        namespaces,
         locale: locale.replace('_', '-'),
         extension
     }
diff --git a/utils/i18n/reader.mjs b/utils/i18n/reader.mjs
index 9f9976b7..a1915df3 100644
--- a/utils/i18n/reader.mjs
+++ b/utils/i18n/reader.mjs
@@ -9,12 +9,23 @@ import { compiledFileSchema, path as translationPath, contextFromFileName } from
 const parseLocale = (file, context) => {
     const locale = yaml.load(fs.readFileSync(file, 'utf8'))
     const _parse = (locale) => {
-        const rtn = {
+        if (!context.namespaces) return {
             [context.locale]: {
                 [context.namespace]: locale
             }
         }
-        return rtn
+        const rtn = {}
+        let inner = rtn
+        context.namespaces.forEach((ns, index) => {
+            if (index === context.namespaces.length - 1) {
+                return inner[ns] = locale
+            }
+            rtn[ns] = {}
+            inner = rtn[ns]
+        })
+        return {
+            [context.locale]: rtn
+        }
     }
     if (Array.isArray(locale)) {
         const toMerge = locale.forEach(_parse)
@@ -25,6 +36,7 @@ const parseLocale = (file, context) => {
                 ...item
             }
         }
+        return rtn
     } else {
         return _parse(locale)
     }

From bb313ae845f8d46c15247cdc5c26d56cee86232b Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Tue, 7 Jun 2022 21:48:17 +0900
Subject: [PATCH 068/278] new generator test

---
 locales/admin.base/en-GB.yml |  9 +++++++++
 locales/admin.home/en-GB.yml |  3 +++
 templates/admin/base.html    | 20 ++++++++++----------
 templates/admin/home.html    |  6 +++---
 4 files changed, 25 insertions(+), 13 deletions(-)
 create mode 100644 locales/admin.base/en-GB.yml
 create mode 100644 locales/admin.home/en-GB.yml

diff --git a/locales/admin.base/en-GB.yml b/locales/admin.base/en-GB.yml
new file mode 100644
index 00000000..cc7229db
--- /dev/null
+++ b/locales/admin.base/en-GB.yml
@@ -0,0 +1,9 @@
+dashboard: Dashboard
+admin: Admin
+admin-panel: '%{appName} Admin Panel'
+welcome-to-admin-panel: Welcome to %{appName} admin panel!
+github: GitHub
+discord: Discord
+youtube: YouTube
+twitter: Twitter
+instagram: Instagram
diff --git a/locales/admin.home/en-GB.yml b/locales/admin.home/en-GB.yml
new file mode 100644
index 00000000..d3fe3048
--- /dev/null
+++ b/locales/admin.home/en-GB.yml
@@ -0,0 +1,3 @@
+total-users: total users
+that-s-a-lot-of-people: that's a lot of people!
+total-online: total online
diff --git a/templates/admin/base.html b/templates/admin/base.html
index 0b084364..848514c2 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -2,7 +2,7 @@
 
 <head>
   <!-- title -->
-  <title>{{ appName() }} - Admin - {% block title %}{% endblock %}</title>
+  <title>{{ appName() }} - {{ t('admin.base.admin') }} - {% block title %}{% endblock %}</title>
 
   <!-- favicon -->
   <link rel="apple-touch-icon" sizes="180x180" href="/static/favicon/apple-touch-icon.png">
@@ -47,10 +47,10 @@
       <div class="colmun">
         <div class="sidebar">
           <div id="style-3" class="sidebar-wrapper">
-            <div class="logo"><a class="simple-text logo-normal">{{ appName() }} Admin Panel</a></div>
+            <div class="logo"><a class="simple-text logo-normal">{{ t('admin.base.admin-panel', appName = appName()) }}</a></div>
             <ul class="nav">
               <li class="nav-item"><a class="nav-link"><span class="icon"><i class="fa fa-home"></i></span> <span
-                    class="name">Dashboard</span></a></li>
+                    class="name">{{ t('admin.base.dashboard') }}</span></a></li>
             </ul>
           </div>
         </div>
@@ -63,8 +63,8 @@
                 onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
             </div>
             <div class="column is-paddingless flex-vcenter">
-              <h2 class="section-title">Dashboard</h2>
-              <p class="section-lead">Welcome to {{ appName() }} admin panel!</p>
+              <h2 class="section-title">{{ t('admin.base.dashboard') }}</h2>
+              <p class="section-lead">{{ t('admin.base.welcome-to-admin-panel', appName = appName()) }}</p>
             </div>
           </div>
           <section class="section">
@@ -80,11 +80,11 @@ <h2 class="section-title">Dashboard</h2>
   <footer class="footer">
     <div class="content">
       <span>{{ appName() }} <strong>v{{ appVersion() }}</strong></span>
-      <a class="foot-link" href="/github"><i class="fa fa-github"></i> GitHub</a>
-      <a class="foot-link" href="/discord"><i class="fab fa-discord"></i> Discord</a>
-      <a class="foot-link" href="/youtube"><i class="fab fa-youtube"></i> YouTube</a>
-      <a class="foot-link" href="/twitter"><i class="fab fa-twitter"></i> Twitter</a>
-      <a class="foot-link" href="/instagram"><i class="fab fa-instagram"></i> Instagram</a>
+      <a class="foot-link" href="/github"><i class="fa fa-github"></i> {{ t('admin.base.github') }}</a>
+      <a class="foot-link" href="/discord"><i class="fab fa-discord"></i> {{ t('admin.base.discord') }}</a>
+      <a class="foot-link" href="/youtube"><i class="fab fa-youtube"></i> {{ t('admin.base.youtube') }}</a>
+      <a class="foot-link" href="/twitter"><i class="fab fa-twitter"></i> {{ t('admin.base.twitter') }}</a>
+      <a class="foot-link" href="/instagram"><i class="fab fa-instagram"></i> {{ t('admin.base.instagram') }}</a>
     </div>
   </footer>
 
diff --git a/templates/admin/home.html b/templates/admin/home.html
index 107380e2..82a43ace 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -15,15 +15,15 @@
     <div class="columns is-marginless is-paddingless">
         <div class="column is-paddingless p-3">
             <div class="card">
-                <div class="title">total users</div>
+                <div class="title">{{ ('admin.home.total-users') }}</div>
                 <i class="fa fa-users"></i>
                 <div class="value">{{ dashdata['count'] }}</div>
-                <div class="stat">that's a lot of people!</div>
+                <div class="stat">{{ t('admin.home.that-s-a-lot-of-people') }}</div>
             </div>
         </div>
         <div class="column is-paddingless p-3">
             <div class="card">
-                <div class="title">total online</div>
+                <div class="title">{{ t('admin.home.total-online') }}</div>
                 <i class="fa fa-circle"></i>
                 <div class="value">
                     <% online_users %>

From 4ac5f1ed7c0b3c894b68782c5b9f8946531629f6 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Tue, 7 Jun 2022 21:58:31 +0900
Subject: [PATCH 069/278] add watch

---
 .locales/admin.en_GB.yml                     | 15 +++++++++++++++
 locales/{admin.base => admin/base}/en-GB.yml |  2 +-
 locales/{admin.home => admin/home}/en-GB.yml |  0
 package.json                                 |  2 ++
 utils/i18n/reader.mjs                        |  6 ++----
 5 files changed, 20 insertions(+), 5 deletions(-)
 create mode 100644 .locales/admin.en_GB.yml
 rename locales/{admin.base => admin/base}/en-GB.yml (90%)
 rename locales/{admin.home => admin/home}/en-GB.yml (100%)

diff --git a/.locales/admin.en_GB.yml b/.locales/admin.en_GB.yml
new file mode 100644
index 00000000..87690c80
--- /dev/null
+++ b/.locales/admin.en_GB.yml
@@ -0,0 +1,15 @@
+en_GB:
+  base:
+    dashboard: Dashboard
+    admin: Admin
+    admin-panel: '%{appName} Admin Panel'
+    welcome-to-admin-panel: Welcome to %{appName} admin panel!
+    github: GitHub
+    discord: Discord
+    youtube: YouTube
+    twitter: Twitter
+    instagram: Instagram
+  home:
+    total-users: total users
+    that-s-a-lot-of-people: that's a lot of people!
+    total-online: total online
diff --git a/locales/admin.base/en-GB.yml b/locales/admin/base/en-GB.yml
similarity index 90%
rename from locales/admin.base/en-GB.yml
rename to locales/admin/base/en-GB.yml
index cc7229db..75b59d44 100644
--- a/locales/admin.base/en-GB.yml
+++ b/locales/admin/base/en-GB.yml
@@ -6,4 +6,4 @@ github: GitHub
 discord: Discord
 youtube: YouTube
 twitter: Twitter
-instagram: Instagram
+instagram: Instagram
\ No newline at end of file
diff --git a/locales/admin.home/en-GB.yml b/locales/admin/home/en-GB.yml
similarity index 100%
rename from locales/admin.home/en-GB.yml
rename to locales/admin/home/en-GB.yml
diff --git a/package.json b/package.json
index 04f71a1d..86272a93 100644
--- a/package.json
+++ b/package.json
@@ -9,6 +9,7 @@
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "i18n:compile": "node utils/i18n/commands/compile.mjs",
+    "i18n:dev": "nodemon --watch ./locales -e yml, yaml utils/i18n/commands/compile.mjs",
     "i18n:make-sure-you-understand-what-you-are-doing:migrate": "node utils/i18n/commands/migrate.mjs",
     "i18n": "node utils/i18n/run"
   },
@@ -27,6 +28,7 @@
     "js-yaml": "^4.1.0"
   },
   "dependencies": {
+    "lodash-es": "^4.17.21",
     "nodemon": "^2.0.16"
   }
 }
diff --git a/utils/i18n/reader.mjs b/utils/i18n/reader.mjs
index a1915df3..da33a617 100644
--- a/utils/i18n/reader.mjs
+++ b/utils/i18n/reader.mjs
@@ -2,6 +2,7 @@ import glob from 'glob'
 import path from 'path'
 import fs from 'fs'
 import yaml from 'js-yaml'
+import { merge }from 'lodash-es'
 
 import { compiledFileSchema, path as translationPath, contextFromFileName } from './config.mjs'
 
@@ -61,10 +62,7 @@ export const readLocales = () => new Promise((resolve, reject) => {
                 const context = contextFromFileName(relative)
                 const data = await parseLocale(match, context)
                 if (!acc[context.locale]) acc[context.locale] = {}
-                acc[context.locale] = {
-                    ...acc[context.locale],
-                    ...data[context.locale]
-                }
+                acc[context.locale] = merge(acc[context.locale], data[context.locale])
                 return acc
             } catch (error) {
                 reject(error)

From 65c6a0285bef0c3907e1367c0165ca2318bee7fb Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Tue, 7 Jun 2022 22:33:00 +0900
Subject: [PATCH 070/278] formatter

---
 package.json                   |  4 ++--
 utils/i18n/commands/format.mjs | 21 +++++++++++++++++++++
 utils/i18n/run.mjs             |  2 --
 3 files changed, 23 insertions(+), 4 deletions(-)
 create mode 100644 utils/i18n/commands/format.mjs
 delete mode 100644 utils/i18n/run.mjs

diff --git a/package.json b/package.json
index 86272a93..50451306 100644
--- a/package.json
+++ b/package.json
@@ -9,9 +9,9 @@
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "i18n:compile": "node utils/i18n/commands/compile.mjs",
+    "i18n:format": "node utils/i18n/commands/format.mjs",
     "i18n:dev": "nodemon --watch ./locales -e yml, yaml utils/i18n/commands/compile.mjs",
-    "i18n:make-sure-you-understand-what-you-are-doing:migrate": "node utils/i18n/commands/migrate.mjs",
-    "i18n": "node utils/i18n/run"
+    "i18n:make-sure-you-understand-what-you-are-doing:migrate": "node utils/i18n/commands/migrate.mjs"
   },
   "repository": {
     "type": "git",
diff --git a/utils/i18n/commands/format.mjs b/utils/i18n/commands/format.mjs
new file mode 100644
index 00000000..2ef469cc
--- /dev/null
+++ b/utils/i18n/commands/format.mjs
@@ -0,0 +1,21 @@
+import yaml from 'js-yaml'
+
+import glob from 'glob'
+import path from 'path'
+import fs from 'fs/promises'
+
+
+import { compiledFileSchema, path as translationPath, contextFromFileName } from '../config.mjs'
+
+glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
+    if (err) throw err
+    const locales = matches.reduce(async (acc, match) => {
+        try {
+            const data = yaml.load(await fs.readFile(match, {encoding: 'utf8'}))
+            const formatted = yaml.dump(data)
+            fs.writeFile(match, formatted, 'utf8')
+        } catch (error) {
+            reject(error)
+        }
+    }, {})
+})
\ No newline at end of file
diff --git a/utils/i18n/run.mjs b/utils/i18n/run.mjs
deleted file mode 100644
index 447a2ca5..00000000
--- a/utils/i18n/run.mjs
+++ /dev/null
@@ -1,2 +0,0 @@
-import locale from './original-reader.mjs'
-

From 89abcf59ee31b4f869ffd23a94ed24ede4989b63 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Tue, 7 Jun 2022 22:35:00 +0900
Subject: [PATCH 071/278] formatter result

---
 locales/admin/base/en-GB.yml | 2 +-
 locales/home/zh-CN.yml       | 5 +++--
 locales/settings/en_GB.yml   | 1 -
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/locales/admin/base/en-GB.yml b/locales/admin/base/en-GB.yml
index 75b59d44..cc7229db 100644
--- a/locales/admin/base/en-GB.yml
+++ b/locales/admin/base/en-GB.yml
@@ -6,4 +6,4 @@ github: GitHub
 discord: Discord
 youtube: YouTube
 twitter: Twitter
-instagram: Instagram
\ No newline at end of file
+instagram: Instagram
diff --git a/locales/home/zh-CN.yml b/locales/home/zh-CN.yml
index 45a9b08f..3d8e0ecd 100644
--- a/locales/home/zh-CN.yml
+++ b/locales/home/zh-CN.yml
@@ -1,6 +1,7 @@
 subtitle-big: >-
-  欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务.
-  详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
+  欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜,
+  以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段,
+  如出现问题或有改进建议, 欢迎与我们联系与沟通.
 some-of-our-coolest-features: 我们觉得最酷的一些功能
 features-title-1: 对Relax 和 Autopilot mod的PP计算
 features-content-1: >-
diff --git a/locales/settings/en_GB.yml b/locales/settings/en_GB.yml
index fc6b20f9..4e44f0f4 100644
--- a/locales/settings/en_GB.yml
+++ b/locales/settings/en_GB.yml
@@ -18,4 +18,3 @@ repeat-password: Repeat Password
 profile: Profile
 user-information: User Infomation
 username: Username
-

From 4963d8f5fd6f4e5bf49b2f1b7f83d910654905ae Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Wed, 8 Jun 2022 00:30:43 +0900
Subject: [PATCH 072/278] fix i18n ally config

---
 .vscode/settings.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 2b00844e..3f255736 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,7 +1,7 @@
 {
   "nuxt.isNuxtApp": false,
   "i18n-ally.namespace": true,
-  "i18n-ally.pathMatcher": "{namespace}/{locale}.{ext}",
+  "i18n-ally.pathMatcher": "{namespaces}/{locale}.{ext}",
   "i18n-ally.localesPaths": "locales",
   "i18n-ally.extract.keygenStyle": "kebab-case",
   "i18n-ally.extract.keyMaxLength": 50,

From 74c7c5fb501c63609835da195e6714bb011e9915 Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Wed, 8 Jun 2022 15:55:44 +0800
Subject: [PATCH 073/278] update to unfinish page

---
 main.py              |    14 +-
 static/css/bulma.css | 11829 +++++++++++++++++++++++++++++++++++++++++
 2 files changed, 11840 insertions(+), 3 deletions(-)
 create mode 100644 static/css/bulma.css

diff --git a/main.py b/main.py
index 7f996ac5..572cce12 100755
--- a/main.py
+++ b/main.py
@@ -4,6 +4,7 @@
 __all__ = ()
 
 import os
+import random
 
 import aiohttp
 import i18n
@@ -33,6 +34,10 @@ async def mysql_conn() -> None:
     await glob.db.connect(glob.config.mysql) # type: ignore
     log('Connected to MySQL!', Ansi.LGREEN)
 
+@app.before_serving
+async def load_lang():
+    i18n.load_path.append(os.getcwd() + '/.locales')
+
 @app.before_serving
 async def http_conn() -> None:
     glob.http = aiohttp.ClientSession(json_serialize=lambda x: orjson.dumps(x).decode())
@@ -50,7 +55,7 @@ def appVersion() -> str:
 
 @app.template_global()
 def t(key, **kwargs) -> str:
-    kwargs['locale'] = session.get('lang', 'en_GB')
+    kwargs['locale'] = session.get('lang', 'zh_CN')
     try:
         return i18n.t(key, **kwargs)
     except:
@@ -60,6 +65,10 @@ def t(key, **kwargs) -> str:
 def appName() -> str:
     return glob.config.app_name
 
+@app.template_global()
+def rand() -> str:
+    return str(random.randint(0,100000))
+
 @app.template_global()
 def captchaKey() -> str:
     return glob.config.hCaptcha_sitekey
@@ -81,5 +90,4 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    i18n.load_path.append(os.getcwd() + '/.locales')
-    app.run(port=8000, debug=glob.config.debug)  # blocking call
+    app.run(port=8000, debug=glob.config.debug)  # blocking call
\ No newline at end of file
diff --git a/static/css/bulma.css b/static/css/bulma.css
new file mode 100644
index 00000000..a9a7be14
--- /dev/null
+++ b/static/css/bulma.css
@@ -0,0 +1,11829 @@
+@font-face {
+    font-family: Rubik;
+    src: url(https://fastly.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/Rubik.woff2) format("woff2 supports variations"), url(https://fastly.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/Rubik.woff2) format("woff2-variations");
+    font-weight: 100 1000;
+    font-stretch: 25% 151%
+}
+
+html {
+    --main: 215;
+    --blue: #007bff;
+    --indigo: #6610f2;
+    --purple: #6f42c1;
+    --pink: #e83e8c;
+    --red: #dc3545;
+    --orange: #fd7e14;
+    --yellow: #ffc107;
+    --green: #28a745;
+    --teal: #20c997;
+    --cyan: #17a2b8;
+    --white: #fff;
+    --gray: #6c757d;
+    --gray-dark: #343a40;
+    --primary: #007bff;
+    --secondary: #6c757d;
+    --success: #28a745;
+    --info: #17a2b8;
+    --warning: #ffc107;
+    --danger: #dc3545;
+    --light: #f8f9fa;
+    --dark: #343a40
+}
+
+@-webkit-keyframes spinAround {
+    0% {
+        transform: rotate(0)
+    }
+
+    to {
+        transform: rotate(359deg)
+    }
+}
+
+@keyframes spinAround {
+    0% {
+        transform: rotate(0)
+    }
+
+    to {
+        transform: rotate(359deg)
+    }
+}
+
+.breadcrumb,
+.button,
+.delete,
+.file,
+.is-unselectable,
+.modal-close,
+.pagination-ellipsis,
+.pagination-link,
+.pagination-next,
+.pagination-previous,
+.tabs {
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none
+}
+
+.navbar-link:not(.is-arrowless)::after,
+.select:not(.is-multiple):not(.is-loading)::after {
+    border: 3px solid transparent;
+    border-radius: 2px;
+    border-right: 0;
+    border-top: 0;
+    content: " ";
+    display: block;
+    height: .625em;
+    margin-top: -.4375em;
+    pointer-events: none;
+    position: absolute;
+    top: 50%;
+    transform: rotate(-45deg);
+    transform-origin: center;
+    width: .625em
+}
+
+.block:not(:last-child),
+.box:not(:last-child),
+.breadcrumb:not(:last-child),
+.content:not(:last-child),
+.highlight:not(:last-child),
+.level:not(:last-child),
+.list:not(:last-child),
+.message:not(:last-child),
+.notification:not(:last-child),
+.pagination:not(:last-child),
+.progress:not(:last-child),
+.subtitle:not(:last-child),
+.table-container:not(:last-child),
+.table:not(:last-child),
+.tabs:not(:last-child),
+.title:not(:last-child) {
+    margin-bottom: 1.5rem
+}
+
+.delete,
+.modal-close {
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    background-color: rgba(10, 10, 10, .2);
+    border: 0;
+    border-radius: 290486px;
+    cursor: pointer;
+    pointer-events: auto;
+    display: inline-block;
+    flex-grow: 0;
+    flex-shrink: 0;
+    font-size: 0;
+    height: 20px;
+    max-height: 20px;
+    max-width: 20px;
+    min-height: 20px;
+    min-width: 20px;
+    outline: 0;
+    position: relative;
+    vertical-align: top;
+    width: 20px
+}
+
+.delete::after,
+.delete::before,
+.modal-close::after,
+.modal-close::before {
+    background-color: #fff;
+    content: "";
+    display: block;
+    left: 50%;
+    position: absolute;
+    top: 50%;
+    transform: translateX(-50%) translateY(-50%) rotate(45deg);
+    transform-origin: center center
+}
+
+.delete::before,
+.modal-close::before {
+    height: 2px;
+    width: 50%
+}
+
+.delete::after,
+.modal-close::after {
+    height: 50%;
+    width: 2px
+}
+
+.delete:focus,
+.delete:hover,
+.modal-close:focus,
+.modal-close:hover {
+    background-color: rgba(10, 10, 10, .3)
+}
+
+.delete:active,
+.modal-close:active {
+    background-color: rgba(10, 10, 10, .4)
+}
+
+.is-small.delete,
+.is-small.modal-close {
+    height: 16px;
+    max-height: 16px;
+    max-width: 16px;
+    min-height: 16px;
+    min-width: 16px;
+    width: 16px
+}
+
+.is-medium.delete,
+.is-medium.modal-close {
+    height: 24px;
+    max-height: 24px;
+    max-width: 24px;
+    min-height: 24px;
+    min-width: 24px;
+    width: 24px
+}
+
+.is-large.delete,
+.is-large.modal-close {
+    height: 32px;
+    max-height: 32px;
+    max-width: 32px;
+    min-height: 32px;
+    min-width: 32px;
+    width: 32px
+}
+
+.button.is-loading::after,
+.control.is-loading::after,
+.loader,
+.select.is-loading::after {
+    -webkit-animation: spinAround .5s infinite linear;
+    animation: spinAround .5s infinite linear;
+    border: 2px solid #dbdee0;
+    border-radius: 290486px;
+    border-right-color: transparent;
+    border-top-color: transparent;
+    content: "";
+    display: block;
+    height: 1em;
+    position: relative;
+    width: 1em
+}
+
+.hero-video,
+.image.is-16by9 .has-ratio,
+.image.is-16by9 img,
+.image.is-1by1 .has-ratio,
+.image.is-1by1 img,
+.image.is-1by2 .has-ratio,
+.image.is-1by2 img,
+.image.is-1by3 .has-ratio,
+.image.is-1by3 img,
+.image.is-2by1 .has-ratio,
+.image.is-2by1 img,
+.image.is-2by3 .has-ratio,
+.image.is-2by3 img,
+.image.is-3by1 .has-ratio,
+.image.is-3by1 img,
+.image.is-3by2 .has-ratio,
+.image.is-3by2 img,
+.image.is-3by4 .has-ratio,
+.image.is-3by4 img,
+.image.is-3by5 .has-ratio,
+.image.is-3by5 img,
+.image.is-4by3 .has-ratio,
+.image.is-4by3 img,
+.image.is-4by5 .has-ratio,
+.image.is-4by5 img,
+.image.is-5by3 .has-ratio,
+.image.is-5by3 img,
+.image.is-5by4 .has-ratio,
+.image.is-5by4 img,
+.image.is-9by16 .has-ratio,
+.image.is-9by16 img,
+.image.is-square .has-ratio,
+.image.is-square img,
+.is-overlay,
+.modal,
+.modal-background {
+    bottom: 0;
+    left: 0;
+    position: absolute;
+    right: 0;
+    top: 0
+}
+
+.button,
+.file-cta,
+.file-name,
+.input,
+.pagination-ellipsis,
+.pagination-link,
+.pagination-next,
+.pagination-previous,
+.select select,
+.textarea {
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    align-items: center;
+    border: 1px solid transparent;
+    border-radius: .4em;
+    box-shadow: none;
+    display: inline-flex;
+    font-size: 15px;
+    height: 2.5em;
+    justify-content: flex-start;
+    line-height: 1.5;
+    padding: calc(.5em - 1px) calc(.75em - 1px);
+    position: relative;
+    vertical-align: top
+}
+
+.button:active,
+.button:focus,
+.file-cta:active,
+.file-cta:focus,
+.file-name:active,
+.file-name:focus,
+.input:active,
+.input:focus,
+.is-active.button,
+.is-active.file-cta,
+.is-active.file-name,
+.is-active.input,
+.is-active.pagination-ellipsis,
+.is-active.pagination-link,
+.is-active.pagination-next,
+.is-active.pagination-previous,
+.is-active.textarea,
+.is-focused.button,
+.is-focused.file-cta,
+.is-focused.file-name,
+.is-focused.input,
+.is-focused.pagination-ellipsis,
+.is-focused.pagination-link,
+.is-focused.pagination-next,
+.is-focused.pagination-previous,
+.is-focused.textarea,
+.pagination-ellipsis:active,
+.pagination-ellipsis:focus,
+.pagination-link:active,
+.pagination-link:focus,
+.pagination-next:active,
+.pagination-next:focus,
+.pagination-previous:active,
+.pagination-previous:focus,
+.select select.is-active,
+.select select.is-focused,
+.select select:active,
+.select select:focus,
+.textarea:active,
+.textarea:focus {
+    outline: 0
+}
+
+.button[disabled],
+.file-cta[disabled],
+.file-name[disabled],
+.input[disabled],
+.pagination-ellipsis[disabled],
+.pagination-link[disabled],
+.pagination-next[disabled],
+.pagination-previous[disabled],
+.select fieldset[disabled] select,
+.select select[disabled],
+.textarea[disabled],
+fieldset[disabled] .button,
+fieldset[disabled] .file-cta,
+fieldset[disabled] .file-name,
+fieldset[disabled] .input,
+fieldset[disabled] .pagination-ellipsis,
+fieldset[disabled] .pagination-link,
+fieldset[disabled] .pagination-next,
+fieldset[disabled] .pagination-previous,
+fieldset[disabled] .select select,
+fieldset[disabled] .textarea {
+    cursor: not-allowed
+}
+
+@-webkit-keyframes moveIndeterminate {
+    0% {
+        background-position: 200% 0
+    }
+
+    to {
+        background-position: -200% 0
+    }
+}
+
+@keyframes moveIndeterminate {
+    0% {
+        background-position: 200% 0
+    }
+
+    to {
+        background-position: -200% 0
+    }
+}
+
+blockquote,
+body,
+dd,
+dl,
+dt,
+fieldset,
+figure,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+html,
+iframe,
+legend,
+li,
+ol,
+p,
+pre,
+ul {
+    margin: 0;
+    padding: 0
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-size: 100%;
+    font-weight: 400
+}
+
+ul {
+    list-style: none
+}
+
+button,
+input,
+select,
+textarea {
+    margin: 0
+}
+
+html {
+    box-sizing: border-box;
+    background-color: hsl(var(--main), 10%, 10%);
+    font-size: 15px;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    min-width: 300px;
+    overflow-x: hidden;
+    overflow-y: scroll;
+    text-rendering: optimizeLegibility;
+    -webkit-text-size-adjust: 100%;
+    -moz-text-size-adjust: 100%;
+    -ms-text-size-adjust: 100%;
+    text-size-adjust: 100%
+}
+
+*,
+::after,
+::before {
+    box-sizing: inherit
+}
+
+img,
+video {
+    height: auto;
+    max-width: 100%
+}
+
+fieldset,
+iframe {
+    border: 0
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0
+}
+
+td,
+textarea,
+th {
+    padding: 0
+}
+
+.content table th:not([align]),
+table td:not([align]),
+table th:not([align]),
+td:not([align]),
+th:not([align]) {
+    text-align: left
+}
+
+article,
+aside,
+figure,
+footer,
+header,
+hgroup,
+section {
+    display: block
+}
+
+body,
+button,
+input,
+select,
+textarea {
+    font-family: Rubik, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif
+}
+
+code,
+pre {
+    -moz-osx-font-smoothing: auto;
+    -webkit-font-smoothing: auto;
+    font-family: Inconsolata, Consolas, Monaco, monospace
+}
+
+body,
+code {
+    font-weight: 400
+}
+
+body {
+    font-size: 1em;
+    line-height: 1.5;
+    color: #fff
+}
+
+a {
+    color: hsl(var(--main), 65%, 70%);
+    cursor: pointer;
+    text-decoration: none;
+    transition: all .2s ease
+}
+
+a strong,
+pre code {
+    color: currentColor
+}
+
+a:hover {
+    color: hsl(var(--main), 90%, 90%)
+}
+
+code {
+    color: #e74c3c;
+    padding: .25em .5em
+}
+
+code,
+hr,
+pre {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+hr {
+    border: 0;
+    display: block;
+    margin: 1.5rem 0;
+    height: 2px
+}
+
+input[type=checkbox],
+input[type=radio] {
+    vertical-align: baseline
+}
+
+code,
+pre,
+small {
+    font-size: .875em
+}
+
+span {
+    font-style: inherit;
+    font-weight: inherit
+}
+
+strong {
+    font-weight: 700
+}
+
+pre {
+    -webkit-overflow-scrolling: touch;
+    color: #fff;
+    overflow-x: auto;
+    padding: 1.25rem 1.5rem;
+    white-space: pre;
+    word-wrap: normal
+}
+
+pre code {
+    background-color: transparent;
+    font-size: 1em;
+    padding: 0
+}
+
+table td,
+table th {
+    vertical-align: top
+}
+
+strong,
+table th {
+    color: #f2f2f2
+}
+
+.is-clearfix::after {
+    clear: both;
+    content: " ";
+    display: table
+}
+
+.is-pulled-left {
+    float: left !important
+}
+
+.is-pulled-right {
+    float: right !important
+}
+
+.is-clipped {
+    overflow: hidden !important
+}
+
+.is-size-1 {
+    font-size: 3rem !important
+}
+
+.is-size-2 {
+    font-size: 2.5rem !important
+}
+
+.is-size-3 {
+    font-size: 2rem !important
+}
+
+.is-size-4 {
+    font-size: 1.5rem !important
+}
+
+.is-size-5 {
+    font-size: 1.25rem !important
+}
+
+.is-size-6 {
+    font-size: 15px !important
+}
+
+.is-size-7 {
+    font-size: .85em !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-size-1-mobile {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-mobile {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-mobile {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-mobile {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-mobile {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-mobile {
+        font-size: 15px !important
+    }
+
+    .is-size-7-mobile {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-size-1-tablet {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-tablet {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-tablet {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-tablet {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-tablet {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-tablet {
+        font-size: 15px !important
+    }
+
+    .is-size-7-tablet {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-size-1-touch {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-touch {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-touch {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-touch {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-touch {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-touch {
+        font-size: 15px !important
+    }
+
+    .is-size-7-touch {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-size-1-desktop {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-desktop {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-desktop {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-desktop {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-desktop {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-desktop {
+        font-size: 15px !important
+    }
+
+    .is-size-7-desktop {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-size-1-widescreen {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-widescreen {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-widescreen {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-widescreen {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-widescreen {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-widescreen {
+        font-size: 15px !important
+    }
+
+    .is-size-7-widescreen {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-size-1-fullhd {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-fullhd {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-fullhd {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-fullhd {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-fullhd {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-fullhd {
+        font-size: 15px !important
+    }
+
+    .is-size-7-fullhd {
+        font-size: .85em !important
+    }
+}
+
+.has-text-centered {
+    text-align: center !important
+}
+
+.has-text-justified {
+    text-align: justify !important
+}
+
+.has-text-left {
+    text-align: left !important
+}
+
+.has-text-right {
+    text-align: right !important
+}
+
+@media screen and (max-width: 768px) {
+    .has-text-centered-mobile {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .has-text-centered-tablet {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .has-text-centered-tablet-only {
+        text-align: center !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .has-text-centered-touch {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .has-text-centered-desktop {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .has-text-centered-desktop-only {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .has-text-centered-widescreen {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .has-text-centered-widescreen-only {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .has-text-centered-fullhd {
+        text-align: center !important
+    }
+}
+
+@media screen and (max-width: 768px) {
+    .has-text-justified-mobile {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .has-text-justified-tablet {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .has-text-justified-tablet-only {
+        text-align: justify !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .has-text-justified-touch {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .has-text-justified-desktop {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .has-text-justified-desktop-only {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .has-text-justified-widescreen {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .has-text-justified-widescreen-only {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .has-text-justified-fullhd {
+        text-align: justify !important
+    }
+}
+
+@media screen and (max-width: 768px) {
+    .has-text-left-mobile {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .has-text-left-tablet {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .has-text-left-tablet-only {
+        text-align: left !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .has-text-left-touch {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .has-text-left-desktop {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .has-text-left-desktop-only {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .has-text-left-widescreen {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .has-text-left-widescreen-only {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .has-text-left-fullhd {
+        text-align: left !important
+    }
+}
+
+@media screen and (max-width: 768px) {
+    .has-text-right-mobile {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .has-text-right-tablet {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .has-text-right-tablet-only {
+        text-align: right !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .has-text-right-touch {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .has-text-right-desktop {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .has-text-right-desktop-only {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .has-text-right-widescreen {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .has-text-right-widescreen-only {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .has-text-right-fullhd {
+        text-align: right !important
+    }
+}
+
+.is-capitalized {
+    text-transform: capitalize !important
+}
+
+.is-lowercase {
+    text-transform: lowercase !important
+}
+
+.is-uppercase {
+    text-transform: uppercase !important
+}
+
+.is-italic {
+    font-style: italic !important
+}
+
+.has-text-white {
+    color: #fff !important
+}
+
+a.has-text-white:focus,
+a.has-text-white:hover {
+    color: #e6e6e6 !important
+}
+
+.has-background-white {
+    background-color: #fff !important
+}
+
+.has-text-black {
+    color: #0a0a0a !important
+}
+
+a.has-text-black:focus,
+a.has-text-black:hover {
+    color: #000 !important
+}
+
+.has-background-black {
+    background-color: #0a0a0a !important
+}
+
+.has-text-light {
+    color: #ecf0f1 !important
+}
+
+a.has-text-light:focus,
+a.has-text-light:hover {
+    color: #cfd9db !important
+}
+
+.has-background-light {
+    background-color: #ecf0f1 !important
+}
+
+.has-text-dark {
+    color: hsl(var(--main), 10%, 15%) !important
+}
+
+a.has-text-dark:focus,
+a.has-text-dark:hover {
+    color: #111414 !important
+}
+
+.has-background-dark {
+    background-color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-text-primary {
+    color: hsl(var(--main), 45%, 45%) !important
+}
+
+a.has-text-primary:focus,
+a.has-text-primary:hover {
+    color: hsl(var(--main), 45%, 35%) !important
+}
+
+.has-background-primary {
+    background-color: hsl(var(--main), 45%, 45%) !important
+}
+
+.has-text-link {
+    color: hsl(var(--main), 45%, 45%) !important
+}
+
+a.has-text-link:focus,
+a.has-text-link:hover {
+    color: #148f77 !important
+}
+
+.has-background-link {
+    background-color: hsl(var(--main), 45%, 45%) !important
+}
+
+.has-text-info {
+    color: #3298dc !important
+}
+
+a.has-text-info:focus,
+a.has-text-info:hover {
+    color: #207dbc !important
+}
+
+.has-background-info {
+    background-color: #3298dc !important
+}
+
+.has-text-success {
+    color: #2ecc71 !important
+}
+
+a.has-text-success:focus,
+a.has-text-success:hover {
+    color: #25a25a !important
+}
+
+.has-background-success {
+    background-color: #2ecc71 !important
+}
+
+.has-text-warning {
+    color: #f1b70e !important
+}
+
+a.has-text-warning:focus,
+a.has-text-warning:hover {
+    color: #c1920b !important
+}
+
+.has-background-warning {
+    background-color: #f1b70e !important
+}
+
+.has-text-danger {
+    color: #e74c3c !important
+}
+
+a.has-text-danger:focus,
+a.has-text-danger:hover {
+    color: #d62c1a !important
+}
+
+.has-background-danger {
+    background-color: #e74c3c !important
+}
+
+.has-text-black-bis {
+    color: #121212 !important
+}
+
+.has-background-black-bis {
+    background-color: #121212 !important
+}
+
+.has-text-black-ter {
+    color: #242424 !important
+}
+
+.has-background-black-ter {
+    background-color: #242424 !important
+}
+
+.has-text-grey-darker {
+    color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-background-grey-darker {
+    background-color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-text-grey-dark {
+    color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-background-grey-dark {
+    background-color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-text-grey {
+    color: #5e6d6f !important
+}
+
+.has-background-grey {
+    background-color: #5e6d6f !important
+}
+
+.has-text-grey-light {
+    color: #8c9b9d !important
+}
+
+.has-background-grey-light {
+    background-color: #8c9b9d !important
+}
+
+.has-text-grey-lighter {
+    color: #dbdee0 !important
+}
+
+.has-background-grey-lighter {
+    background-color: #dbdee0 !important
+}
+
+.has-text-white-ter {
+    color: #ecf0f1 !important
+}
+
+.has-background-white-ter {
+    background-color: #ecf0f1 !important
+}
+
+.has-text-white-bis {
+    color: #fafafa !important
+}
+
+.has-background-white-bis {
+    background-color: #fafafa !important
+}
+
+.has-text-weight-light {
+    font-weight: 300 !important
+}
+
+.has-text-weight-normal {
+    font-weight: 400 !important
+}
+
+.has-text-weight-medium {
+    font-weight: 500 !important
+}
+
+.has-text-weight-semibold {
+    font-weight: 600 !important
+}
+
+.has-text-weight-bold {
+    font-weight: 700 !important
+}
+
+.is-family-primary,
+.is-family-sans-serif,
+.is-family-secondary {
+    font-family: Rubik, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif !important
+}
+
+.is-family-code,
+.is-family-monospace {
+    font-family: Inconsolata, Consolas, Monaco, monospace !important
+}
+
+.is-block {
+    display: block !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-block-mobile {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-block-tablet {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-block-tablet-only {
+        display: block !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-block-touch {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-block-desktop {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-block-desktop-only {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-block-widescreen {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-block-widescreen-only {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-block-fullhd {
+        display: block !important
+    }
+}
+
+.is-flex {
+    display: flex !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-flex-mobile {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-flex-tablet {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-flex-tablet-only {
+        display: flex !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-flex-touch {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-flex-desktop {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-flex-desktop-only {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-flex-widescreen {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-flex-widescreen-only {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-flex-fullhd {
+        display: flex !important
+    }
+}
+
+.is-inline {
+    display: inline !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-inline-mobile {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-inline-tablet {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-inline-tablet-only {
+        display: inline !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-inline-touch {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-inline-desktop {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-inline-desktop-only {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-inline-widescreen {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-inline-widescreen-only {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-inline-fullhd {
+        display: inline !important
+    }
+}
+
+.is-inline-block {
+    display: inline-block !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-inline-block-mobile {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-inline-block-tablet {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-inline-block-tablet-only {
+        display: inline-block !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-inline-block-touch {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-inline-block-desktop {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-inline-block-desktop-only {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-inline-block-widescreen {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-inline-block-widescreen-only {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-inline-block-fullhd {
+        display: inline-block !important
+    }
+}
+
+.is-inline-flex {
+    display: inline-flex !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-inline-flex-mobile {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-inline-flex-tablet {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-inline-flex-tablet-only {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-inline-flex-touch {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-inline-flex-desktop {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-inline-flex-desktop-only {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-inline-flex-widescreen {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-inline-flex-widescreen-only {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-inline-flex-fullhd {
+        display: inline-flex !important
+    }
+}
+
+.is-hidden {
+    display: none !important
+}
+
+.is-sr-only {
+    border: 0 !important;
+    clip: rect(0, 0, 0, 0) !important;
+    height: .01em !important;
+    overflow: hidden !important;
+    padding: 0 !important;
+    position: absolute !important;
+    white-space: nowrap !important;
+    width: .01em !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-hidden-mobile {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-hidden-tablet {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-hidden-tablet-only {
+        display: none !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-hidden-touch {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-hidden-desktop {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-hidden-desktop-only {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-hidden-widescreen {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-hidden-widescreen-only {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-hidden-fullhd {
+        display: none !important
+    }
+}
+
+.is-invisible {
+    visibility: hidden !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-invisible-mobile {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-invisible-tablet {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-invisible-tablet-only {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-invisible-touch {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-invisible-desktop {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-invisible-desktop-only {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-invisible-widescreen {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-invisible-widescreen-only {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-invisible-fullhd {
+        visibility: hidden !important
+    }
+}
+
+.is-marginless {
+    margin: 0 !important
+}
+
+.is-paddingless {
+    padding: 0 !important
+}
+
+.is-radiusless {
+    border-radius: 0 !important
+}
+
+.is-shadowless {
+    box-shadow: none !important
+}
+
+.is-relative {
+    position: relative !important
+}
+
+.box {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: 8px;
+    box-shadow: none;
+    color: #fff;
+    display: block;
+    padding: 1.25rem
+}
+
+a.box:focus,
+a.box:hover {
+    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px hsl(var(--main), 45%, 45%)
+}
+
+a.box:active {
+    box-shadow: inset 0 1px 2px rgba(10, 10, 10, .2), 0 0 0 1px hsl(var(--main), 45%, 45%)
+}
+
+.button {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: #4c5759;
+    cursor: pointer;
+    justify-content: center;
+    padding-bottom: calc(.5em - 1px);
+    padding-left: 1em;
+    padding-right: 1em;
+    padding-top: calc(.5em - 1px);
+    text-align: center;
+    white-space: nowrap
+}
+
+.button strong {
+    color: inherit
+}
+
+.button .icon,
+.button .icon.is-large,
+.button .icon.is-medium,
+.button .icon.is-small {
+    height: 1.5em;
+    width: 1.5em
+}
+
+.button .icon:first-child:not(:last-child) {
+    margin-left: calc(-.5em - 1px);
+    margin-right: .25em
+}
+
+.button .icon:last-child:not(:first-child) {
+    margin-left: .25em;
+    margin-right: calc(-.5em - 1px)
+}
+
+.button .icon:first-child:last-child {
+    margin-left: calc(-.5em - 1px);
+    margin-right: calc(-.5em - 1px)
+}
+
+.button.is-hovered,
+.button:hover {
+    border-color: #8c9b9d;
+    color: #f2f2f2
+}
+
+.button.is-focused,
+.button:focus {
+    border-color: #8c9b9d;
+    color: hsl(var(--main), 75%, 80%)
+}
+
+.button.is-focused:not(:active),
+.button:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(26, 188, 156, .25)
+}
+
+.button.is-active,
+.button:active {
+    border-color: hsl(var(--main), 10%, 15%);
+    color: #f2f2f2
+}
+
+.button.is-text {
+    background-color: transparent;
+    border-color: transparent;
+    color: #fff;
+    text-decoration: underline
+}
+
+.button.is-text.is-focused,
+.button.is-text.is-hovered,
+.button.is-text:focus,
+.button.is-text:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #f2f2f2
+}
+
+.button.is-text.is-active,
+.button.is-text:active {
+    background-color: #1d2122;
+    color: #f2f2f2
+}
+
+.button.is-text[disabled],
+fieldset[disabled] .button.is-text {
+    background-color: transparent;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-white {
+    background-color: #fff
+}
+
+.button.is-white,
+.button.is-white.is-hovered,
+.button.is-white:hover {
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.button.is-white.is-focused,
+.button.is-white:focus {
+    color: #0a0a0a
+}
+
+.button.is-white.is-focused:not(:active),
+.button.is-white:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(255, 255, 255, .25)
+}
+
+.button.is-white.is-active,
+.button.is-white:active {
+    background-color: #f2f2f2;
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.button.is-white[disabled],
+fieldset[disabled] .button.is-white {
+    background-color: #fff;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-white.is-loading::after {
+    border-color: transparent transparent #0a0a0a #0a0a0a !important
+}
+
+.button.is-white.is-outlined {
+    background-color: transparent;
+    border-color: #fff;
+    color: #fff
+}
+
+.button.is-white.is-outlined.is-focused,
+.button.is-white.is-outlined.is-hovered,
+.button.is-white.is-outlined:focus,
+.button.is-white.is-outlined:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #0a0a0a
+}
+
+.button.is-white.is-outlined.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-white.is-outlined.is-loading.is-focused::after,
+.button.is-white.is-outlined.is-loading.is-hovered::after,
+.button.is-white.is-outlined.is-loading:focus::after,
+.button.is-white.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #0a0a0a #0a0a0a !important
+}
+
+.button.is-white.is-outlined[disabled],
+fieldset[disabled] .button.is-white.is-outlined {
+    background-color: transparent;
+    border-color: #fff;
+    box-shadow: none;
+    color: #fff
+}
+
+.button.is-black {
+    background-color: #0a0a0a
+}
+
+.button.is-black,
+.button.is-black.is-hovered,
+.button.is-black:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-black.is-focused,
+.button.is-black:focus {
+    color: #fff
+}
+
+.button.is-black.is-focused:not(:active),
+.button.is-black:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(10, 10, 10, .25)
+}
+
+.button.is-black.is-active,
+.button.is-black:active {
+    background-color: #000;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-black[disabled],
+fieldset[disabled] .button.is-black {
+    background-color: #0a0a0a;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-black.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-black.is-outlined {
+    background-color: transparent;
+    border-color: #0a0a0a;
+    color: #0a0a0a
+}
+
+.button.is-black.is-outlined.is-focused,
+.button.is-black.is-outlined.is-hovered,
+.button.is-black.is-outlined:focus,
+.button.is-black.is-outlined:hover {
+    background-color: #0a0a0a;
+    border-color: #0a0a0a;
+    color: #fff
+}
+
+.button.is-black.is-outlined.is-loading::after {
+    border-color: transparent transparent #0a0a0a #0a0a0a !important
+}
+
+.button.is-black.is-outlined.is-loading.is-focused::after,
+.button.is-black.is-outlined.is-loading.is-hovered::after,
+.button.is-black.is-outlined.is-loading:focus::after,
+.button.is-black.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-black.is-outlined[disabled],
+fieldset[disabled] .button.is-black.is-outlined {
+    background-color: transparent;
+    border-color: #0a0a0a;
+    box-shadow: none;
+    color: #0a0a0a
+}
+
+.button.is-light {
+    background-color: #ecf0f1
+}
+
+.button.is-light,
+.button.is-light.is-hovered,
+.button.is-light:hover {
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-light.is-focused,
+.button.is-light:focus {
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-light.is-focused:not(:active),
+.button.is-light:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(236, 240, 241, .25)
+}
+
+.button.is-light.is-active,
+.button.is-light:active {
+    background-color: #dde4e6;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-light[disabled],
+fieldset[disabled] .button.is-light {
+    background-color: #ecf0f1;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-light.is-loading::after {
+    border-color: transparent transparent rgba(0, 0, 0, .7) rgba(0, 0, 0, .7) !important
+}
+
+.button.is-light.is-outlined {
+    background-color: transparent;
+    border-color: #ecf0f1;
+    color: #ecf0f1
+}
+
+.button.is-light.is-outlined.is-focused,
+.button.is-light.is-outlined.is-hovered,
+.button.is-light.is-outlined:focus,
+.button.is-light.is-outlined:hover {
+    background-color: #ecf0f1;
+    border-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-light.is-outlined.is-loading::after {
+    border-color: transparent transparent #ecf0f1 #ecf0f1 !important
+}
+
+.button.is-light.is-outlined.is-loading.is-focused::after,
+.button.is-light.is-outlined.is-loading.is-hovered::after,
+.button.is-light.is-outlined.is-loading:focus::after,
+.button.is-light.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent rgba(0, 0, 0, .7) rgba(0, 0, 0, .7) !important
+}
+
+.button.is-light.is-outlined[disabled],
+fieldset[disabled] .button.is-light.is-outlined {
+    background-color: transparent;
+    border-color: #ecf0f1;
+    box-shadow: none;
+    color: #ecf0f1
+}
+
+.button.is-dark {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.button.is-dark,
+.button.is-dark.is-hovered,
+.button.is-dark:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-dark.is-focused,
+.button.is-dark:focus {
+    color: #fff
+}
+
+.button.is-dark.is-focused:not(:active),
+.button.is-dark:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(40, 47, 47, .25)
+}
+
+.button.is-dark.is-active,
+.button.is-dark:active {
+    background-color: #1d2122;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-dark[disabled],
+fieldset[disabled] .button.is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-dark.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-dark.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 10%, 15%);
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.button.is-dark.is-outlined.is-focused,
+.button.is-dark.is-outlined.is-hovered,
+.button.is-dark.is-outlined:focus,
+.button.is-dark.is-outlined:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.button.is-dark.is-outlined.is-loading::after {
+    border-color: transparent transparent hsl(var(--main), 10%, 15%) hsl(var(--main), 10%, 15%) !important
+}
+
+.button.is-dark.is-outlined.is-loading.is-focused::after,
+.button.is-dark.is-outlined.is-loading.is-hovered::after,
+.button.is-dark.is-outlined.is-loading:focus::after,
+.button.is-dark.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-dark.is-outlined[disabled],
+fieldset[disabled] .button.is-dark.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 10%, 15%);
+    box-shadow: none;
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.button.is-primary {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-primary,
+.button.is-primary.is-hovered,
+.button.is-primary:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-primary.is-focused,
+.button.is-primary:focus {
+    color: #fff
+}
+
+.button.is-primary.is-focused:not(:active),
+.button.is-primary:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(55, 90, 127, .25)
+}
+
+.button.is-primary.is-active,
+.button.is-primary:active {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-primary[disabled],
+fieldset[disabled] .button.is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-primary.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-primary.is-outlined {
+    background-color: transparent;
+    border-color: #fff;
+    color: #fff
+}
+
+.button.is-primary.is-outlined.is-focused,
+.button.is-primary.is-outlined.is-hovered,
+.button.is-primary.is-outlined:focus,
+.button.is-primary.is-outlined:hover {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.button.is-primary.is-outlined.is-loading::after {
+    border-color: transparent transparent hsl(var(--main), 45%, 45%) hsl(var(--main), 45%, 45%) !important
+}
+
+.button.is-primary.is-outlined.is-loading.is-focused::after,
+.button.is-primary.is-outlined.is-loading.is-hovered::after,
+.button.is-primary.is-outlined.is-loading:focus::after,
+.button.is-primary.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-primary.is-outlined[disabled],
+fieldset[disabled] .button.is-primary.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 45%, 45%);
+    box-shadow: none;
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-primary.is-light {
+    background-color: #f1f5f9;
+    color: hsl(var(--main), 65%, 35%)
+}
+
+.button.is-primary.is-light.is-hovered,
+.button.is-primary.is-light:hover {
+    background-color: #e8eef5;
+    border-color: transparent;
+    color: hsl(var(--main), 65%, 35%)
+}
+
+.button.is-primary.is-light.is-active,
+.button.is-primary.is-light:active {
+    background-color: #dfe8f1;
+    border-color: transparent;
+    color: #4d7eb2
+}
+
+.button.is-link {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-link,
+.button.is-link.is-hovered,
+.button.is-link:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-link.is-focused,
+.button.is-link:focus {
+    color: #fff
+}
+
+.button.is-link.is-focused:not(:active),
+.button.is-link:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(26, 188, 156, .25)
+}
+
+.button.is-link.is-active,
+.button.is-link:active {
+    background-color: hsl(var(--main), 75%, 80%);
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-link[disabled],
+fieldset[disabled] .button.is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-link.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-link.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 45%, 45%);
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-link.is-outlined.is-focused,
+.button.is-link.is-outlined.is-hovered,
+.button.is-link.is-outlined:focus,
+.button.is-link.is-outlined:hover {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.button.is-link.is-outlined.is-loading::after {
+    border-color: transparent transparent hsl(var(--main), 45%, 45%) hsl(var(--main), 45%, 45%) !important
+}
+
+.button.is-link.is-outlined.is-loading.is-focused::after,
+.button.is-link.is-outlined.is-loading.is-hovered::after,
+.button.is-link.is-outlined.is-loading:focus::after,
+.button.is-link.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-link.is-outlined[disabled],
+fieldset[disabled] .button.is-link.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 45%, 45%);
+    box-shadow: none;
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-link.is-light {
+    background-color: #edfdf9;
+    color: #15987e
+}
+
+.button.is-link.is-light.is-hovered,
+.button.is-link.is-light:hover {
+    background-color: #e2fbf6;
+    border-color: transparent;
+    color: #15987e
+}
+
+.button.is-link.is-light.is-active,
+.button.is-link.is-light:active {
+    background-color: #d7f9f3;
+    border-color: transparent;
+    color: #15987e
+}
+
+.button.is-info {
+    background-color: #3298dc
+}
+
+.button.is-info,
+.button.is-info.is-hovered,
+.button.is-info:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-info.is-focused,
+.button.is-info:focus {
+    color: #fff
+}
+
+.button.is-info.is-focused:not(:active),
+.button.is-info:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(50, 152, 220, .25)
+}
+
+.button.is-info.is-active,
+.button.is-info:active {
+    background-color: #238cd1;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-info[disabled],
+fieldset[disabled] .button.is-info {
+    background-color: #3298dc;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-info.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-info.is-outlined {
+    background-color: transparent;
+    border-color: #3298dc;
+    color: #3298dc
+}
+
+.button.is-info.is-outlined.is-focused,
+.button.is-info.is-outlined.is-hovered,
+.button.is-info.is-outlined:focus,
+.button.is-info.is-outlined:hover {
+    background-color: #3298dc;
+    border-color: #3298dc;
+    color: #fff
+}
+
+.button.is-info.is-outlined.is-loading::after {
+    border-color: transparent transparent #3298dc #3298dc !important
+}
+
+.button.is-info.is-outlined.is-loading.is-focused::after,
+.button.is-info.is-outlined.is-loading.is-hovered::after,
+.button.is-info.is-outlined.is-loading:focus::after,
+.button.is-info.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-info.is-outlined[disabled],
+fieldset[disabled] .button.is-info.is-outlined {
+    background-color: transparent;
+    border-color: #3298dc;
+    box-shadow: none;
+    color: #3298dc
+}
+
+.button.is-info.is-light {
+    background-color: #eef6fc;
+    color: #1d72aa
+}
+
+.button.is-info.is-light.is-hovered,
+.button.is-info.is-light:hover {
+    background-color: #e3f1fa;
+    border-color: transparent;
+    color: #1d72aa
+}
+
+.button.is-info.is-light.is-active,
+.button.is-info.is-light:active {
+    background-color: #d8ebf8;
+    border-color: transparent;
+    color: #1d72aa
+}
+
+.button.is-success {
+    background-color: #2ecc71
+}
+
+.button.is-success,
+.button.is-success.is-hovered,
+.button.is-success:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-success.is-focused,
+.button.is-success:focus {
+    color: #fff
+}
+
+.button.is-success.is-focused:not(:active),
+.button.is-success:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(46, 204, 113, .25)
+}
+
+.button.is-success.is-active,
+.button.is-success:active {
+    background-color: #29b765;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-success[disabled],
+fieldset[disabled] .button.is-success {
+    background-color: #2ecc71;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-success.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-success.is-outlined {
+    background-color: transparent;
+    border-color: #2ecc71;
+    color: #2ecc71
+}
+
+.button.is-success.is-outlined.is-focused,
+.button.is-success.is-outlined.is-hovered,
+.button.is-success.is-outlined:focus,
+.button.is-success.is-outlined:hover {
+    background-color: #2ecc71;
+    border-color: #2ecc71;
+    color: #fff
+}
+
+.button.is-success.is-outlined.is-loading::after {
+    border-color: transparent transparent #2ecc71 #2ecc71 !important
+}
+
+.button.is-success.is-outlined.is-loading.is-focused::after,
+.button.is-success.is-outlined.is-loading.is-hovered::after,
+.button.is-success.is-outlined.is-loading:focus::after,
+.button.is-success.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-success.is-outlined[disabled],
+fieldset[disabled] .button.is-success.is-outlined {
+    background-color: transparent;
+    border-color: #2ecc71;
+    box-shadow: none;
+    color: #2ecc71
+}
+
+.button.is-success.is-light {
+    background-color: #eefbf4;
+    color: #1d8147
+}
+
+.button.is-success.is-light.is-hovered,
+.button.is-success.is-light:hover {
+    background-color: #e4f9ed;
+    border-color: transparent;
+    color: #1d8147
+}
+
+.button.is-success.is-light.is-active,
+.button.is-success.is-light:active {
+    background-color: #daf7e6;
+    border-color: transparent;
+    color: #1d8147
+}
+
+.button.is-warning {
+    background-color: #f1b70e
+}
+
+.button.is-warning,
+.button.is-warning.is-hovered,
+.button.is-warning:hover {
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-warning.is-focused,
+.button.is-warning:focus {
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-warning.is-focused:not(:active),
+.button.is-warning:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(241, 183, 14, .25)
+}
+
+.button.is-warning.is-active,
+.button.is-warning:active {
+    background-color: #d9a50d;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-warning[disabled],
+fieldset[disabled] .button.is-warning {
+    background-color: #f1b70e;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-warning.is-loading::after {
+    border-color: transparent transparent rgba(0, 0, 0, .7) rgba(0, 0, 0, .7) !important
+}
+
+.button.is-warning.is-outlined {
+    background-color: transparent;
+    border-color: #f1b70e;
+    color: #f1b70e
+}
+
+.button.is-warning.is-outlined.is-focused,
+.button.is-warning.is-outlined.is-hovered,
+.button.is-warning.is-outlined:focus,
+.button.is-warning.is-outlined:hover {
+    background-color: #f1b70e;
+    border-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-warning.is-outlined.is-loading::after {
+    border-color: transparent transparent #f1b70e #f1b70e !important
+}
+
+.button.is-warning.is-outlined.is-loading.is-focused::after,
+.button.is-warning.is-outlined.is-loading.is-hovered::after,
+.button.is-warning.is-outlined.is-loading:focus::after,
+.button.is-warning.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent rgba(0, 0, 0, .7) rgba(0, 0, 0, .7) !important
+}
+
+.button.is-warning.is-outlined[disabled],
+fieldset[disabled] .button.is-warning.is-outlined {
+    background-color: transparent;
+    border-color: #f1b70e;
+    box-shadow: none;
+    color: #f1b70e
+}
+
+.button.is-warning.is-light {
+    background-color: #fef9ec;
+    color: #8c6a08
+}
+
+.button.is-warning.is-light.is-hovered,
+.button.is-warning.is-light:hover {
+    background-color: #fdf6e0;
+    border-color: transparent;
+    color: #8c6a08
+}
+
+.button.is-warning.is-light.is-active,
+.button.is-warning.is-light:active {
+    background-color: #fcf2d4;
+    border-color: transparent;
+    color: #8c6a08
+}
+
+.button.is-danger {
+    background-color: #e74c3c
+}
+
+.button.is-danger,
+.button.is-danger.is-hovered,
+.button.is-danger:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-danger.is-focused,
+.button.is-danger:focus {
+    color: #fff
+}
+
+.button.is-danger.is-focused:not(:active),
+.button.is-danger:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(231, 76, 60, .25)
+}
+
+.button.is-danger.is-active,
+.button.is-danger:active {
+    background-color: #e43725;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-danger[disabled],
+fieldset[disabled] .button.is-danger {
+    background-color: #e74c3c;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-danger.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-danger.is-outlined {
+    background-color: transparent;
+    border-color: #e74c3c;
+    color: #e74c3c
+}
+
+.button.is-danger.is-outlined.is-focused,
+.button.is-danger.is-outlined.is-hovered,
+.button.is-danger.is-outlined:focus,
+.button.is-danger.is-outlined:hover {
+    background-color: #e74c3c;
+    border-color: #e74c3c;
+    color: #fff
+}
+
+.button.is-danger.is-outlined.is-loading::after {
+    border-color: transparent transparent #e74c3c #e74c3c !important
+}
+
+.button.is-danger.is-outlined.is-loading.is-focused::after,
+.button.is-danger.is-outlined.is-loading.is-hovered::after,
+.button.is-danger.is-outlined.is-loading:focus::after,
+.button.is-danger.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-danger.is-outlined[disabled],
+fieldset[disabled] .button.is-danger.is-outlined {
+    background-color: transparent;
+    border-color: #e74c3c;
+    box-shadow: none;
+    color: #e74c3c
+}
+
+.button.is-danger.is-light {
+    background-color: #fdeeed;
+    color: #c32818
+}
+
+.button.is-danger.is-light.is-hovered,
+.button.is-danger.is-light:hover {
+    background-color: #fbe4e1;
+    border-color: transparent;
+    color: #c32818
+}
+
+.button.is-danger.is-light.is-active,
+.button.is-danger.is-light:active {
+    background-color: #fad9d6;
+    border-color: transparent;
+    color: #c32818
+}
+
+.button.is-small {
+    border-radius: 3px;
+    font-size: .85em
+}
+
+.button.is-normal {
+    font-size: 15px
+}
+
+.button.is-medium {
+    font-size: 1.25rem
+}
+
+.button.is-large {
+    font-size: 1.5rem
+}
+
+.button[disabled],
+fieldset[disabled] .button {
+    background-color: #8c9b9d;
+    border-color: #5e6d6f;
+    box-shadow: none;
+    opacity: .5
+}
+
+.button.is-fullwidth {
+    display: flex;
+    width: 100%
+}
+
+.button.is-loading {
+    color: transparent !important;
+    pointer-events: none
+}
+
+.button.is-loading::after {
+    left: calc(50% - (1em / 2));
+    top: calc(50% - (1em / 2));
+    position: absolute !important
+}
+
+.button.is-static {
+    background-color: #ecf0f1;
+    border-color: #5e6d6f;
+    color: #fff;
+    box-shadow: none;
+    pointer-events: none
+}
+
+.button.is-rounded {
+    border-radius: 290486px;
+    padding-left: calc(1em + .25em);
+    padding-right: calc(1em + .25em)
+}
+
+.buttons {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start
+}
+
+.buttons .button {
+    margin-bottom: .5rem
+}
+
+.buttons .button:not(:last-child):not(.is-fullwidth) {
+    margin-right: .5rem
+}
+
+.buttons:last-child {
+    margin-bottom: -.5rem
+}
+
+.buttons:not(:last-child) {
+    margin-bottom: 1rem
+}
+
+.buttons.are-small .button:not(.is-normal):not(.is-medium):not(.is-large) {
+    border-radius: 3px;
+    font-size: .85em
+}
+
+.buttons.are-medium .button:not(.is-small):not(.is-normal):not(.is-large) {
+    font-size: 1.25rem
+}
+
+.buttons.are-large .button:not(.is-small):not(.is-normal):not(.is-medium) {
+    font-size: 1.5rem
+}
+
+.buttons.has-addons .button:not(:first-child) {
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0
+}
+
+.buttons.has-addons .button:not(:last-child) {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0;
+    margin-right: -1px
+}
+
+.buttons.has-addons .button:last-child {
+    margin-right: 0
+}
+
+.buttons.has-addons .button.is-hovered,
+.buttons.has-addons .button:hover {
+    z-index: 2
+}
+
+.buttons.has-addons .button.is-active,
+.buttons.has-addons .button.is-focused,
+.buttons.has-addons .button.is-selected,
+.buttons.has-addons .button:active,
+.buttons.has-addons .button:focus {
+    z-index: 3
+}
+
+.buttons.has-addons .button.is-active:hover,
+.buttons.has-addons .button.is-focused:hover,
+.buttons.has-addons .button.is-selected:hover,
+.buttons.has-addons .button:active:hover,
+.buttons.has-addons .button:focus:hover {
+    z-index: 4
+}
+
+.buttons.has-addons .button.is-expanded {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.buttons.is-centered {
+    justify-content: center
+}
+
+.buttons.is-centered:not(.has-addons) .button:not(.is-fullwidth),
+.buttons.is-right:not(.has-addons) .button:not(.is-fullwidth) {
+    margin-left: .25rem;
+    margin-right: .25rem
+}
+
+.buttons.is-right {
+    justify-content: flex-end
+}
+
+.container {
+    flex-grow: 1;
+    margin: 0 auto;
+    position: relative;
+    width: auto
+}
+
+.container.is-fluid {
+    max-width: none;
+    padding-left: 32px;
+    padding-right: 32px;
+    width: 100%
+}
+
+@media screen and (min-width: 1024px) {
+    .container {
+        max-width: 960px
+    }
+}
+
+@media screen and (max-width: 1215px) {
+    .container.is-widescreen {
+        max-width: 1152px
+    }
+}
+
+@media screen and (max-width: 1407px) {
+    .container.is-fullhd {
+        max-width: 1344px
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .container {
+        max-width: 1152px
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .container {
+        max-width: 1344px
+    }
+}
+
+.content li+li {
+    margin-top: .25em
+}
+
+.content blockquote:not(:last-child),
+.content dl:not(:last-child),
+.content ol:not(:last-child),
+.content p:not(:last-child),
+.content pre:not(:last-child),
+.content table:not(:last-child),
+.content ul:not(:last-child) {
+    margin-bottom: 1em
+}
+
+.content h1,
+.content h2,
+.content h3,
+.content h4,
+.content h5,
+.content h6 {
+    color: #f2f2f2;
+    font-weight: 600;
+    line-height: 1.125
+}
+
+.content h1 {
+    font-size: 2em;
+    margin-bottom: .5em
+}
+
+.content h1:not(:first-child) {
+    margin-top: 1em
+}
+
+.content h2 {
+    font-size: 1.75em;
+    margin-bottom: .5714em
+}
+
+.content h2:not(:first-child) {
+    margin-top: 1.1428em
+}
+
+.content h3 {
+    font-size: 1.5em;
+    margin-bottom: .6666em
+}
+
+.content h3:not(:first-child) {
+    margin-top: 1.3333em
+}
+
+.content h4 {
+    font-size: 1.25em;
+    margin-bottom: .8em
+}
+
+.content h5 {
+    font-size: 1.125em;
+    margin-bottom: .8888em
+}
+
+.content h6 {
+    font-size: 1em;
+    margin-bottom: 1em
+}
+
+.content blockquote {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-left: 5px solid #5e6d6f;
+    padding: 1.25em 1.5em
+}
+
+.content ol {
+    list-style-position: outside;
+    margin-left: 2em;
+    margin-top: 1em
+}
+
+.content ol:not([type]) {
+    list-style-type: decimal
+}
+
+.content ol:not([type]).is-lower-alpha {
+    list-style-type: lower-alpha
+}
+
+.content ol:not([type]).is-lower-roman {
+    list-style-type: lower-roman
+}
+
+.content ol:not([type]).is-upper-alpha {
+    list-style-type: upper-alpha
+}
+
+.content ol:not([type]).is-upper-roman {
+    list-style-type: upper-roman
+}
+
+.content ul {
+    list-style: disc outside;
+    margin-top: 1em
+}
+
+.content ul ul {
+    list-style-type: circle;
+    margin-top: .5em
+}
+
+.content ul ul ul {
+    list-style-type: square
+}
+
+.content dd,
+.content ul {
+    margin-left: 2em
+}
+
+.content figure {
+    margin-left: 2em;
+    margin-right: 2em;
+    text-align: center
+}
+
+.content figure:not(:first-child) {
+    margin-top: 2em
+}
+
+.content figure:not(:last-child) {
+    margin-bottom: 2em
+}
+
+.content figure img {
+    display: inline-block
+}
+
+.content figure figcaption {
+    font-style: italic
+}
+
+.content pre {
+    -webkit-overflow-scrolling: touch;
+    overflow-x: auto;
+    padding: 1.25em 1.5em;
+    white-space: pre;
+    word-wrap: normal
+}
+
+.content sub,
+.content sup {
+    font-size: 75%
+}
+
+.content table {
+    width: 100%
+}
+
+.content table td,
+.content table th,
+.table td,
+.table th {
+    border-width: 0 0 1px;
+    padding: .5em .75em;
+    vertical-align: top
+}
+
+.content table th,
+.table th {
+    color: #f2f2f2
+}
+
+.content table thead td,
+.content table thead th,
+.table thead td,
+.table thead th {
+    border-width: 0 0 2px;
+    color: #f2f2f2
+}
+
+.content table tfoot td,
+.content table tfoot th,
+.table tfoot td,
+.table tfoot th {
+    border-width: 2px 0 0;
+    color: #f2f2f2
+}
+
+.content table tbody tr:last-child td,
+.content table tbody tr:last-child th,
+.table tbody tr:last-child td,
+.table tbody tr:last-child th {
+    border-bottom-width: 0
+}
+
+.content .tabs li+li {
+    margin-top: 0
+}
+
+.content.is-small {
+    font-size: .85em
+}
+
+.content.is-medium {
+    font-size: 1.25rem
+}
+
+.content.is-large {
+    font-size: 1.5rem
+}
+
+.icon {
+    align-items: center;
+    display: inline-flex;
+    justify-content: center;
+    height: 1.5rem;
+    width: 1.5rem
+}
+
+.icon.is-small {
+    height: 1rem;
+    width: 1rem
+}
+
+.icon.is-medium {
+    height: 2rem;
+    width: 2rem
+}
+
+.icon.is-large {
+    height: 3rem;
+    width: 3rem
+}
+
+.image {
+    display: block;
+    position: relative
+}
+
+.image img {
+    display: block;
+    height: auto;
+    width: 100%
+}
+
+.image img.is-rounded {
+    border-radius: 290486px
+}
+
+.image.is-fullwidth {
+    width: 100%
+}
+
+.image.is-16by9 .has-ratio,
+.image.is-16by9 img,
+.image.is-1by1 .has-ratio,
+.image.is-1by1 img,
+.image.is-1by2 .has-ratio,
+.image.is-1by2 img,
+.image.is-1by3 .has-ratio,
+.image.is-1by3 img,
+.image.is-2by1 .has-ratio,
+.image.is-2by1 img,
+.image.is-2by3 .has-ratio,
+.image.is-2by3 img,
+.image.is-3by1 .has-ratio,
+.image.is-3by1 img,
+.image.is-3by2 .has-ratio,
+.image.is-3by2 img,
+.image.is-3by4 .has-ratio,
+.image.is-3by4 img,
+.image.is-3by5 .has-ratio,
+.image.is-3by5 img,
+.image.is-4by3 .has-ratio,
+.image.is-4by3 img,
+.image.is-4by5 .has-ratio,
+.image.is-4by5 img,
+.image.is-5by3 .has-ratio,
+.image.is-5by3 img,
+.image.is-5by4 .has-ratio,
+.image.is-5by4 img,
+.image.is-9by16 .has-ratio,
+.image.is-9by16 img,
+.image.is-square .has-ratio,
+.image.is-square img {
+    height: 100%;
+    width: 100%
+}
+
+.image.is-1by1,
+.image.is-square {
+    padding-top: 100%
+}
+
+.image.is-5by4 {
+    padding-top: 80%
+}
+
+.image.is-4by3 {
+    padding-top: 75%
+}
+
+.image.is-3by2 {
+    padding-top: 66.6666%
+}
+
+.image.is-5by3 {
+    padding-top: 60%
+}
+
+.image.is-16by9 {
+    padding-top: 56.25%
+}
+
+.image.is-2by1 {
+    padding-top: 50%
+}
+
+.image.is-3by1 {
+    padding-top: 33.3333%
+}
+
+.image.is-4by5 {
+    padding-top: 125%
+}
+
+.image.is-3by4 {
+    padding-top: 133.3333%
+}
+
+.image.is-2by3 {
+    padding-top: 150%
+}
+
+.image.is-3by5 {
+    padding-top: 166.6666%
+}
+
+.image.is-9by16 {
+    padding-top: 177.7777%
+}
+
+.image.is-1by2 {
+    padding-top: 200%
+}
+
+.image.is-1by3 {
+    padding-top: 300%
+}
+
+.image.is-16x16 {
+    height: 16px;
+    width: 16px
+}
+
+.image.is-24x24 {
+    height: 24px;
+    width: 24px
+}
+
+.image.is-32x32 {
+    height: 32px;
+    width: 32px
+}
+
+.image.is-48x48 {
+    height: 48px;
+    width: 48px
+}
+
+.image.is-64x64 {
+    height: 64px;
+    width: 64px
+}
+
+.image.is-96x96 {
+    height: 96px;
+    width: 96px
+}
+
+.image.is-128x128 {
+    height: 128px;
+    width: 128px
+}
+
+.notification {
+    border-radius: .4em;
+    padding: 1.25rem 2.5rem 1.25rem 1.5rem;
+    position: relative
+}
+
+.message a:not(.button):not(.tag):not(.dropdown-item),
+.notification a:not(.button):not(.dropdown-item) {
+    color: currentColor;
+    text-decoration: underline
+}
+
+.notification code,
+.notification pre {
+    background: #fff
+}
+
+.notification pre code {
+    background: 0 0
+}
+
+.notification>.delete {
+    position: absolute;
+    right: .5rem;
+    top: .5rem
+}
+
+.notification .content,
+.notification .subtitle,
+.notification .title,
+.notification strong,
+.table td.is-selected a,
+.table td.is-selected strong,
+.table th.is-selected a,
+.table th.is-selected strong,
+.table tr.is-selected a,
+.table tr.is-selected strong {
+    color: currentColor
+}
+
+.notification.is-white {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.notification.is-black {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.notification.is-light {
+    background-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.notification.is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.notification.is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.notification.is-primary.is-light {
+    background-color: #f1f5f9;
+    color: #4d7eb2
+}
+
+.notification.is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.notification.is-link.is-light {
+    background-color: #edfdf9;
+    color: #15987e
+}
+
+.notification.is-info {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.notification.is-info.is-light {
+    background-color: #eef6fc;
+    color: #1d72aa
+}
+
+.notification.is-success {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.notification.is-success.is-light {
+    background-color: #eefbf4;
+    color: #1d8147
+}
+
+.notification.is-warning {
+    background-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.notification.is-warning.is-light {
+    background-color: #fef9ec;
+    color: #8c6a08
+}
+
+.notification.is-danger {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.notification.is-danger.is-light {
+    background-color: #fdeeed;
+    color: #c32818
+}
+
+.progress {
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    border: 0;
+    border-radius: 290486px;
+    display: block;
+    height: 15px;
+    overflow: hidden;
+    padding: 0;
+    width: 100%
+}
+
+.progress::-webkit-progress-bar {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.progress::-webkit-progress-value {
+    background-color: #dbdee0
+}
+
+.progress::-moz-progress-bar {
+    background-color: #dbdee0
+}
+
+.progress::-ms-fill {
+    background-color: #dbdee0;
+    border: 0
+}
+
+.progress.is-white::-webkit-progress-value {
+    background-color: #fff
+}
+
+.progress.is-white::-moz-progress-bar {
+    background-color: #fff
+}
+
+.progress.is-white::-ms-fill {
+    background-color: #fff
+}
+
+.progress.is-white:indeterminate {
+    background-image: linear-gradient(to right, #fff 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-black::-webkit-progress-value {
+    background-color: #0a0a0a
+}
+
+.progress.is-black::-moz-progress-bar {
+    background-color: #0a0a0a
+}
+
+.progress.is-black::-ms-fill {
+    background-color: #0a0a0a
+}
+
+.progress.is-black:indeterminate {
+    background-image: linear-gradient(to right, #0a0a0a 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-light::-webkit-progress-value {
+    background-color: #ecf0f1
+}
+
+.progress.is-light::-moz-progress-bar {
+    background-color: #ecf0f1
+}
+
+.progress.is-light::-ms-fill {
+    background-color: #ecf0f1
+}
+
+.progress.is-light:indeterminate {
+    background-image: linear-gradient(to right, #ecf0f1 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-dark::-webkit-progress-value {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.progress.is-dark::-moz-progress-bar {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.progress.is-dark::-ms-fill {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.progress.is-dark:indeterminate {
+    background-image: linear-gradient(to right, #6a6a6a 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-primary::-webkit-progress-value {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-primary::-moz-progress-bar {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-primary::-ms-fill {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-primary:indeterminate {
+    background-image: linear-gradient(to right, hsl(var(--main), 45%, 45%) 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-link::-webkit-progress-value {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-link::-moz-progress-bar {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-link::-ms-fill {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-link:indeterminate {
+    background-image: linear-gradient(to right, hsl(var(--main), 45%, 45%) 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-info::-webkit-progress-value {
+    background-color: #3298dc
+}
+
+.progress.is-info::-moz-progress-bar {
+    background-color: #3298dc
+}
+
+.progress.is-info::-ms-fill {
+    background-color: #3298dc
+}
+
+.progress.is-info:indeterminate {
+    background-image: linear-gradient(to right, #3298dc 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-success::-webkit-progress-value {
+    background-color: #2ecc71
+}
+
+.progress.is-success::-moz-progress-bar {
+    background-color: #2ecc71
+}
+
+.progress.is-success::-ms-fill {
+    background-color: #2ecc71
+}
+
+.progress.is-success:indeterminate {
+    background-image: linear-gradient(to right, #2ecc71 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-warning::-webkit-progress-value {
+    background-color: #f1b70e
+}
+
+.progress.is-warning::-moz-progress-bar {
+    background-color: #f1b70e
+}
+
+.progress.is-warning::-ms-fill {
+    background-color: #f1b70e
+}
+
+.progress.is-warning:indeterminate {
+    background-image: linear-gradient(to right, #f1b70e 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-danger::-webkit-progress-value {
+    background-color: #e74c3c
+}
+
+.progress.is-danger::-moz-progress-bar {
+    background-color: #e74c3c
+}
+
+.progress.is-danger::-ms-fill {
+    background-color: #e74c3c
+}
+
+.progress.is-danger:indeterminate {
+    background-image: linear-gradient(to right, #e74c3c 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress:indeterminate {
+    -webkit-animation-duration: 1.5s;
+    animation-duration: 1.5s;
+    -webkit-animation-iteration-count: infinite;
+    animation-iteration-count: infinite;
+    -webkit-animation-name: moveIndeterminate;
+    animation-name: moveIndeterminate;
+    -webkit-animation-timing-function: linear;
+    animation-timing-function: linear;
+    background-color: hsl(var(--main), 10%, 15%);
+    background-image: linear-gradient(to right, #fff 30%, hsl(var(--main), 10%, 15%) 30%);
+    background-position: top left;
+    background-repeat: no-repeat;
+    background-size: 150% 150%
+}
+
+.progress:indeterminate::-webkit-progress-bar {
+    background-color: transparent
+}
+
+.progress:indeterminate::-moz-progress-bar {
+    background-color: transparent
+}
+
+.progress.is-small {
+    height: .85em
+}
+
+.progress.is-medium {
+    height: 1.25rem
+}
+
+.progress.is-large {
+    height: 1.5rem
+}
+
+.table {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.table td.is-white,
+.table th.is-white {
+    background-color: #fff;
+    border-color: #fff;
+    color: #0a0a0a
+}
+
+.hero.is-white .tabs.is-boxed li.is-active a,
+.hero.is-white .tabs.is-boxed li.is-active a:hover,
+.hero.is-white .tabs.is-toggle li.is-active a,
+.hero.is-white .tabs.is-toggle li.is-active a:hover,
+.table td.is-black,
+.table th.is-black {
+    background-color: #0a0a0a;
+    border-color: #0a0a0a;
+    color: #fff
+}
+
+.table td.is-light,
+.table th.is-light {
+    background-color: #ecf0f1;
+    border-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.table td.is-dark,
+.table th.is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.table td.is-primary,
+.table th.is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.table td.is-link,
+.table th.is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.table td.is-info,
+.table th.is-info {
+    background-color: #3298dc;
+    border-color: #3298dc;
+    color: #fff
+}
+
+.table td.is-success,
+.table th.is-success {
+    background-color: #2ecc71;
+    border-color: #2ecc71;
+    color: #fff
+}
+
+.table td.is-warning,
+.table th.is-warning {
+    background-color: #f1b70e;
+    border-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.table td.is-danger,
+.table th.is-danger {
+    background-color: #e74c3c;
+    border-color: #e74c3c;
+    color: #fff
+}
+
+.table td.is-narrow,
+.table th.is-narrow {
+    white-space: nowrap;
+    width: 1%
+}
+
+.table td.is-selected,
+.table th.is-selected,
+.table tr.is-selected {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.table th:not([align]) {
+    text-align: left
+}
+
+.table tr.is-selected td,
+.table tr.is-selected th {
+    border-color: #fff;
+    color: currentColor
+}
+
+.message-body pre code,
+.table tbody,
+.table tfoot,
+.table thead {
+    background-color: transparent
+}
+
+.table.is-bordered td,
+.table.is-bordered th {
+    border-width: 1px
+}
+
+.table.is-bordered tr:last-child td,
+.table.is-bordered tr:last-child th {
+    border-bottom-width: 1px
+}
+
+.table.is-fullwidth {
+    width: 100%
+}
+
+.table.is-hoverable tbody tr:not(.is-selected):hover,
+.table.is-hoverable.is-striped tbody tr:not(.is-selected):hover {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.table.is-hoverable.is-striped tbody tr:not(.is-selected):hover:nth-child(even) {
+    background-color: #2d3435
+}
+
+.table.is-narrow td,
+.table.is-narrow th {
+    padding: .25em .5em
+}
+
+.table.is-striped tbody tr:not(.is-selected):nth-child(even) {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.table-container {
+    -webkit-overflow-scrolling: touch;
+    overflow: auto;
+    overflow-y: hidden;
+    max-width: 100%
+}
+
+.tags {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start
+}
+
+.tags .tag {
+    margin-bottom: .5rem
+}
+
+.tags .tag:not(:last-child) {
+    margin-right: .5rem
+}
+
+.tags:last-child {
+    margin-bottom: -.5rem
+}
+
+.tags:not(:last-child) {
+    margin-bottom: 1rem
+}
+
+.tags.are-medium .tag:not(.is-normal):not(.is-large) {
+    font-size: 15px
+}
+
+.tags.are-large .tag:not(.is-normal):not(.is-medium) {
+    font-size: 1.25rem
+}
+
+.tags.is-centered {
+    justify-content: center
+}
+
+.tags.is-centered .tag {
+    margin-right: .25rem;
+    margin-left: .25rem
+}
+
+.tags.is-right {
+    justify-content: flex-end
+}
+
+.tags.is-right .tag:not(:first-child) {
+    margin-left: .5rem
+}
+
+.tags.is-right .tag:not(:last-child) {
+    margin-right: 0
+}
+
+.tags.has-addons .tag {
+    margin-right: 0
+}
+
+.tags.has-addons .tag:not(:first-child) {
+    margin-left: 0;
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0
+}
+
+.tags.has-addons .tag:not(:last-child) {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0
+}
+
+.tag:not(body) {
+    align-items: center;
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: .4em;
+    color: #fff;
+    display: inline-flex;
+    font-size: .85em;
+    height: 2em;
+    justify-content: center;
+    line-height: 1.5;
+    padding-left: .75em;
+    padding-right: .75em;
+    white-space: nowrap
+}
+
+.tag:not(body) .delete {
+    margin-left: .25rem;
+    margin-right: -.375rem
+}
+
+.tag:not(body).is-white {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.tag:not(body).is-black {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.tag:not(body).is-light {
+    background-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.tag:not(body).is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.tag:not(body).is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.tag:not(body).is-primary.is-light {
+    background-color: #f1f5f9;
+    color: #4d7eb2
+}
+
+.tag:not(body).is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.tag:not(body).is-link.is-light {
+    background-color: #edfdf9;
+    color: #15987e
+}
+
+.tag:not(body).is-info {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.tag:not(body).is-info.is-light {
+    background-color: #eef6fc;
+    color: #1d72aa
+}
+
+.tag:not(body).is-success {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.tag:not(body).is-success.is-light {
+    background-color: #eefbf4;
+    color: #1d8147
+}
+
+.tag:not(body).is-warning {
+    background-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.tag:not(body).is-warning.is-light {
+    background-color: #fef9ec;
+    color: #8c6a08
+}
+
+.tag:not(body).is-danger {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.tag:not(body).is-danger.is-light {
+    background-color: #fdeeed;
+    color: #c32818
+}
+
+.tag:not(body).is-normal {
+    font-size: .85em
+}
+
+.tag:not(body).is-medium {
+    font-size: 15px
+}
+
+.tag:not(body).is-large {
+    font-size: 1.25rem
+}
+
+.tag:not(body) .icon:first-child:not(:last-child) {
+    margin-left: -.375em;
+    margin-right: .1875em
+}
+
+.tag:not(body) .icon:last-child:not(:first-child) {
+    margin-left: .1875em;
+    margin-right: -.375em
+}
+
+.tag:not(body) .icon:first-child:last-child {
+    margin-left: -.375em;
+    margin-right: -.375em
+}
+
+.tag:not(body).is-delete {
+    margin-left: 1px;
+    padding: 0;
+    position: relative;
+    width: 2em
+}
+
+.tag:not(body).is-delete::after,
+.tag:not(body).is-delete::before {
+    background-color: currentColor;
+    content: "";
+    display: block;
+    left: 50%;
+    position: absolute;
+    top: 50%;
+    transform: translateX(-50%) translateY(-50%) rotate(45deg);
+    transform-origin: center center
+}
+
+.tag:not(body).is-delete::before {
+    height: 1px;
+    width: 50%
+}
+
+.tag:not(body).is-delete::after {
+    height: 50%;
+    width: 1px
+}
+
+.tag:not(body).is-delete:focus,
+.tag:not(body).is-delete:hover {
+    background-color: #1d2122
+}
+
+.tag:not(body).is-delete:active {
+    background-color: #111414
+}
+
+.tag:not(body).is-rounded {
+    border-radius: 290486px
+}
+
+a.tag:hover {
+    text-decoration: underline
+}
+
+.subtitle,
+.title {
+    word-break: break-word
+}
+
+.subtitle em,
+.subtitle span,
+.title em,
+.title span,
+.title strong {
+    font-weight: inherit
+}
+
+.subtitle sub,
+.subtitle sup,
+.title sub,
+.title sup {
+    font-size: .75em
+}
+
+.subtitle .tag,
+.title .tag {
+    vertical-align: middle
+}
+
+.title {
+    color: #fff;
+    font-size: 2rem;
+    font-weight: 500;
+    line-height: 1.125
+}
+
+.title strong {
+    color: inherit
+}
+
+.title+.highlight {
+    margin-top: -.75rem
+}
+
+.subtitle:not(.is-spaced)+.title,
+.title:not(.is-spaced)+.subtitle {
+    margin-top: -1.25rem
+}
+
+.title.is-1 {
+    font-size: 3rem
+}
+
+.title.is-2 {
+    font-size: 2.5rem
+}
+
+.title.is-3 {
+    font-size: 2rem
+}
+
+.title.is-4 {
+    font-size: 1.5rem
+}
+
+.subtitle,
+.title.is-5 {
+    font-size: 1.25rem
+}
+
+.title.is-6 {
+    font-size: 15px
+}
+
+.title.is-7 {
+    font-size: .85em
+}
+
+.subtitle {
+    color: #d4d4d4;
+    font-weight: 400;
+    line-height: 1.25
+}
+
+.subtitle strong {
+    color: #8c9b9d;
+    font-weight: 600
+}
+
+.subtitle.is-1 {
+    font-size: 3rem
+}
+
+.subtitle.is-2 {
+    font-size: 2.5rem
+}
+
+.subtitle.is-3 {
+    font-size: 2rem
+}
+
+.subtitle.is-4 {
+    font-size: 1.5rem
+}
+
+.subtitle.is-5 {
+    font-size: 1.25rem
+}
+
+.subtitle.is-6 {
+    font-size: 15px
+}
+
+.subtitle.is-7 {
+    font-size: .85em
+}
+
+.heading {
+    display: block;
+    font-size: 11px;
+    letter-spacing: 1px;
+    margin-bottom: 5px;
+    text-transform: uppercase
+}
+
+.highlight {
+    font-weight: 400;
+    max-width: 100%;
+    overflow: hidden;
+    padding: 0
+}
+
+.highlight pre {
+    overflow: auto;
+    max-width: 100%
+}
+
+.number {
+    align-items: center;
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: 290486px;
+    display: inline-flex;
+    font-size: 1.25rem;
+    height: 2em;
+    justify-content: center;
+    margin-right: 1.5rem;
+    min-width: 2.5em;
+    padding: .25rem .5rem;
+    text-align: center;
+    vertical-align: top
+}
+
+.input,
+.select select,
+.textarea {
+    border: none;
+    background-color: hsl(var(--main), 15%, 15%);
+    border-radius: .4em;
+    color: #fff
+}
+
+.input:-moz-placeholder,
+.input::-moz-placeholder,
+.select select:-moz-placeholder,
+.select select::-moz-placeholder,
+.textarea:-moz-placeholder,
+.textarea::-moz-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input::-webkit-input-placeholder,
+.select select::-webkit-input-placeholder,
+.textarea::-webkit-input-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input:-ms-input-placeholder,
+.select select:-ms-input-placeholder,
+.textarea:-ms-input-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input:hover,
+.is-hovered.input,
+.is-hovered.textarea,
+.select select.is-hovered,
+.select select:hover,
+.textarea:hover {
+    border-color: hsl(var(--main), 15%, 15%)
+}
+
+.input:active,
+.input:focus,
+.is-active.input,
+.is-active.textarea,
+.is-focused.input,
+.is-focused.textarea,
+.select select.is-active,
+.select select.is-focused,
+.select select:active,
+.select select:focus,
+.textarea:active,
+.textarea:focus {
+    border-color: hsl(var(--main), 45%, 45%);
+    box-shadow: 0 0 0 .125em hsl(var(--main), 25%, 45%, 45%)
+}
+
+.input[disabled],
+.select fieldset[disabled] select,
+.select select[disabled],
+.textarea[disabled],
+fieldset[disabled] .input,
+fieldset[disabled] .select select,
+fieldset[disabled] .textarea {
+    background-color: hsl(var(--main), 15%, 15%);
+    border-color: hsl(var(--main), 10%, 15%);
+    box-shadow: none;
+    color: #fff;
+    opacity: .9
+}
+
+.input[disabled]:-moz-placeholder,
+.input[disabled]::-moz-placeholder,
+.select fieldset[disabled] select:-moz-placeholder,
+.select fieldset[disabled] select::-moz-placeholder,
+.select select[disabled]:-moz-placeholder,
+.select select[disabled]::-moz-placeholder,
+.textarea[disabled]:-moz-placeholder,
+.textarea[disabled]::-moz-placeholder,
+fieldset[disabled] .input:-moz-placeholder,
+fieldset[disabled] .input::-moz-placeholder,
+fieldset[disabled] .select select:-moz-placeholder,
+fieldset[disabled] .select select::-moz-placeholder,
+fieldset[disabled] .textarea:-moz-placeholder,
+fieldset[disabled] .textarea::-moz-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input[disabled]::-webkit-input-placeholder,
+.select fieldset[disabled] select::-webkit-input-placeholder,
+.select select[disabled]::-webkit-input-placeholder,
+.textarea[disabled]::-webkit-input-placeholder,
+fieldset[disabled] .input::-webkit-input-placeholder,
+fieldset[disabled] .select select::-webkit-input-placeholder,
+fieldset[disabled] .textarea::-webkit-input-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input[disabled]:-ms-input-placeholder,
+.select fieldset[disabled] select:-ms-input-placeholder,
+.select select[disabled]:-ms-input-placeholder,
+.textarea[disabled]:-ms-input-placeholder,
+fieldset[disabled] .input:-ms-input-placeholder,
+fieldset[disabled] .select select:-ms-input-placeholder,
+fieldset[disabled] .textarea:-ms-input-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input {
+    max-width: 100%
+}
+
+.input,
+.textarea {
+    box-shadow: inset 0 .0625em .125em rgba(10, 10, 10, .05);
+    width: 100%
+}
+
+.input[readonly],
+.textarea[readonly] {
+    box-shadow: none
+}
+
+.is-white.input,
+.is-white.textarea {
+    border-color: #fff
+}
+
+.is-white.input:active,
+.is-white.input:focus,
+.is-white.is-active.input,
+.is-white.is-active.textarea,
+.is-white.is-focused.input,
+.is-white.is-focused.textarea,
+.is-white.textarea:active,
+.is-white.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(255, 255, 255, .25)
+}
+
+.is-black.input,
+.is-black.textarea {
+    border-color: #0a0a0a
+}
+
+.is-black.input:active,
+.is-black.input:focus,
+.is-black.is-active.input,
+.is-black.is-active.textarea,
+.is-black.is-focused.input,
+.is-black.is-focused.textarea,
+.is-black.textarea:active,
+.is-black.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(10, 10, 10, .25)
+}
+
+.is-light.input,
+.is-light.textarea {
+    border-color: #ecf0f1
+}
+
+.is-light.input:active,
+.is-light.input:focus,
+.is-light.is-active.input,
+.is-light.is-active.textarea,
+.is-light.is-focused.input,
+.is-light.is-focused.textarea,
+.is-light.textarea:active,
+.is-light.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(236, 240, 241, .25)
+}
+
+.is-dark.input,
+.is-dark.textarea,
+.select select[disabled]:hover,
+fieldset[disabled] .select select:hover {
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.is-dark.input:active,
+.is-dark.input:focus,
+.is-dark.is-active.input,
+.is-dark.is-active.textarea,
+.is-dark.is-focused.input,
+.is-dark.is-focused.textarea,
+.is-dark.textarea:active,
+.is-dark.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(40, 47, 47, .25)
+}
+
+.is-primary.input,
+.is-primary.textarea {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.is-primary.input:active,
+.is-primary.input:focus,
+.is-primary.is-active.input,
+.is-primary.is-active.textarea,
+.is-primary.is-focused.input,
+.is-primary.is-focused.textarea,
+.is-primary.textarea:active,
+.is-primary.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(55, 90, 127, .25)
+}
+
+.is-link.input,
+.is-link.textarea {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.is-link.input:active,
+.is-link.input:focus,
+.is-link.is-active.input,
+.is-link.is-active.textarea,
+.is-link.is-focused.input,
+.is-link.is-focused.textarea,
+.is-link.textarea:active,
+.is-link.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(26, 188, 156, .25)
+}
+
+.is-info.input,
+.is-info.textarea {
+    border-color: #3298dc
+}
+
+.is-info.input:active,
+.is-info.input:focus,
+.is-info.is-active.input,
+.is-info.is-active.textarea,
+.is-info.is-focused.input,
+.is-info.is-focused.textarea,
+.is-info.textarea:active,
+.is-info.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(50, 152, 220, .25)
+}
+
+.is-success.input,
+.is-success.textarea {
+    border-color: #2ecc71
+}
+
+.is-success.input:active,
+.is-success.input:focus,
+.is-success.is-active.input,
+.is-success.is-active.textarea,
+.is-success.is-focused.input,
+.is-success.is-focused.textarea,
+.is-success.textarea:active,
+.is-success.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(46, 204, 113, .25)
+}
+
+.is-warning.input,
+.is-warning.textarea {
+    border-color: #f1b70e
+}
+
+.is-warning.input:active,
+.is-warning.input:focus,
+.is-warning.is-active.input,
+.is-warning.is-active.textarea,
+.is-warning.is-focused.input,
+.is-warning.is-focused.textarea,
+.is-warning.textarea:active,
+.is-warning.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(241, 183, 14, .25)
+}
+
+.is-danger.input,
+.is-danger.textarea {
+    border-color: #e74c3c
+}
+
+.is-danger.input:active,
+.is-danger.input:focus,
+.is-danger.is-active.input,
+.is-danger.is-active.textarea,
+.is-danger.is-focused.input,
+.is-danger.is-focused.textarea,
+.is-danger.textarea:active,
+.is-danger.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(231, 76, 60, .25)
+}
+
+.is-small.input,
+.is-small.textarea {
+    border-radius: 3px;
+    font-size: .85em
+}
+
+.is-medium.input,
+.is-medium.textarea {
+    font-size: 1.25rem
+}
+
+.is-large.input,
+.is-large.textarea {
+    font-size: 1.5rem
+}
+
+.is-fullwidth.input,
+.is-fullwidth.textarea {
+    display: block;
+    width: 100%
+}
+
+.is-inline.input,
+.is-inline.textarea {
+    display: inline;
+    width: auto
+}
+
+.input.is-rounded {
+    border-radius: 290486px;
+    padding-left: calc(calc(.75em - 1px) + .375em);
+    padding-right: calc(calc(.75em - 1px) + .375em)
+}
+
+.input.is-static {
+    background-color: transparent;
+    border-color: transparent;
+    box-shadow: none;
+    padding-left: 0;
+    padding-right: 0
+}
+
+.textarea {
+    display: block;
+    max-width: 100%;
+    min-width: 100%;
+    padding: calc(.75em - 1px);
+    resize: vertical
+}
+
+.textarea:not([rows]) {
+    max-height: 40em;
+    min-height: 8em
+}
+
+.textarea[rows] {
+    height: initial
+}
+
+.textarea.has-fixed-size {
+    resize: none
+}
+
+.checkbox,
+.radio,
+.select {
+    display: inline-block;
+    position: relative
+}
+
+.checkbox,
+.radio {
+    cursor: pointer;
+    line-height: 1.25
+}
+
+.checkbox input,
+.radio input {
+    cursor: pointer
+}
+
+.checkbox:hover,
+.radio:hover {
+    color: #8c9b9d
+}
+
+.checkbox[disabled],
+.radio[disabled],
+fieldset[disabled] .checkbox,
+fieldset[disabled] .radio {
+    color: #fff;
+    cursor: not-allowed
+}
+
+.radio+.radio {
+    margin-left: .5em
+}
+
+.select {
+    max-width: 100%;
+    vertical-align: top
+}
+
+.select:not(.is-multiple) {
+    height: 2.5em
+}
+
+.select:not(.is-multiple):not(.is-loading)::after {
+    border-color: #fff;
+    right: 1.125em;
+    z-index: 4
+}
+
+.select.is-rounded select {
+    border-radius: 290486px;
+    padding-left: 1em
+}
+
+.select select {
+    cursor: pointer;
+    display: block;
+    font-size: 1em;
+    max-width: 100%;
+    outline: 0
+}
+
+.select select::-ms-expand {
+    display: none
+}
+
+.select select:not([multiple]) {
+    padding-right: 2.5em
+}
+
+.select select[multiple] {
+    height: auto;
+    padding: 0
+}
+
+.select select[multiple] option {
+    padding: .5em 1em
+}
+
+.select:not(.is-multiple):not(.is-loading):hover::after {
+    border-color: #8c9b9d
+}
+
+.select.is-white:not(:hover)::after {
+    border-color: #fff
+}
+
+.select.is-disabled::after,
+.select.is-white select {
+    border-color: #fff
+}
+
+.select.is-white select.is-hovered,
+.select.is-white select:hover {
+    border-color: #f2f2f2
+}
+
+.select.is-white select.is-active,
+.select.is-white select.is-focused,
+.select.is-white select:active,
+.select.is-white select:focus {
+    box-shadow: 0 0 0 .125em rgba(255, 255, 255, .25)
+}
+
+.select.is-black:not(:hover)::after {
+    border-color: #0a0a0a
+}
+
+.select.is-black select {
+    border-color: #0a0a0a
+}
+
+.select.is-black select.is-hovered,
+.select.is-black select:hover {
+    border-color: #000
+}
+
+.select.is-black select.is-active,
+.select.is-black select.is-focused,
+.select.is-black select:active,
+.select.is-black select:focus {
+    box-shadow: 0 0 0 .125em rgba(10, 10, 10, .25)
+}
+
+.select.is-light:not(:hover)::after {
+    border-color: #ecf0f1
+}
+
+.select.is-light select {
+    border-color: #ecf0f1
+}
+
+.select.is-light select.is-hovered,
+.select.is-light select:hover {
+    border-color: #dde4e6
+}
+
+.select.is-light select.is-active,
+.select.is-light select.is-focused,
+.select.is-light select:active,
+.select.is-light select:focus {
+    box-shadow: 0 0 0 .125em rgba(236, 240, 241, .25)
+}
+
+.select.is-dark:not(:hover)::after {
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.select.is-dark select {
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.select.is-dark select.is-hovered,
+.select.is-dark select:hover {
+    border-color: #1d2122
+}
+
+.select.is-dark select.is-active,
+.select.is-dark select.is-focused,
+.select.is-dark select:active,
+.select.is-dark select:focus {
+    box-shadow: 0 0 0 .125em rgba(40, 47, 47, .25)
+}
+
+.select.is-primary:not(:hover)::after {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.select.is-primary select {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.select.is-primary select.is-hovered,
+.select.is-primary select:hover {
+    border-color: #2f4d6d
+}
+
+.select.is-primary select.is-active,
+.select.is-primary select.is-focused,
+.select.is-primary select:active,
+.select.is-primary select:focus {
+    box-shadow: 0 0 0 .125em rgba(55, 90, 127, .25)
+}
+
+.select.is-link:not(:hover)::after {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.select.is-link select {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.select.is-link select.is-hovered,
+.select.is-link select:hover {
+    border-color: hsl(var(--main), 75%, 80%)
+}
+
+.select.is-link select.is-active,
+.select.is-link select.is-focused,
+.select.is-link select:active,
+.select.is-link select:focus {
+    box-shadow: 0 0 0 .125em rgba(26, 188, 156, .25)
+}
+
+.select.is-info:not(:hover)::after {
+    border-color: #3298dc
+}
+
+.select.is-info select {
+    border-color: #3298dc
+}
+
+.select.is-info select.is-hovered,
+.select.is-info select:hover {
+    border-color: #238cd1
+}
+
+.select.is-info select.is-active,
+.select.is-info select.is-focused,
+.select.is-info select:active,
+.select.is-info select:focus {
+    box-shadow: 0 0 0 .125em rgba(50, 152, 220, .25)
+}
+
+.select.is-success:not(:hover)::after {
+    border-color: #2ecc71
+}
+
+.select.is-success select {
+    border-color: #2ecc71
+}
+
+.select.is-success select.is-hovered,
+.select.is-success select:hover {
+    border-color: #29b765
+}
+
+.select.is-success select.is-active,
+.select.is-success select.is-focused,
+.select.is-success select:active,
+.select.is-success select:focus {
+    box-shadow: 0 0 0 .125em rgba(46, 204, 113, .25)
+}
+
+.select.is-warning:not(:hover)::after {
+    border-color: #f1b70e
+}
+
+.select.is-warning select {
+    border-color: #f1b70e
+}
+
+.select.is-warning select.is-hovered,
+.select.is-warning select:hover {
+    border-color: #d9a50d
+}
+
+.select.is-warning select.is-active,
+.select.is-warning select.is-focused,
+.select.is-warning select:active,
+.select.is-warning select:focus {
+    box-shadow: 0 0 0 .125em rgba(241, 183, 14, .25)
+}
+
+.select.is-danger:not(:hover)::after {
+    border-color: #e74c3c
+}
+
+.select.is-danger select {
+    border-color: #e74c3c
+}
+
+.select.is-danger select.is-hovered,
+.select.is-danger select:hover {
+    border-color: #e43725
+}
+
+.select.is-danger select.is-active,
+.select.is-danger select.is-focused,
+.select.is-danger select:active,
+.select.is-danger select:focus {
+    box-shadow: 0 0 0 .125em rgba(231, 76, 60, .25)
+}
+
+.select.is-small {
+    border-radius: 3px;
+    font-size: .85em
+}
+
+.select.is-medium {
+    font-size: 1.25rem
+}
+
+.select.is-large {
+    font-size: 1.5rem
+}
+
+.select.is-fullwidth,
+.select.is-fullwidth select {
+    width: 100%
+}
+
+.select.is-loading::after {
+    margin-top: 0;
+    position: absolute;
+    right: .625em;
+    top: .625em;
+    transform: none
+}
+
+.file.is-small,
+.select.is-loading.is-small:after {
+    font-size: .85em
+}
+
+.file.is-medium,
+.select.is-loading.is-medium:after {
+    font-size: 1.25rem
+}
+
+.file.is-large,
+.select.is-loading.is-large:after {
+    font-size: 1.5rem
+}
+
+.file {
+    align-items: stretch;
+    display: flex;
+    justify-content: flex-start;
+    position: relative
+}
+
+.file.is-white .file-cta {
+    background-color: #fff;
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.file.is-white.is-hovered .file-cta,
+.file.is-white:hover .file-cta {
+    background-color: #f9f9f9;
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.file.is-white.is-focused .file-cta,
+.file.is-white:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(255, 255, 255, .25);
+    color: #0a0a0a
+}
+
+.file.is-white.is-active .file-cta,
+.file.is-white:active .file-cta {
+    background-color: #f2f2f2;
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.file.is-black .file-cta {
+    background-color: #0a0a0a;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-black.is-hovered .file-cta,
+.file.is-black:hover .file-cta {
+    background-color: #040404;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-black.is-focused .file-cta,
+.file.is-black:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(10, 10, 10, .25);
+    color: #fff
+}
+
+.file.is-black.is-active .file-cta,
+.file.is-black:active .file-cta {
+    background-color: #000;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-light .file-cta {
+    background-color: #ecf0f1;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-light.is-hovered .file-cta,
+.file.is-light:hover .file-cta {
+    background-color: #e5eaec;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-light.is-focused .file-cta,
+.file.is-light:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(236, 240, 241, .25);
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-light.is-active .file-cta,
+.file.is-light:active .file-cta {
+    background-color: #dde4e6;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-dark .file-cta {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-dark.is-hovered .file-cta,
+.file.is-dark:hover .file-cta {
+    background-color: #232829;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-dark.is-focused .file-cta,
+.file.is-dark:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(40, 47, 47, .25);
+    color: #fff
+}
+
+.file.is-dark.is-active .file-cta,
+.file.is-dark:active .file-cta,
+.file.is-primary .file-cta {
+    background-color: #1d2122;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-primary .file-cta {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.file.is-primary.is-hovered .file-cta,
+.file.is-primary:hover .file-cta {
+    background-color: #335476;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-primary.is-focused .file-cta,
+.file.is-primary:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(55, 90, 127, .25);
+    color: #fff
+}
+
+.file.is-link .file-cta,
+.file.is-primary.is-active .file-cta,
+.file.is-primary:active .file-cta {
+    background-color: #2f4d6d;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-link .file-cta {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.file.is-link.is-hovered .file-cta,
+.file.is-link:hover .file-cta {
+    background-color: #18b193;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-link.is-focused .file-cta,
+.file.is-link:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(26, 188, 156, .25);
+    color: #fff
+}
+
+.file.is-info .file-cta,
+.file.is-link.is-active .file-cta,
+.file.is-link:active .file-cta {
+    background-color: hsl(var(--main), 75%, 80%);
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-info .file-cta {
+    background-color: #3298dc
+}
+
+.file.is-info.is-hovered .file-cta,
+.file.is-info:hover .file-cta {
+    background-color: #2793da;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-info.is-focused .file-cta,
+.file.is-info:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(50, 152, 220, .25);
+    color: #fff
+}
+
+.file.is-info.is-active .file-cta,
+.file.is-info:active .file-cta,
+.file.is-success .file-cta {
+    background-color: #238cd1;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-success .file-cta {
+    background-color: #2ecc71
+}
+
+.file.is-success.is-hovered .file-cta,
+.file.is-success:hover .file-cta {
+    background-color: #2cc26b;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-success.is-focused .file-cta,
+.file.is-success:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(46, 204, 113, .25);
+    color: #fff
+}
+
+.file.is-success.is-active .file-cta,
+.file.is-success:active .file-cta {
+    background-color: #29b765;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-warning .file-cta {
+    background-color: #f1b70e;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-warning.is-hovered .file-cta,
+.file.is-warning:hover .file-cta {
+    background-color: #e5ae0d;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-warning.is-focused .file-cta,
+.file.is-warning:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(241, 183, 14, .25);
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-warning.is-active .file-cta,
+.file.is-warning:active .file-cta {
+    background-color: #d9a50d;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-danger .file-cta {
+    background-color: #e74c3c;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-danger.is-hovered .file-cta,
+.file.is-danger:hover .file-cta {
+    background-color: #e64231;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-danger.is-focused .file-cta,
+.file.is-danger:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(231, 76, 60, .25);
+    color: #fff
+}
+
+.file.is-danger.is-active .file-cta,
+.file.is-danger:active .file-cta {
+    background-color: #e43725;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-medium .file-icon .fa {
+    font-size: 21px
+}
+
+.file.is-large .file-icon .fa {
+    font-size: 28px
+}
+
+.file.has-name .file-cta {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0
+}
+
+.file.has-name .file-name {
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0
+}
+
+.file.has-name.is-empty .file-cta,
+.level code {
+    border-radius: .4em
+}
+
+.file.has-name.is-empty .file-name {
+    display: none
+}
+
+.file.is-boxed .file-label {
+    flex-direction: column
+}
+
+.file.is-boxed .file-cta {
+    flex-direction: column;
+    height: auto;
+    padding: 1em 3em
+}
+
+.file.is-boxed .file-name {
+    border-width: 0 1px 1px
+}
+
+.file.is-boxed .file-icon {
+    height: 1.5em;
+    width: 1.5em
+}
+
+.file.is-boxed .file-icon .fa {
+    font-size: 21px
+}
+
+.file.is-boxed.is-small .file-icon .fa {
+    font-size: 14px
+}
+
+.file.is-boxed.is-medium .file-icon .fa {
+    font-size: 28px
+}
+
+.file.is-boxed.is-large .file-icon .fa {
+    font-size: 35px
+}
+
+.card .card-image img,
+.file.is-boxed.has-name .file-cta {
+    border-radius: .4em .4em 0 0
+}
+
+.file.is-boxed.has-name .file-name {
+    border-radius: 0 0 .4em .4em;
+    border-width: 0 1px 1px
+}
+
+.file.is-centered {
+    justify-content: center
+}
+
+.file.is-fullwidth .file-label {
+    width: 100%
+}
+
+.file.is-fullwidth .file-name {
+    flex-grow: 1;
+    max-width: none
+}
+
+.file.is-right {
+    justify-content: flex-end
+}
+
+.file.is-right .file-cta {
+    border-radius: 0 .4em .4em 0
+}
+
+.file.is-right .file-name {
+    border-radius: .4em 0 0 .4em;
+    border-width: 1px 0 1px 1px;
+    order: -1
+}
+
+.file-label {
+    align-items: stretch;
+    display: flex;
+    cursor: pointer;
+    justify-content: flex-start;
+    overflow: hidden;
+    position: relative
+}
+
+.file-label:hover .file-cta {
+    background-color: #232829;
+    color: #f2f2f2
+}
+
+.file-label:hover .file-name {
+    border-color: #596668
+}
+
+.file-label:active .file-cta {
+    background-color: #1d2122;
+    color: #f2f2f2
+}
+
+.file-label:active .file-name {
+    border-color: #535f61
+}
+
+.file-input {
+    height: 100%;
+    left: 0;
+    opacity: 0;
+    outline: 0;
+    position: absolute;
+    top: 0;
+    width: 100%
+}
+
+.file-cta {
+    border-color: #5e6d6f
+}
+
+.file-cta,
+.file-name {
+    border-radius: .4em;
+    font-size: 1em;
+    padding-left: 1em;
+    padding-right: 1em;
+    white-space: nowrap
+}
+
+.file-cta {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.file-name {
+    border-color: #5e6d6f;
+    border-style: solid;
+    border-width: 1px 1px 1px 0;
+    display: block;
+    max-width: 16em;
+    overflow: hidden;
+    text-align: left;
+    text-overflow: ellipsis
+}
+
+.file-icon {
+    align-items: center;
+    display: flex;
+    height: 1em;
+    justify-content: center;
+    margin-right: .5em;
+    width: 1em
+}
+
+.file-icon .fa {
+    font-size: 14px
+}
+
+.label {
+    display: block;
+    font-size: 15px;
+    font-weight: 700
+}
+
+.label:not(:last-child) {
+    margin-bottom: .5em
+}
+
+.help,
+.label.is-small {
+    font-size: .85em
+}
+
+.label.is-medium {
+    font-size: 1.25rem
+}
+
+.label.is-large {
+    font-size: 1.5rem
+}
+
+.help {
+    display: block;
+    margin-top: .25rem
+}
+
+.help.is-white {
+    color: #fff
+}
+
+.help.is-black {
+    color: #0a0a0a
+}
+
+.help.is-light {
+    color: #ecf0f1
+}
+
+.help.is-dark {
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.help.is-primary {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.help.is-link {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.help.is-info {
+    color: #3298dc
+}
+
+.help.is-success {
+    color: #2ecc71
+}
+
+.help.is-warning {
+    color: #f1b70e
+}
+
+.help.is-danger {
+    color: #e74c3c
+}
+
+.field:not(:last-child) {
+    margin-bottom: .75rem
+}
+
+.field.has-addons,
+.field.is-grouped {
+    display: flex;
+    justify-content: flex-start
+}
+
+.field.has-addons .control:not(:last-child) {
+    margin-right: -1px
+}
+
+.field.has-addons .control:not(:first-child):not(:last-child) .button,
+.field.has-addons .control:not(:first-child):not(:last-child) .input,
+.field.has-addons .control:not(:first-child):not(:last-child) .select select {
+    border-radius: 0
+}
+
+.field.has-addons .control:first-child:not(:only-child) .button,
+.field.has-addons .control:first-child:not(:only-child) .input,
+.field.has-addons .control:first-child:not(:only-child) .select select {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0
+}
+
+.field.has-addons .control:last-child:not(:only-child) .button,
+.field.has-addons .control:last-child:not(:only-child) .input,
+.field.has-addons .control:last-child:not(:only-child) .select select {
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0
+}
+
+.field.has-addons .control .button:not([disabled]).is-hovered,
+.field.has-addons .control .button:not([disabled]):hover,
+.field.has-addons .control .input:not([disabled]).is-hovered,
+.field.has-addons .control .input:not([disabled]):hover,
+.field.has-addons .control .select select:not([disabled]).is-hovered,
+.field.has-addons .control .select select:not([disabled]):hover {
+    z-index: 2
+}
+
+.field.has-addons .control .button:not([disabled]).is-active,
+.field.has-addons .control .button:not([disabled]).is-focused,
+.field.has-addons .control .button:not([disabled]):active,
+.field.has-addons .control .button:not([disabled]):focus,
+.field.has-addons .control .input:not([disabled]).is-active,
+.field.has-addons .control .input:not([disabled]).is-focused,
+.field.has-addons .control .input:not([disabled]):active,
+.field.has-addons .control .input:not([disabled]):focus,
+.field.has-addons .control .select select:not([disabled]).is-active,
+.field.has-addons .control .select select:not([disabled]).is-focused,
+.field.has-addons .control .select select:not([disabled]):active,
+.field.has-addons .control .select select:not([disabled]):focus {
+    z-index: 3
+}
+
+.field.has-addons .control .button:not([disabled]).is-active:hover,
+.field.has-addons .control .button:not([disabled]).is-focused:hover,
+.field.has-addons .control .button:not([disabled]):active:hover,
+.field.has-addons .control .button:not([disabled]):focus:hover,
+.field.has-addons .control .input:not([disabled]).is-active:hover,
+.field.has-addons .control .input:not([disabled]).is-focused:hover,
+.field.has-addons .control .input:not([disabled]):active:hover,
+.field.has-addons .control .input:not([disabled]):focus:hover,
+.field.has-addons .control .select select:not([disabled]).is-active:hover,
+.field.has-addons .control .select select:not([disabled]).is-focused:hover,
+.field.has-addons .control .select select:not([disabled]):active:hover,
+.field.has-addons .control .select select:not([disabled]):focus:hover {
+    z-index: 4
+}
+
+.field.has-addons .control.is-expanded {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.field.has-addons.has-addons-centered {
+    justify-content: center
+}
+
+.field.has-addons.has-addons-right {
+    justify-content: flex-end
+}
+
+.field.has-addons.has-addons-fullwidth .control,
+.tabs.is-fullwidth li {
+    flex-grow: 1;
+    flex-shrink: 0
+}
+
+.field.is-grouped>.control {
+    flex-shrink: 0
+}
+
+.field.is-grouped>.control:not(:last-child) {
+    margin-bottom: 0;
+    margin-right: .75rem
+}
+
+.field.is-grouped>.control.is-expanded {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.breadcrumb.is-centered ol,
+.breadcrumb.is-centered ul,
+.field.is-grouped.is-grouped-centered {
+    justify-content: center
+}
+
+.breadcrumb.is-right ol,
+.breadcrumb.is-right ul,
+.field.is-grouped.is-grouped-right {
+    justify-content: flex-end
+}
+
+.field.is-grouped.is-grouped-multiline {
+    flex-wrap: wrap
+}
+
+.field.is-grouped.is-grouped-multiline>.control:last-child,
+.field.is-grouped.is-grouped-multiline>.control:not(:last-child) {
+    margin-bottom: .75rem
+}
+
+.field.is-grouped.is-grouped-multiline:last-child {
+    margin-bottom: -.75rem
+}
+
+.field.is-grouped.is-grouped-multiline:not(:last-child) {
+    margin-bottom: 0
+}
+
+@media screen and (min-width: 769px),
+print {
+    .field.is-horizontal {
+        display: flex
+    }
+}
+
+.field-label .label {
+    font-size: inherit
+}
+
+@media screen and (max-width: 768px) {
+    .field-label {
+        margin-bottom: .5rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .field-label {
+        flex-basis: 0;
+        flex-grow: 1;
+        flex-shrink: 0;
+        margin-right: 1.5rem;
+        text-align: right
+    }
+
+    .field-label.is-small {
+        font-size: .85em;
+        padding-top: .375em
+    }
+
+    .field-label.is-normal {
+        padding-top: .375em
+    }
+
+    .field-label.is-medium {
+        font-size: 1.25rem;
+        padding-top: .375em
+    }
+
+    .field-label.is-large {
+        font-size: 1.5rem;
+        padding-top: .375em
+    }
+}
+
+.field-body .field .field {
+    margin-bottom: 0
+}
+
+@media screen and (min-width: 769px),
+print {
+    .field-body {
+        display: flex;
+        flex-basis: 0;
+        flex-grow: 5
+    }
+
+    .field-body .field {
+        margin-bottom: 0
+    }
+
+    .field-body,
+    .field-body>.field {
+        flex-shrink: 1
+    }
+
+    .field-body>.field:not(.is-narrow) {
+        flex-grow: 1
+    }
+
+    .field-body>.field:not(:last-child) {
+        margin-right: .75rem
+    }
+}
+
+.control {
+    box-sizing: border-box;
+    clear: both;
+    font-size: 15px;
+    position: relative;
+    text-align: left
+}
+
+.control.has-icons-left .input:focus~.icon,
+.control.has-icons-left .select:focus~.icon,
+.control.has-icons-right .input:focus~.icon,
+.control.has-icons-right .select:focus~.icon {
+    color: #d4d4d4
+}
+
+.breadcrumb.is-small,
+.control.has-icons-left .input.is-small~.icon,
+.control.has-icons-left .select.is-small~.icon,
+.control.has-icons-right .input.is-small~.icon,
+.control.has-icons-right .select.is-small~.icon,
+.control.is-loading.is-small:after {
+    font-size: .85em
+}
+
+.breadcrumb.is-medium,
+.control.has-icons-left .input.is-medium~.icon,
+.control.has-icons-left .select.is-medium~.icon,
+.control.has-icons-right .input.is-medium~.icon,
+.control.has-icons-right .select.is-medium~.icon,
+.control.is-loading.is-medium:after {
+    font-size: 1.25rem
+}
+
+.breadcrumb.is-large,
+.control.has-icons-left .input.is-large~.icon,
+.control.has-icons-left .select.is-large~.icon,
+.control.has-icons-right .input.is-large~.icon,
+.control.has-icons-right .select.is-large~.icon,
+.control.is-loading.is-large:after {
+    font-size: 1.5rem
+}
+
+.control.has-icons-left .icon,
+.control.has-icons-right .icon {
+    color: #d4d4d4;
+    height: 2.5em;
+    pointer-events: none;
+    position: absolute;
+    top: 0;
+    width: 2.5em;
+    z-index: 4
+}
+
+.control.has-icons-left .input,
+.control.has-icons-left .select select {
+    padding-left: 2.5em
+}
+
+.control.has-icons-left .icon.is-left {
+    left: 0
+}
+
+.control.has-icons-right .input,
+.control.has-icons-right .select select {
+    padding-right: 2.5em
+}
+
+.control.has-icons-right .icon.is-right {
+    right: 0
+}
+
+.control.is-loading::after {
+    position: absolute !important;
+    right: .625em;
+    top: .625em;
+    z-index: 4
+}
+
+.breadcrumb {
+    font-size: 15px;
+    white-space: nowrap
+}
+
+.breadcrumb a {
+    justify-content: center;
+    padding: 0 .75em
+}
+
+.breadcrumb a:hover {
+    color: hsl(var(--main), 75%, 90%)
+}
+
+.breadcrumb a,
+.breadcrumb li {
+    align-items: center;
+    display: flex
+}
+
+.breadcrumb li:first-child a {
+    padding-left: 0
+}
+
+.breadcrumb li.is-active a {
+    color: #f2f2f2;
+    cursor: default;
+    pointer-events: none
+}
+
+.breadcrumb li+li::before {
+    color: #8c9b9d;
+    content: "\0002f"
+}
+
+.breadcrumb ol,
+.breadcrumb ul {
+    align-items: flex-start;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start
+}
+
+.breadcrumb .icon:first-child {
+    margin-right: .5em
+}
+
+.breadcrumb .icon:last-child {
+    margin-left: .5em
+}
+
+.breadcrumb.has-arrow-separator li+li::before {
+    content: "\02192"
+}
+
+.breadcrumb.has-bullet-separator li+li::before {
+    content: "\02022"
+}
+
+.breadcrumb.has-dot-separator li+li::before {
+    content: "\000b7"
+}
+
+.breadcrumb.has-succeeds-separator li+li::before {
+    content: "\0227B"
+}
+
+.card {
+    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .02);
+    color: #fff;
+    max-width: 100%;
+    position: relative
+}
+
+.card-header {
+    background-color: transparent;
+    align-items: stretch;
+    box-shadow: 0 .125em .25em rgba(10, 10, 10, .1);
+    display: flex
+}
+
+.card-header-title {
+    align-items: center;
+    color: #f2f2f2;
+    display: flex;
+    flex-grow: 1;
+    font-weight: 700;
+    padding: .75rem 1rem
+}
+
+.card-header-icon,
+.card-header-title.is-centered {
+    justify-content: center
+}
+
+.card-header-icon {
+    align-items: center;
+    cursor: pointer;
+    display: flex;
+    padding: .75rem 1rem
+}
+
+.card-image {
+    display: block;
+    position: relative
+}
+
+.card-content,
+.card-footer {
+    background-color: transparent
+}
+
+.card-content {
+    padding: 1.5rem
+}
+
+.card-footer {
+    border-top: 1px solid #ededed;
+    align-items: stretch;
+    display: flex
+}
+
+.card-footer-item {
+    align-items: center;
+    display: flex;
+    flex-basis: 0;
+    flex-grow: 1;
+    flex-shrink: 0;
+    justify-content: center;
+    padding: .75rem
+}
+
+.card-footer-item:not(:last-child) {
+    border-right: 1px solid #ededed
+}
+
+.card .media:not(:last-child) {
+    margin-bottom: 1.5rem
+}
+
+.dropdown {
+    display: inline-flex;
+    position: relative;
+    vertical-align: top
+}
+
+.dropdown.is-active .dropdown-menu,
+.dropdown.is-hoverable:hover .dropdown-menu {
+    display: block
+}
+
+.dropdown.is-right .dropdown-menu {
+    left: auto;
+    right: 0
+}
+
+.dropdown.is-up .dropdown-menu {
+    bottom: 100%;
+    padding-bottom: 4px;
+    padding-top: initial;
+    top: auto
+}
+
+.dropdown-menu {
+    display: none;
+    left: 0;
+    min-width: 12rem;
+    padding-top: 4px;
+    position: absolute;
+    top: 100%;
+    z-index: 20
+}
+
+.dropdown-content {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: .4em;
+    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .02);
+    padding-bottom: .5rem;
+    padding-top: .5rem
+}
+
+.dropdown-item {
+    color: #fff;
+    display: block;
+    font-size: .875rem;
+    line-height: 1.5;
+    padding: .375rem 1rem;
+    position: relative
+}
+
+a.dropdown-item,
+button.dropdown-item {
+    padding-right: 3rem;
+    text-align: left;
+    white-space: nowrap;
+    width: 100%
+}
+
+a.dropdown-item:hover,
+button.dropdown-item:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #0a0a0a
+}
+
+a.dropdown-item.is-active,
+button.dropdown-item.is-active {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.dropdown-divider {
+    background-color: #ededed;
+    border: 0;
+    display: block;
+    height: 1px;
+    margin: .5rem 0
+}
+
+.level {
+    align-items: center;
+    justify-content: space-between
+}
+
+.level img {
+    display: inline-block;
+    vertical-align: top
+}
+
+.level.is-mobile,
+.level.is-mobile .level-left,
+.level.is-mobile .level-right {
+    display: flex
+}
+
+.level.is-mobile .level-left+.level-right {
+    margin-top: 0
+}
+
+.level.is-mobile .level-item:not(:last-child) {
+    margin-bottom: 0;
+    margin-right: .75rem
+}
+
+.level.is-mobile .level-item:not(.is-narrow) {
+    flex-grow: 1
+}
+
+@media screen and (min-width: 769px),
+print {
+    .level {
+        display: flex
+    }
+
+    .level>.level-item:not(.is-narrow) {
+        flex-grow: 1
+    }
+}
+
+.level-item {
+    align-items: center;
+    display: flex;
+    justify-content: center
+}
+
+.level-item .subtitle,
+.level-item .title {
+    margin-bottom: 0
+}
+
+@media screen and (max-width: 768px) {
+    .level-item:not(:last-child) {
+        margin-bottom: .75rem
+    }
+}
+
+.level-item,
+.level-left,
+.level-right {
+    flex-basis: auto;
+    flex-grow: 0;
+    flex-shrink: 0
+}
+
+.level-left .level-item.is-flexible,
+.level-right .level-item.is-flexible {
+    flex-grow: 1
+}
+
+@media screen and (min-width: 769px),
+print {
+
+    .level-left .level-item:not(:last-child),
+    .level-right .level-item:not(:last-child) {
+        margin-right: .75rem
+    }
+}
+
+.level-left {
+    align-items: center;
+    justify-content: flex-start
+}
+
+@media screen and (max-width: 768px) {
+    .level-left+.level-right {
+        margin-top: 1.5rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .level-left {
+        display: flex
+    }
+}
+
+.level-right {
+    align-items: center;
+    justify-content: flex-end
+}
+
+@media screen and (min-width: 769px),
+print {
+    .level-right {
+        display: flex
+    }
+}
+
+.list {
+    background-color: #fff;
+    border-radius: .4em;
+    box-shadow: 0 2px 3px rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .1)
+}
+
+.list-item {
+    display: block;
+    padding: .5em 1em
+}
+
+.list-item:not(a) {
+    color: #fff
+}
+
+.list-item:first-child {
+    border-top-left-radius: .4em;
+    border-top-right-radius: .4em
+}
+
+.list-item:last-child {
+    border-bottom-left-radius: .4em;
+    border-bottom-right-radius: .4em
+}
+
+.list-item:not(:last-child) {
+    border-bottom: 1px solid #5e6d6f
+}
+
+.list-item.is-active {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+a.list-item {
+    background-color: hsl(var(--main), 10%, 15%);
+    cursor: pointer
+}
+
+.media {
+    align-items: flex-start;
+    display: flex;
+    text-align: left
+}
+
+.media .content:not(:last-child) {
+    margin-bottom: .75rem
+}
+
+.media .media {
+    border-top: 1px solid rgba(94, 109, 111, .5);
+    display: flex;
+    padding-top: .75rem
+}
+
+.media .media .content:not(:last-child),
+.media .media .control:not(:last-child) {
+    margin-bottom: .5rem
+}
+
+.media .media .media {
+    padding-top: .5rem
+}
+
+.media .media .media+.media {
+    margin-top: .5rem
+}
+
+.media+.media {
+    border-top: 1px solid rgba(94, 109, 111, .5);
+    margin-top: 1rem;
+    padding-top: 1rem
+}
+
+.media.is-large+.media {
+    margin-top: 1.5rem;
+    padding-top: 1.5rem
+}
+
+.media-left,
+.media-right {
+    flex-basis: auto;
+    flex-grow: 0;
+    flex-shrink: 0
+}
+
+.media-left {
+    margin-right: 1rem
+}
+
+.media-right {
+    margin-left: 1rem
+}
+
+.media-content {
+    flex-basis: auto;
+    flex-grow: 1;
+    flex-shrink: 1;
+    text-align: left
+}
+
+@media screen and (max-width: 768px) {
+    .media-content {
+        overflow-x: auto
+    }
+}
+
+.menu {
+    font-size: 15px
+}
+
+.menu.is-small {
+    font-size: .85em
+}
+
+.menu.is-medium {
+    font-size: 1.25rem
+}
+
+.menu.is-large {
+    font-size: 1.5rem
+}
+
+.menu-list {
+    line-height: 1.25
+}
+
+.menu-list a {
+    border-radius: 3px;
+    color: #fff;
+    display: block;
+    padding: .5em .75em
+}
+
+.menu-list a:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #f2f2f2
+}
+
+.menu-list a.is-active {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.menu-list li ul {
+    border-left: 1px solid #5e6d6f;
+    margin: .75em;
+    padding-left: .75em
+}
+
+.menu-label {
+    color: #fff;
+    font-size: .75em;
+    letter-spacing: .1em;
+    text-transform: uppercase
+}
+
+.menu-label:not(:first-child) {
+    margin-top: 1em
+}
+
+.menu-label:not(:last-child) {
+    margin-bottom: 1em
+}
+
+.message {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: .4em;
+    font-size: 15px
+}
+
+.message strong {
+    color: currentColor
+}
+
+.message.is-small {
+    font-size: .85em
+}
+
+.message.is-medium {
+    font-size: 1.25rem
+}
+
+.message.is-large {
+    font-size: 1.5rem
+}
+
+.message-body code,
+.message-body pre,
+.message.is-white {
+    background-color: #fff
+}
+
+.message.is-white .message-header {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.message.is-white .message-body {
+    border-color: #fff;
+    color: #000
+}
+
+.message.is-black {
+    background-color: #fafafa
+}
+
+.message.is-black .message-header {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.message.is-black .message-body,
+.navbar.is-white .navbar-brand .navbar-link::after {
+    border-color: #0a0a0a;
+    color: #000
+}
+
+.message.is-light {
+    background-color: #f9fafb
+}
+
+.message.is-light .message-header {
+    background-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.message.is-light .message-body {
+    border-color: #ecf0f1;
+    color: #000
+}
+
+.message.is-dark {
+    background-color: #f9fafa
+}
+
+.message.is-dark .message-header {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.message.is-dark .message-body {
+    border-color: hsl(var(--main), 10%, 15%);
+    color: #000
+}
+
+.message.is-primary {
+    background-color: hsl(var(--main), 50%, 90%)
+}
+
+.message.is-primary .message-header {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.message.is-primary .message-body {
+    border-color: hsl(var(--main), 45%, 45%);
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.message.is-info {
+    background-color: #eef6fc
+}
+
+.message.is-info .message-header {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.message.is-info .message-body {
+    border-color: #3298dc;
+    color: #1d72aa
+}
+
+.message.is-success {
+    background-color: #eefbf4
+}
+
+.message.is-success .message-header {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.message.is-success .message-body {
+    border-color: #2ecc71;
+    color: #1d8147
+}
+
+.message.is-warning {
+    background-color: #fef9ec
+}
+
+.message.is-warning .message-header {
+    background-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.message.is-warning .message-body {
+    border-color: #f1b70e;
+    color: #8c6a08
+}
+
+.message.is-danger {
+    background-color: #fdeeed
+}
+
+.message.is-danger .message-header {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.message.is-danger .message-body {
+    border-color: #e74c3c;
+    color: #c32818
+}
+
+.message-header {
+    align-items: center;
+    border-radius: .4em .4em 0 0;
+    color: rgba(0, 0, 0, .7);
+    display: flex;
+    justify-content: space-between;
+    line-height: 1.25;
+    padding: .75em 1em;
+    position: relative
+}
+
+.message-header .delete {
+    flex-grow: 0;
+    flex-shrink: 0;
+    margin-left: .75em
+}
+
+.message-header+.message-body {
+    border-width: 0;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0
+}
+
+.message-body {
+    border-radius: .4em;
+    border-style: solid;
+    color: #fff;
+    padding: 1.25em 1.5em
+}
+
+.modal {
+    align-items: center;
+    display: none;
+    flex-direction: column;
+    justify-content: center;
+    overflow: hidden;
+    position: fixed;
+    z-index: 40
+}
+
+.modal.is-active {
+    display: flex
+}
+
+.modal-background {
+    background-color: rgba(10, 10, 10, .86)
+}
+
+.modal-content {
+    max-height: calc(100vh - 160px);
+    overflow: auto
+}
+
+.modal-card,
+.modal-content {
+    margin: 0 20px;
+    position: relative;
+    width: 100%
+}
+
+@media screen and (min-width: 769px),
+print {
+
+    .modal-card,
+    .modal-content {
+        margin: 0 auto;
+        max-height: calc(100vh - 40px);
+        width: 640px
+    }
+}
+
+.modal-close {
+    background: 0 0;
+    height: 40px;
+    position: fixed;
+    right: 20px;
+    top: 20px;
+    width: 40px
+}
+
+.modal-card {
+    display: flex;
+    flex-direction: column;
+    max-height: calc(100vh - 40px);
+    overflow: hidden;
+    -ms-overflow-y: visible
+}
+
+.modal-card-foot,
+.modal-card-head {
+    align-items: center;
+    background-color: hsl(var(--main), 10%, 15%);
+    display: flex;
+    flex-shrink: 0;
+    justify-content: flex-start;
+    padding: 20px;
+    position: relative
+}
+
+.modal-card-head {
+    border-bottom: 1px solid #5e6d6f;
+    border-top-left-radius: 8px;
+    border-top-right-radius: 8px
+}
+
+.modal-card-title {
+    color: #f2f2f2;
+    flex-grow: 1;
+    flex-shrink: 0;
+    font-size: 1.5rem;
+    line-height: 1
+}
+
+.modal-card-foot {
+    border-bottom-left-radius: 8px;
+    border-bottom-right-radius: 8px;
+    border-top: 1px solid #5e6d6f
+}
+
+.modal-card-foot .button:not(:last-child) {
+    margin-right: .5em
+}
+
+.modal-card-body {
+    -webkit-overflow-scrolling: touch;
+    flex-grow: 1;
+    flex-shrink: 1;
+    overflow: auto;
+    padding: 20px
+}
+
+.navbar {
+    background-color: hsl(var(--main), 45%, 45%);
+    min-height: 4rem;
+    position: relative;
+    z-index: 30
+}
+
+.navbar>.container {
+    align-items: stretch;
+    display: flex;
+    min-height: 4rem;
+    width: 100%
+}
+
+.navbar.has-shadow {
+    box-shadow: 0 2px 0 0 hsl(var(--main), 10%, 15%)
+}
+
+.navbar.is-fixed-bottom,
+.navbar.is-fixed-top {
+    left: 0;
+    position: fixed;
+    right: 0;
+    z-index: 30
+}
+
+.navbar.is-fixed-bottom {
+    bottom: 0
+}
+
+.navbar.is-fixed-bottom.has-shadow {
+    box-shadow: 0 -2px 0 0 hsl(var(--main), 10%, 15%)
+}
+
+.navbar.is-fixed-top {
+    top: 0
+}
+
+body.has-navbar-fixed-top,
+html.has-navbar-fixed-top {
+    padding-top: 4rem
+}
+
+body.has-navbar-fixed-bottom,
+html.has-navbar-fixed-bottom {
+    padding-bottom: 4rem
+}
+
+.navbar-brand,
+.navbar-tabs {
+    align-items: stretch;
+    display: flex;
+    flex-shrink: 0;
+    min-height: 4rem
+}
+
+.navbar-brand a.navbar-item:focus,
+.navbar-brand a.navbar-item:hover {
+    background-color: transparent
+}
+
+.navbar-tabs {
+    -webkit-overflow-scrolling: touch;
+    max-width: 100vw;
+    overflow-x: auto;
+    overflow-y: hidden
+}
+
+.navbar-burger {
+    color: #fff;
+    cursor: pointer;
+    display: block;
+    height: 4rem;
+    position: relative;
+    width: 4rem;
+    margin-left: auto
+}
+
+.navbar-burger span {
+    background-color: currentColor;
+    display: block;
+    height: 1px;
+    left: calc(50% - 8px);
+    position: absolute;
+    transform-origin: center;
+    transition-duration: 86ms;
+    transition-property: background-color, opacity, transform;
+    transition-timing-function: ease-out;
+    width: 16px
+}
+
+.navbar-burger span:nth-child(1) {
+    top: calc(50% - 6px)
+}
+
+.navbar-burger span:nth-child(2) {
+    top: calc(50% - 1px)
+}
+
+.navbar-burger span:nth-child(3) {
+    top: calc(50% + 4px)
+}
+
+.navbar-burger:hover {
+    background-color: rgba(0, 0, 0, .05)
+}
+
+.navbar-burger.is-active span:nth-child(1) {
+    transform: translateY(5px) rotate(45deg)
+}
+
+.navbar-burger.is-active span:nth-child(2) {
+    opacity: 0
+}
+
+.navbar-burger.is-active span:nth-child(3) {
+    transform: translateY(-5px) rotate(-45deg)
+}
+
+.navbar-menu {
+    display: none
+}
+
+.navbar-item,
+.navbar-link {
+    color: #fff;
+    display: block;
+    line-height: 1.5;
+    padding: .5rem .75rem;
+    position: relative
+}
+
+.navbar-item .icon:only-child,
+.navbar-link .icon:only-child {
+    margin-left: -.25rem;
+    margin-right: -.25rem
+}
+
+.navbar-link,
+a.navbar-item {
+    cursor: pointer
+}
+
+.navbar-link.is-active,
+.navbar-link:focus,
+.navbar-link:focus-within,
+.navbar-link:hover,
+a.navbar-item.is-active,
+a.navbar-item:focus,
+a.navbar-item:focus-within,
+a.navbar-item:hover {
+    background-color: transparent;
+    color: hsl(var(--main), 50%, 75%)
+}
+
+.navbar-item {
+    flex-grow: 0;
+    flex-shrink: 0
+}
+
+.navbar-item img {
+    max-height: 1.75rem
+}
+
+.navbar-item.has-dropdown {
+    padding: 0
+}
+
+.navbar-content,
+.navbar-item.is-expanded {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.navbar-item.is-tab {
+    border-bottom: 1px solid transparent;
+    min-height: 4rem;
+    padding-bottom: calc(.5rem - 1px)
+}
+
+.navbar-item.is-tab:focus,
+.navbar-item.is-tab:hover {
+    background-color: transparent;
+    border-bottom-color: hsl(var(--main), 45%, 45%)
+}
+
+.navbar-item.is-tab.is-active {
+    background-color: transparent;
+    border-bottom-color: hsl(var(--main), 45%, 45%);
+    border-bottom-style: solid;
+    border-bottom-width: 3px;
+    color: hsl(var(--main), 45%, 45%);
+    padding-bottom: calc(.5rem - 3px)
+}
+
+.navbar-link:not(.is-arrowless) {
+    padding-right: 2.5em
+}
+
+.navbar-link:not(.is-arrowless)::after {
+    border-color: #fff;
+    margin-top: -.375em;
+    right: 1.125em
+}
+
+.navbar-dropdown {
+    font-size: .875rem;
+    padding-bottom: .5rem;
+    padding-top: .5rem
+}
+
+.navbar-dropdown .navbar-item {
+    padding-left: 1.5rem;
+    padding-right: 1.5rem
+}
+
+.navbar-divider {
+    background-color: rgba(0, 0, 0, .2);
+    border: 0;
+    display: none;
+    height: 2px;
+    margin: .5rem 0
+}
+
+@media screen and (max-width: 1023px) {
+    .navbar>.container {
+        display: block
+    }
+
+    .navbar-brand .navbar-item,
+    .navbar-tabs .navbar-item {
+        align-items: center;
+        display: flex
+    }
+
+    .navbar-link::after {
+        display: none
+    }
+
+    .navbar-menu {
+        background-color: hsl(var(--main), 45%, 45%);
+        box-shadow: 0 8px 16px rgba(10, 10, 10, .1);
+        padding: .5rem 0
+    }
+
+    .navbar-menu.is-active {
+        display: block
+    }
+
+    .navbar.is-fixed-bottom-touch,
+    .navbar.is-fixed-top-touch {
+        left: 0;
+        position: fixed;
+        right: 0;
+        z-index: 30
+    }
+
+    .navbar.is-fixed-bottom-touch {
+        bottom: 0
+    }
+
+    .navbar.is-fixed-bottom-touch.has-shadow {
+        box-shadow: 0 -2px 3px rgba(10, 10, 10, .1)
+    }
+
+    .navbar.is-fixed-top-touch {
+        top: 0
+    }
+
+    .navbar.is-fixed-top .navbar-menu,
+    .navbar.is-fixed-top-touch .navbar-menu {
+        -webkit-overflow-scrolling: touch;
+        max-height: calc(100vh - 4rem);
+        overflow: auto
+    }
+
+    body.has-navbar-fixed-top-touch,
+    html.has-navbar-fixed-top-touch {
+        padding-top: 4rem
+    }
+
+    body.has-navbar-fixed-bottom-touch,
+    html.has-navbar-fixed-bottom-touch {
+        padding-bottom: 4rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+
+    .navbar,
+    .navbar-end,
+    .navbar-menu,
+    .navbar-start {
+        align-items: stretch;
+        display: flex
+    }
+
+    .navbar {
+        min-height: 4rem
+    }
+
+    .navbar.is-spaced {
+        padding: 1rem 2rem
+    }
+
+    .navbar.is-spaced .navbar-end,
+    .navbar.is-spaced .navbar-start {
+        align-items: center
+    }
+
+    .navbar.is-spaced .navbar-link,
+    .navbar.is-spaced a.navbar-item {
+        border-radius: .4em
+    }
+
+    .navbar.is-transparent .navbar-link.is-active,
+    .navbar.is-transparent .navbar-link:focus,
+    .navbar.is-transparent .navbar-link:hover,
+    .navbar.is-transparent a.navbar-item.is-active,
+    .navbar.is-transparent a.navbar-item:focus,
+    .navbar.is-transparent a.navbar-item:hover {
+        background-color: transparent !important
+    }
+
+    .navbar.is-transparent .navbar-item.has-dropdown.is-active .navbar-link,
+    .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:focus .navbar-link,
+    .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:focus-within .navbar-link,
+    .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:hover .navbar-link {
+        background-color: transparent !important
+    }
+
+    .navbar-dropdown a.navbar-item:focus,
+    .navbar-dropdown a.navbar-item:hover,
+    .navbar.is-transparent .navbar-dropdown a.navbar-item:focus,
+    .navbar.is-transparent .navbar-dropdown a.navbar-item:hover {
+        background-color: transparent;
+        color: #dbdee0
+    }
+
+    .navbar-dropdown a.navbar-item.is-active,
+    .navbar.is-transparent .navbar-dropdown a.navbar-item.is-active {
+        background-color: transparent;
+        color: hsl(var(--main), 45%, 45%)
+    }
+
+    .navbar-burger {
+        display: none
+    }
+
+    .navbar-item,
+    .navbar-link {
+        align-items: center
+    }
+
+    .navbar-link {
+        display: flex
+    }
+
+    .navbar-item {
+        display: flex
+    }
+
+    .navbar-item.has-dropdown {
+        align-items: stretch
+    }
+
+    .navbar-item.has-dropdown-up .navbar-link::after {
+        transform: rotate(135deg) translate(.25em, -.25em)
+    }
+
+    .navbar-item.has-dropdown-up .navbar-dropdown {
+        border-bottom: 1px solid rgba(0, 0, 0, .2);
+        border-radius: 8px 8px 0 0;
+        border-top: none;
+        bottom: 100%;
+        box-shadow: 0 -8px 8px rgba(10, 10, 10, .1);
+        top: auto
+    }
+
+    .navbar-item.is-active .navbar-dropdown,
+    .navbar-item.is-hoverable:focus .navbar-dropdown,
+    .navbar-item.is-hoverable:focus-within .navbar-dropdown,
+    .navbar-item.is-hoverable:hover .navbar-dropdown {
+        display: block
+    }
+
+    .navbar-item.is-active .navbar-dropdown.is-boxed,
+    .navbar-item.is-hoverable:focus .navbar-dropdown.is-boxed,
+    .navbar-item.is-hoverable:focus-within .navbar-dropdown.is-boxed,
+    .navbar-item.is-hoverable:hover .navbar-dropdown.is-boxed,
+    .navbar.is-spaced .navbar-item.is-active .navbar-dropdown,
+    .navbar.is-spaced .navbar-item.is-hoverable:focus .navbar-dropdown,
+    .navbar.is-spaced .navbar-item.is-hoverable:focus-within .navbar-dropdown,
+    .navbar.is-spaced .navbar-item.is-hoverable:hover .navbar-dropdown {
+        opacity: 1;
+        pointer-events: auto;
+        transform: translateY(0)
+    }
+
+    .navbar-menu {
+        flex-grow: 1;
+        flex-shrink: 0
+    }
+
+    .navbar-start {
+        justify-content: flex-start;
+        margin-right: auto
+    }
+
+    .navbar-end {
+        justify-content: flex-end;
+        margin-left: auto
+    }
+
+    .navbar-dropdown {
+        background-color: hsl(var(--main), 45%, 45%);
+        border-bottom-left-radius: 8px;
+        border-bottom-right-radius: 8px;
+        border-top: 1px solid rgba(0, 0, 0, .2);
+        box-shadow: 0 8px 8px rgba(10, 10, 10, .1);
+        display: none;
+        font-size: .875rem;
+        left: 0;
+        min-width: 100%;
+        position: absolute;
+        top: 100%;
+        z-index: 20
+    }
+
+    .navbar-dropdown .navbar-item {
+        padding: .375rem 1rem;
+        white-space: nowrap
+    }
+
+    .navbar-dropdown a.navbar-item {
+        padding-right: 3rem
+    }
+
+    .navbar-dropdown.is-boxed,
+    .navbar.is-spaced .navbar-dropdown {
+        border-radius: 8px;
+        border-top: none;
+        box-shadow: 0 8px 8px rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .1);
+        display: block;
+        opacity: 0;
+        pointer-events: none;
+        top: calc(100% + (-4px));
+        transform: translateY(-5px);
+        transition-duration: 86ms;
+        transition-property: opacity, transform
+    }
+
+    .navbar-dropdown.is-right {
+        left: auto;
+        right: 0
+    }
+
+    .navbar-divider {
+        display: block
+    }
+
+    .container>.navbar .navbar-brand,
+    .navbar>.container .navbar-brand {
+        margin-left: -.75rem
+    }
+
+    .container>.navbar .navbar-menu,
+    .navbar>.container .navbar-menu {
+        margin-right: -.75rem
+    }
+
+    .navbar.is-fixed-bottom-desktop,
+    .navbar.is-fixed-top-desktop {
+        left: 0;
+        position: fixed;
+        right: 0;
+        z-index: 30
+    }
+
+    .navbar.is-fixed-bottom-desktop {
+        bottom: 0
+    }
+
+    .navbar.is-fixed-bottom-desktop.has-shadow {
+        box-shadow: 0 -2px 3px rgba(10, 10, 10, .1)
+    }
+
+    .navbar.is-fixed-top-desktop {
+        top: 0
+    }
+
+    body.has-navbar-fixed-top-desktop,
+    html.has-navbar-fixed-top-desktop {
+        padding-top: 4rem
+    }
+
+    body.has-navbar-fixed-bottom-desktop,
+    html.has-navbar-fixed-bottom-desktop {
+        padding-bottom: 4rem
+    }
+
+    body.has-spaced-navbar-fixed-top,
+    html.has-spaced-navbar-fixed-top {
+        padding-top: 6rem
+    }
+
+    body.has-spaced-navbar-fixed-bottom,
+    html.has-spaced-navbar-fixed-bottom {
+        padding-bottom: 6rem
+    }
+
+    .navbar-link.is-active,
+    a.navbar-item.is-active {
+        color: hsl(var(--main), 45%, 85%)
+    }
+
+    .navbar-link.is-active:not(:focus):not(:hover),
+    a.navbar-item.is-active:not(:focus):not(:hover) {
+        background-color: transparent
+    }
+
+    .navbar-item.has-dropdown.is-active .navbar-link,
+    .navbar-item.has-dropdown:focus .navbar-link,
+    .navbar-item.has-dropdown:hover .navbar-link {
+        background-color: transparent
+    }
+}
+
+.hero.is-fullheight-with-navbar {
+    min-height: calc(100vh - 4rem)
+}
+
+.pagination {
+    font-size: 15px;
+    margin: -.25rem
+}
+
+.pagination.is-small {
+    font-size: .85em
+}
+
+.pagination.is-medium {
+    font-size: 1.25rem
+}
+
+.pagination.is-large {
+    font-size: 1.5rem
+}
+
+.pagination.is-rounded .pagination-next,
+.pagination.is-rounded .pagination-previous {
+    padding-left: 1em;
+    padding-right: 1em;
+    border-radius: 290486px
+}
+
+.pagination.is-rounded .pagination-link {
+    border-radius: 290486px
+}
+
+.pagination,
+.pagination-list {
+    align-items: center;
+    display: flex;
+    justify-content: center;
+    text-align: center
+}
+
+.pagination-ellipsis,
+.pagination-link,
+.pagination-next,
+.pagination-previous {
+    font-size: 1em;
+    justify-content: center;
+    margin: .25rem;
+    text-align: center
+}
+
+.pagination-ellipsis,
+.pagination-link {
+    padding-left: .5em;
+    padding-right: .5em
+}
+
+.pagination-link,
+.pagination-next,
+.pagination-previous {
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff;
+    background: hsl(var(--main), 45%, 45%);
+    min-width: 2.5em
+}
+
+.pagination-link:hover,
+.pagination-next:hover,
+.pagination-previous:hover {
+    border-color: hsl(var(--main), 85%, 85%);
+    color: hsl(var(--main), 65%, 85%)
+}
+
+.pagination-link:focus,
+.pagination-next:focus,
+.pagination-previous:focus {
+    border-color: #8c9b9d
+}
+
+.pagination-link:active,
+.pagination-next:active,
+.pagination-previous:active {
+    box-shadow: inset 0 1px 2px rgb(10 10 10 / 20%)
+}
+
+.pagination-link[disabled],
+.pagination-next[disabled],
+.pagination-previous[disabled] {
+    background-color: #5e6d6f;
+    border-color: #5e6d6f;
+    box-shadow: none;
+    color: #fff;
+    opacity: .5
+}
+
+.pagination-next,
+.pagination-previous {
+    padding-left: .75em;
+    padding-right: .75em;
+    white-space: nowrap
+}
+
+.pagination-link.is-current {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.pagination-ellipsis {
+    color: #8c9b9d;
+    pointer-events: none
+}
+
+.pagination-list {
+    flex-wrap: wrap
+}
+
+@media screen and (max-width: 768px) {
+    .pagination {
+        flex-wrap: wrap
+    }
+
+    .pagination-list li,
+    .pagination-next,
+    .pagination-previous {
+        flex-grow: 1;
+        flex-shrink: 1
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .pagination-list {
+        flex-grow: 1;
+        flex-shrink: 1;
+        justify-content: flex-start;
+        order: 1
+    }
+
+    .pagination-previous {
+        order: 2
+    }
+
+    .pagination-next {
+        order: 3
+    }
+
+    .pagination {
+        justify-content: space-between
+    }
+
+    .pagination.is-centered .pagination-previous {
+        order: 1
+    }
+
+    .pagination.is-centered .pagination-list {
+        justify-content: center;
+        order: 2
+    }
+
+    .pagination.is-centered .pagination-next {
+        order: 3
+    }
+
+    .pagination.is-right .pagination-previous {
+        order: 1
+    }
+
+    .pagination.is-right .pagination-next {
+        order: 2
+    }
+
+    .pagination.is-right .pagination-list {
+        justify-content: flex-end;
+        order: 3
+    }
+}
+
+.panel {
+    border-radius: 8px;
+    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .02);
+    font-size: 15px;
+    background: hsl(var(--main), 15%, 12%)
+}
+
+.panel:not(:last-child) {
+    margin-bottom: 1.5rem
+}
+
+.panel.is-white .panel-heading {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.panel.is-white .panel-tabs a.is-active {
+    border-bottom-color: #fff
+}
+
+.panel.is-white .panel-block.is-active .panel-icon {
+    color: #fff
+}
+
+.panel.is-black .panel-heading {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.panel.is-black .panel-tabs a.is-active {
+    border-bottom-color: #0a0a0a
+}
+
+.panel.is-black .panel-block.is-active .panel-icon {
+    color: #0a0a0a
+}
+
+.panel.is-light .panel-heading {
+    background-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.panel.is-light .panel-tabs a.is-active {
+    border-bottom-color: #ecf0f1
+}
+
+.panel.is-light .panel-block.is-active .panel-icon {
+    color: #ecf0f1
+}
+
+.panel.is-dark .panel-heading {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.panel.is-dark .panel-tabs a.is-active {
+    border-bottom-color: hsl(var(--main), 10%, 15%)
+}
+
+.panel.is-dark .panel-block.is-active .panel-icon {
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.panel.is-primary .panel-heading {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.panel.is-primary .panel-tabs a.is-active {
+    border-bottom-color: hsl(var(--main), 45%, 45%)
+}
+
+.panel.is-primary .panel-block.is-active .panel-icon {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.panel.is-link .panel-heading {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.panel.is-link .panel-tabs a.is-active {
+    border-bottom-color: hsl(var(--main), 45%, 45%)
+}
+
+.panel.is-link .panel-block.is-active .panel-icon {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.panel.is-info .panel-heading {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.panel.is-info .panel-tabs a.is-active {
+    border-bottom-color: #3298dc
+}
+
+.panel.is-info .panel-block.is-active .panel-icon {
+    color: #3298dc
+}
+
+.panel.is-success .panel-heading {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.panel.is-success .panel-tabs a.is-active {
+    border-bottom-color: #2ecc71
+}
+
+.panel.is-success .panel-block.is-active .panel-icon {
+    color: #2ecc71
+}
+
+.panel.is-warning .panel-heading {
+    background-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.panel.is-warning .panel-tabs a.is-active {
+    border-bottom-color: #f1b70e
+}
+
+.panel.is-warning .panel-block.is-active .panel-icon {
+    color: #f1b70e
+}
+
+.panel.is-danger .panel-heading {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.panel.is-danger .panel-tabs a.is-active {
+    border-bottom-color: #e74c3c
+}
+
+.panel.is-danger .panel-block.is-active .panel-icon {
+    color: #e74c3c
+}
+
+.panel-heading {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: 8px 8px 0 0;
+    color: #f2f2f2;
+    font-size: 1.25em;
+    line-height: 1.25;
+    padding: .75em 1em
+}
+
+.panel-tabs {
+    align-items: flex-end;
+    display: flex;
+    font-size: .875em;
+    justify-content: center
+}
+
+.panel-tabs a {
+    border-bottom: 1px solid #5e6d6f;
+    padding: .5em
+}
+
+.panel-tabs a.is-active {
+    color: hsl(var(--main), 75%, 80%)
+}
+
+.panel-list a {
+    color: #fff
+}
+
+.panel-list a:hover {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.panel-block {
+    align-items: center;
+    color: #f2f2f2;
+    display: flex;
+    justify-content: flex-start;
+    padding: .5em 1.15em
+}
+
+.panel-block input[type=checkbox] {
+    margin-right: .75em
+}
+
+.panel-block>.control {
+    flex-grow: 1;
+    flex-shrink: 1;
+    width: 100%
+}
+
+.panel-block.is-wrapped {
+    flex-wrap: wrap
+}
+
+.panel-block.is-active {
+    border-left-color: hsl(var(--main), 45%, 45%);
+    color: hsl(var(--main), 75%, 80%)
+}
+
+.panel-block:last-child {
+    border-bottom-left-radius: 8px;
+    border-bottom-right-radius: 8px
+}
+
+a.panel-block,
+label.panel-block {
+    cursor: pointer
+}
+
+a.panel-block:hover,
+label.panel-block:hover {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.panel-icon {
+    display: inline-block;
+    font-size: 14px;
+    height: 1em;
+    line-height: 1em;
+    text-align: center;
+    vertical-align: top;
+    width: 1em;
+    color: #fff;
+    margin-right: .75em
+}
+
+.panel-icon .fa {
+    font-size: inherit;
+    line-height: inherit
+}
+
+.tabs {
+    -webkit-overflow-scrolling: touch;
+    align-items: stretch;
+    display: flex;
+    font-size: 15px;
+    justify-content: space-between;
+    overflow: hidden;
+    overflow-x: auto;
+    white-space: nowrap
+}
+
+.tabs a,
+.tabs ul {
+    align-items: center;
+    border-bottom-color: #5e6d6f;
+    border-bottom-style: solid;
+    display: flex
+}
+
+.tabs a {
+    color: #fff;
+    padding: .5em 1em;
+    vertical-align: top;
+    justify-content: center
+}
+
+.tabs a:hover {
+    border-bottom-color: #f2f2f2;
+    color: #f2f2f2
+}
+
+.tabs li {
+    display: block
+}
+
+.tabs li.is-active a {
+    border-bottom-color: hsl(var(--main), 45%, 45%);
+    color: hsl(var(--main), 65%, 65%)
+}
+
+.tabs ul {
+    flex-grow: 1;
+    flex-shrink: 0;
+    justify-content: flex-start;
+    border-bottom-width: 2px
+}
+
+.tabs ul.is-center,
+.tabs ul.is-left {
+    padding-right: .75em
+}
+
+.tabs ul.is-center {
+    flex: none;
+    justify-content: center;
+    padding-left: .75em
+}
+
+.tabs ul.is-right {
+    justify-content: flex-end;
+    padding-left: .75em
+}
+
+.tabs .icon:first-child {
+    margin-right: .5em
+}
+
+.tabs .icon:last-child {
+    margin-left: .5em
+}
+
+.tabs.is-centered ul {
+    justify-content: center
+}
+
+.tabs.is-right ul {
+    justify-content: flex-end
+}
+
+.tabs.is-boxed a {
+    border: 1px solid transparent;
+    border-radius: .4em .4em 0 0
+}
+
+.tabs.is-boxed a:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-bottom-color: #5e6d6f
+}
+
+.tabs.is-boxed li.is-active a {
+    border-color: #5e6d6f;
+    border-bottom-color: transparent !important
+}
+
+.tabs.is-toggle a {
+    border-color: #5e6d6f;
+    border-style: solid;
+    border-width: 1px;
+    margin-bottom: 0;
+    position: relative
+}
+
+.tabs.is-toggle a:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: #8c9b9d;
+    z-index: 2
+}
+
+.tabs.is-toggle li+li {
+    margin-left: -2px
+}
+
+.tabs.is-toggle li:first-child a {
+    border-radius: .4em 0 0 .4em
+}
+
+.tabs.is-toggle li:last-child a {
+    border-radius: 0 .4em .4em 0
+}
+
+.tabs.is-toggle li.is-active a {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff;
+    z-index: 1
+}
+
+.hero .tabs ul,
+.tabs.is-toggle ul {
+    border-bottom: none
+}
+
+.tabs.is-toggle.is-toggle-rounded li:first-child a {
+    border-bottom-left-radius: 290486px;
+    border-top-left-radius: 290486px;
+    padding-left: 1.25em
+}
+
+.tabs.is-toggle.is-toggle-rounded li:last-child a {
+    border-bottom-right-radius: 290486px;
+    border-top-right-radius: 290486px;
+    padding-right: 1.25em
+}
+
+.tabs.is-small {
+    font-size: .85em
+}
+
+.tabs.is-medium {
+    font-size: 1.25rem
+}
+
+.tabs.is-large {
+    font-size: 1.5rem
+}
+
+.column {
+    display: block;
+    flex-basis: 0;
+    flex-grow: 1;
+    flex-shrink: 1;
+    padding: .75rem
+}
+
+.columns.is-mobile>.column.is-narrow {
+    flex: none
+}
+
+.columns.is-mobile>.column.is-full {
+    flex: none;
+    width: 100%
+}
+
+.columns.is-mobile>.column.is-three-quarters {
+    flex: none;
+    width: 75%
+}
+
+.columns.is-mobile>.column.is-two-thirds {
+    flex: none;
+    width: 66.6666%
+}
+
+.columns.is-mobile>.column.is-half {
+    flex: none;
+    width: 50%
+}
+
+.columns.is-mobile>.column.is-one-third {
+    flex: none;
+    width: 33.3333%
+}
+
+.columns.is-mobile>.column.is-one-quarter {
+    flex: none;
+    width: 25%
+}
+
+.columns.is-mobile>.column.is-one-fifth {
+    flex: none;
+    width: 20%
+}
+
+.columns.is-mobile>.column.is-two-fifths {
+    flex: none;
+    width: 40%
+}
+
+.columns.is-mobile>.column.is-three-fifths {
+    flex: none;
+    width: 60%
+}
+
+.columns.is-mobile>.column.is-four-fifths {
+    flex: none;
+    width: 80%
+}
+
+.columns.is-mobile>.column.is-offset-three-quarters {
+    margin-left: 75%
+}
+
+.columns.is-mobile>.column.is-offset-two-thirds {
+    margin-left: 66.6666%
+}
+
+.columns.is-mobile>.column.is-offset-half {
+    margin-left: 50%
+}
+
+.columns.is-mobile>.column.is-offset-one-third {
+    margin-left: 33.3333%
+}
+
+.columns.is-mobile>.column.is-offset-one-quarter {
+    margin-left: 25%
+}
+
+.columns.is-mobile>.column.is-offset-one-fifth {
+    margin-left: 20%
+}
+
+.columns.is-mobile>.column.is-offset-two-fifths {
+    margin-left: 40%
+}
+
+.columns.is-mobile>.column.is-offset-three-fifths {
+    margin-left: 60%
+}
+
+.columns.is-mobile>.column.is-offset-four-fifths {
+    margin-left: 80%
+}
+
+.columns.is-mobile>.column.is-0 {
+    flex: none;
+    width: 0%
+}
+
+.columns.is-mobile>.column.is-offset-0 {
+    margin-left: 0
+}
+
+.columns.is-mobile>.column.is-1 {
+    flex: none;
+    width: 8.33333%
+}
+
+.columns.is-mobile>.column.is-offset-1 {
+    margin-left: 8.33333%
+}
+
+.columns.is-mobile>.column.is-2 {
+    flex: none;
+    width: 16.66667%
+}
+
+.columns.is-mobile>.column.is-offset-2 {
+    margin-left: 16.66667%
+}
+
+.columns.is-mobile>.column.is-3 {
+    flex: none;
+    width: 25%
+}
+
+.columns.is-mobile>.column.is-offset-3 {
+    margin-left: 25%
+}
+
+.columns.is-mobile>.column.is-4 {
+    flex: none;
+    width: 33.33333%
+}
+
+.columns.is-mobile>.column.is-offset-4 {
+    margin-left: 33.33333%
+}
+
+.columns.is-mobile>.column.is-5 {
+    flex: none;
+    width: 41.66667%
+}
+
+.columns.is-mobile>.column.is-offset-5 {
+    margin-left: 41.66667%
+}
+
+.columns.is-mobile>.column.is-6 {
+    flex: none;
+    width: 50%
+}
+
+.columns.is-mobile>.column.is-offset-6 {
+    margin-left: 50%
+}
+
+.columns.is-mobile>.column.is-7 {
+    flex: none;
+    width: 58.33333%
+}
+
+.columns.is-mobile>.column.is-offset-7 {
+    margin-left: 58.33333%
+}
+
+.columns.is-mobile>.column.is-8 {
+    flex: none;
+    width: 66.66667%
+}
+
+.columns.is-mobile>.column.is-offset-8 {
+    margin-left: 66.66667%
+}
+
+.columns.is-mobile>.column.is-9 {
+    flex: none;
+    width: 75%
+}
+
+.columns.is-mobile>.column.is-offset-9 {
+    margin-left: 75%
+}
+
+.columns.is-mobile>.column.is-10 {
+    flex: none;
+    width: 83.33333%
+}
+
+.columns.is-mobile>.column.is-offset-10 {
+    margin-left: 83.33333%
+}
+
+.columns.is-mobile>.column.is-11 {
+    flex: none;
+    width: 91.66667%
+}
+
+.columns.is-mobile>.column.is-offset-11 {
+    margin-left: 91.66667%
+}
+
+.columns.is-mobile>.column.is-12 {
+    flex: none;
+    width: 100%
+}
+
+.columns.is-mobile>.column.is-offset-12 {
+    margin-left: 100%
+}
+
+@media screen and (max-width: 768px) {
+    .column.is-narrow-mobile {
+        flex: none
+    }
+
+    .column.is-full-mobile {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-mobile {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-mobile {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-mobile {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-mobile {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-mobile {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-mobile {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-mobile {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-mobile {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-mobile {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-mobile {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-mobile {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-mobile {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-mobile {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-mobile {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-mobile {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-mobile {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-mobile {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-mobile {
+        margin-left: 80%
+    }
+
+    .column.is-0-mobile {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-mobile {
+        margin-left: 0
+    }
+
+    .column.is-1-mobile {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-mobile {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-mobile {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-mobile {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-mobile {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-mobile {
+        margin-left: 25%
+    }
+
+    .column.is-4-mobile {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-mobile {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-mobile {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-mobile {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-mobile {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-mobile {
+        margin-left: 50%
+    }
+
+    .column.is-7-mobile {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-mobile {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-mobile {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-mobile {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-mobile {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-mobile {
+        margin-left: 75%
+    }
+
+    .column.is-10-mobile {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-mobile {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-mobile {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-mobile {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-mobile {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-mobile {
+        margin-left: 100%
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+
+    .column.is-narrow,
+    .column.is-narrow-tablet {
+        flex: none
+    }
+
+    .column.is-full,
+    .column.is-full-tablet {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters,
+    .column.is-three-quarters-tablet {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds,
+    .column.is-two-thirds-tablet {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half,
+    .column.is-half-tablet {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third,
+    .column.is-one-third-tablet {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter,
+    .column.is-one-quarter-tablet {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth,
+    .column.is-one-fifth-tablet {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths,
+    .column.is-two-fifths-tablet {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths,
+    .column.is-three-fifths-tablet {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths,
+    .column.is-four-fifths-tablet {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters,
+    .column.is-offset-three-quarters-tablet {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds,
+    .column.is-offset-two-thirds-tablet {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half,
+    .column.is-offset-half-tablet {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third,
+    .column.is-offset-one-third-tablet {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter,
+    .column.is-offset-one-quarter-tablet {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth,
+    .column.is-offset-one-fifth-tablet {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths,
+    .column.is-offset-two-fifths-tablet {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths,
+    .column.is-offset-three-fifths-tablet {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths,
+    .column.is-offset-four-fifths-tablet {
+        margin-left: 80%
+    }
+
+    .column.is-0,
+    .column.is-0-tablet {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0,
+    .column.is-offset-0-tablet {
+        margin-left: 0
+    }
+
+    .column.is-1,
+    .column.is-1-tablet {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1,
+    .column.is-offset-1-tablet {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2,
+    .column.is-2-tablet {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2,
+    .column.is-offset-2-tablet {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3,
+    .column.is-3-tablet {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3,
+    .column.is-offset-3-tablet {
+        margin-left: 25%
+    }
+
+    .column.is-4,
+    .column.is-4-tablet {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4,
+    .column.is-offset-4-tablet {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5,
+    .column.is-5-tablet {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5,
+    .column.is-offset-5-tablet {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6,
+    .column.is-6-tablet {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6,
+    .column.is-offset-6-tablet {
+        margin-left: 50%
+    }
+
+    .column.is-7,
+    .column.is-7-tablet {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7,
+    .column.is-offset-7-tablet {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8,
+    .column.is-8-tablet {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8,
+    .column.is-offset-8-tablet {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9,
+    .column.is-9-tablet {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9,
+    .column.is-offset-9-tablet {
+        margin-left: 75%
+    }
+
+    .column.is-10,
+    .column.is-10-tablet {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10,
+    .column.is-offset-10-tablet {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11,
+    .column.is-11-tablet {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11,
+    .column.is-offset-11-tablet {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12,
+    .column.is-12-tablet {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12,
+    .column.is-offset-12-tablet {
+        margin-left: 100%
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .column.is-narrow-touch {
+        flex: none
+    }
+
+    .column.is-full-touch {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-touch {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-touch {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-touch {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-touch {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-touch {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-touch {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-touch {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-touch {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-touch {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-touch {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-touch {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-touch {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-touch {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-touch {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-touch {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-touch {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-touch {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-touch {
+        margin-left: 80%
+    }
+
+    .column.is-0-touch {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-touch {
+        margin-left: 0
+    }
+
+    .column.is-1-touch {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-touch {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-touch {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-touch {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-touch {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-touch {
+        margin-left: 25%
+    }
+
+    .column.is-4-touch {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-touch {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-touch {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-touch {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-touch {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-touch {
+        margin-left: 50%
+    }
+
+    .column.is-7-touch {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-touch {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-touch {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-touch {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-touch {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-touch {
+        margin-left: 75%
+    }
+
+    .column.is-10-touch {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-touch {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-touch {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-touch {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-touch {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-touch {
+        margin-left: 100%
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .column.is-narrow-desktop {
+        flex: none
+    }
+
+    .column.is-full-desktop {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-desktop {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-desktop {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-desktop {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-desktop {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-desktop {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-desktop {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-desktop {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-desktop {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-desktop {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-desktop {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-desktop {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-desktop {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-desktop {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-desktop {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-desktop {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-desktop {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-desktop {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-desktop {
+        margin-left: 80%
+    }
+
+    .column.is-0-desktop {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-desktop {
+        margin-left: 0
+    }
+
+    .column.is-1-desktop {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-desktop {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-desktop {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-desktop {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-desktop {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-desktop {
+        margin-left: 25%
+    }
+
+    .column.is-4-desktop {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-desktop {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-desktop {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-desktop {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-desktop {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-desktop {
+        margin-left: 50%
+    }
+
+    .column.is-7-desktop {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-desktop {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-desktop {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-desktop {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-desktop {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-desktop {
+        margin-left: 75%
+    }
+
+    .column.is-10-desktop {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-desktop {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-desktop {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-desktop {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-desktop {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-desktop {
+        margin-left: 100%
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .column.is-narrow-widescreen {
+        flex: none
+    }
+
+    .column.is-full-widescreen {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-widescreen {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-widescreen {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-widescreen {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-widescreen {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-widescreen {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-widescreen {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-widescreen {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-widescreen {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-widescreen {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-widescreen {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-widescreen {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-widescreen {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-widescreen {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-widescreen {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-widescreen {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-widescreen {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-widescreen {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-widescreen {
+        margin-left: 80%
+    }
+
+    .column.is-0-widescreen {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-widescreen {
+        margin-left: 0
+    }
+
+    .column.is-1-widescreen {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-widescreen {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-widescreen {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-widescreen {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-widescreen {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-widescreen {
+        margin-left: 25%
+    }
+
+    .column.is-4-widescreen {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-widescreen {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-widescreen {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-widescreen {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-widescreen {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-widescreen {
+        margin-left: 50%
+    }
+
+    .column.is-7-widescreen {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-widescreen {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-widescreen {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-widescreen {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-widescreen {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-widescreen {
+        margin-left: 75%
+    }
+
+    .column.is-10-widescreen {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-widescreen {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-widescreen {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-widescreen {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-widescreen {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-widescreen {
+        margin-left: 100%
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .column.is-narrow-fullhd {
+        flex: none
+    }
+
+    .column.is-full-fullhd {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-fullhd {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-fullhd {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-fullhd {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-fullhd {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-fullhd {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-fullhd {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-fullhd {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-fullhd {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-fullhd {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-fullhd {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-fullhd {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-fullhd {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-fullhd {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-fullhd {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-fullhd {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-fullhd {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-fullhd {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-fullhd {
+        margin-left: 80%
+    }
+
+    .column.is-0-fullhd {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-fullhd {
+        margin-left: 0
+    }
+
+    .column.is-1-fullhd {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-fullhd {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-fullhd {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-fullhd {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-fullhd {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-fullhd {
+        margin-left: 25%
+    }
+
+    .column.is-4-fullhd {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-fullhd {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-fullhd {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-fullhd {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-fullhd {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-fullhd {
+        margin-left: 50%
+    }
+
+    .column.is-7-fullhd {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-fullhd {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-fullhd {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-fullhd {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-fullhd {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-fullhd {
+        margin-left: 75%
+    }
+
+    .column.is-10-fullhd {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-fullhd {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-fullhd {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-fullhd {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-fullhd {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-fullhd {
+        margin-left: 100%
+    }
+}
+
+.columns {
+    margin-left: -.75rem;
+    margin-right: -.75rem;
+    margin-top: -.75rem
+}
+
+.columns:last-child {
+    margin-bottom: -.75rem
+}
+
+.columns:not(:last-child) {
+    margin-bottom: calc(1.5rem - .75rem)
+}
+
+.columns.is-centered {
+    justify-content: center
+}
+
+.columns.is-gapless {
+    margin-left: 0;
+    margin-right: 0;
+    margin-top: 0
+}
+
+.columns.is-gapless>.column {
+    margin: 0;
+    padding: 0 !important
+}
+
+.columns.is-gapless:not(:last-child) {
+    margin-bottom: 1.5rem
+}
+
+.columns.is-gapless:last-child {
+    margin-bottom: 0
+}
+
+.columns.is-mobile {
+    display: flex
+}
+
+.columns.is-multiline {
+    flex-wrap: wrap
+}
+
+.columns.is-vcentered {
+    align-items: center
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns:not(.is-desktop) {
+        display: flex
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-desktop {
+        display: flex
+    }
+}
+
+.columns.is-variable {
+    --columnGap: 0.75rem;
+    margin-left: calc(-1 * var(--columnGap));
+    margin-right: calc(-1 * var(--columnGap))
+}
+
+.columns.is-variable .column {
+    padding-left: var(--columnGap);
+    padding-right: var(--columnGap)
+}
+
+.columns.is-variable.is-0 {
+    --columnGap: 0rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-0-mobile {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-0-tablet {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-0-tablet-only {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-0-touch {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-0-desktop {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-0-desktop-only {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-0-widescreen {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-0-widescreen-only {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-0-fullhd {
+        --columnGap: 0rem
+    }
+}
+
+.columns.is-variable.is-1 {
+    --columnGap: 0.25rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-1-mobile {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-1-tablet {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-1-tablet-only {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-1-touch {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-1-desktop {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-1-desktop-only {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-1-widescreen {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-1-widescreen-only {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-1-fullhd {
+        --columnGap: 0.25rem
+    }
+}
+
+.columns.is-variable.is-2 {
+    --columnGap: 0.5rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-2-mobile {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-2-tablet {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-2-tablet-only {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-2-touch {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-2-desktop {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-2-desktop-only {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-2-widescreen {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-2-widescreen-only {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-2-fullhd {
+        --columnGap: 0.5rem
+    }
+}
+
+.columns.is-variable.is-3 {
+    --columnGap: 0.75rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-3-mobile {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-3-tablet {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-3-tablet-only {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-3-touch {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-3-desktop {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-3-desktop-only {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-3-widescreen {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-3-widescreen-only {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-3-fullhd {
+        --columnGap: 0.75rem
+    }
+}
+
+.columns.is-variable.is-4 {
+    --columnGap: 1rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-4-mobile {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-4-tablet {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-4-tablet-only {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-4-touch {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-4-desktop {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-4-desktop-only {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-4-widescreen {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-4-widescreen-only {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-4-fullhd {
+        --columnGap: 1rem
+    }
+}
+
+.columns.is-variable.is-5 {
+    --columnGap: 1.25rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-5-mobile {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-5-tablet {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-5-tablet-only {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-5-touch {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-5-desktop {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-5-desktop-only {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-5-widescreen {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-5-widescreen-only {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-5-fullhd {
+        --columnGap: 1.25rem
+    }
+}
+
+.columns.is-variable.is-6 {
+    --columnGap: 1.5rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-6-mobile {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-6-tablet {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-6-tablet-only {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-6-touch {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-6-desktop {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-6-desktop-only {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-6-widescreen {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-6-widescreen-only {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-6-fullhd {
+        --columnGap: 1.5rem
+    }
+}
+
+.columns.is-variable.is-7 {
+    --columnGap: 1.75rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-7-mobile {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-7-tablet {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-7-tablet-only {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-7-touch {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-7-desktop {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-7-desktop-only {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-7-widescreen {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-7-widescreen-only {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-7-fullhd {
+        --columnGap: 1.75rem
+    }
+}
+
+.columns.is-variable.is-8 {
+    --columnGap: 2rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-8-mobile {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-8-tablet {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-8-tablet-only {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-8-touch {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-8-desktop {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-8-desktop-only {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-8-widescreen {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-8-widescreen-only {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-8-fullhd {
+        --columnGap: 2rem
+    }
+}
+
+.tile {
+    align-items: stretch;
+    display: block;
+    flex-basis: 0;
+    flex-grow: 1;
+    flex-shrink: 1;
+    min-height: -webkit-min-content;
+    min-height: -moz-min-content;
+    min-height: min-content
+}
+
+.tile.is-ancestor {
+    margin-left: -.75rem;
+    margin-right: -.75rem;
+    margin-top: -.75rem
+}
+
+.tile.is-ancestor:last-child {
+    margin-bottom: -.75rem
+}
+
+.tile.is-ancestor:not(:last-child) {
+    margin-bottom: .75rem
+}
+
+.tile.is-child {
+    margin: 0 !important
+}
+
+.tile.is-parent {
+    padding: .75rem
+}
+
+.tile.is-vertical {
+    flex-direction: column
+}
+
+.tile.is-vertical>.tile.is-child:not(:last-child) {
+    margin-bottom: 1.5rem !important
+}
+
+@media screen and (min-width: 769px),
+print {
+    .tile:not(.is-child) {
+        display: flex
+    }
+
+    .tile.is-1 {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .tile.is-2 {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .tile.is-3 {
+        flex: none;
+        width: 25%
+    }
+
+    .tile.is-4 {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .tile.is-5 {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .tile.is-6 {
+        flex: none;
+        width: 50%
+    }
+
+    .tile.is-7 {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .tile.is-8 {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .tile.is-9 {
+        flex: none;
+        width: 75%
+    }
+
+    .tile.is-10 {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .tile.is-11 {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .tile.is-12 {
+        flex: none;
+        width: 100%
+    }
+}
+
+.hero {
+    align-items: stretch;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between
+}
+
+.hero .navbar {
+    background: 0 0
+}
+
+.hero.is-white {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.hero.is-black a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-black strong,
+.hero.is-danger a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-danger strong,
+.hero.is-dark a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-dark strong,
+.hero.is-info a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-info strong,
+.hero.is-light a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-light strong,
+.hero.is-link a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-link strong,
+.hero.is-primary a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-primary strong,
+.hero.is-success a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-success strong,
+.hero.is-warning a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-warning strong,
+.hero.is-white a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-white strong {
+    color: inherit
+}
+
+.hero.is-white .title {
+    color: #0a0a0a
+}
+
+.hero.is-white .subtitle {
+    color: rgba(10, 10, 10, .9)
+}
+
+.hero.is-white .subtitle a:not(.button),
+.hero.is-white .subtitle strong {
+    color: #0a0a0a
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-white .navbar-menu {
+        background-color: #fff
+    }
+}
+
+.hero.is-white .navbar-item,
+.hero.is-white .navbar-link {
+    color: rgba(10, 10, 10, .7)
+}
+
+.hero.is-white .navbar-link.is-active,
+.hero.is-white .navbar-link:hover,
+.hero.is-white a.navbar-item.is-active,
+.hero.is-white a.navbar-item:hover {
+    background-color: #f2f2f2;
+    color: #0a0a0a
+}
+
+.hero.is-white .tabs a {
+    color: #0a0a0a;
+    opacity: .9
+}
+
+.hero.is-white .tabs a:hover,
+.hero.is-white .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-white .tabs.is-boxed a,
+.hero.is-white .tabs.is-toggle a {
+    color: #0a0a0a
+}
+
+.hero.is-black .tabs.is-boxed a:hover,
+.hero.is-black .tabs.is-toggle a:hover,
+.hero.is-danger .tabs.is-boxed a:hover,
+.hero.is-danger .tabs.is-toggle a:hover,
+.hero.is-dark .tabs.is-boxed a:hover,
+.hero.is-dark .tabs.is-toggle a:hover,
+.hero.is-info .tabs.is-boxed a:hover,
+.hero.is-info .tabs.is-toggle a:hover,
+.hero.is-light .tabs.is-boxed a:hover,
+.hero.is-light .tabs.is-toggle a:hover,
+.hero.is-link .tabs.is-boxed a:hover,
+.hero.is-link .tabs.is-toggle a:hover,
+.hero.is-primary .tabs.is-boxed a:hover,
+.hero.is-primary .tabs.is-toggle a:hover,
+.hero.is-success .tabs.is-boxed a:hover,
+.hero.is-success .tabs.is-toggle a:hover,
+.hero.is-warning .tabs.is-boxed a:hover,
+.hero.is-warning .tabs.is-toggle a:hover,
+.hero.is-white .tabs.is-boxed a:hover,
+.hero.is-white .tabs.is-toggle a:hover {
+    background-color: rgba(10, 10, 10, .1)
+}
+
+.hero.is-white.is-bold {
+    background-image: linear-gradient(141deg, #e6e6e6 0, #fff 71%, #fff 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-white.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #e6e6e6 0, #fff 71%, #fff 100%)
+    }
+}
+
+.hero.is-black {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.hero.is-black .title {
+    color: #fff
+}
+
+.hero.is-black .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-black .subtitle a:not(.button),
+.hero.is-black .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-black .navbar-menu {
+        background-color: #0a0a0a
+    }
+}
+
+.hero.is-black .navbar-item,
+.hero.is-black .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-black .navbar-link.is-active,
+.hero.is-black .navbar-link:hover,
+.hero.is-black a.navbar-item.is-active,
+.hero.is-black a.navbar-item:hover {
+    background-color: #000;
+    color: #fff
+}
+
+.hero.is-black .tabs a {
+    color: #fff;
+    opacity: .9
+}
+
+.hero.is-black .tabs a:hover,
+.hero.is-black .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-black .tabs.is-boxed a,
+.hero.is-black .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-black .tabs.is-boxed li.is-active a,
+.hero.is-black .tabs.is-boxed li.is-active a:hover,
+.hero.is-black .tabs.is-toggle li.is-active a,
+.hero.is-black .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #0a0a0a
+}
+
+.hero.is-black.is-bold {
+    background-image: linear-gradient(141deg, #000 0, #0a0a0a 71%, #181616 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-black.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #000 0, #0a0a0a 71%, #181616 100%)
+    }
+}
+
+.hero.is-light {
+    background-color: #ecf0f1
+}
+
+.hero.is-light,
+.hero.is-light .title {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-light .subtitle {
+    color: rgba(0, 0, 0, .9)
+}
+
+.hero.is-light .subtitle a:not(.button),
+.hero.is-light .subtitle strong {
+    color: rgba(0, 0, 0, .7)
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-light .navbar-menu {
+        background-color: #ecf0f1
+    }
+}
+
+.hero.is-light .navbar-item,
+.hero.is-light .navbar-link {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-light .navbar-link.is-active,
+.hero.is-light .navbar-link:hover,
+.hero.is-light a.navbar-item.is-active,
+.hero.is-light a.navbar-item:hover {
+    background-color: #dde4e6;
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-light .tabs a {
+    color: rgba(0, 0, 0, .7);
+    opacity: .9
+}
+
+.hero.is-light .tabs a:hover,
+.hero.is-light .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-light .tabs.is-boxed a,
+.hero.is-light .tabs.is-toggle a {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-light .tabs.is-boxed li.is-active a,
+.hero.is-light .tabs.is-boxed li.is-active a:hover,
+.hero.is-light .tabs.is-toggle li.is-active a,
+.hero.is-light .tabs.is-toggle li.is-active a:hover {
+    background-color: rgba(0, 0, 0, .7);
+    border-color: rgba(0, 0, 0, .7);
+    color: #ecf0f1
+}
+
+.hero.is-light.is-bold {
+    background-image: linear-gradient(141deg, #cadfe0 0, #ecf0f1 71%, #fafbfc 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-light.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #cadfe0 0, #ecf0f1 71%, #fafbfc 100%)
+    }
+}
+
+.hero.is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.hero.is-dark .title {
+    color: #fff
+}
+
+.hero.is-dark .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-dark .subtitle a:not(.button),
+.hero.is-dark .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-dark .navbar-menu {
+        background-color: hsl(var(--main), 10%, 15%)
+    }
+}
+
+.hero.is-dark .navbar-item,
+.hero.is-dark .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-dark .navbar-link.is-active,
+.hero.is-dark .navbar-link:hover,
+.hero.is-dark a.navbar-item.is-active,
+.hero.is-dark a.navbar-item:hover {
+    background-color: #1d2122;
+    color: #fff
+}
+
+.hero.is-dark .tabs a,
+.hero.is-info .tabs a,
+.hero.is-link .tabs a,
+.hero.is-primary .tabs a,
+.hero.is-success .tabs a {
+    color: #fff;
+    opacity: .9
+}
+
+.hero.is-dark .tabs a:hover,
+.hero.is-dark .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-dark .tabs.is-boxed li.is-active a,
+.hero.is-dark .tabs.is-boxed li.is-active a:hover,
+.hero.is-dark .tabs.is-toggle li.is-active a,
+.hero.is-dark .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.hero.is-dark.is-bold {
+    background-image: linear-gradient(141deg, #0f1615 0, hsl(var(--main), 10%, 15%) 71%, #313c40 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-dark.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #0f1615 0, hsl(var(--main), 10%, 15%) 71%, #313c40 100%)
+    }
+}
+
+.hero.is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.hero.is-dark .tabs.is-boxed a,
+.hero.is-dark .tabs.is-toggle a,
+.hero.is-primary .title {
+    color: #fff
+}
+
+.hero.is-primary .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-primary .subtitle a:not(.button),
+.hero.is-primary .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-primary .navbar-menu {
+        background-color: hsl(var(--main), 45%, 45%)
+    }
+}
+
+.hero.is-primary .navbar-item,
+.hero.is-primary .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-primary .navbar-link.is-active,
+.hero.is-primary .navbar-link:hover,
+.hero.is-primary a.navbar-item.is-active,
+.hero.is-primary a.navbar-item:hover {
+    background-color: #2f4d6d;
+    color: #fff
+}
+
+.hero.is-primary .tabs a:hover,
+.hero.is-primary .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-primary .tabs.is-boxed li.is-active a,
+.hero.is-primary .tabs.is-boxed li.is-active a:hover,
+.hero.is-primary .tabs.is-toggle li.is-active a,
+.hero.is-primary .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.hero.is-primary.is-bold {
+    background-image: linear-gradient(141deg, #214b62 0, hsl(var(--main), 45%, 45%) 71%, #3a5796 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-primary.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #214b62 0, hsl(var(--main), 45%, 45%) 71%, #3a5796 100%)
+    }
+}
+
+.hero.is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.hero.is-link .title,
+.hero.is-primary .tabs.is-boxed a,
+.hero.is-primary .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-link .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-link .subtitle a:not(.button),
+.hero.is-link .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-link .navbar-menu {
+        background-color: hsl(var(--main), 45%, 45%)
+    }
+}
+
+.hero.is-link .navbar-item,
+.hero.is-link .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-link .navbar-link.is-active,
+.hero.is-link .navbar-link:hover,
+.hero.is-link a.navbar-item.is-active,
+.hero.is-link a.navbar-item:hover {
+    background-color: hsl(var(--main), 75%, 80%);
+    color: #fff
+}
+
+.hero.is-link .tabs a:hover,
+.hero.is-link .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-link .tabs.is-boxed li.is-active a,
+.hero.is-link .tabs.is-boxed li.is-active a:hover,
+.hero.is-link .tabs.is-toggle li.is-active a,
+.hero.is-link .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.hero.is-link.is-bold {
+    background-image: linear-gradient(141deg, #0c9764 0, hsl(var(--main), 45%, 45%) 71%, #17d8d2 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-link.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #0c9764 0, hsl(var(--main), 45%, 45%) 71%, #17d8d2 100%)
+    }
+}
+
+.hero.is-info {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.hero.is-info .title,
+.hero.is-link .tabs.is-boxed a,
+.hero.is-link .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-info .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-info .subtitle a:not(.button),
+.hero.is-info .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-info .navbar-menu {
+        background-color: #3298dc
+    }
+}
+
+.hero.is-info .navbar-item,
+.hero.is-info .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-info .navbar-link.is-active,
+.hero.is-info .navbar-link:hover,
+.hero.is-info a.navbar-item.is-active,
+.hero.is-info a.navbar-item:hover {
+    background-color: #238cd1;
+    color: #fff
+}
+
+.hero.is-info .tabs a:hover,
+.hero.is-info .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-info .tabs.is-boxed li.is-active a,
+.hero.is-info .tabs.is-boxed li.is-active a:hover,
+.hero.is-info .tabs.is-toggle li.is-active a,
+.hero.is-info .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #3298dc
+}
+
+.hero.is-info.is-bold {
+    background-image: linear-gradient(141deg, #159dc6 0, #3298dc 71%, #4389e5 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-info.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #159dc6 0, #3298dc 71%, #4389e5 100%)
+    }
+}
+
+.hero.is-success {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.hero.is-info .tabs.is-boxed a,
+.hero.is-info .tabs.is-toggle a,
+.hero.is-success .title {
+    color: #fff
+}
+
+.hero.is-success .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-success .subtitle a:not(.button),
+.hero.is-success .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-success .navbar-menu {
+        background-color: #2ecc71
+    }
+}
+
+.hero.is-success .navbar-item,
+.hero.is-success .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-success .navbar-link.is-active,
+.hero.is-success .navbar-link:hover,
+.hero.is-success a.navbar-item.is-active,
+.hero.is-success a.navbar-item:hover {
+    background-color: #29b765;
+    color: #fff
+}
+
+.hero.is-success .tabs a:hover,
+.hero.is-success .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-success .tabs.is-boxed a,
+.hero.is-success .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-success .tabs.is-boxed li.is-active a,
+.hero.is-success .tabs.is-boxed li.is-active a:hover,
+.hero.is-success .tabs.is-toggle li.is-active a,
+.hero.is-success .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #2ecc71
+}
+
+.hero.is-success.is-bold {
+    background-image: linear-gradient(141deg, #1bac40 0, #2ecc71 71%, #3ada98 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-success.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #1bac40 0, #2ecc71 71%, #3ada98 100%)
+    }
+}
+
+.hero.is-warning {
+    background-color: #f1b70e
+}
+
+.hero.is-warning,
+.hero.is-warning .title {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-warning .subtitle {
+    color: rgba(0, 0, 0, .9)
+}
+
+.hero.is-warning .subtitle a:not(.button),
+.hero.is-warning .subtitle strong {
+    color: rgba(0, 0, 0, .7)
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-warning .navbar-menu {
+        background-color: #f1b70e
+    }
+}
+
+.hero.is-warning .navbar-item,
+.hero.is-warning .navbar-link {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-warning .navbar-link.is-active,
+.hero.is-warning .navbar-link:hover,
+.hero.is-warning a.navbar-item.is-active,
+.hero.is-warning a.navbar-item:hover {
+    background-color: #d9a50d;
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-warning .tabs a {
+    color: rgba(0, 0, 0, .7);
+    opacity: .9
+}
+
+.hero.is-warning .tabs a:hover,
+.hero.is-warning .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-warning .tabs.is-boxed a,
+.hero.is-warning .tabs.is-toggle a {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-warning .tabs.is-boxed li.is-active a,
+.hero.is-warning .tabs.is-boxed li.is-active a:hover,
+.hero.is-warning .tabs.is-toggle li.is-active a,
+.hero.is-warning .tabs.is-toggle li.is-active a:hover {
+    background-color: rgba(0, 0, 0, .7);
+    border-color: rgba(0, 0, 0, .7);
+    color: #f1b70e
+}
+
+.hero.is-warning.is-bold {
+    background-image: linear-gradient(141deg, #cb7601 0, #f1b70e 71%, #f8e520 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-warning.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #cb7601 0, #f1b70e 71%, #f8e520 100%)
+    }
+}
+
+.hero.is-danger {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.hero.is-danger .title {
+    color: #fff
+}
+
+.hero.is-danger .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-danger .subtitle a:not(.button),
+.hero.is-danger .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-danger .navbar-menu {
+        background-color: #e74c3c
+    }
+}
+
+.hero.is-danger .navbar-item,
+.hero.is-danger .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-danger .navbar-link.is-active,
+.hero.is-danger .navbar-link:hover,
+.hero.is-danger a.navbar-item.is-active,
+.hero.is-danger a.navbar-item:hover {
+    background-color: #e43725;
+    color: #fff
+}
+
+.hero.is-danger .tabs a {
+    color: #fff;
+    opacity: .9
+}
+
+.hero.is-danger .tabs a:hover,
+.hero.is-danger .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-danger .tabs.is-boxed a,
+.hero.is-danger .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-danger .tabs.is-boxed li.is-active a,
+.hero.is-danger .tabs.is-boxed li.is-active a:hover,
+.hero.is-danger .tabs.is-toggle li.is-active a,
+.hero.is-danger .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #e74c3c
+}
+
+.hero.is-danger.is-bold {
+    background-image: linear-gradient(141deg, #e20e1e 0, #e74c3c 71%, #ef784e 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-danger.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #e20e1e 0, #e74c3c 71%, #ef784e 100%)
+    }
+}
+
+.hero.is-small .hero-body {
+    padding: 1.5rem
+}
+
+@media screen and (min-width: 769px),
+print {
+    .hero.is-medium .hero-body {
+        padding: 9rem 1.5rem
+    }
+
+    .hero.is-large .hero-body {
+        padding: 18rem 1.5rem
+    }
+}
+
+.hero.is-fullheight .hero-body,
+.hero.is-fullheight-with-navbar .hero-body,
+.hero.is-halfheight .hero-body {
+    align-items: center;
+    display: flex
+}
+
+.hero.is-fullheight .hero-body>.container,
+.hero.is-fullheight-with-navbar .hero-body>.container,
+.hero.is-halfheight .hero-body>.container {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.hero.is-halfheight {
+    min-height: 50vh
+}
+
+.hero.is-fullheight {
+    min-height: 100vh
+}
+
+.hero-video {
+    overflow: hidden
+}
+
+.hero-video video {
+    left: 50%;
+    min-height: 100%;
+    min-width: 100%;
+    position: absolute;
+    top: 50%;
+    transform: translate3d(-50%, -50%, 0)
+}
+
+.hero-video.is-transparent {
+    opacity: .3
+}
+
+@media screen and (max-width: 768px) {
+    .hero-video {
+        display: none
+    }
+}
+
+.hero-buttons {
+    margin-top: 1.5rem
+}
+
+@media screen and (max-width: 768px) {
+    .hero-buttons .button {
+        display: flex
+    }
+
+    .hero-buttons .button:not(:last-child) {
+        margin-bottom: .75rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .hero-buttons {
+        display: flex;
+        justify-content: center
+    }
+
+    .hero-buttons .button:not(:last-child) {
+        margin-right: 1.5rem
+    }
+}
+
+.hero-body,
+.hero-foot,
+.hero-head {
+    flex-grow: 0;
+    flex-shrink: 0
+}
+
+.hero-body {
+    flex-grow: 1
+}
+
+.hero-body,
+.section {
+    padding: 3rem 1.5rem
+}
+
+@media screen and (min-width: 1024px) {
+    .section.is-medium {
+        padding: 9rem 1.5rem
+    }
+
+    .section.is-large {
+        padding: 18rem 1.5rem
+    }
+}
+
+.footer {
+    background-color: hsl(var(--main), 10%, 15%);
+    padding: 3rem 1.5rem 6rem
+}
+
+h6 {
+    text-transform: uppercase;
+    letter-spacing: .5px
+}
+
+.hero {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.button {
+    transition: all .2s ease;
+    border-width: 2px;
+    color: #fff
+}
+
+.button.is-active,
+.button.is-focused,
+.button:active,
+.button:focus {
+    box-shadow: 0 0 0 2px rgba(140, 155, 157, .5)
+}
+
+.button.is-white.is-hovered,
+.button.is-white:hover {
+    background-color: #fff
+}
+
+.button.is-white.is-active,
+.button.is-white.is-focused,
+.button.is-white:active,
+.button.is-white:focus {
+    border-color: #fff;
+    box-shadow: 0 0 0 2px rgba(255, 255, 255, .5)
+}
+
+.button.is-black.is-hovered,
+.button.is-black:hover {
+    background-color: #1d1d1d
+}
+
+.button.is-black.is-active,
+.button.is-black.is-focused,
+.button.is-black:active,
+.button.is-black:focus {
+    border-color: #0a0a0a;
+    box-shadow: 0 0 0 2px rgba(10, 10, 10, .5)
+}
+
+.button.is-light.is-hovered,
+.button.is-light:hover {
+    background-color: #fff
+}
+
+.button.is-light.is-active,
+.button.is-light.is-focused,
+.button.is-light:active,
+.button.is-light:focus {
+    border-color: #ecf0f1;
+    box-shadow: 0 0 0 2px rgba(236, 240, 241, .5)
+}
+
+.button.is-dark.is-hovered,
+.button.is-dark:hover {
+    background-color: #3a4344
+}
+
+.button.is-dark.is-active,
+.button.is-dark.is-focused,
+.button.is-dark:active,
+.button.is-dark:focus {
+    border-color: hsl(var(--main), 10%, 15%);
+    box-shadow: 0 0 0 2px rgba(40, 47, 47, .5)
+}
+
+.button.is-primary.is-hovered,
+.button.is-primary:hover {
+    background-color: hsl(var(--main), 65%, 35%)
+}
+
+.button.is-primary.is-active,
+.button.is-primary.is-focused,
+.button.is-primary:active,
+.button.is-primary:focus {
+    box-shadow: 0 0 0 2px rgb(140 155 157 / 50%)
+}
+
+.button.is-link.is-hovered,
+.button.is-link:hover {
+    background-color: #1fdeb8
+}
+
+.button.is-link.is-active,
+.button.is-link.is-focused,
+.button.is-link:active,
+.button.is-link:focus {
+    border-color: hsl(var(--main), 45%, 45%);
+    box-shadow: 0 0 0 2px rgba(26, 188, 156, .5)
+}
+
+.button.is-info.is-hovered,
+.button.is-info:hover {
+    background-color: #53a9e2
+}
+
+.button.is-info.is-active,
+.button.is-info.is-focused,
+.button.is-info:active,
+.button.is-info:focus {
+    border-color: #3298dc;
+    box-shadow: 0 0 0 2px rgba(50, 152, 220, .5)
+}
+
+.button.is-success.is-hovered,
+.button.is-success:hover {
+    background-color: #4ad685
+}
+
+.button.is-success.is-active,
+.button.is-success.is-focused,
+.button.is-success:active,
+.button.is-success:focus {
+    border-color: #2ecc71;
+    box-shadow: 0 0 0 2px rgba(46, 204, 113, .5)
+}
+
+.button.is-warning.is-hovered,
+.button.is-warning:hover {
+    background-color: #f3c232
+}
+
+.button.is-warning.is-active,
+.button.is-warning.is-focused,
+.button.is-warning:active,
+.button.is-warning:focus {
+    border-color: #f1b70e;
+    box-shadow: 0 0 0 2px rgba(241, 183, 14, .5)
+}
+
+.button.is-danger.is-hovered,
+.button.is-danger:hover {
+    background-color: #eb6b5e
+}
+
+.button.is-danger.is-active,
+.button.is-danger.is-focused,
+.button.is-danger:active,
+.button.is-danger:focus {
+    border-color: #e74c3c;
+    box-shadow: 0 0 0 2px rgba(231, 76, 60, .5)
+}
+
+.label {
+    color: #dbdee0
+}
+
+.input,
+.textarea {
+    transition: all .2s ease;
+    box-shadow: none;
+    border-width: 2px;
+    padding-left: 1em;
+    padding-right: 1em
+}
+
+.select select,
+.select:after {
+    border-width: 2px
+}
+
+.control.has-addons .button,
+.control.has-addons .input,
+.control.has-addons .select {
+    margin-right: -2px
+}
+
+.notification {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.card {
+    box-shadow: none;
+    border: 2px solid hsl(var(--main), 10%, 15%);
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: .4em
+}
+
+.card .card-header {
+    box-shadow: none;
+    border-radius: .4em .4em 0 0
+}
+
+.card .card-footer,
+.card .card-header {
+    background-color: rgba(18, 18, 18, .2)
+}
+
+.card .card-footer,
+.card .card-footer-item {
+    border-width: 2px;
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.notification.is-white a:not(.button) {
+    color: #0a0a0a;
+    text-decoration: underline
+}
+
+.notification.is-black a:not(.button) {
+    color: #fff;
+    text-decoration: underline
+}
+
+.notification.is-light a:not(.button) {
+    color: rgba(0, 0, 0, .7);
+    text-decoration: underline
+}
+
+.notification.is-dark a:not(.button),
+.notification.is-info a:not(.button),
+.notification.is-link a:not(.button),
+.notification.is-primary a:not(.button),
+.notification.is-success a:not(.button) {
+    color: #fff;
+    text-decoration: underline
+}
+
+.notification.is-warning a:not(.button) {
+    color: rgba(0, 0, 0, .7);
+    text-decoration: underline
+}
+
+.notification.is-danger a:not(.button) {
+    color: #fff;
+    text-decoration: underline
+}
+
+.tag {
+    border-radius: .4em
+}
+
+.menu-list a {
+    transition: all .3s ease
+}
+
+.modal-card-body {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.modal-card-foot,
+.modal-card-head {
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.message-header {
+    font-weight: 700;
+    background-color: hsl(var(--main), 30%, 20%);
+    color: #fff
+}
+
+.message-body {
+    border-width: 2px;
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.navbar.is-transparent {
+    background: 0 0
+}
+
+.navbar.is-primary .navbar-dropdown a.navbar-item.is-active {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+@media screen and (max-width: 1023px) {
+    .navbar .navbar-menu {
+        background-color: hsl(var(--main), 45%, 45%);
+        border-radius: 0 0 .4em .4em
+    }
+}
+
+.hero .navbar,
+body>.navbar {
+    border-radius: 0
+}
+
+.pagination-link,
+.pagination-next,
+.pagination-previous,
+.panel-block,
+.panel-heading,
+.panel-tabs {
+    border-width: 2px
+}
+
+.panel-block:first-child,
+.panel-heading:first-child,
+.panel-tabs:first-child {
+    border-top-width: 2px
+}
+
+.panel-heading {
+    font-weight: 700
+}
+
+.panel-tabs a {
+    border-width: 2px;
+    margin-bottom: -2px
+}
+
+.panel-tabs a.is-active {
+    border-bottom-color: hsl(var(--main), 75%, 80%)
+}
+
+.panel-block:hover,
+.panel-block:hover .panel-icon {
+    color: hsl(var(--main), 85%, 95%)
+}
+
+.panel-block.is-active .panel-icon {
+    color: hsl(var(--main), 75%, 80%)
+}
+
+.tabs a {
+    border-bottom-width: 2px;
+    margin-bottom: -2px
+}
+
+.tabs.is-boxed a {
+    border-width: 2px
+}
+
+.tabs.is-boxed li.is-active a {
+    background-color: hsl(var(--main), 10%, 10%)
+}
+
+.tabs.is-toggle li a {
+    border-width: 2px;
+    margin-bottom: 0
+}
+
+.hero.is-black .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-danger .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-dark .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-info .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-light .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-link .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-primary .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-success .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-warning .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-white .navbar .navbar-dropdown .navbar-item:hover {
+    background-color: transparent
+}
+
+.is-flex-direction-row {
+    flex-direction: row !important
+}
+
+.is-flex-direction-row-reverse {
+    flex-direction: row-reverse !important
+}
+
+.is-flex-direction-column {
+    flex-direction: column !important
+}
+
+.is-flex-direction-column-reverse {
+    flex-direction: column-reverse !important
+}
+
+.is-flex-wrap-nowrap {
+    flex-wrap: nowrap !important
+}
+
+.is-flex-wrap-wrap {
+    flex-wrap: wrap !important
+}
+
+.is-flex-wrap-wrap-reverse {
+    flex-wrap: wrap-reverse !important
+}
+
+.is-justify-content-flex-start {
+    justify-content: flex-start !important
+}
+
+.is-justify-content-flex-end {
+    justify-content: flex-end !important
+}
+
+.is-justify-content-center {
+    justify-content: center !important
+}
+
+.is-justify-content-space-between {
+    justify-content: space-between !important
+}
+
+.is-justify-content-space-around {
+    justify-content: space-around !important
+}
+
+.is-justify-content-space-evenly {
+    justify-content: space-evenly !important
+}
+
+.is-justify-content-start {
+    justify-content: start !important
+}
+
+.is-justify-content-end {
+    justify-content: end !important
+}
+
+.is-justify-content-left {
+    justify-content: left !important
+}
+
+.is-justify-content-right {
+    justify-content: right !important
+}
+
+.is-align-content-flex-start {
+    align-content: flex-start !important
+}
+
+.is-align-content-flex-end {
+    align-content: flex-end !important
+}
+
+.is-align-content-center {
+    align-content: center !important
+}
+
+.is-align-content-space-between {
+    align-content: space-between !important
+}
+
+.is-align-content-space-around {
+    align-content: space-around !important
+}
+
+.is-align-content-space-evenly {
+    align-content: space-evenly !important
+}
+
+.is-align-content-stretch {
+    align-content: stretch !important
+}
+
+.is-align-content-start {
+    align-content: start !important
+}
+
+.is-align-content-end {
+    align-content: end !important
+}
+
+.is-align-content-baseline {
+    align-content: baseline !important
+}
+
+.is-align-items-stretch {
+    align-items: stretch !important
+}
+
+.is-align-items-flex-start {
+    align-items: flex-start !important
+}
+
+.is-align-items-flex-end {
+    align-items: flex-end !important
+}
+
+.is-align-items-center {
+    align-items: center !important
+}
+
+.is-align-items-baseline {
+    align-items: baseline !important
+}
+
+.is-align-items-start {
+    align-items: start !important
+}
+
+.is-align-items-end {
+    align-items: end !important
+}
+
+.is-align-items-self-start {
+    align-items: self-start !important
+}
+
+.is-align-items-self-end {
+    align-items: self-end !important
+}
+
+.is-align-self-auto {
+    align-self: auto !important
+}
+
+.is-align-self-flex-start {
+    align-self: flex-start !important
+}
+
+.is-align-self-flex-end {
+    align-self: flex-end !important
+}
+
+.is-align-self-center {
+    align-self: center !important
+}
+
+.is-align-self-baseline {
+    align-self: baseline !important
+}
+
+.is-align-self-stretch {
+    align-self: stretch !important
+}
+
+.is-flex-grow-0 {
+    flex-grow: 0 !important
+}
+
+.is-flex-grow-1 {
+    flex-grow: 1 !important
+}
+
+.is-flex-grow-2 {
+    flex-grow: 2 !important
+}
+
+.is-flex-grow-3 {
+    flex-grow: 3 !important
+}
+
+.is-flex-grow-4 {
+    flex-grow: 4 !important
+}
+
+.is-flex-grow-5 {
+    flex-grow: 5 !important
+}
+
+.is-flex-shrink-0 {
+    flex-shrink: 0 !important
+}
+
+.is-flex-shrink-1 {
+    flex-shrink: 1 !important
+}
+
+.is-flex-shrink-2 {
+    flex-shrink: 2 !important
+}
+
+.is-flex-shrink-3 {
+    flex-shrink: 3 !important
+}
+
+.is-flex-shrink-4 {
+    flex-shrink: 4 !important
+}
+
+.is-flex-shrink-5 {
+    flex-shrink: 5 !important
+}
+
+.is-clearfix::after {
+    clear: both;
+    content: " ";
+    display: table
+}
+
+.is-pulled-left {
+    float: left !important
+}
+
+.is-pulled-right {
+    float: right !important
+}
+
+.is-radiusless {
+    border-radius: 0 !important
+}
+
+.is-shadowless {
+    box-shadow: none !important
+}
+
+.is-clickable {
+    cursor: pointer !important
+}
+
+.is-clipped {
+    overflow: hidden !important
+}
+
+.is-relative {
+    position: relative !important
+}
+
+.is-marginless {
+    margin: 0 !important
+}
+
+.is-paddingless {
+    padding: 0 !important
+}
+
+.m-0 {
+    margin: 0 !important
+}
+
+.mt-0 {
+    margin-top: 0 !important
+}
+
+.mr-0 {
+    margin-right: 0 !important
+}
+
+.mb-0 {
+    margin-bottom: 0 !important
+}
+
+.ml-0 {
+    margin-left: 0 !important
+}
+
+.mx-0 {
+    margin-left: 0 !important;
+    margin-right: 0 !important
+}
+
+.my-0 {
+    margin-top: 0 !important;
+    margin-bottom: 0 !important
+}
+
+.m-1 {
+    margin: .25rem !important
+}
+
+.mt-1 {
+    margin-top: .25rem !important
+}
+
+.mr-1 {
+    margin-right: .25rem !important
+}
+
+.mb-1 {
+    margin-bottom: .25rem !important
+}
+
+.ml-1 {
+    margin-left: .25rem !important
+}
+
+.mx-1 {
+    margin-left: .25rem !important;
+    margin-right: .25rem !important
+}
+
+.my-1 {
+    margin-top: .25rem !important;
+    margin-bottom: .25rem !important
+}
+
+.m-2 {
+    margin: .5rem !important
+}
+
+.mt-2 {
+    margin-top: .5rem !important
+}
+
+.mr-2 {
+    margin-right: .5rem !important
+}
+
+.mb-2 {
+    margin-bottom: .5rem !important
+}
+
+.ml-2 {
+    margin-left: .5rem !important
+}
+
+.mx-2 {
+    margin-left: .5rem !important;
+    margin-right: .5rem !important
+}
+
+.my-2 {
+    margin-top: .5rem !important;
+    margin-bottom: .5rem !important
+}
+
+.m-3 {
+    margin: .75rem !important
+}
+
+.mt-3 {
+    margin-top: .75rem !important
+}
+
+.mr-3 {
+    margin-right: .75rem !important
+}
+
+.mb-3 {
+    margin-bottom: .75rem !important
+}
+
+.ml-3 {
+    margin-left: .75rem !important
+}
+
+.mx-3 {
+    margin-left: .75rem !important;
+    margin-right: .75rem !important
+}
+
+.my-3 {
+    margin-top: .75rem !important;
+    margin-bottom: .75rem !important
+}
+
+.m-4 {
+    margin: 1rem !important
+}
+
+.mt-4 {
+    margin-top: 1rem !important
+}
+
+.mr-4 {
+    margin-right: 1rem !important
+}
+
+.mb-4 {
+    margin-bottom: 1rem !important
+}
+
+.ml-4 {
+    margin-left: 1rem !important
+}
+
+.mx-4 {
+    margin-left: 1rem !important;
+    margin-right: 1rem !important
+}
+
+.my-4 {
+    margin-top: 1rem !important;
+    margin-bottom: 1rem !important
+}
+
+.m-5 {
+    margin: 1.5rem !important
+}
+
+.mt-5 {
+    margin-top: 1.5rem !important
+}
+
+.mr-5 {
+    margin-right: 1.5rem !important
+}
+
+.mb-5 {
+    margin-bottom: 1.5rem !important
+}
+
+.ml-5 {
+    margin-left: 1.5rem !important
+}
+
+.mx-5 {
+    margin-left: 1.5rem !important;
+    margin-right: 1.5rem !important
+}
+
+.my-5 {
+    margin-top: 1.5rem !important;
+    margin-bottom: 1.5rem !important
+}
+
+.m-6 {
+    margin: 3rem !important
+}
+
+.mt-6 {
+    margin-top: 3rem !important
+}
+
+.mr-6 {
+    margin-right: 3rem !important
+}
+
+.mb-6 {
+    margin-bottom: 3rem !important
+}
+
+.ml-6 {
+    margin-left: 3rem !important
+}
+
+.mx-6 {
+    margin-left: 3rem !important;
+    margin-right: 3rem !important
+}
+
+.my-6 {
+    margin-top: 3rem !important;
+    margin-bottom: 3rem !important
+}
+
+.p-0 {
+    padding: 0 !important
+}
+
+.pt-0 {
+    padding-top: 0 !important
+}
+
+.pr-0 {
+    padding-right: 0 !important
+}
+
+.pb-0 {
+    padding-bottom: 0 !important
+}
+
+.pl-0 {
+    padding-left: 0 !important
+}
+
+.px-0 {
+    padding-left: 0 !important;
+    padding-right: 0 !important
+}
+
+.py-0 {
+    padding-top: 0 !important;
+    padding-bottom: 0 !important
+}
+
+.p-1 {
+    padding: .25rem !important
+}
+
+.pt-1 {
+    padding-top: .25rem !important
+}
+
+.pr-1 {
+    padding-right: .25rem !important
+}
+
+.pb-1 {
+    padding-bottom: .25rem !important
+}
+
+.pl-1 {
+    padding-left: .25rem !important
+}
+
+.px-1 {
+    padding-left: .25rem !important;
+    padding-right: .25rem !important
+}
+
+.py-1 {
+    padding-top: .25rem !important;
+    padding-bottom: .25rem !important
+}
+
+.p-2 {
+    padding: .5rem !important
+}
+
+.pt-2 {
+    padding-top: .5rem !important
+}
+
+.pr-2 {
+    padding-right: .5rem !important
+}
+
+.pb-2 {
+    padding-bottom: .5rem !important
+}
+
+.pl-2 {
+    padding-left: .5rem !important
+}
+
+.px-2 {
+    padding-left: .5rem !important;
+    padding-right: .5rem !important
+}
+
+.py-2 {
+    padding-top: .5rem !important;
+    padding-bottom: .5rem !important
+}
+
+.p-3 {
+    padding: .75rem !important
+}
+
+.pt-3 {
+    padding-top: .75rem !important
+}
+
+.pr-3 {
+    padding-right: .75rem !important
+}
+
+.pb-3 {
+    padding-bottom: .75rem !important
+}
+
+.pl-3 {
+    padding-left: .75rem !important
+}
+
+.px-3 {
+    padding-left: .75rem !important;
+    padding-right: .75rem !important
+}
+
+.py-3 {
+    padding-top: .75rem !important;
+    padding-bottom: .75rem !important
+}
+
+.p-4 {
+    padding: 1rem !important
+}
+
+.pt-4 {
+    padding-top: 1rem !important
+}
+
+.pr-4 {
+    padding-right: 1rem !important
+}
+
+.pb-4 {
+    padding-bottom: 1rem !important
+}
+
+.pl-4 {
+    padding-left: 1rem !important
+}
+
+.px-4 {
+    padding-left: 1rem !important;
+    padding-right: 1rem !important
+}
+
+.py-4 {
+    padding-top: 1rem !important;
+    padding-bottom: 1rem !important
+}
+
+.p-5 {
+    padding: 1.5rem !important
+}
+
+.pt-5 {
+    padding-top: 1.5rem !important
+}
+
+.pr-5 {
+    padding-right: 1.5rem !important
+}
+
+.pb-5 {
+    padding-bottom: 1.5rem !important
+}
+
+.pl-5 {
+    padding-left: 1.5rem !important
+}
+
+.px-5 {
+    padding-left: 1.5rem !important;
+    padding-right: 1.5rem !important
+}
+
+.py-5 {
+    padding-top: 1.5rem !important;
+    padding-bottom: 1.5rem !important
+}
+
+.p-6 {
+    padding: 3rem !important
+}
+
+.pt-6 {
+    padding-top: 3rem !important
+}
+
+.pr-6 {
+    padding-right: 3rem !important
+}
+
+.pb-6 {
+    padding-bottom: 3rem !important
+}
+
+.pl-6 {
+    padding-left: 3rem !important
+}
+
+.px-6 {
+    padding-left: 3rem !important;
+    padding-right: 3rem !important
+}
+
+.py-6 {
+    padding-top: 3rem !important;
+    padding-bottom: 3rem !important
+}
+
+.is-size-1 {
+    font-size: 3rem !important
+}
+
+.is-size-2 {
+    font-size: 2.5rem !important
+}
+
+.is-size-3 {
+    font-size: 2rem !important
+}
+
+.is-size-4 {
+    font-size: 1.5rem !important
+}
+
+.is-size-5 {
+    font-size: 1.25rem !important
+}
+
+.is-size-6 {
+    font-size: 1rem !important
+}
+
+.is-size-7 {
+    font-size: .75rem !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-size-1-mobile {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-mobile {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-mobile {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-mobile {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-mobile {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-mobile {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-mobile {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-size-1-tablet {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-tablet {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-tablet {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-tablet {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-tablet {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-tablet {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-tablet {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-size-1-touch {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-touch {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-touch {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-touch {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-touch {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-touch {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-touch {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-size-1-desktop {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-desktop {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-desktop {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-desktop {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-desktop {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-desktop {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-desktop {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-size-1-widescreen {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-widescreen {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-widescreen {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-widescreen {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-widescreen {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-widescreen {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-widescreen {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-size-1-fullhd {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-fullhd {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-fullhd {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-fullhd {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-fullhd {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-fullhd {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-fullhd {
+        font-size: .75rem !important
+    }
+}
+
+.has-text-centered {
+    text-align: center !important
+}
+
+.has-text-justified {
+    text-align: justify !important
+}
+
+.has-text-left {
+    text-align: left !important
+}
+
+.has-text-right {
+    text-align: right !important
+}
\ No newline at end of file

From 818e7dfb0e478e45bf763c5ad3631b2c93117a44 Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Wed, 8 Jun 2022 16:06:28 +0800
Subject: [PATCH 074/278] resolve the conflict

---
 .locales/home.zh_CN.yml | 6 +++---
 main.py                 | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/.locales/home.zh_CN.yml b/.locales/home.zh_CN.yml
index 6641fa25..156ac5c1 100644
--- a/.locales/home.zh_CN.yml
+++ b/.locales/home.zh_CN.yml
@@ -1,8 +1,8 @@
 zh_CN:
   subtitle-big: >-
-    欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜,
-    以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段,
-    如出现问题或有改进建议, 欢迎与我们联系与沟通.
+    欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会
+    群内的兽耳机器人24小时为您提供成绩查询等服务.详情请加QQ群: 792778662. 
+    ppysb新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
   some-of-our-coolest-features: 我们觉得最酷的一些功能
   features-title-1: 对Relax 和 Autopilot mod的PP计算
   features-content-1: >-
diff --git a/main.py b/main.py
index 572cce12..ed264deb 100755
--- a/main.py
+++ b/main.py
@@ -90,4 +90,4 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    app.run(port=8000, debug=glob.config.debug)  # blocking call
\ No newline at end of file
+    app.run(port=8000, debug=glob.config.debug) # blocking call

From 5ba664663a46ead5a3bc6877d17923994c10ef8c Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Wed, 8 Jun 2022 16:10:47 +0800
Subject: [PATCH 075/278] resolve the conflict

---
 main.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/main.py b/main.py
index ed264deb..f597bc84 100755
--- a/main.py
+++ b/main.py
@@ -90,4 +90,4 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    app.run(port=8000, debug=glob.config.debug) # blocking call
+    app.run(port=8000, debug=glob.config.debug)  # blocking call

From a2c7edbb0909dee398e63e11a5249feecf1732e2 Mon Sep 17 00:00:00 2001
From: DAYGoodTime <ken570015@163.com>
Date: Wed, 8 Jun 2022 14:55:09 +0000
Subject: [PATCH 076/278] add new i18 structure and completed some translation

---
 .gitignore                       |     3 +-
 .locales/admin.en_US.yml         |    10 +
 .locales/admin.zh_CN.yml         |    10 +
 .locales/global.zh_CN.yml        |     2 +-
 .locales/login.zh_CN.yml         |     2 +-
 .locales/navbar.en_GB.yml        |     4 +
 .locales/navbar.en_US.yml        |     4 +
 .locales/navbar.zh_CN.yml        |     4 +
 .locales/profile.en_GB.yml       |     2 +
 .locales/profile.en_US.yml       |     2 +
 .locales/profile.zh_CN.yml       |     2 +
 .locales/register.zh_CN.yml      |     3 +-
 .locales/settings.en_GB.yml      |     1 +
 .locales/settings.en_US.yml      |     1 +
 .locales/settings.zh_CN.yml      |    39 +-
 locales/admin/base/en-US.yml     |     6 +
 locales/admin/base/zh-CN.yml     |     6 +
 locales/admin/home/en-US.yml     |     1 +
 locales/admin/home/zh-CN.yml     |     1 +
 locales/global/zh-CN.yml         |     2 +-
 locales/login/zh-CN.yml          |     2 +-
 locales/navbar/en-GB.yml         |     4 +
 locales/navbar/en-US.yml         |     4 +
 locales/navbar/zh-CN.yml         |     4 +
 locales/profile/en-GB.yml        |     2 +
 locales/profile/en-US.yml        |     2 +
 locales/profile/zh-CN.yml        |     2 +
 locales/register/zh-CN.yml       |     3 +-
 locales/settings/en_GB.yml       |     1 +
 locales/settings/en_US.yml       |     1 +
 locales/settings/zh_CN.yml       |    39 +-
 main.py                          |    14 +-
 static/css/bulma.css             | 11829 +++++++++++++++++++++++++++++
 static/css/style.css             |    21 +
 templates/components/navbar.html |     8 +-
 templates/profile.html           |     8 +-
 templates/settings/sidebar.html  |     2 +-
 37 files changed, 11992 insertions(+), 59 deletions(-)
 create mode 100644 .locales/admin.en_US.yml
 create mode 100644 .locales/admin.zh_CN.yml
 create mode 100644 locales/admin/base/en-US.yml
 create mode 100644 locales/admin/base/zh-CN.yml
 create mode 100644 locales/admin/home/en-US.yml
 create mode 100644 locales/admin/home/zh-CN.yml
 create mode 100644 static/css/bulma.css

diff --git a/.gitignore b/.gitignore
index e457592f..ab0344fd 100644
--- a/.gitignore
+++ b/.gitignore
@@ -144,4 +144,5 @@ config.py
 !.data/banners/.gitkeep
 
 node_modules/
-package-lock.json
\ No newline at end of file
+package-lock.json
+.vscode/launch.json
diff --git a/.locales/admin.en_US.yml b/.locales/admin.en_US.yml
new file mode 100644
index 00000000..26354469
--- /dev/null
+++ b/.locales/admin.en_US.yml
@@ -0,0 +1,10 @@
+en_US:
+  base:
+    admin: Admin
+    dashboard: Dashboard
+    welcome-to-admin-panel: Welcome to %{appName} admin panel!
+    discord: Discord
+    admin-panel: '%{appName} Admin Panel'
+    instagram: Instagram
+  home:
+    that-s-a-lot-of-people: that's a lot of people!
diff --git a/.locales/admin.zh_CN.yml b/.locales/admin.zh_CN.yml
new file mode 100644
index 00000000..2d84d3d6
--- /dev/null
+++ b/.locales/admin.zh_CN.yml
@@ -0,0 +1,10 @@
+zh_CN:
+  base:
+    admin: Admin
+    dashboard: Dashboard
+    welcome-to-admin-panel: Welcome to %{appName} admin panel!
+    discord: Discord
+    admin-panel: '%{appName} Admin Panel'
+    instagram: Instagram
+  home:
+    that-s-a-lot-of-people: that's a lot of people!
diff --git a/.locales/global.zh_CN.yml b/.locales/global.zh_CN.yml
index 53befdae..eedc351f 100644
--- a/.locales/global.zh_CN.yml
+++ b/.locales/global.zh_CN.yml
@@ -3,7 +3,7 @@ zh_CN:
   log-in: 登录
   offline: 离线
   online: 在线
-  leaderboard: Leaderboard
+  leaderboard: 排行榜2
   login: Login
   profile: Profile
   register: Register
diff --git a/.locales/login.zh_CN.yml b/.locales/login.zh_CN.yml
index 7f3bdba9..fe9fa342 100644
--- a/.locales/login.zh_CN.yml
+++ b/.locales/login.zh_CN.yml
@@ -4,4 +4,4 @@ zh_CN:
   forgot-login: 忘记账号?
   username: 你的用户名
   password: 你的密码
-  email: Email
+  email: 电子邮箱
diff --git a/.locales/navbar.en_GB.yml b/.locales/navbar.en_GB.yml
index be57f008..6071c65e 100644
--- a/.locales/navbar.en_GB.yml
+++ b/.locales/navbar.en_GB.yml
@@ -3,3 +3,7 @@ en_GB:
   leaderboards: Leaderboards
   information: Information
   admin: Admin
+  profile: Profile
+  settings: Settings
+  logout: Logout
+  todo: Todo..
diff --git a/.locales/navbar.en_US.yml b/.locales/navbar.en_US.yml
index 4631210f..d2b503bd 100644
--- a/.locales/navbar.en_US.yml
+++ b/.locales/navbar.en_US.yml
@@ -3,3 +3,7 @@ en_US:
   leaderboards: Leaderboards
   information: Information
   admin: Admin
+  profile: Profile
+  settings: Settings
+  logout: Logout
+  todo: Todo..
diff --git a/.locales/navbar.zh_CN.yml b/.locales/navbar.zh_CN.yml
index 81fe7bdd..23a84b0d 100644
--- a/.locales/navbar.zh_CN.yml
+++ b/.locales/navbar.zh_CN.yml
@@ -3,3 +3,7 @@ zh_CN:
   leaderboards: 排行榜
   information: Information
   admin: Admin
+  profile: 玩家资料
+  settings: 设置
+  logout: 登出
+  todo: 敬请期待
diff --git a/.locales/profile.en_GB.yml b/.locales/profile.en_GB.yml
index 57f5a4fb..53ce3557 100644
--- a/.locales/profile.en_GB.yml
+++ b/.locales/profile.en_GB.yml
@@ -1,7 +1,9 @@
 en_GB:
+  best-scores: Best Scores
   no-scores-available: No scores available
   try-playing-something: Try playing something
   show-more: Show more
   most-played-beatmaps: Most Played Beatmaps
   no-beatmaps-available: No beatmaps available
   statistics: Statistics
+  recent-scores: Recent Scores
diff --git a/.locales/profile.en_US.yml b/.locales/profile.en_US.yml
index dd275207..9bc61132 100644
--- a/.locales/profile.en_US.yml
+++ b/.locales/profile.en_US.yml
@@ -1,7 +1,9 @@
 en_US:
+  best-scores: Best Scores
   no-scores-available: No scores available
   try-playing-something: Try playing something
   show-more: Show more
   most-played-beatmaps: Most Played Beatmaps
   no-beatmaps-available: No beatmaps available
   statistics: Statistics
+  recent-scores: Recent Scores
diff --git a/.locales/profile.zh_CN.yml b/.locales/profile.zh_CN.yml
index 085756e3..6bfcf4f0 100644
--- a/.locales/profile.zh_CN.yml
+++ b/.locales/profile.zh_CN.yml
@@ -1,7 +1,9 @@
 zh_CN:
+  best-scores: 最好成绩
   no-scores-available: 暂无有效成绩
   try-playing-something: 尝试去游玩一会吧！
   show-more: 展示更多
   most-played-beatmaps: 游玩最多的铺面
   no-beatmaps-available: 暂无有效铺面
   statistics: 数据统计
+  recent-scores: 最近的成绩
diff --git a/.locales/register.zh_CN.yml b/.locales/register.zh_CN.yml
index fce75283..bc49fd8a 100644
--- a/.locales/register.zh_CN.yml
+++ b/.locales/register.zh_CN.yml
@@ -4,4 +4,5 @@ zh_CN:
   email: 电子邮箱
   password: 密码
   already-have-an-account: 已经拥有账号了?
-  username: Username
+  username: |
+    你的用户名
diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
index fa7046e4..fb6d5870 100644
--- a/.locales/settings.en_GB.yml
+++ b/.locales/settings.en_GB.yml
@@ -19,3 +19,4 @@ en_GB:
   profile: Profile
   user-information: User Infomation
   username: Username
+  settings: Settings
diff --git a/.locales/settings.en_US.yml b/.locales/settings.en_US.yml
index 0a6d35dd..1eb9c5e4 100644
--- a/.locales/settings.en_US.yml
+++ b/.locales/settings.en_US.yml
@@ -19,3 +19,4 @@ en_US:
   profile: Profile
   user-information: User Infomation
   username: Username
+  settings: Settings
diff --git a/.locales/settings.zh_CN.yml b/.locales/settings.zh_CN.yml
index b856e629..87d35436 100644
--- a/.locales/settings.zh_CN.yml
+++ b/.locales/settings.zh_CN.yml
@@ -1,21 +1,20 @@
 zh_CN:
-  avatar: Avatar
-  avatar-description: >-
-    We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a
-    PNG, JPG under 5MB
-  choose-file: Choose file
-  save: Save
-  preview: Preview
-  customisation: Customisation
-  banner: Banner
-  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
-  profile-background: Profile Background
-  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password: Password
-  password-change: Password Change
-  old-password: Old Password
-  new-password: New Password
-  repeat-password: Repeat Password
-  profile: Profile
-  user-information: User Infomation
-  username: Username
+  avatar: 头像
+  avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片.并且图片大小低于5MB
+  choose-file: 选择一张图片
+  save: 保存
+  preview: 预览
+  customisation: 个性化
+  banner: 背景横幅
+  banner-description: 建议上传分辨率为 1440x262 的 GIF, PNG, JPG, JPEG 等四种格式的图片
+  profile-background: 资料背景
+  profile-background-description: 建议上传长宽比为 16:9  的 PNG, JPG, JPEG 格式的图片
+  password: 密码
+  password-change: 更改密码
+  old-password: 旧密码
+  new-password: 新密码
+  repeat-password: 确认新密码
+  profile: 玩家资料
+  user-information: 用户信息
+  username: 你的用户名
+  settings: 设置
diff --git a/locales/admin/base/en-US.yml b/locales/admin/base/en-US.yml
new file mode 100644
index 00000000..f473d69e
--- /dev/null
+++ b/locales/admin/base/en-US.yml
@@ -0,0 +1,6 @@
+admin: Admin
+dashboard: Dashboard
+welcome-to-admin-panel: Welcome to %{appName} admin panel!
+discord: Discord
+admin-panel: '%{appName} Admin Panel'
+instagram: Instagram
diff --git a/locales/admin/base/zh-CN.yml b/locales/admin/base/zh-CN.yml
new file mode 100644
index 00000000..f473d69e
--- /dev/null
+++ b/locales/admin/base/zh-CN.yml
@@ -0,0 +1,6 @@
+admin: Admin
+dashboard: Dashboard
+welcome-to-admin-panel: Welcome to %{appName} admin panel!
+discord: Discord
+admin-panel: '%{appName} Admin Panel'
+instagram: Instagram
diff --git a/locales/admin/home/en-US.yml b/locales/admin/home/en-US.yml
new file mode 100644
index 00000000..dab3e7a9
--- /dev/null
+++ b/locales/admin/home/en-US.yml
@@ -0,0 +1 @@
+that-s-a-lot-of-people: that's a lot of people!
diff --git a/locales/admin/home/zh-CN.yml b/locales/admin/home/zh-CN.yml
new file mode 100644
index 00000000..dab3e7a9
--- /dev/null
+++ b/locales/admin/home/zh-CN.yml
@@ -0,0 +1 @@
+that-s-a-lot-of-people: that's a lot of people!
diff --git a/locales/global/zh-CN.yml b/locales/global/zh-CN.yml
index 5d8482c0..d0b695d9 100644
--- a/locales/global/zh-CN.yml
+++ b/locales/global/zh-CN.yml
@@ -2,7 +2,7 @@ sign-up: 注册
 log-in: 登录
 offline: 离线
 online: 在线
-leaderboard: Leaderboard
+leaderboard: 排行榜2
 login: Login
 profile: Profile
 register: Register
diff --git a/locales/login/zh-CN.yml b/locales/login/zh-CN.yml
index f2dfd434..ef59445c 100644
--- a/locales/login/zh-CN.yml
+++ b/locales/login/zh-CN.yml
@@ -3,4 +3,4 @@ register: 注册
 forgot-login: 忘记账号?
 username: 你的用户名
 password: 你的密码
-email: Email
+email: 电子邮箱
diff --git a/locales/navbar/en-GB.yml b/locales/navbar/en-GB.yml
index d8be2d51..14567547 100644
--- a/locales/navbar/en-GB.yml
+++ b/locales/navbar/en-GB.yml
@@ -2,3 +2,7 @@ home: Home
 leaderboards: Leaderboards
 information: Information
 admin: Admin
+profile: Profile
+settings: Settings
+logout: Logout
+todo: Todo..
diff --git a/locales/navbar/en-US.yml b/locales/navbar/en-US.yml
index d8be2d51..14567547 100644
--- a/locales/navbar/en-US.yml
+++ b/locales/navbar/en-US.yml
@@ -2,3 +2,7 @@ home: Home
 leaderboards: Leaderboards
 information: Information
 admin: Admin
+profile: Profile
+settings: Settings
+logout: Logout
+todo: Todo..
diff --git a/locales/navbar/zh-CN.yml b/locales/navbar/zh-CN.yml
index 5786b730..6107aac8 100644
--- a/locales/navbar/zh-CN.yml
+++ b/locales/navbar/zh-CN.yml
@@ -2,3 +2,7 @@ home: 主页
 leaderboards: 排行榜
 information: Information
 admin: Admin
+profile: 玩家资料
+settings: 设置
+logout: 登出
+todo: 敬请期待
diff --git a/locales/profile/en-GB.yml b/locales/profile/en-GB.yml
index e808fa1d..ea0c45a8 100644
--- a/locales/profile/en-GB.yml
+++ b/locales/profile/en-GB.yml
@@ -1,6 +1,8 @@
+best-scores: Best Scores
 no-scores-available: No scores available
 try-playing-something: Try playing something
 show-more: Show more
 most-played-beatmaps: Most Played Beatmaps
 no-beatmaps-available: No beatmaps available
 statistics: Statistics
+recent-scores: Recent Scores
diff --git a/locales/profile/en-US.yml b/locales/profile/en-US.yml
index e808fa1d..ea0c45a8 100644
--- a/locales/profile/en-US.yml
+++ b/locales/profile/en-US.yml
@@ -1,6 +1,8 @@
+best-scores: Best Scores
 no-scores-available: No scores available
 try-playing-something: Try playing something
 show-more: Show more
 most-played-beatmaps: Most Played Beatmaps
 no-beatmaps-available: No beatmaps available
 statistics: Statistics
+recent-scores: Recent Scores
diff --git a/locales/profile/zh-CN.yml b/locales/profile/zh-CN.yml
index 9462f102..ccbe0a58 100644
--- a/locales/profile/zh-CN.yml
+++ b/locales/profile/zh-CN.yml
@@ -1,6 +1,8 @@
+best-scores: 最好成绩
 no-scores-available: 暂无有效成绩
 try-playing-something: 尝试去游玩一会吧！
 show-more: 展示更多
 most-played-beatmaps: 游玩最多的铺面
 no-beatmaps-available: 暂无有效铺面
 statistics: 数据统计
+recent-scores: 最近的成绩
diff --git a/locales/register/zh-CN.yml b/locales/register/zh-CN.yml
index 647aa7a9..724cda1b 100644
--- a/locales/register/zh-CN.yml
+++ b/locales/register/zh-CN.yml
@@ -3,4 +3,5 @@ register: 注册账号
 email: 电子邮箱
 password: 密码
 already-have-an-account: 已经拥有账号了?
-username: Username
+username: |
+  你的用户名
diff --git a/locales/settings/en_GB.yml b/locales/settings/en_GB.yml
index 4e44f0f4..0efdd461 100644
--- a/locales/settings/en_GB.yml
+++ b/locales/settings/en_GB.yml
@@ -18,3 +18,4 @@ repeat-password: Repeat Password
 profile: Profile
 user-information: User Infomation
 username: Username
+settings: Settings
diff --git a/locales/settings/en_US.yml b/locales/settings/en_US.yml
index 4e44f0f4..0efdd461 100644
--- a/locales/settings/en_US.yml
+++ b/locales/settings/en_US.yml
@@ -18,3 +18,4 @@ repeat-password: Repeat Password
 profile: Profile
 user-information: User Infomation
 username: Username
+settings: Settings
diff --git a/locales/settings/zh_CN.yml b/locales/settings/zh_CN.yml
index 4e44f0f4..396069b0 100644
--- a/locales/settings/zh_CN.yml
+++ b/locales/settings/zh_CN.yml
@@ -1,20 +1,19 @@
-avatar: Avatar
-avatar-description: >-
-  We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG,
-  JPG under 5MB
-choose-file: Choose file
-save: Save
-preview: Preview
-customisation: Customisation
-banner: Banner
-banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
-profile-background: Profile Background
-profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-password: Password
-password-change: Password Change
-old-password: Old Password
-new-password: New Password
-repeat-password: Repeat Password
-profile: Profile
-user-information: User Infomation
-username: Username
+avatar: 头像
+avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片.并且图片大小低于5MB
+choose-file: 选择一张图片
+save: 保存
+preview: 预览
+customisation: 个性化
+banner: 背景横幅
+banner-description: 建议上传分辨率为 1440x262 的 GIF, PNG, JPG, JPEG 等四种格式的图片
+profile-background: 资料背景
+profile-background-description: 建议上传长宽比为 16:9  的 PNG, JPG, JPEG 格式的图片
+password: 密码
+password-change: 更改密码
+old-password: 旧密码
+new-password: 新密码
+repeat-password: 确认新密码
+profile: 玩家资料
+user-information: 用户信息
+username: 你的用户名
+settings: 设置
diff --git a/main.py b/main.py
index 7f996ac5..e0a5aa73 100755
--- a/main.py
+++ b/main.py
@@ -4,6 +4,7 @@
 __all__ = ()
 
 import os
+import random
 
 import aiohttp
 import i18n
@@ -33,6 +34,10 @@ async def mysql_conn() -> None:
     await glob.db.connect(glob.config.mysql) # type: ignore
     log('Connected to MySQL!', Ansi.LGREEN)
 
+@app.before_serving
+async def load_lang():
+    i18n.load_path.append(os.getcwd() + '/.locales')
+
 @app.before_serving
 async def http_conn() -> None:
     glob.http = aiohttp.ClientSession(json_serialize=lambda x: orjson.dumps(x).decode())
@@ -50,7 +55,7 @@ def appVersion() -> str:
 
 @app.template_global()
 def t(key, **kwargs) -> str:
-    kwargs['locale'] = session.get('lang', 'en_GB')
+    kwargs['locale'] = session.get('lang', 'zh_CN')
     try:
         return i18n.t(key, **kwargs)
     except:
@@ -60,6 +65,10 @@ def t(key, **kwargs) -> str:
 def appName() -> str:
     return glob.config.app_name
 
+@app.template_global()
+def rand() -> str:
+    return str(random.randint(0,100000))
+
 @app.template_global()
 def captchaKey() -> str:
     return glob.config.hCaptcha_sitekey
@@ -81,5 +90,4 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    i18n.load_path.append(os.getcwd() + '/.locales')
-    app.run(port=8000, debug=glob.config.debug)  # blocking call
+    app.run(port=10000, debug=glob.config.debug)  # blocking call
\ No newline at end of file
diff --git a/static/css/bulma.css b/static/css/bulma.css
new file mode 100644
index 00000000..a9a7be14
--- /dev/null
+++ b/static/css/bulma.css
@@ -0,0 +1,11829 @@
+@font-face {
+    font-family: Rubik;
+    src: url(https://fastly.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/Rubik.woff2) format("woff2 supports variations"), url(https://fastly.jsdelivr.net/gh/HakuraSukinoe/bulma-hsl/Rubik.woff2) format("woff2-variations");
+    font-weight: 100 1000;
+    font-stretch: 25% 151%
+}
+
+html {
+    --main: 215;
+    --blue: #007bff;
+    --indigo: #6610f2;
+    --purple: #6f42c1;
+    --pink: #e83e8c;
+    --red: #dc3545;
+    --orange: #fd7e14;
+    --yellow: #ffc107;
+    --green: #28a745;
+    --teal: #20c997;
+    --cyan: #17a2b8;
+    --white: #fff;
+    --gray: #6c757d;
+    --gray-dark: #343a40;
+    --primary: #007bff;
+    --secondary: #6c757d;
+    --success: #28a745;
+    --info: #17a2b8;
+    --warning: #ffc107;
+    --danger: #dc3545;
+    --light: #f8f9fa;
+    --dark: #343a40
+}
+
+@-webkit-keyframes spinAround {
+    0% {
+        transform: rotate(0)
+    }
+
+    to {
+        transform: rotate(359deg)
+    }
+}
+
+@keyframes spinAround {
+    0% {
+        transform: rotate(0)
+    }
+
+    to {
+        transform: rotate(359deg)
+    }
+}
+
+.breadcrumb,
+.button,
+.delete,
+.file,
+.is-unselectable,
+.modal-close,
+.pagination-ellipsis,
+.pagination-link,
+.pagination-next,
+.pagination-previous,
+.tabs {
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none
+}
+
+.navbar-link:not(.is-arrowless)::after,
+.select:not(.is-multiple):not(.is-loading)::after {
+    border: 3px solid transparent;
+    border-radius: 2px;
+    border-right: 0;
+    border-top: 0;
+    content: " ";
+    display: block;
+    height: .625em;
+    margin-top: -.4375em;
+    pointer-events: none;
+    position: absolute;
+    top: 50%;
+    transform: rotate(-45deg);
+    transform-origin: center;
+    width: .625em
+}
+
+.block:not(:last-child),
+.box:not(:last-child),
+.breadcrumb:not(:last-child),
+.content:not(:last-child),
+.highlight:not(:last-child),
+.level:not(:last-child),
+.list:not(:last-child),
+.message:not(:last-child),
+.notification:not(:last-child),
+.pagination:not(:last-child),
+.progress:not(:last-child),
+.subtitle:not(:last-child),
+.table-container:not(:last-child),
+.table:not(:last-child),
+.tabs:not(:last-child),
+.title:not(:last-child) {
+    margin-bottom: 1.5rem
+}
+
+.delete,
+.modal-close {
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    background-color: rgba(10, 10, 10, .2);
+    border: 0;
+    border-radius: 290486px;
+    cursor: pointer;
+    pointer-events: auto;
+    display: inline-block;
+    flex-grow: 0;
+    flex-shrink: 0;
+    font-size: 0;
+    height: 20px;
+    max-height: 20px;
+    max-width: 20px;
+    min-height: 20px;
+    min-width: 20px;
+    outline: 0;
+    position: relative;
+    vertical-align: top;
+    width: 20px
+}
+
+.delete::after,
+.delete::before,
+.modal-close::after,
+.modal-close::before {
+    background-color: #fff;
+    content: "";
+    display: block;
+    left: 50%;
+    position: absolute;
+    top: 50%;
+    transform: translateX(-50%) translateY(-50%) rotate(45deg);
+    transform-origin: center center
+}
+
+.delete::before,
+.modal-close::before {
+    height: 2px;
+    width: 50%
+}
+
+.delete::after,
+.modal-close::after {
+    height: 50%;
+    width: 2px
+}
+
+.delete:focus,
+.delete:hover,
+.modal-close:focus,
+.modal-close:hover {
+    background-color: rgba(10, 10, 10, .3)
+}
+
+.delete:active,
+.modal-close:active {
+    background-color: rgba(10, 10, 10, .4)
+}
+
+.is-small.delete,
+.is-small.modal-close {
+    height: 16px;
+    max-height: 16px;
+    max-width: 16px;
+    min-height: 16px;
+    min-width: 16px;
+    width: 16px
+}
+
+.is-medium.delete,
+.is-medium.modal-close {
+    height: 24px;
+    max-height: 24px;
+    max-width: 24px;
+    min-height: 24px;
+    min-width: 24px;
+    width: 24px
+}
+
+.is-large.delete,
+.is-large.modal-close {
+    height: 32px;
+    max-height: 32px;
+    max-width: 32px;
+    min-height: 32px;
+    min-width: 32px;
+    width: 32px
+}
+
+.button.is-loading::after,
+.control.is-loading::after,
+.loader,
+.select.is-loading::after {
+    -webkit-animation: spinAround .5s infinite linear;
+    animation: spinAround .5s infinite linear;
+    border: 2px solid #dbdee0;
+    border-radius: 290486px;
+    border-right-color: transparent;
+    border-top-color: transparent;
+    content: "";
+    display: block;
+    height: 1em;
+    position: relative;
+    width: 1em
+}
+
+.hero-video,
+.image.is-16by9 .has-ratio,
+.image.is-16by9 img,
+.image.is-1by1 .has-ratio,
+.image.is-1by1 img,
+.image.is-1by2 .has-ratio,
+.image.is-1by2 img,
+.image.is-1by3 .has-ratio,
+.image.is-1by3 img,
+.image.is-2by1 .has-ratio,
+.image.is-2by1 img,
+.image.is-2by3 .has-ratio,
+.image.is-2by3 img,
+.image.is-3by1 .has-ratio,
+.image.is-3by1 img,
+.image.is-3by2 .has-ratio,
+.image.is-3by2 img,
+.image.is-3by4 .has-ratio,
+.image.is-3by4 img,
+.image.is-3by5 .has-ratio,
+.image.is-3by5 img,
+.image.is-4by3 .has-ratio,
+.image.is-4by3 img,
+.image.is-4by5 .has-ratio,
+.image.is-4by5 img,
+.image.is-5by3 .has-ratio,
+.image.is-5by3 img,
+.image.is-5by4 .has-ratio,
+.image.is-5by4 img,
+.image.is-9by16 .has-ratio,
+.image.is-9by16 img,
+.image.is-square .has-ratio,
+.image.is-square img,
+.is-overlay,
+.modal,
+.modal-background {
+    bottom: 0;
+    left: 0;
+    position: absolute;
+    right: 0;
+    top: 0
+}
+
+.button,
+.file-cta,
+.file-name,
+.input,
+.pagination-ellipsis,
+.pagination-link,
+.pagination-next,
+.pagination-previous,
+.select select,
+.textarea {
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    align-items: center;
+    border: 1px solid transparent;
+    border-radius: .4em;
+    box-shadow: none;
+    display: inline-flex;
+    font-size: 15px;
+    height: 2.5em;
+    justify-content: flex-start;
+    line-height: 1.5;
+    padding: calc(.5em - 1px) calc(.75em - 1px);
+    position: relative;
+    vertical-align: top
+}
+
+.button:active,
+.button:focus,
+.file-cta:active,
+.file-cta:focus,
+.file-name:active,
+.file-name:focus,
+.input:active,
+.input:focus,
+.is-active.button,
+.is-active.file-cta,
+.is-active.file-name,
+.is-active.input,
+.is-active.pagination-ellipsis,
+.is-active.pagination-link,
+.is-active.pagination-next,
+.is-active.pagination-previous,
+.is-active.textarea,
+.is-focused.button,
+.is-focused.file-cta,
+.is-focused.file-name,
+.is-focused.input,
+.is-focused.pagination-ellipsis,
+.is-focused.pagination-link,
+.is-focused.pagination-next,
+.is-focused.pagination-previous,
+.is-focused.textarea,
+.pagination-ellipsis:active,
+.pagination-ellipsis:focus,
+.pagination-link:active,
+.pagination-link:focus,
+.pagination-next:active,
+.pagination-next:focus,
+.pagination-previous:active,
+.pagination-previous:focus,
+.select select.is-active,
+.select select.is-focused,
+.select select:active,
+.select select:focus,
+.textarea:active,
+.textarea:focus {
+    outline: 0
+}
+
+.button[disabled],
+.file-cta[disabled],
+.file-name[disabled],
+.input[disabled],
+.pagination-ellipsis[disabled],
+.pagination-link[disabled],
+.pagination-next[disabled],
+.pagination-previous[disabled],
+.select fieldset[disabled] select,
+.select select[disabled],
+.textarea[disabled],
+fieldset[disabled] .button,
+fieldset[disabled] .file-cta,
+fieldset[disabled] .file-name,
+fieldset[disabled] .input,
+fieldset[disabled] .pagination-ellipsis,
+fieldset[disabled] .pagination-link,
+fieldset[disabled] .pagination-next,
+fieldset[disabled] .pagination-previous,
+fieldset[disabled] .select select,
+fieldset[disabled] .textarea {
+    cursor: not-allowed
+}
+
+@-webkit-keyframes moveIndeterminate {
+    0% {
+        background-position: 200% 0
+    }
+
+    to {
+        background-position: -200% 0
+    }
+}
+
+@keyframes moveIndeterminate {
+    0% {
+        background-position: 200% 0
+    }
+
+    to {
+        background-position: -200% 0
+    }
+}
+
+blockquote,
+body,
+dd,
+dl,
+dt,
+fieldset,
+figure,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+html,
+iframe,
+legend,
+li,
+ol,
+p,
+pre,
+ul {
+    margin: 0;
+    padding: 0
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-size: 100%;
+    font-weight: 400
+}
+
+ul {
+    list-style: none
+}
+
+button,
+input,
+select,
+textarea {
+    margin: 0
+}
+
+html {
+    box-sizing: border-box;
+    background-color: hsl(var(--main), 10%, 10%);
+    font-size: 15px;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    min-width: 300px;
+    overflow-x: hidden;
+    overflow-y: scroll;
+    text-rendering: optimizeLegibility;
+    -webkit-text-size-adjust: 100%;
+    -moz-text-size-adjust: 100%;
+    -ms-text-size-adjust: 100%;
+    text-size-adjust: 100%
+}
+
+*,
+::after,
+::before {
+    box-sizing: inherit
+}
+
+img,
+video {
+    height: auto;
+    max-width: 100%
+}
+
+fieldset,
+iframe {
+    border: 0
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0
+}
+
+td,
+textarea,
+th {
+    padding: 0
+}
+
+.content table th:not([align]),
+table td:not([align]),
+table th:not([align]),
+td:not([align]),
+th:not([align]) {
+    text-align: left
+}
+
+article,
+aside,
+figure,
+footer,
+header,
+hgroup,
+section {
+    display: block
+}
+
+body,
+button,
+input,
+select,
+textarea {
+    font-family: Rubik, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif
+}
+
+code,
+pre {
+    -moz-osx-font-smoothing: auto;
+    -webkit-font-smoothing: auto;
+    font-family: Inconsolata, Consolas, Monaco, monospace
+}
+
+body,
+code {
+    font-weight: 400
+}
+
+body {
+    font-size: 1em;
+    line-height: 1.5;
+    color: #fff
+}
+
+a {
+    color: hsl(var(--main), 65%, 70%);
+    cursor: pointer;
+    text-decoration: none;
+    transition: all .2s ease
+}
+
+a strong,
+pre code {
+    color: currentColor
+}
+
+a:hover {
+    color: hsl(var(--main), 90%, 90%)
+}
+
+code {
+    color: #e74c3c;
+    padding: .25em .5em
+}
+
+code,
+hr,
+pre {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+hr {
+    border: 0;
+    display: block;
+    margin: 1.5rem 0;
+    height: 2px
+}
+
+input[type=checkbox],
+input[type=radio] {
+    vertical-align: baseline
+}
+
+code,
+pre,
+small {
+    font-size: .875em
+}
+
+span {
+    font-style: inherit;
+    font-weight: inherit
+}
+
+strong {
+    font-weight: 700
+}
+
+pre {
+    -webkit-overflow-scrolling: touch;
+    color: #fff;
+    overflow-x: auto;
+    padding: 1.25rem 1.5rem;
+    white-space: pre;
+    word-wrap: normal
+}
+
+pre code {
+    background-color: transparent;
+    font-size: 1em;
+    padding: 0
+}
+
+table td,
+table th {
+    vertical-align: top
+}
+
+strong,
+table th {
+    color: #f2f2f2
+}
+
+.is-clearfix::after {
+    clear: both;
+    content: " ";
+    display: table
+}
+
+.is-pulled-left {
+    float: left !important
+}
+
+.is-pulled-right {
+    float: right !important
+}
+
+.is-clipped {
+    overflow: hidden !important
+}
+
+.is-size-1 {
+    font-size: 3rem !important
+}
+
+.is-size-2 {
+    font-size: 2.5rem !important
+}
+
+.is-size-3 {
+    font-size: 2rem !important
+}
+
+.is-size-4 {
+    font-size: 1.5rem !important
+}
+
+.is-size-5 {
+    font-size: 1.25rem !important
+}
+
+.is-size-6 {
+    font-size: 15px !important
+}
+
+.is-size-7 {
+    font-size: .85em !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-size-1-mobile {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-mobile {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-mobile {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-mobile {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-mobile {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-mobile {
+        font-size: 15px !important
+    }
+
+    .is-size-7-mobile {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-size-1-tablet {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-tablet {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-tablet {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-tablet {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-tablet {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-tablet {
+        font-size: 15px !important
+    }
+
+    .is-size-7-tablet {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-size-1-touch {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-touch {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-touch {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-touch {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-touch {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-touch {
+        font-size: 15px !important
+    }
+
+    .is-size-7-touch {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-size-1-desktop {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-desktop {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-desktop {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-desktop {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-desktop {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-desktop {
+        font-size: 15px !important
+    }
+
+    .is-size-7-desktop {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-size-1-widescreen {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-widescreen {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-widescreen {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-widescreen {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-widescreen {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-widescreen {
+        font-size: 15px !important
+    }
+
+    .is-size-7-widescreen {
+        font-size: .85em !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-size-1-fullhd {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-fullhd {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-fullhd {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-fullhd {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-fullhd {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-fullhd {
+        font-size: 15px !important
+    }
+
+    .is-size-7-fullhd {
+        font-size: .85em !important
+    }
+}
+
+.has-text-centered {
+    text-align: center !important
+}
+
+.has-text-justified {
+    text-align: justify !important
+}
+
+.has-text-left {
+    text-align: left !important
+}
+
+.has-text-right {
+    text-align: right !important
+}
+
+@media screen and (max-width: 768px) {
+    .has-text-centered-mobile {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .has-text-centered-tablet {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .has-text-centered-tablet-only {
+        text-align: center !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .has-text-centered-touch {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .has-text-centered-desktop {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .has-text-centered-desktop-only {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .has-text-centered-widescreen {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .has-text-centered-widescreen-only {
+        text-align: center !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .has-text-centered-fullhd {
+        text-align: center !important
+    }
+}
+
+@media screen and (max-width: 768px) {
+    .has-text-justified-mobile {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .has-text-justified-tablet {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .has-text-justified-tablet-only {
+        text-align: justify !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .has-text-justified-touch {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .has-text-justified-desktop {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .has-text-justified-desktop-only {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .has-text-justified-widescreen {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .has-text-justified-widescreen-only {
+        text-align: justify !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .has-text-justified-fullhd {
+        text-align: justify !important
+    }
+}
+
+@media screen and (max-width: 768px) {
+    .has-text-left-mobile {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .has-text-left-tablet {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .has-text-left-tablet-only {
+        text-align: left !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .has-text-left-touch {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .has-text-left-desktop {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .has-text-left-desktop-only {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .has-text-left-widescreen {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .has-text-left-widescreen-only {
+        text-align: left !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .has-text-left-fullhd {
+        text-align: left !important
+    }
+}
+
+@media screen and (max-width: 768px) {
+    .has-text-right-mobile {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .has-text-right-tablet {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .has-text-right-tablet-only {
+        text-align: right !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .has-text-right-touch {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .has-text-right-desktop {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .has-text-right-desktop-only {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .has-text-right-widescreen {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .has-text-right-widescreen-only {
+        text-align: right !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .has-text-right-fullhd {
+        text-align: right !important
+    }
+}
+
+.is-capitalized {
+    text-transform: capitalize !important
+}
+
+.is-lowercase {
+    text-transform: lowercase !important
+}
+
+.is-uppercase {
+    text-transform: uppercase !important
+}
+
+.is-italic {
+    font-style: italic !important
+}
+
+.has-text-white {
+    color: #fff !important
+}
+
+a.has-text-white:focus,
+a.has-text-white:hover {
+    color: #e6e6e6 !important
+}
+
+.has-background-white {
+    background-color: #fff !important
+}
+
+.has-text-black {
+    color: #0a0a0a !important
+}
+
+a.has-text-black:focus,
+a.has-text-black:hover {
+    color: #000 !important
+}
+
+.has-background-black {
+    background-color: #0a0a0a !important
+}
+
+.has-text-light {
+    color: #ecf0f1 !important
+}
+
+a.has-text-light:focus,
+a.has-text-light:hover {
+    color: #cfd9db !important
+}
+
+.has-background-light {
+    background-color: #ecf0f1 !important
+}
+
+.has-text-dark {
+    color: hsl(var(--main), 10%, 15%) !important
+}
+
+a.has-text-dark:focus,
+a.has-text-dark:hover {
+    color: #111414 !important
+}
+
+.has-background-dark {
+    background-color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-text-primary {
+    color: hsl(var(--main), 45%, 45%) !important
+}
+
+a.has-text-primary:focus,
+a.has-text-primary:hover {
+    color: hsl(var(--main), 45%, 35%) !important
+}
+
+.has-background-primary {
+    background-color: hsl(var(--main), 45%, 45%) !important
+}
+
+.has-text-link {
+    color: hsl(var(--main), 45%, 45%) !important
+}
+
+a.has-text-link:focus,
+a.has-text-link:hover {
+    color: #148f77 !important
+}
+
+.has-background-link {
+    background-color: hsl(var(--main), 45%, 45%) !important
+}
+
+.has-text-info {
+    color: #3298dc !important
+}
+
+a.has-text-info:focus,
+a.has-text-info:hover {
+    color: #207dbc !important
+}
+
+.has-background-info {
+    background-color: #3298dc !important
+}
+
+.has-text-success {
+    color: #2ecc71 !important
+}
+
+a.has-text-success:focus,
+a.has-text-success:hover {
+    color: #25a25a !important
+}
+
+.has-background-success {
+    background-color: #2ecc71 !important
+}
+
+.has-text-warning {
+    color: #f1b70e !important
+}
+
+a.has-text-warning:focus,
+a.has-text-warning:hover {
+    color: #c1920b !important
+}
+
+.has-background-warning {
+    background-color: #f1b70e !important
+}
+
+.has-text-danger {
+    color: #e74c3c !important
+}
+
+a.has-text-danger:focus,
+a.has-text-danger:hover {
+    color: #d62c1a !important
+}
+
+.has-background-danger {
+    background-color: #e74c3c !important
+}
+
+.has-text-black-bis {
+    color: #121212 !important
+}
+
+.has-background-black-bis {
+    background-color: #121212 !important
+}
+
+.has-text-black-ter {
+    color: #242424 !important
+}
+
+.has-background-black-ter {
+    background-color: #242424 !important
+}
+
+.has-text-grey-darker {
+    color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-background-grey-darker {
+    background-color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-text-grey-dark {
+    color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-background-grey-dark {
+    background-color: hsl(var(--main), 10%, 15%) !important
+}
+
+.has-text-grey {
+    color: #5e6d6f !important
+}
+
+.has-background-grey {
+    background-color: #5e6d6f !important
+}
+
+.has-text-grey-light {
+    color: #8c9b9d !important
+}
+
+.has-background-grey-light {
+    background-color: #8c9b9d !important
+}
+
+.has-text-grey-lighter {
+    color: #dbdee0 !important
+}
+
+.has-background-grey-lighter {
+    background-color: #dbdee0 !important
+}
+
+.has-text-white-ter {
+    color: #ecf0f1 !important
+}
+
+.has-background-white-ter {
+    background-color: #ecf0f1 !important
+}
+
+.has-text-white-bis {
+    color: #fafafa !important
+}
+
+.has-background-white-bis {
+    background-color: #fafafa !important
+}
+
+.has-text-weight-light {
+    font-weight: 300 !important
+}
+
+.has-text-weight-normal {
+    font-weight: 400 !important
+}
+
+.has-text-weight-medium {
+    font-weight: 500 !important
+}
+
+.has-text-weight-semibold {
+    font-weight: 600 !important
+}
+
+.has-text-weight-bold {
+    font-weight: 700 !important
+}
+
+.is-family-primary,
+.is-family-sans-serif,
+.is-family-secondary {
+    font-family: Rubik, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif !important
+}
+
+.is-family-code,
+.is-family-monospace {
+    font-family: Inconsolata, Consolas, Monaco, monospace !important
+}
+
+.is-block {
+    display: block !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-block-mobile {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-block-tablet {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-block-tablet-only {
+        display: block !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-block-touch {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-block-desktop {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-block-desktop-only {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-block-widescreen {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-block-widescreen-only {
+        display: block !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-block-fullhd {
+        display: block !important
+    }
+}
+
+.is-flex {
+    display: flex !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-flex-mobile {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-flex-tablet {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-flex-tablet-only {
+        display: flex !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-flex-touch {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-flex-desktop {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-flex-desktop-only {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-flex-widescreen {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-flex-widescreen-only {
+        display: flex !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-flex-fullhd {
+        display: flex !important
+    }
+}
+
+.is-inline {
+    display: inline !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-inline-mobile {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-inline-tablet {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-inline-tablet-only {
+        display: inline !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-inline-touch {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-inline-desktop {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-inline-desktop-only {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-inline-widescreen {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-inline-widescreen-only {
+        display: inline !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-inline-fullhd {
+        display: inline !important
+    }
+}
+
+.is-inline-block {
+    display: inline-block !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-inline-block-mobile {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-inline-block-tablet {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-inline-block-tablet-only {
+        display: inline-block !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-inline-block-touch {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-inline-block-desktop {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-inline-block-desktop-only {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-inline-block-widescreen {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-inline-block-widescreen-only {
+        display: inline-block !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-inline-block-fullhd {
+        display: inline-block !important
+    }
+}
+
+.is-inline-flex {
+    display: inline-flex !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-inline-flex-mobile {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-inline-flex-tablet {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-inline-flex-tablet-only {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-inline-flex-touch {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-inline-flex-desktop {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-inline-flex-desktop-only {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-inline-flex-widescreen {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-inline-flex-widescreen-only {
+        display: inline-flex !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-inline-flex-fullhd {
+        display: inline-flex !important
+    }
+}
+
+.is-hidden {
+    display: none !important
+}
+
+.is-sr-only {
+    border: 0 !important;
+    clip: rect(0, 0, 0, 0) !important;
+    height: .01em !important;
+    overflow: hidden !important;
+    padding: 0 !important;
+    position: absolute !important;
+    white-space: nowrap !important;
+    width: .01em !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-hidden-mobile {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-hidden-tablet {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-hidden-tablet-only {
+        display: none !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-hidden-touch {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-hidden-desktop {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-hidden-desktop-only {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-hidden-widescreen {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-hidden-widescreen-only {
+        display: none !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-hidden-fullhd {
+        display: none !important
+    }
+}
+
+.is-invisible {
+    visibility: hidden !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-invisible-mobile {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-invisible-tablet {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .is-invisible-tablet-only {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-invisible-touch {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-invisible-desktop {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .is-invisible-desktop-only {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-invisible-widescreen {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .is-invisible-widescreen-only {
+        visibility: hidden !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-invisible-fullhd {
+        visibility: hidden !important
+    }
+}
+
+.is-marginless {
+    margin: 0 !important
+}
+
+.is-paddingless {
+    padding: 0 !important
+}
+
+.is-radiusless {
+    border-radius: 0 !important
+}
+
+.is-shadowless {
+    box-shadow: none !important
+}
+
+.is-relative {
+    position: relative !important
+}
+
+.box {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: 8px;
+    box-shadow: none;
+    color: #fff;
+    display: block;
+    padding: 1.25rem
+}
+
+a.box:focus,
+a.box:hover {
+    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px hsl(var(--main), 45%, 45%)
+}
+
+a.box:active {
+    box-shadow: inset 0 1px 2px rgba(10, 10, 10, .2), 0 0 0 1px hsl(var(--main), 45%, 45%)
+}
+
+.button {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: #4c5759;
+    cursor: pointer;
+    justify-content: center;
+    padding-bottom: calc(.5em - 1px);
+    padding-left: 1em;
+    padding-right: 1em;
+    padding-top: calc(.5em - 1px);
+    text-align: center;
+    white-space: nowrap
+}
+
+.button strong {
+    color: inherit
+}
+
+.button .icon,
+.button .icon.is-large,
+.button .icon.is-medium,
+.button .icon.is-small {
+    height: 1.5em;
+    width: 1.5em
+}
+
+.button .icon:first-child:not(:last-child) {
+    margin-left: calc(-.5em - 1px);
+    margin-right: .25em
+}
+
+.button .icon:last-child:not(:first-child) {
+    margin-left: .25em;
+    margin-right: calc(-.5em - 1px)
+}
+
+.button .icon:first-child:last-child {
+    margin-left: calc(-.5em - 1px);
+    margin-right: calc(-.5em - 1px)
+}
+
+.button.is-hovered,
+.button:hover {
+    border-color: #8c9b9d;
+    color: #f2f2f2
+}
+
+.button.is-focused,
+.button:focus {
+    border-color: #8c9b9d;
+    color: hsl(var(--main), 75%, 80%)
+}
+
+.button.is-focused:not(:active),
+.button:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(26, 188, 156, .25)
+}
+
+.button.is-active,
+.button:active {
+    border-color: hsl(var(--main), 10%, 15%);
+    color: #f2f2f2
+}
+
+.button.is-text {
+    background-color: transparent;
+    border-color: transparent;
+    color: #fff;
+    text-decoration: underline
+}
+
+.button.is-text.is-focused,
+.button.is-text.is-hovered,
+.button.is-text:focus,
+.button.is-text:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #f2f2f2
+}
+
+.button.is-text.is-active,
+.button.is-text:active {
+    background-color: #1d2122;
+    color: #f2f2f2
+}
+
+.button.is-text[disabled],
+fieldset[disabled] .button.is-text {
+    background-color: transparent;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-white {
+    background-color: #fff
+}
+
+.button.is-white,
+.button.is-white.is-hovered,
+.button.is-white:hover {
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.button.is-white.is-focused,
+.button.is-white:focus {
+    color: #0a0a0a
+}
+
+.button.is-white.is-focused:not(:active),
+.button.is-white:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(255, 255, 255, .25)
+}
+
+.button.is-white.is-active,
+.button.is-white:active {
+    background-color: #f2f2f2;
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.button.is-white[disabled],
+fieldset[disabled] .button.is-white {
+    background-color: #fff;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-white.is-loading::after {
+    border-color: transparent transparent #0a0a0a #0a0a0a !important
+}
+
+.button.is-white.is-outlined {
+    background-color: transparent;
+    border-color: #fff;
+    color: #fff
+}
+
+.button.is-white.is-outlined.is-focused,
+.button.is-white.is-outlined.is-hovered,
+.button.is-white.is-outlined:focus,
+.button.is-white.is-outlined:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #0a0a0a
+}
+
+.button.is-white.is-outlined.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-white.is-outlined.is-loading.is-focused::after,
+.button.is-white.is-outlined.is-loading.is-hovered::after,
+.button.is-white.is-outlined.is-loading:focus::after,
+.button.is-white.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #0a0a0a #0a0a0a !important
+}
+
+.button.is-white.is-outlined[disabled],
+fieldset[disabled] .button.is-white.is-outlined {
+    background-color: transparent;
+    border-color: #fff;
+    box-shadow: none;
+    color: #fff
+}
+
+.button.is-black {
+    background-color: #0a0a0a
+}
+
+.button.is-black,
+.button.is-black.is-hovered,
+.button.is-black:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-black.is-focused,
+.button.is-black:focus {
+    color: #fff
+}
+
+.button.is-black.is-focused:not(:active),
+.button.is-black:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(10, 10, 10, .25)
+}
+
+.button.is-black.is-active,
+.button.is-black:active {
+    background-color: #000;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-black[disabled],
+fieldset[disabled] .button.is-black {
+    background-color: #0a0a0a;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-black.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-black.is-outlined {
+    background-color: transparent;
+    border-color: #0a0a0a;
+    color: #0a0a0a
+}
+
+.button.is-black.is-outlined.is-focused,
+.button.is-black.is-outlined.is-hovered,
+.button.is-black.is-outlined:focus,
+.button.is-black.is-outlined:hover {
+    background-color: #0a0a0a;
+    border-color: #0a0a0a;
+    color: #fff
+}
+
+.button.is-black.is-outlined.is-loading::after {
+    border-color: transparent transparent #0a0a0a #0a0a0a !important
+}
+
+.button.is-black.is-outlined.is-loading.is-focused::after,
+.button.is-black.is-outlined.is-loading.is-hovered::after,
+.button.is-black.is-outlined.is-loading:focus::after,
+.button.is-black.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-black.is-outlined[disabled],
+fieldset[disabled] .button.is-black.is-outlined {
+    background-color: transparent;
+    border-color: #0a0a0a;
+    box-shadow: none;
+    color: #0a0a0a
+}
+
+.button.is-light {
+    background-color: #ecf0f1
+}
+
+.button.is-light,
+.button.is-light.is-hovered,
+.button.is-light:hover {
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-light.is-focused,
+.button.is-light:focus {
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-light.is-focused:not(:active),
+.button.is-light:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(236, 240, 241, .25)
+}
+
+.button.is-light.is-active,
+.button.is-light:active {
+    background-color: #dde4e6;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-light[disabled],
+fieldset[disabled] .button.is-light {
+    background-color: #ecf0f1;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-light.is-loading::after {
+    border-color: transparent transparent rgba(0, 0, 0, .7) rgba(0, 0, 0, .7) !important
+}
+
+.button.is-light.is-outlined {
+    background-color: transparent;
+    border-color: #ecf0f1;
+    color: #ecf0f1
+}
+
+.button.is-light.is-outlined.is-focused,
+.button.is-light.is-outlined.is-hovered,
+.button.is-light.is-outlined:focus,
+.button.is-light.is-outlined:hover {
+    background-color: #ecf0f1;
+    border-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-light.is-outlined.is-loading::after {
+    border-color: transparent transparent #ecf0f1 #ecf0f1 !important
+}
+
+.button.is-light.is-outlined.is-loading.is-focused::after,
+.button.is-light.is-outlined.is-loading.is-hovered::after,
+.button.is-light.is-outlined.is-loading:focus::after,
+.button.is-light.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent rgba(0, 0, 0, .7) rgba(0, 0, 0, .7) !important
+}
+
+.button.is-light.is-outlined[disabled],
+fieldset[disabled] .button.is-light.is-outlined {
+    background-color: transparent;
+    border-color: #ecf0f1;
+    box-shadow: none;
+    color: #ecf0f1
+}
+
+.button.is-dark {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.button.is-dark,
+.button.is-dark.is-hovered,
+.button.is-dark:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-dark.is-focused,
+.button.is-dark:focus {
+    color: #fff
+}
+
+.button.is-dark.is-focused:not(:active),
+.button.is-dark:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(40, 47, 47, .25)
+}
+
+.button.is-dark.is-active,
+.button.is-dark:active {
+    background-color: #1d2122;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-dark[disabled],
+fieldset[disabled] .button.is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-dark.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-dark.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 10%, 15%);
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.button.is-dark.is-outlined.is-focused,
+.button.is-dark.is-outlined.is-hovered,
+.button.is-dark.is-outlined:focus,
+.button.is-dark.is-outlined:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.button.is-dark.is-outlined.is-loading::after {
+    border-color: transparent transparent hsl(var(--main), 10%, 15%) hsl(var(--main), 10%, 15%) !important
+}
+
+.button.is-dark.is-outlined.is-loading.is-focused::after,
+.button.is-dark.is-outlined.is-loading.is-hovered::after,
+.button.is-dark.is-outlined.is-loading:focus::after,
+.button.is-dark.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-dark.is-outlined[disabled],
+fieldset[disabled] .button.is-dark.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 10%, 15%);
+    box-shadow: none;
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.button.is-primary {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-primary,
+.button.is-primary.is-hovered,
+.button.is-primary:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-primary.is-focused,
+.button.is-primary:focus {
+    color: #fff
+}
+
+.button.is-primary.is-focused:not(:active),
+.button.is-primary:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(55, 90, 127, .25)
+}
+
+.button.is-primary.is-active,
+.button.is-primary:active {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-primary[disabled],
+fieldset[disabled] .button.is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-primary.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-primary.is-outlined {
+    background-color: transparent;
+    border-color: #fff;
+    color: #fff
+}
+
+.button.is-primary.is-outlined.is-focused,
+.button.is-primary.is-outlined.is-hovered,
+.button.is-primary.is-outlined:focus,
+.button.is-primary.is-outlined:hover {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.button.is-primary.is-outlined.is-loading::after {
+    border-color: transparent transparent hsl(var(--main), 45%, 45%) hsl(var(--main), 45%, 45%) !important
+}
+
+.button.is-primary.is-outlined.is-loading.is-focused::after,
+.button.is-primary.is-outlined.is-loading.is-hovered::after,
+.button.is-primary.is-outlined.is-loading:focus::after,
+.button.is-primary.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-primary.is-outlined[disabled],
+fieldset[disabled] .button.is-primary.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 45%, 45%);
+    box-shadow: none;
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-primary.is-light {
+    background-color: #f1f5f9;
+    color: hsl(var(--main), 65%, 35%)
+}
+
+.button.is-primary.is-light.is-hovered,
+.button.is-primary.is-light:hover {
+    background-color: #e8eef5;
+    border-color: transparent;
+    color: hsl(var(--main), 65%, 35%)
+}
+
+.button.is-primary.is-light.is-active,
+.button.is-primary.is-light:active {
+    background-color: #dfe8f1;
+    border-color: transparent;
+    color: #4d7eb2
+}
+
+.button.is-link {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-link,
+.button.is-link.is-hovered,
+.button.is-link:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-link.is-focused,
+.button.is-link:focus {
+    color: #fff
+}
+
+.button.is-link.is-focused:not(:active),
+.button.is-link:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(26, 188, 156, .25)
+}
+
+.button.is-link.is-active,
+.button.is-link:active {
+    background-color: hsl(var(--main), 75%, 80%);
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-link[disabled],
+fieldset[disabled] .button.is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-link.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-link.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 45%, 45%);
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-link.is-outlined.is-focused,
+.button.is-link.is-outlined.is-hovered,
+.button.is-link.is-outlined:focus,
+.button.is-link.is-outlined:hover {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.button.is-link.is-outlined.is-loading::after {
+    border-color: transparent transparent hsl(var(--main), 45%, 45%) hsl(var(--main), 45%, 45%) !important
+}
+
+.button.is-link.is-outlined.is-loading.is-focused::after,
+.button.is-link.is-outlined.is-loading.is-hovered::after,
+.button.is-link.is-outlined.is-loading:focus::after,
+.button.is-link.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-link.is-outlined[disabled],
+fieldset[disabled] .button.is-link.is-outlined {
+    background-color: transparent;
+    border-color: hsl(var(--main), 45%, 45%);
+    box-shadow: none;
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.button.is-link.is-light {
+    background-color: #edfdf9;
+    color: #15987e
+}
+
+.button.is-link.is-light.is-hovered,
+.button.is-link.is-light:hover {
+    background-color: #e2fbf6;
+    border-color: transparent;
+    color: #15987e
+}
+
+.button.is-link.is-light.is-active,
+.button.is-link.is-light:active {
+    background-color: #d7f9f3;
+    border-color: transparent;
+    color: #15987e
+}
+
+.button.is-info {
+    background-color: #3298dc
+}
+
+.button.is-info,
+.button.is-info.is-hovered,
+.button.is-info:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-info.is-focused,
+.button.is-info:focus {
+    color: #fff
+}
+
+.button.is-info.is-focused:not(:active),
+.button.is-info:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(50, 152, 220, .25)
+}
+
+.button.is-info.is-active,
+.button.is-info:active {
+    background-color: #238cd1;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-info[disabled],
+fieldset[disabled] .button.is-info {
+    background-color: #3298dc;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-info.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-info.is-outlined {
+    background-color: transparent;
+    border-color: #3298dc;
+    color: #3298dc
+}
+
+.button.is-info.is-outlined.is-focused,
+.button.is-info.is-outlined.is-hovered,
+.button.is-info.is-outlined:focus,
+.button.is-info.is-outlined:hover {
+    background-color: #3298dc;
+    border-color: #3298dc;
+    color: #fff
+}
+
+.button.is-info.is-outlined.is-loading::after {
+    border-color: transparent transparent #3298dc #3298dc !important
+}
+
+.button.is-info.is-outlined.is-loading.is-focused::after,
+.button.is-info.is-outlined.is-loading.is-hovered::after,
+.button.is-info.is-outlined.is-loading:focus::after,
+.button.is-info.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-info.is-outlined[disabled],
+fieldset[disabled] .button.is-info.is-outlined {
+    background-color: transparent;
+    border-color: #3298dc;
+    box-shadow: none;
+    color: #3298dc
+}
+
+.button.is-info.is-light {
+    background-color: #eef6fc;
+    color: #1d72aa
+}
+
+.button.is-info.is-light.is-hovered,
+.button.is-info.is-light:hover {
+    background-color: #e3f1fa;
+    border-color: transparent;
+    color: #1d72aa
+}
+
+.button.is-info.is-light.is-active,
+.button.is-info.is-light:active {
+    background-color: #d8ebf8;
+    border-color: transparent;
+    color: #1d72aa
+}
+
+.button.is-success {
+    background-color: #2ecc71
+}
+
+.button.is-success,
+.button.is-success.is-hovered,
+.button.is-success:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-success.is-focused,
+.button.is-success:focus {
+    color: #fff
+}
+
+.button.is-success.is-focused:not(:active),
+.button.is-success:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(46, 204, 113, .25)
+}
+
+.button.is-success.is-active,
+.button.is-success:active {
+    background-color: #29b765;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-success[disabled],
+fieldset[disabled] .button.is-success {
+    background-color: #2ecc71;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-success.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-success.is-outlined {
+    background-color: transparent;
+    border-color: #2ecc71;
+    color: #2ecc71
+}
+
+.button.is-success.is-outlined.is-focused,
+.button.is-success.is-outlined.is-hovered,
+.button.is-success.is-outlined:focus,
+.button.is-success.is-outlined:hover {
+    background-color: #2ecc71;
+    border-color: #2ecc71;
+    color: #fff
+}
+
+.button.is-success.is-outlined.is-loading::after {
+    border-color: transparent transparent #2ecc71 #2ecc71 !important
+}
+
+.button.is-success.is-outlined.is-loading.is-focused::after,
+.button.is-success.is-outlined.is-loading.is-hovered::after,
+.button.is-success.is-outlined.is-loading:focus::after,
+.button.is-success.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-success.is-outlined[disabled],
+fieldset[disabled] .button.is-success.is-outlined {
+    background-color: transparent;
+    border-color: #2ecc71;
+    box-shadow: none;
+    color: #2ecc71
+}
+
+.button.is-success.is-light {
+    background-color: #eefbf4;
+    color: #1d8147
+}
+
+.button.is-success.is-light.is-hovered,
+.button.is-success.is-light:hover {
+    background-color: #e4f9ed;
+    border-color: transparent;
+    color: #1d8147
+}
+
+.button.is-success.is-light.is-active,
+.button.is-success.is-light:active {
+    background-color: #daf7e6;
+    border-color: transparent;
+    color: #1d8147
+}
+
+.button.is-warning {
+    background-color: #f1b70e
+}
+
+.button.is-warning,
+.button.is-warning.is-hovered,
+.button.is-warning:hover {
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-warning.is-focused,
+.button.is-warning:focus {
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-warning.is-focused:not(:active),
+.button.is-warning:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(241, 183, 14, .25)
+}
+
+.button.is-warning.is-active,
+.button.is-warning:active {
+    background-color: #d9a50d;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-warning[disabled],
+fieldset[disabled] .button.is-warning {
+    background-color: #f1b70e;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-warning.is-loading::after {
+    border-color: transparent transparent rgba(0, 0, 0, .7) rgba(0, 0, 0, .7) !important
+}
+
+.button.is-warning.is-outlined {
+    background-color: transparent;
+    border-color: #f1b70e;
+    color: #f1b70e
+}
+
+.button.is-warning.is-outlined.is-focused,
+.button.is-warning.is-outlined.is-hovered,
+.button.is-warning.is-outlined:focus,
+.button.is-warning.is-outlined:hover {
+    background-color: #f1b70e;
+    border-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.button.is-warning.is-outlined.is-loading::after {
+    border-color: transparent transparent #f1b70e #f1b70e !important
+}
+
+.button.is-warning.is-outlined.is-loading.is-focused::after,
+.button.is-warning.is-outlined.is-loading.is-hovered::after,
+.button.is-warning.is-outlined.is-loading:focus::after,
+.button.is-warning.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent rgba(0, 0, 0, .7) rgba(0, 0, 0, .7) !important
+}
+
+.button.is-warning.is-outlined[disabled],
+fieldset[disabled] .button.is-warning.is-outlined {
+    background-color: transparent;
+    border-color: #f1b70e;
+    box-shadow: none;
+    color: #f1b70e
+}
+
+.button.is-warning.is-light {
+    background-color: #fef9ec;
+    color: #8c6a08
+}
+
+.button.is-warning.is-light.is-hovered,
+.button.is-warning.is-light:hover {
+    background-color: #fdf6e0;
+    border-color: transparent;
+    color: #8c6a08
+}
+
+.button.is-warning.is-light.is-active,
+.button.is-warning.is-light:active {
+    background-color: #fcf2d4;
+    border-color: transparent;
+    color: #8c6a08
+}
+
+.button.is-danger {
+    background-color: #e74c3c
+}
+
+.button.is-danger,
+.button.is-danger.is-hovered,
+.button.is-danger:hover {
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-danger.is-focused,
+.button.is-danger:focus {
+    color: #fff
+}
+
+.button.is-danger.is-focused:not(:active),
+.button.is-danger:focus:not(:active) {
+    box-shadow: 0 0 0 .125em rgba(231, 76, 60, .25)
+}
+
+.button.is-danger.is-active,
+.button.is-danger:active {
+    background-color: #e43725;
+    border-color: transparent;
+    color: #fff
+}
+
+.button.is-danger[disabled],
+fieldset[disabled] .button.is-danger {
+    background-color: #e74c3c;
+    border-color: transparent;
+    box-shadow: none
+}
+
+.button.is-danger.is-loading::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-danger.is-outlined {
+    background-color: transparent;
+    border-color: #e74c3c;
+    color: #e74c3c
+}
+
+.button.is-danger.is-outlined.is-focused,
+.button.is-danger.is-outlined.is-hovered,
+.button.is-danger.is-outlined:focus,
+.button.is-danger.is-outlined:hover {
+    background-color: #e74c3c;
+    border-color: #e74c3c;
+    color: #fff
+}
+
+.button.is-danger.is-outlined.is-loading::after {
+    border-color: transparent transparent #e74c3c #e74c3c !important
+}
+
+.button.is-danger.is-outlined.is-loading.is-focused::after,
+.button.is-danger.is-outlined.is-loading.is-hovered::after,
+.button.is-danger.is-outlined.is-loading:focus::after,
+.button.is-danger.is-outlined.is-loading:hover::after {
+    border-color: transparent transparent #fff #fff !important
+}
+
+.button.is-danger.is-outlined[disabled],
+fieldset[disabled] .button.is-danger.is-outlined {
+    background-color: transparent;
+    border-color: #e74c3c;
+    box-shadow: none;
+    color: #e74c3c
+}
+
+.button.is-danger.is-light {
+    background-color: #fdeeed;
+    color: #c32818
+}
+
+.button.is-danger.is-light.is-hovered,
+.button.is-danger.is-light:hover {
+    background-color: #fbe4e1;
+    border-color: transparent;
+    color: #c32818
+}
+
+.button.is-danger.is-light.is-active,
+.button.is-danger.is-light:active {
+    background-color: #fad9d6;
+    border-color: transparent;
+    color: #c32818
+}
+
+.button.is-small {
+    border-radius: 3px;
+    font-size: .85em
+}
+
+.button.is-normal {
+    font-size: 15px
+}
+
+.button.is-medium {
+    font-size: 1.25rem
+}
+
+.button.is-large {
+    font-size: 1.5rem
+}
+
+.button[disabled],
+fieldset[disabled] .button {
+    background-color: #8c9b9d;
+    border-color: #5e6d6f;
+    box-shadow: none;
+    opacity: .5
+}
+
+.button.is-fullwidth {
+    display: flex;
+    width: 100%
+}
+
+.button.is-loading {
+    color: transparent !important;
+    pointer-events: none
+}
+
+.button.is-loading::after {
+    left: calc(50% - (1em / 2));
+    top: calc(50% - (1em / 2));
+    position: absolute !important
+}
+
+.button.is-static {
+    background-color: #ecf0f1;
+    border-color: #5e6d6f;
+    color: #fff;
+    box-shadow: none;
+    pointer-events: none
+}
+
+.button.is-rounded {
+    border-radius: 290486px;
+    padding-left: calc(1em + .25em);
+    padding-right: calc(1em + .25em)
+}
+
+.buttons {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start
+}
+
+.buttons .button {
+    margin-bottom: .5rem
+}
+
+.buttons .button:not(:last-child):not(.is-fullwidth) {
+    margin-right: .5rem
+}
+
+.buttons:last-child {
+    margin-bottom: -.5rem
+}
+
+.buttons:not(:last-child) {
+    margin-bottom: 1rem
+}
+
+.buttons.are-small .button:not(.is-normal):not(.is-medium):not(.is-large) {
+    border-radius: 3px;
+    font-size: .85em
+}
+
+.buttons.are-medium .button:not(.is-small):not(.is-normal):not(.is-large) {
+    font-size: 1.25rem
+}
+
+.buttons.are-large .button:not(.is-small):not(.is-normal):not(.is-medium) {
+    font-size: 1.5rem
+}
+
+.buttons.has-addons .button:not(:first-child) {
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0
+}
+
+.buttons.has-addons .button:not(:last-child) {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0;
+    margin-right: -1px
+}
+
+.buttons.has-addons .button:last-child {
+    margin-right: 0
+}
+
+.buttons.has-addons .button.is-hovered,
+.buttons.has-addons .button:hover {
+    z-index: 2
+}
+
+.buttons.has-addons .button.is-active,
+.buttons.has-addons .button.is-focused,
+.buttons.has-addons .button.is-selected,
+.buttons.has-addons .button:active,
+.buttons.has-addons .button:focus {
+    z-index: 3
+}
+
+.buttons.has-addons .button.is-active:hover,
+.buttons.has-addons .button.is-focused:hover,
+.buttons.has-addons .button.is-selected:hover,
+.buttons.has-addons .button:active:hover,
+.buttons.has-addons .button:focus:hover {
+    z-index: 4
+}
+
+.buttons.has-addons .button.is-expanded {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.buttons.is-centered {
+    justify-content: center
+}
+
+.buttons.is-centered:not(.has-addons) .button:not(.is-fullwidth),
+.buttons.is-right:not(.has-addons) .button:not(.is-fullwidth) {
+    margin-left: .25rem;
+    margin-right: .25rem
+}
+
+.buttons.is-right {
+    justify-content: flex-end
+}
+
+.container {
+    flex-grow: 1;
+    margin: 0 auto;
+    position: relative;
+    width: auto
+}
+
+.container.is-fluid {
+    max-width: none;
+    padding-left: 32px;
+    padding-right: 32px;
+    width: 100%
+}
+
+@media screen and (min-width: 1024px) {
+    .container {
+        max-width: 960px
+    }
+}
+
+@media screen and (max-width: 1215px) {
+    .container.is-widescreen {
+        max-width: 1152px
+    }
+}
+
+@media screen and (max-width: 1407px) {
+    .container.is-fullhd {
+        max-width: 1344px
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .container {
+        max-width: 1152px
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .container {
+        max-width: 1344px
+    }
+}
+
+.content li+li {
+    margin-top: .25em
+}
+
+.content blockquote:not(:last-child),
+.content dl:not(:last-child),
+.content ol:not(:last-child),
+.content p:not(:last-child),
+.content pre:not(:last-child),
+.content table:not(:last-child),
+.content ul:not(:last-child) {
+    margin-bottom: 1em
+}
+
+.content h1,
+.content h2,
+.content h3,
+.content h4,
+.content h5,
+.content h6 {
+    color: #f2f2f2;
+    font-weight: 600;
+    line-height: 1.125
+}
+
+.content h1 {
+    font-size: 2em;
+    margin-bottom: .5em
+}
+
+.content h1:not(:first-child) {
+    margin-top: 1em
+}
+
+.content h2 {
+    font-size: 1.75em;
+    margin-bottom: .5714em
+}
+
+.content h2:not(:first-child) {
+    margin-top: 1.1428em
+}
+
+.content h3 {
+    font-size: 1.5em;
+    margin-bottom: .6666em
+}
+
+.content h3:not(:first-child) {
+    margin-top: 1.3333em
+}
+
+.content h4 {
+    font-size: 1.25em;
+    margin-bottom: .8em
+}
+
+.content h5 {
+    font-size: 1.125em;
+    margin-bottom: .8888em
+}
+
+.content h6 {
+    font-size: 1em;
+    margin-bottom: 1em
+}
+
+.content blockquote {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-left: 5px solid #5e6d6f;
+    padding: 1.25em 1.5em
+}
+
+.content ol {
+    list-style-position: outside;
+    margin-left: 2em;
+    margin-top: 1em
+}
+
+.content ol:not([type]) {
+    list-style-type: decimal
+}
+
+.content ol:not([type]).is-lower-alpha {
+    list-style-type: lower-alpha
+}
+
+.content ol:not([type]).is-lower-roman {
+    list-style-type: lower-roman
+}
+
+.content ol:not([type]).is-upper-alpha {
+    list-style-type: upper-alpha
+}
+
+.content ol:not([type]).is-upper-roman {
+    list-style-type: upper-roman
+}
+
+.content ul {
+    list-style: disc outside;
+    margin-top: 1em
+}
+
+.content ul ul {
+    list-style-type: circle;
+    margin-top: .5em
+}
+
+.content ul ul ul {
+    list-style-type: square
+}
+
+.content dd,
+.content ul {
+    margin-left: 2em
+}
+
+.content figure {
+    margin-left: 2em;
+    margin-right: 2em;
+    text-align: center
+}
+
+.content figure:not(:first-child) {
+    margin-top: 2em
+}
+
+.content figure:not(:last-child) {
+    margin-bottom: 2em
+}
+
+.content figure img {
+    display: inline-block
+}
+
+.content figure figcaption {
+    font-style: italic
+}
+
+.content pre {
+    -webkit-overflow-scrolling: touch;
+    overflow-x: auto;
+    padding: 1.25em 1.5em;
+    white-space: pre;
+    word-wrap: normal
+}
+
+.content sub,
+.content sup {
+    font-size: 75%
+}
+
+.content table {
+    width: 100%
+}
+
+.content table td,
+.content table th,
+.table td,
+.table th {
+    border-width: 0 0 1px;
+    padding: .5em .75em;
+    vertical-align: top
+}
+
+.content table th,
+.table th {
+    color: #f2f2f2
+}
+
+.content table thead td,
+.content table thead th,
+.table thead td,
+.table thead th {
+    border-width: 0 0 2px;
+    color: #f2f2f2
+}
+
+.content table tfoot td,
+.content table tfoot th,
+.table tfoot td,
+.table tfoot th {
+    border-width: 2px 0 0;
+    color: #f2f2f2
+}
+
+.content table tbody tr:last-child td,
+.content table tbody tr:last-child th,
+.table tbody tr:last-child td,
+.table tbody tr:last-child th {
+    border-bottom-width: 0
+}
+
+.content .tabs li+li {
+    margin-top: 0
+}
+
+.content.is-small {
+    font-size: .85em
+}
+
+.content.is-medium {
+    font-size: 1.25rem
+}
+
+.content.is-large {
+    font-size: 1.5rem
+}
+
+.icon {
+    align-items: center;
+    display: inline-flex;
+    justify-content: center;
+    height: 1.5rem;
+    width: 1.5rem
+}
+
+.icon.is-small {
+    height: 1rem;
+    width: 1rem
+}
+
+.icon.is-medium {
+    height: 2rem;
+    width: 2rem
+}
+
+.icon.is-large {
+    height: 3rem;
+    width: 3rem
+}
+
+.image {
+    display: block;
+    position: relative
+}
+
+.image img {
+    display: block;
+    height: auto;
+    width: 100%
+}
+
+.image img.is-rounded {
+    border-radius: 290486px
+}
+
+.image.is-fullwidth {
+    width: 100%
+}
+
+.image.is-16by9 .has-ratio,
+.image.is-16by9 img,
+.image.is-1by1 .has-ratio,
+.image.is-1by1 img,
+.image.is-1by2 .has-ratio,
+.image.is-1by2 img,
+.image.is-1by3 .has-ratio,
+.image.is-1by3 img,
+.image.is-2by1 .has-ratio,
+.image.is-2by1 img,
+.image.is-2by3 .has-ratio,
+.image.is-2by3 img,
+.image.is-3by1 .has-ratio,
+.image.is-3by1 img,
+.image.is-3by2 .has-ratio,
+.image.is-3by2 img,
+.image.is-3by4 .has-ratio,
+.image.is-3by4 img,
+.image.is-3by5 .has-ratio,
+.image.is-3by5 img,
+.image.is-4by3 .has-ratio,
+.image.is-4by3 img,
+.image.is-4by5 .has-ratio,
+.image.is-4by5 img,
+.image.is-5by3 .has-ratio,
+.image.is-5by3 img,
+.image.is-5by4 .has-ratio,
+.image.is-5by4 img,
+.image.is-9by16 .has-ratio,
+.image.is-9by16 img,
+.image.is-square .has-ratio,
+.image.is-square img {
+    height: 100%;
+    width: 100%
+}
+
+.image.is-1by1,
+.image.is-square {
+    padding-top: 100%
+}
+
+.image.is-5by4 {
+    padding-top: 80%
+}
+
+.image.is-4by3 {
+    padding-top: 75%
+}
+
+.image.is-3by2 {
+    padding-top: 66.6666%
+}
+
+.image.is-5by3 {
+    padding-top: 60%
+}
+
+.image.is-16by9 {
+    padding-top: 56.25%
+}
+
+.image.is-2by1 {
+    padding-top: 50%
+}
+
+.image.is-3by1 {
+    padding-top: 33.3333%
+}
+
+.image.is-4by5 {
+    padding-top: 125%
+}
+
+.image.is-3by4 {
+    padding-top: 133.3333%
+}
+
+.image.is-2by3 {
+    padding-top: 150%
+}
+
+.image.is-3by5 {
+    padding-top: 166.6666%
+}
+
+.image.is-9by16 {
+    padding-top: 177.7777%
+}
+
+.image.is-1by2 {
+    padding-top: 200%
+}
+
+.image.is-1by3 {
+    padding-top: 300%
+}
+
+.image.is-16x16 {
+    height: 16px;
+    width: 16px
+}
+
+.image.is-24x24 {
+    height: 24px;
+    width: 24px
+}
+
+.image.is-32x32 {
+    height: 32px;
+    width: 32px
+}
+
+.image.is-48x48 {
+    height: 48px;
+    width: 48px
+}
+
+.image.is-64x64 {
+    height: 64px;
+    width: 64px
+}
+
+.image.is-96x96 {
+    height: 96px;
+    width: 96px
+}
+
+.image.is-128x128 {
+    height: 128px;
+    width: 128px
+}
+
+.notification {
+    border-radius: .4em;
+    padding: 1.25rem 2.5rem 1.25rem 1.5rem;
+    position: relative
+}
+
+.message a:not(.button):not(.tag):not(.dropdown-item),
+.notification a:not(.button):not(.dropdown-item) {
+    color: currentColor;
+    text-decoration: underline
+}
+
+.notification code,
+.notification pre {
+    background: #fff
+}
+
+.notification pre code {
+    background: 0 0
+}
+
+.notification>.delete {
+    position: absolute;
+    right: .5rem;
+    top: .5rem
+}
+
+.notification .content,
+.notification .subtitle,
+.notification .title,
+.notification strong,
+.table td.is-selected a,
+.table td.is-selected strong,
+.table th.is-selected a,
+.table th.is-selected strong,
+.table tr.is-selected a,
+.table tr.is-selected strong {
+    color: currentColor
+}
+
+.notification.is-white {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.notification.is-black {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.notification.is-light {
+    background-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.notification.is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.notification.is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.notification.is-primary.is-light {
+    background-color: #f1f5f9;
+    color: #4d7eb2
+}
+
+.notification.is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.notification.is-link.is-light {
+    background-color: #edfdf9;
+    color: #15987e
+}
+
+.notification.is-info {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.notification.is-info.is-light {
+    background-color: #eef6fc;
+    color: #1d72aa
+}
+
+.notification.is-success {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.notification.is-success.is-light {
+    background-color: #eefbf4;
+    color: #1d8147
+}
+
+.notification.is-warning {
+    background-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.notification.is-warning.is-light {
+    background-color: #fef9ec;
+    color: #8c6a08
+}
+
+.notification.is-danger {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.notification.is-danger.is-light {
+    background-color: #fdeeed;
+    color: #c32818
+}
+
+.progress {
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    border: 0;
+    border-radius: 290486px;
+    display: block;
+    height: 15px;
+    overflow: hidden;
+    padding: 0;
+    width: 100%
+}
+
+.progress::-webkit-progress-bar {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.progress::-webkit-progress-value {
+    background-color: #dbdee0
+}
+
+.progress::-moz-progress-bar {
+    background-color: #dbdee0
+}
+
+.progress::-ms-fill {
+    background-color: #dbdee0;
+    border: 0
+}
+
+.progress.is-white::-webkit-progress-value {
+    background-color: #fff
+}
+
+.progress.is-white::-moz-progress-bar {
+    background-color: #fff
+}
+
+.progress.is-white::-ms-fill {
+    background-color: #fff
+}
+
+.progress.is-white:indeterminate {
+    background-image: linear-gradient(to right, #fff 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-black::-webkit-progress-value {
+    background-color: #0a0a0a
+}
+
+.progress.is-black::-moz-progress-bar {
+    background-color: #0a0a0a
+}
+
+.progress.is-black::-ms-fill {
+    background-color: #0a0a0a
+}
+
+.progress.is-black:indeterminate {
+    background-image: linear-gradient(to right, #0a0a0a 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-light::-webkit-progress-value {
+    background-color: #ecf0f1
+}
+
+.progress.is-light::-moz-progress-bar {
+    background-color: #ecf0f1
+}
+
+.progress.is-light::-ms-fill {
+    background-color: #ecf0f1
+}
+
+.progress.is-light:indeterminate {
+    background-image: linear-gradient(to right, #ecf0f1 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-dark::-webkit-progress-value {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.progress.is-dark::-moz-progress-bar {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.progress.is-dark::-ms-fill {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.progress.is-dark:indeterminate {
+    background-image: linear-gradient(to right, #6a6a6a 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-primary::-webkit-progress-value {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-primary::-moz-progress-bar {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-primary::-ms-fill {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-primary:indeterminate {
+    background-image: linear-gradient(to right, hsl(var(--main), 45%, 45%) 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-link::-webkit-progress-value {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-link::-moz-progress-bar {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-link::-ms-fill {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.progress.is-link:indeterminate {
+    background-image: linear-gradient(to right, hsl(var(--main), 45%, 45%) 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-info::-webkit-progress-value {
+    background-color: #3298dc
+}
+
+.progress.is-info::-moz-progress-bar {
+    background-color: #3298dc
+}
+
+.progress.is-info::-ms-fill {
+    background-color: #3298dc
+}
+
+.progress.is-info:indeterminate {
+    background-image: linear-gradient(to right, #3298dc 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-success::-webkit-progress-value {
+    background-color: #2ecc71
+}
+
+.progress.is-success::-moz-progress-bar {
+    background-color: #2ecc71
+}
+
+.progress.is-success::-ms-fill {
+    background-color: #2ecc71
+}
+
+.progress.is-success:indeterminate {
+    background-image: linear-gradient(to right, #2ecc71 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-warning::-webkit-progress-value {
+    background-color: #f1b70e
+}
+
+.progress.is-warning::-moz-progress-bar {
+    background-color: #f1b70e
+}
+
+.progress.is-warning::-ms-fill {
+    background-color: #f1b70e
+}
+
+.progress.is-warning:indeterminate {
+    background-image: linear-gradient(to right, #f1b70e 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress.is-danger::-webkit-progress-value {
+    background-color: #e74c3c
+}
+
+.progress.is-danger::-moz-progress-bar {
+    background-color: #e74c3c
+}
+
+.progress.is-danger::-ms-fill {
+    background-color: #e74c3c
+}
+
+.progress.is-danger:indeterminate {
+    background-image: linear-gradient(to right, #e74c3c 30%, hsl(var(--main), 10%, 15%) 30%)
+}
+
+.progress:indeterminate {
+    -webkit-animation-duration: 1.5s;
+    animation-duration: 1.5s;
+    -webkit-animation-iteration-count: infinite;
+    animation-iteration-count: infinite;
+    -webkit-animation-name: moveIndeterminate;
+    animation-name: moveIndeterminate;
+    -webkit-animation-timing-function: linear;
+    animation-timing-function: linear;
+    background-color: hsl(var(--main), 10%, 15%);
+    background-image: linear-gradient(to right, #fff 30%, hsl(var(--main), 10%, 15%) 30%);
+    background-position: top left;
+    background-repeat: no-repeat;
+    background-size: 150% 150%
+}
+
+.progress:indeterminate::-webkit-progress-bar {
+    background-color: transparent
+}
+
+.progress:indeterminate::-moz-progress-bar {
+    background-color: transparent
+}
+
+.progress.is-small {
+    height: .85em
+}
+
+.progress.is-medium {
+    height: 1.25rem
+}
+
+.progress.is-large {
+    height: 1.5rem
+}
+
+.table {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.table td.is-white,
+.table th.is-white {
+    background-color: #fff;
+    border-color: #fff;
+    color: #0a0a0a
+}
+
+.hero.is-white .tabs.is-boxed li.is-active a,
+.hero.is-white .tabs.is-boxed li.is-active a:hover,
+.hero.is-white .tabs.is-toggle li.is-active a,
+.hero.is-white .tabs.is-toggle li.is-active a:hover,
+.table td.is-black,
+.table th.is-black {
+    background-color: #0a0a0a;
+    border-color: #0a0a0a;
+    color: #fff
+}
+
+.table td.is-light,
+.table th.is-light {
+    background-color: #ecf0f1;
+    border-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.table td.is-dark,
+.table th.is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.table td.is-primary,
+.table th.is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.table td.is-link,
+.table th.is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.table td.is-info,
+.table th.is-info {
+    background-color: #3298dc;
+    border-color: #3298dc;
+    color: #fff
+}
+
+.table td.is-success,
+.table th.is-success {
+    background-color: #2ecc71;
+    border-color: #2ecc71;
+    color: #fff
+}
+
+.table td.is-warning,
+.table th.is-warning {
+    background-color: #f1b70e;
+    border-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.table td.is-danger,
+.table th.is-danger {
+    background-color: #e74c3c;
+    border-color: #e74c3c;
+    color: #fff
+}
+
+.table td.is-narrow,
+.table th.is-narrow {
+    white-space: nowrap;
+    width: 1%
+}
+
+.table td.is-selected,
+.table th.is-selected,
+.table tr.is-selected {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.table th:not([align]) {
+    text-align: left
+}
+
+.table tr.is-selected td,
+.table tr.is-selected th {
+    border-color: #fff;
+    color: currentColor
+}
+
+.message-body pre code,
+.table tbody,
+.table tfoot,
+.table thead {
+    background-color: transparent
+}
+
+.table.is-bordered td,
+.table.is-bordered th {
+    border-width: 1px
+}
+
+.table.is-bordered tr:last-child td,
+.table.is-bordered tr:last-child th {
+    border-bottom-width: 1px
+}
+
+.table.is-fullwidth {
+    width: 100%
+}
+
+.table.is-hoverable tbody tr:not(.is-selected):hover,
+.table.is-hoverable.is-striped tbody tr:not(.is-selected):hover {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.table.is-hoverable.is-striped tbody tr:not(.is-selected):hover:nth-child(even) {
+    background-color: #2d3435
+}
+
+.table.is-narrow td,
+.table.is-narrow th {
+    padding: .25em .5em
+}
+
+.table.is-striped tbody tr:not(.is-selected):nth-child(even) {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.table-container {
+    -webkit-overflow-scrolling: touch;
+    overflow: auto;
+    overflow-y: hidden;
+    max-width: 100%
+}
+
+.tags {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start
+}
+
+.tags .tag {
+    margin-bottom: .5rem
+}
+
+.tags .tag:not(:last-child) {
+    margin-right: .5rem
+}
+
+.tags:last-child {
+    margin-bottom: -.5rem
+}
+
+.tags:not(:last-child) {
+    margin-bottom: 1rem
+}
+
+.tags.are-medium .tag:not(.is-normal):not(.is-large) {
+    font-size: 15px
+}
+
+.tags.are-large .tag:not(.is-normal):not(.is-medium) {
+    font-size: 1.25rem
+}
+
+.tags.is-centered {
+    justify-content: center
+}
+
+.tags.is-centered .tag {
+    margin-right: .25rem;
+    margin-left: .25rem
+}
+
+.tags.is-right {
+    justify-content: flex-end
+}
+
+.tags.is-right .tag:not(:first-child) {
+    margin-left: .5rem
+}
+
+.tags.is-right .tag:not(:last-child) {
+    margin-right: 0
+}
+
+.tags.has-addons .tag {
+    margin-right: 0
+}
+
+.tags.has-addons .tag:not(:first-child) {
+    margin-left: 0;
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0
+}
+
+.tags.has-addons .tag:not(:last-child) {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0
+}
+
+.tag:not(body) {
+    align-items: center;
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: .4em;
+    color: #fff;
+    display: inline-flex;
+    font-size: .85em;
+    height: 2em;
+    justify-content: center;
+    line-height: 1.5;
+    padding-left: .75em;
+    padding-right: .75em;
+    white-space: nowrap
+}
+
+.tag:not(body) .delete {
+    margin-left: .25rem;
+    margin-right: -.375rem
+}
+
+.tag:not(body).is-white {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.tag:not(body).is-black {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.tag:not(body).is-light {
+    background-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.tag:not(body).is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.tag:not(body).is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.tag:not(body).is-primary.is-light {
+    background-color: #f1f5f9;
+    color: #4d7eb2
+}
+
+.tag:not(body).is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.tag:not(body).is-link.is-light {
+    background-color: #edfdf9;
+    color: #15987e
+}
+
+.tag:not(body).is-info {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.tag:not(body).is-info.is-light {
+    background-color: #eef6fc;
+    color: #1d72aa
+}
+
+.tag:not(body).is-success {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.tag:not(body).is-success.is-light {
+    background-color: #eefbf4;
+    color: #1d8147
+}
+
+.tag:not(body).is-warning {
+    background-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.tag:not(body).is-warning.is-light {
+    background-color: #fef9ec;
+    color: #8c6a08
+}
+
+.tag:not(body).is-danger {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.tag:not(body).is-danger.is-light {
+    background-color: #fdeeed;
+    color: #c32818
+}
+
+.tag:not(body).is-normal {
+    font-size: .85em
+}
+
+.tag:not(body).is-medium {
+    font-size: 15px
+}
+
+.tag:not(body).is-large {
+    font-size: 1.25rem
+}
+
+.tag:not(body) .icon:first-child:not(:last-child) {
+    margin-left: -.375em;
+    margin-right: .1875em
+}
+
+.tag:not(body) .icon:last-child:not(:first-child) {
+    margin-left: .1875em;
+    margin-right: -.375em
+}
+
+.tag:not(body) .icon:first-child:last-child {
+    margin-left: -.375em;
+    margin-right: -.375em
+}
+
+.tag:not(body).is-delete {
+    margin-left: 1px;
+    padding: 0;
+    position: relative;
+    width: 2em
+}
+
+.tag:not(body).is-delete::after,
+.tag:not(body).is-delete::before {
+    background-color: currentColor;
+    content: "";
+    display: block;
+    left: 50%;
+    position: absolute;
+    top: 50%;
+    transform: translateX(-50%) translateY(-50%) rotate(45deg);
+    transform-origin: center center
+}
+
+.tag:not(body).is-delete::before {
+    height: 1px;
+    width: 50%
+}
+
+.tag:not(body).is-delete::after {
+    height: 50%;
+    width: 1px
+}
+
+.tag:not(body).is-delete:focus,
+.tag:not(body).is-delete:hover {
+    background-color: #1d2122
+}
+
+.tag:not(body).is-delete:active {
+    background-color: #111414
+}
+
+.tag:not(body).is-rounded {
+    border-radius: 290486px
+}
+
+a.tag:hover {
+    text-decoration: underline
+}
+
+.subtitle,
+.title {
+    word-break: break-word
+}
+
+.subtitle em,
+.subtitle span,
+.title em,
+.title span,
+.title strong {
+    font-weight: inherit
+}
+
+.subtitle sub,
+.subtitle sup,
+.title sub,
+.title sup {
+    font-size: .75em
+}
+
+.subtitle .tag,
+.title .tag {
+    vertical-align: middle
+}
+
+.title {
+    color: #fff;
+    font-size: 2rem;
+    font-weight: 500;
+    line-height: 1.125
+}
+
+.title strong {
+    color: inherit
+}
+
+.title+.highlight {
+    margin-top: -.75rem
+}
+
+.subtitle:not(.is-spaced)+.title,
+.title:not(.is-spaced)+.subtitle {
+    margin-top: -1.25rem
+}
+
+.title.is-1 {
+    font-size: 3rem
+}
+
+.title.is-2 {
+    font-size: 2.5rem
+}
+
+.title.is-3 {
+    font-size: 2rem
+}
+
+.title.is-4 {
+    font-size: 1.5rem
+}
+
+.subtitle,
+.title.is-5 {
+    font-size: 1.25rem
+}
+
+.title.is-6 {
+    font-size: 15px
+}
+
+.title.is-7 {
+    font-size: .85em
+}
+
+.subtitle {
+    color: #d4d4d4;
+    font-weight: 400;
+    line-height: 1.25
+}
+
+.subtitle strong {
+    color: #8c9b9d;
+    font-weight: 600
+}
+
+.subtitle.is-1 {
+    font-size: 3rem
+}
+
+.subtitle.is-2 {
+    font-size: 2.5rem
+}
+
+.subtitle.is-3 {
+    font-size: 2rem
+}
+
+.subtitle.is-4 {
+    font-size: 1.5rem
+}
+
+.subtitle.is-5 {
+    font-size: 1.25rem
+}
+
+.subtitle.is-6 {
+    font-size: 15px
+}
+
+.subtitle.is-7 {
+    font-size: .85em
+}
+
+.heading {
+    display: block;
+    font-size: 11px;
+    letter-spacing: 1px;
+    margin-bottom: 5px;
+    text-transform: uppercase
+}
+
+.highlight {
+    font-weight: 400;
+    max-width: 100%;
+    overflow: hidden;
+    padding: 0
+}
+
+.highlight pre {
+    overflow: auto;
+    max-width: 100%
+}
+
+.number {
+    align-items: center;
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: 290486px;
+    display: inline-flex;
+    font-size: 1.25rem;
+    height: 2em;
+    justify-content: center;
+    margin-right: 1.5rem;
+    min-width: 2.5em;
+    padding: .25rem .5rem;
+    text-align: center;
+    vertical-align: top
+}
+
+.input,
+.select select,
+.textarea {
+    border: none;
+    background-color: hsl(var(--main), 15%, 15%);
+    border-radius: .4em;
+    color: #fff
+}
+
+.input:-moz-placeholder,
+.input::-moz-placeholder,
+.select select:-moz-placeholder,
+.select select::-moz-placeholder,
+.textarea:-moz-placeholder,
+.textarea::-moz-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input::-webkit-input-placeholder,
+.select select::-webkit-input-placeholder,
+.textarea::-webkit-input-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input:-ms-input-placeholder,
+.select select:-ms-input-placeholder,
+.textarea:-ms-input-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input:hover,
+.is-hovered.input,
+.is-hovered.textarea,
+.select select.is-hovered,
+.select select:hover,
+.textarea:hover {
+    border-color: hsl(var(--main), 15%, 15%)
+}
+
+.input:active,
+.input:focus,
+.is-active.input,
+.is-active.textarea,
+.is-focused.input,
+.is-focused.textarea,
+.select select.is-active,
+.select select.is-focused,
+.select select:active,
+.select select:focus,
+.textarea:active,
+.textarea:focus {
+    border-color: hsl(var(--main), 45%, 45%);
+    box-shadow: 0 0 0 .125em hsl(var(--main), 25%, 45%, 45%)
+}
+
+.input[disabled],
+.select fieldset[disabled] select,
+.select select[disabled],
+.textarea[disabled],
+fieldset[disabled] .input,
+fieldset[disabled] .select select,
+fieldset[disabled] .textarea {
+    background-color: hsl(var(--main), 15%, 15%);
+    border-color: hsl(var(--main), 10%, 15%);
+    box-shadow: none;
+    color: #fff;
+    opacity: .9
+}
+
+.input[disabled]:-moz-placeholder,
+.input[disabled]::-moz-placeholder,
+.select fieldset[disabled] select:-moz-placeholder,
+.select fieldset[disabled] select::-moz-placeholder,
+.select select[disabled]:-moz-placeholder,
+.select select[disabled]::-moz-placeholder,
+.textarea[disabled]:-moz-placeholder,
+.textarea[disabled]::-moz-placeholder,
+fieldset[disabled] .input:-moz-placeholder,
+fieldset[disabled] .input::-moz-placeholder,
+fieldset[disabled] .select select:-moz-placeholder,
+fieldset[disabled] .select select::-moz-placeholder,
+fieldset[disabled] .textarea:-moz-placeholder,
+fieldset[disabled] .textarea::-moz-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input[disabled]::-webkit-input-placeholder,
+.select fieldset[disabled] select::-webkit-input-placeholder,
+.select select[disabled]::-webkit-input-placeholder,
+.textarea[disabled]::-webkit-input-placeholder,
+fieldset[disabled] .input::-webkit-input-placeholder,
+fieldset[disabled] .select select::-webkit-input-placeholder,
+fieldset[disabled] .textarea::-webkit-input-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input[disabled]:-ms-input-placeholder,
+.select fieldset[disabled] select:-ms-input-placeholder,
+.select select[disabled]:-ms-input-placeholder,
+.textarea[disabled]:-ms-input-placeholder,
+fieldset[disabled] .input:-ms-input-placeholder,
+fieldset[disabled] .select select:-ms-input-placeholder,
+fieldset[disabled] .textarea:-ms-input-placeholder {
+    color: rgba(255, 255, 255, .3)
+}
+
+.input {
+    max-width: 100%
+}
+
+.input,
+.textarea {
+    box-shadow: inset 0 .0625em .125em rgba(10, 10, 10, .05);
+    width: 100%
+}
+
+.input[readonly],
+.textarea[readonly] {
+    box-shadow: none
+}
+
+.is-white.input,
+.is-white.textarea {
+    border-color: #fff
+}
+
+.is-white.input:active,
+.is-white.input:focus,
+.is-white.is-active.input,
+.is-white.is-active.textarea,
+.is-white.is-focused.input,
+.is-white.is-focused.textarea,
+.is-white.textarea:active,
+.is-white.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(255, 255, 255, .25)
+}
+
+.is-black.input,
+.is-black.textarea {
+    border-color: #0a0a0a
+}
+
+.is-black.input:active,
+.is-black.input:focus,
+.is-black.is-active.input,
+.is-black.is-active.textarea,
+.is-black.is-focused.input,
+.is-black.is-focused.textarea,
+.is-black.textarea:active,
+.is-black.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(10, 10, 10, .25)
+}
+
+.is-light.input,
+.is-light.textarea {
+    border-color: #ecf0f1
+}
+
+.is-light.input:active,
+.is-light.input:focus,
+.is-light.is-active.input,
+.is-light.is-active.textarea,
+.is-light.is-focused.input,
+.is-light.is-focused.textarea,
+.is-light.textarea:active,
+.is-light.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(236, 240, 241, .25)
+}
+
+.is-dark.input,
+.is-dark.textarea,
+.select select[disabled]:hover,
+fieldset[disabled] .select select:hover {
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.is-dark.input:active,
+.is-dark.input:focus,
+.is-dark.is-active.input,
+.is-dark.is-active.textarea,
+.is-dark.is-focused.input,
+.is-dark.is-focused.textarea,
+.is-dark.textarea:active,
+.is-dark.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(40, 47, 47, .25)
+}
+
+.is-primary.input,
+.is-primary.textarea {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.is-primary.input:active,
+.is-primary.input:focus,
+.is-primary.is-active.input,
+.is-primary.is-active.textarea,
+.is-primary.is-focused.input,
+.is-primary.is-focused.textarea,
+.is-primary.textarea:active,
+.is-primary.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(55, 90, 127, .25)
+}
+
+.is-link.input,
+.is-link.textarea {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.is-link.input:active,
+.is-link.input:focus,
+.is-link.is-active.input,
+.is-link.is-active.textarea,
+.is-link.is-focused.input,
+.is-link.is-focused.textarea,
+.is-link.textarea:active,
+.is-link.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(26, 188, 156, .25)
+}
+
+.is-info.input,
+.is-info.textarea {
+    border-color: #3298dc
+}
+
+.is-info.input:active,
+.is-info.input:focus,
+.is-info.is-active.input,
+.is-info.is-active.textarea,
+.is-info.is-focused.input,
+.is-info.is-focused.textarea,
+.is-info.textarea:active,
+.is-info.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(50, 152, 220, .25)
+}
+
+.is-success.input,
+.is-success.textarea {
+    border-color: #2ecc71
+}
+
+.is-success.input:active,
+.is-success.input:focus,
+.is-success.is-active.input,
+.is-success.is-active.textarea,
+.is-success.is-focused.input,
+.is-success.is-focused.textarea,
+.is-success.textarea:active,
+.is-success.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(46, 204, 113, .25)
+}
+
+.is-warning.input,
+.is-warning.textarea {
+    border-color: #f1b70e
+}
+
+.is-warning.input:active,
+.is-warning.input:focus,
+.is-warning.is-active.input,
+.is-warning.is-active.textarea,
+.is-warning.is-focused.input,
+.is-warning.is-focused.textarea,
+.is-warning.textarea:active,
+.is-warning.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(241, 183, 14, .25)
+}
+
+.is-danger.input,
+.is-danger.textarea {
+    border-color: #e74c3c
+}
+
+.is-danger.input:active,
+.is-danger.input:focus,
+.is-danger.is-active.input,
+.is-danger.is-active.textarea,
+.is-danger.is-focused.input,
+.is-danger.is-focused.textarea,
+.is-danger.textarea:active,
+.is-danger.textarea:focus {
+    box-shadow: 0 0 0 .125em rgba(231, 76, 60, .25)
+}
+
+.is-small.input,
+.is-small.textarea {
+    border-radius: 3px;
+    font-size: .85em
+}
+
+.is-medium.input,
+.is-medium.textarea {
+    font-size: 1.25rem
+}
+
+.is-large.input,
+.is-large.textarea {
+    font-size: 1.5rem
+}
+
+.is-fullwidth.input,
+.is-fullwidth.textarea {
+    display: block;
+    width: 100%
+}
+
+.is-inline.input,
+.is-inline.textarea {
+    display: inline;
+    width: auto
+}
+
+.input.is-rounded {
+    border-radius: 290486px;
+    padding-left: calc(calc(.75em - 1px) + .375em);
+    padding-right: calc(calc(.75em - 1px) + .375em)
+}
+
+.input.is-static {
+    background-color: transparent;
+    border-color: transparent;
+    box-shadow: none;
+    padding-left: 0;
+    padding-right: 0
+}
+
+.textarea {
+    display: block;
+    max-width: 100%;
+    min-width: 100%;
+    padding: calc(.75em - 1px);
+    resize: vertical
+}
+
+.textarea:not([rows]) {
+    max-height: 40em;
+    min-height: 8em
+}
+
+.textarea[rows] {
+    height: initial
+}
+
+.textarea.has-fixed-size {
+    resize: none
+}
+
+.checkbox,
+.radio,
+.select {
+    display: inline-block;
+    position: relative
+}
+
+.checkbox,
+.radio {
+    cursor: pointer;
+    line-height: 1.25
+}
+
+.checkbox input,
+.radio input {
+    cursor: pointer
+}
+
+.checkbox:hover,
+.radio:hover {
+    color: #8c9b9d
+}
+
+.checkbox[disabled],
+.radio[disabled],
+fieldset[disabled] .checkbox,
+fieldset[disabled] .radio {
+    color: #fff;
+    cursor: not-allowed
+}
+
+.radio+.radio {
+    margin-left: .5em
+}
+
+.select {
+    max-width: 100%;
+    vertical-align: top
+}
+
+.select:not(.is-multiple) {
+    height: 2.5em
+}
+
+.select:not(.is-multiple):not(.is-loading)::after {
+    border-color: #fff;
+    right: 1.125em;
+    z-index: 4
+}
+
+.select.is-rounded select {
+    border-radius: 290486px;
+    padding-left: 1em
+}
+
+.select select {
+    cursor: pointer;
+    display: block;
+    font-size: 1em;
+    max-width: 100%;
+    outline: 0
+}
+
+.select select::-ms-expand {
+    display: none
+}
+
+.select select:not([multiple]) {
+    padding-right: 2.5em
+}
+
+.select select[multiple] {
+    height: auto;
+    padding: 0
+}
+
+.select select[multiple] option {
+    padding: .5em 1em
+}
+
+.select:not(.is-multiple):not(.is-loading):hover::after {
+    border-color: #8c9b9d
+}
+
+.select.is-white:not(:hover)::after {
+    border-color: #fff
+}
+
+.select.is-disabled::after,
+.select.is-white select {
+    border-color: #fff
+}
+
+.select.is-white select.is-hovered,
+.select.is-white select:hover {
+    border-color: #f2f2f2
+}
+
+.select.is-white select.is-active,
+.select.is-white select.is-focused,
+.select.is-white select:active,
+.select.is-white select:focus {
+    box-shadow: 0 0 0 .125em rgba(255, 255, 255, .25)
+}
+
+.select.is-black:not(:hover)::after {
+    border-color: #0a0a0a
+}
+
+.select.is-black select {
+    border-color: #0a0a0a
+}
+
+.select.is-black select.is-hovered,
+.select.is-black select:hover {
+    border-color: #000
+}
+
+.select.is-black select.is-active,
+.select.is-black select.is-focused,
+.select.is-black select:active,
+.select.is-black select:focus {
+    box-shadow: 0 0 0 .125em rgba(10, 10, 10, .25)
+}
+
+.select.is-light:not(:hover)::after {
+    border-color: #ecf0f1
+}
+
+.select.is-light select {
+    border-color: #ecf0f1
+}
+
+.select.is-light select.is-hovered,
+.select.is-light select:hover {
+    border-color: #dde4e6
+}
+
+.select.is-light select.is-active,
+.select.is-light select.is-focused,
+.select.is-light select:active,
+.select.is-light select:focus {
+    box-shadow: 0 0 0 .125em rgba(236, 240, 241, .25)
+}
+
+.select.is-dark:not(:hover)::after {
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.select.is-dark select {
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.select.is-dark select.is-hovered,
+.select.is-dark select:hover {
+    border-color: #1d2122
+}
+
+.select.is-dark select.is-active,
+.select.is-dark select.is-focused,
+.select.is-dark select:active,
+.select.is-dark select:focus {
+    box-shadow: 0 0 0 .125em rgba(40, 47, 47, .25)
+}
+
+.select.is-primary:not(:hover)::after {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.select.is-primary select {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.select.is-primary select.is-hovered,
+.select.is-primary select:hover {
+    border-color: #2f4d6d
+}
+
+.select.is-primary select.is-active,
+.select.is-primary select.is-focused,
+.select.is-primary select:active,
+.select.is-primary select:focus {
+    box-shadow: 0 0 0 .125em rgba(55, 90, 127, .25)
+}
+
+.select.is-link:not(:hover)::after {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.select.is-link select {
+    border-color: hsl(var(--main), 45%, 45%)
+}
+
+.select.is-link select.is-hovered,
+.select.is-link select:hover {
+    border-color: hsl(var(--main), 75%, 80%)
+}
+
+.select.is-link select.is-active,
+.select.is-link select.is-focused,
+.select.is-link select:active,
+.select.is-link select:focus {
+    box-shadow: 0 0 0 .125em rgba(26, 188, 156, .25)
+}
+
+.select.is-info:not(:hover)::after {
+    border-color: #3298dc
+}
+
+.select.is-info select {
+    border-color: #3298dc
+}
+
+.select.is-info select.is-hovered,
+.select.is-info select:hover {
+    border-color: #238cd1
+}
+
+.select.is-info select.is-active,
+.select.is-info select.is-focused,
+.select.is-info select:active,
+.select.is-info select:focus {
+    box-shadow: 0 0 0 .125em rgba(50, 152, 220, .25)
+}
+
+.select.is-success:not(:hover)::after {
+    border-color: #2ecc71
+}
+
+.select.is-success select {
+    border-color: #2ecc71
+}
+
+.select.is-success select.is-hovered,
+.select.is-success select:hover {
+    border-color: #29b765
+}
+
+.select.is-success select.is-active,
+.select.is-success select.is-focused,
+.select.is-success select:active,
+.select.is-success select:focus {
+    box-shadow: 0 0 0 .125em rgba(46, 204, 113, .25)
+}
+
+.select.is-warning:not(:hover)::after {
+    border-color: #f1b70e
+}
+
+.select.is-warning select {
+    border-color: #f1b70e
+}
+
+.select.is-warning select.is-hovered,
+.select.is-warning select:hover {
+    border-color: #d9a50d
+}
+
+.select.is-warning select.is-active,
+.select.is-warning select.is-focused,
+.select.is-warning select:active,
+.select.is-warning select:focus {
+    box-shadow: 0 0 0 .125em rgba(241, 183, 14, .25)
+}
+
+.select.is-danger:not(:hover)::after {
+    border-color: #e74c3c
+}
+
+.select.is-danger select {
+    border-color: #e74c3c
+}
+
+.select.is-danger select.is-hovered,
+.select.is-danger select:hover {
+    border-color: #e43725
+}
+
+.select.is-danger select.is-active,
+.select.is-danger select.is-focused,
+.select.is-danger select:active,
+.select.is-danger select:focus {
+    box-shadow: 0 0 0 .125em rgba(231, 76, 60, .25)
+}
+
+.select.is-small {
+    border-radius: 3px;
+    font-size: .85em
+}
+
+.select.is-medium {
+    font-size: 1.25rem
+}
+
+.select.is-large {
+    font-size: 1.5rem
+}
+
+.select.is-fullwidth,
+.select.is-fullwidth select {
+    width: 100%
+}
+
+.select.is-loading::after {
+    margin-top: 0;
+    position: absolute;
+    right: .625em;
+    top: .625em;
+    transform: none
+}
+
+.file.is-small,
+.select.is-loading.is-small:after {
+    font-size: .85em
+}
+
+.file.is-medium,
+.select.is-loading.is-medium:after {
+    font-size: 1.25rem
+}
+
+.file.is-large,
+.select.is-loading.is-large:after {
+    font-size: 1.5rem
+}
+
+.file {
+    align-items: stretch;
+    display: flex;
+    justify-content: flex-start;
+    position: relative
+}
+
+.file.is-white .file-cta {
+    background-color: #fff;
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.file.is-white.is-hovered .file-cta,
+.file.is-white:hover .file-cta {
+    background-color: #f9f9f9;
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.file.is-white.is-focused .file-cta,
+.file.is-white:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(255, 255, 255, .25);
+    color: #0a0a0a
+}
+
+.file.is-white.is-active .file-cta,
+.file.is-white:active .file-cta {
+    background-color: #f2f2f2;
+    border-color: transparent;
+    color: #0a0a0a
+}
+
+.file.is-black .file-cta {
+    background-color: #0a0a0a;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-black.is-hovered .file-cta,
+.file.is-black:hover .file-cta {
+    background-color: #040404;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-black.is-focused .file-cta,
+.file.is-black:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(10, 10, 10, .25);
+    color: #fff
+}
+
+.file.is-black.is-active .file-cta,
+.file.is-black:active .file-cta {
+    background-color: #000;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-light .file-cta {
+    background-color: #ecf0f1;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-light.is-hovered .file-cta,
+.file.is-light:hover .file-cta {
+    background-color: #e5eaec;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-light.is-focused .file-cta,
+.file.is-light:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(236, 240, 241, .25);
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-light.is-active .file-cta,
+.file.is-light:active .file-cta {
+    background-color: #dde4e6;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-dark .file-cta {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-dark.is-hovered .file-cta,
+.file.is-dark:hover .file-cta {
+    background-color: #232829;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-dark.is-focused .file-cta,
+.file.is-dark:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(40, 47, 47, .25);
+    color: #fff
+}
+
+.file.is-dark.is-active .file-cta,
+.file.is-dark:active .file-cta,
+.file.is-primary .file-cta {
+    background-color: #1d2122;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-primary .file-cta {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.file.is-primary.is-hovered .file-cta,
+.file.is-primary:hover .file-cta {
+    background-color: #335476;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-primary.is-focused .file-cta,
+.file.is-primary:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(55, 90, 127, .25);
+    color: #fff
+}
+
+.file.is-link .file-cta,
+.file.is-primary.is-active .file-cta,
+.file.is-primary:active .file-cta {
+    background-color: #2f4d6d;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-link .file-cta {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+.file.is-link.is-hovered .file-cta,
+.file.is-link:hover .file-cta {
+    background-color: #18b193;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-link.is-focused .file-cta,
+.file.is-link:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(26, 188, 156, .25);
+    color: #fff
+}
+
+.file.is-info .file-cta,
+.file.is-link.is-active .file-cta,
+.file.is-link:active .file-cta {
+    background-color: hsl(var(--main), 75%, 80%);
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-info .file-cta {
+    background-color: #3298dc
+}
+
+.file.is-info.is-hovered .file-cta,
+.file.is-info:hover .file-cta {
+    background-color: #2793da;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-info.is-focused .file-cta,
+.file.is-info:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(50, 152, 220, .25);
+    color: #fff
+}
+
+.file.is-info.is-active .file-cta,
+.file.is-info:active .file-cta,
+.file.is-success .file-cta {
+    background-color: #238cd1;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-success .file-cta {
+    background-color: #2ecc71
+}
+
+.file.is-success.is-hovered .file-cta,
+.file.is-success:hover .file-cta {
+    background-color: #2cc26b;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-success.is-focused .file-cta,
+.file.is-success:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(46, 204, 113, .25);
+    color: #fff
+}
+
+.file.is-success.is-active .file-cta,
+.file.is-success:active .file-cta {
+    background-color: #29b765;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-warning .file-cta {
+    background-color: #f1b70e;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-warning.is-hovered .file-cta,
+.file.is-warning:hover .file-cta {
+    background-color: #e5ae0d;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-warning.is-focused .file-cta,
+.file.is-warning:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(241, 183, 14, .25);
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-warning.is-active .file-cta,
+.file.is-warning:active .file-cta {
+    background-color: #d9a50d;
+    border-color: transparent;
+    color: rgba(0, 0, 0, .7)
+}
+
+.file.is-danger .file-cta {
+    background-color: #e74c3c;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-danger.is-hovered .file-cta,
+.file.is-danger:hover .file-cta {
+    background-color: #e64231;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-danger.is-focused .file-cta,
+.file.is-danger:focus .file-cta {
+    border-color: transparent;
+    box-shadow: 0 0 .5em rgba(231, 76, 60, .25);
+    color: #fff
+}
+
+.file.is-danger.is-active .file-cta,
+.file.is-danger:active .file-cta {
+    background-color: #e43725;
+    border-color: transparent;
+    color: #fff
+}
+
+.file.is-medium .file-icon .fa {
+    font-size: 21px
+}
+
+.file.is-large .file-icon .fa {
+    font-size: 28px
+}
+
+.file.has-name .file-cta {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0
+}
+
+.file.has-name .file-name {
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0
+}
+
+.file.has-name.is-empty .file-cta,
+.level code {
+    border-radius: .4em
+}
+
+.file.has-name.is-empty .file-name {
+    display: none
+}
+
+.file.is-boxed .file-label {
+    flex-direction: column
+}
+
+.file.is-boxed .file-cta {
+    flex-direction: column;
+    height: auto;
+    padding: 1em 3em
+}
+
+.file.is-boxed .file-name {
+    border-width: 0 1px 1px
+}
+
+.file.is-boxed .file-icon {
+    height: 1.5em;
+    width: 1.5em
+}
+
+.file.is-boxed .file-icon .fa {
+    font-size: 21px
+}
+
+.file.is-boxed.is-small .file-icon .fa {
+    font-size: 14px
+}
+
+.file.is-boxed.is-medium .file-icon .fa {
+    font-size: 28px
+}
+
+.file.is-boxed.is-large .file-icon .fa {
+    font-size: 35px
+}
+
+.card .card-image img,
+.file.is-boxed.has-name .file-cta {
+    border-radius: .4em .4em 0 0
+}
+
+.file.is-boxed.has-name .file-name {
+    border-radius: 0 0 .4em .4em;
+    border-width: 0 1px 1px
+}
+
+.file.is-centered {
+    justify-content: center
+}
+
+.file.is-fullwidth .file-label {
+    width: 100%
+}
+
+.file.is-fullwidth .file-name {
+    flex-grow: 1;
+    max-width: none
+}
+
+.file.is-right {
+    justify-content: flex-end
+}
+
+.file.is-right .file-cta {
+    border-radius: 0 .4em .4em 0
+}
+
+.file.is-right .file-name {
+    border-radius: .4em 0 0 .4em;
+    border-width: 1px 0 1px 1px;
+    order: -1
+}
+
+.file-label {
+    align-items: stretch;
+    display: flex;
+    cursor: pointer;
+    justify-content: flex-start;
+    overflow: hidden;
+    position: relative
+}
+
+.file-label:hover .file-cta {
+    background-color: #232829;
+    color: #f2f2f2
+}
+
+.file-label:hover .file-name {
+    border-color: #596668
+}
+
+.file-label:active .file-cta {
+    background-color: #1d2122;
+    color: #f2f2f2
+}
+
+.file-label:active .file-name {
+    border-color: #535f61
+}
+
+.file-input {
+    height: 100%;
+    left: 0;
+    opacity: 0;
+    outline: 0;
+    position: absolute;
+    top: 0;
+    width: 100%
+}
+
+.file-cta {
+    border-color: #5e6d6f
+}
+
+.file-cta,
+.file-name {
+    border-radius: .4em;
+    font-size: 1em;
+    padding-left: 1em;
+    padding-right: 1em;
+    white-space: nowrap
+}
+
+.file-cta {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.file-name {
+    border-color: #5e6d6f;
+    border-style: solid;
+    border-width: 1px 1px 1px 0;
+    display: block;
+    max-width: 16em;
+    overflow: hidden;
+    text-align: left;
+    text-overflow: ellipsis
+}
+
+.file-icon {
+    align-items: center;
+    display: flex;
+    height: 1em;
+    justify-content: center;
+    margin-right: .5em;
+    width: 1em
+}
+
+.file-icon .fa {
+    font-size: 14px
+}
+
+.label {
+    display: block;
+    font-size: 15px;
+    font-weight: 700
+}
+
+.label:not(:last-child) {
+    margin-bottom: .5em
+}
+
+.help,
+.label.is-small {
+    font-size: .85em
+}
+
+.label.is-medium {
+    font-size: 1.25rem
+}
+
+.label.is-large {
+    font-size: 1.5rem
+}
+
+.help {
+    display: block;
+    margin-top: .25rem
+}
+
+.help.is-white {
+    color: #fff
+}
+
+.help.is-black {
+    color: #0a0a0a
+}
+
+.help.is-light {
+    color: #ecf0f1
+}
+
+.help.is-dark {
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.help.is-primary {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.help.is-link {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.help.is-info {
+    color: #3298dc
+}
+
+.help.is-success {
+    color: #2ecc71
+}
+
+.help.is-warning {
+    color: #f1b70e
+}
+
+.help.is-danger {
+    color: #e74c3c
+}
+
+.field:not(:last-child) {
+    margin-bottom: .75rem
+}
+
+.field.has-addons,
+.field.is-grouped {
+    display: flex;
+    justify-content: flex-start
+}
+
+.field.has-addons .control:not(:last-child) {
+    margin-right: -1px
+}
+
+.field.has-addons .control:not(:first-child):not(:last-child) .button,
+.field.has-addons .control:not(:first-child):not(:last-child) .input,
+.field.has-addons .control:not(:first-child):not(:last-child) .select select {
+    border-radius: 0
+}
+
+.field.has-addons .control:first-child:not(:only-child) .button,
+.field.has-addons .control:first-child:not(:only-child) .input,
+.field.has-addons .control:first-child:not(:only-child) .select select {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0
+}
+
+.field.has-addons .control:last-child:not(:only-child) .button,
+.field.has-addons .control:last-child:not(:only-child) .input,
+.field.has-addons .control:last-child:not(:only-child) .select select {
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0
+}
+
+.field.has-addons .control .button:not([disabled]).is-hovered,
+.field.has-addons .control .button:not([disabled]):hover,
+.field.has-addons .control .input:not([disabled]).is-hovered,
+.field.has-addons .control .input:not([disabled]):hover,
+.field.has-addons .control .select select:not([disabled]).is-hovered,
+.field.has-addons .control .select select:not([disabled]):hover {
+    z-index: 2
+}
+
+.field.has-addons .control .button:not([disabled]).is-active,
+.field.has-addons .control .button:not([disabled]).is-focused,
+.field.has-addons .control .button:not([disabled]):active,
+.field.has-addons .control .button:not([disabled]):focus,
+.field.has-addons .control .input:not([disabled]).is-active,
+.field.has-addons .control .input:not([disabled]).is-focused,
+.field.has-addons .control .input:not([disabled]):active,
+.field.has-addons .control .input:not([disabled]):focus,
+.field.has-addons .control .select select:not([disabled]).is-active,
+.field.has-addons .control .select select:not([disabled]).is-focused,
+.field.has-addons .control .select select:not([disabled]):active,
+.field.has-addons .control .select select:not([disabled]):focus {
+    z-index: 3
+}
+
+.field.has-addons .control .button:not([disabled]).is-active:hover,
+.field.has-addons .control .button:not([disabled]).is-focused:hover,
+.field.has-addons .control .button:not([disabled]):active:hover,
+.field.has-addons .control .button:not([disabled]):focus:hover,
+.field.has-addons .control .input:not([disabled]).is-active:hover,
+.field.has-addons .control .input:not([disabled]).is-focused:hover,
+.field.has-addons .control .input:not([disabled]):active:hover,
+.field.has-addons .control .input:not([disabled]):focus:hover,
+.field.has-addons .control .select select:not([disabled]).is-active:hover,
+.field.has-addons .control .select select:not([disabled]).is-focused:hover,
+.field.has-addons .control .select select:not([disabled]):active:hover,
+.field.has-addons .control .select select:not([disabled]):focus:hover {
+    z-index: 4
+}
+
+.field.has-addons .control.is-expanded {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.field.has-addons.has-addons-centered {
+    justify-content: center
+}
+
+.field.has-addons.has-addons-right {
+    justify-content: flex-end
+}
+
+.field.has-addons.has-addons-fullwidth .control,
+.tabs.is-fullwidth li {
+    flex-grow: 1;
+    flex-shrink: 0
+}
+
+.field.is-grouped>.control {
+    flex-shrink: 0
+}
+
+.field.is-grouped>.control:not(:last-child) {
+    margin-bottom: 0;
+    margin-right: .75rem
+}
+
+.field.is-grouped>.control.is-expanded {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.breadcrumb.is-centered ol,
+.breadcrumb.is-centered ul,
+.field.is-grouped.is-grouped-centered {
+    justify-content: center
+}
+
+.breadcrumb.is-right ol,
+.breadcrumb.is-right ul,
+.field.is-grouped.is-grouped-right {
+    justify-content: flex-end
+}
+
+.field.is-grouped.is-grouped-multiline {
+    flex-wrap: wrap
+}
+
+.field.is-grouped.is-grouped-multiline>.control:last-child,
+.field.is-grouped.is-grouped-multiline>.control:not(:last-child) {
+    margin-bottom: .75rem
+}
+
+.field.is-grouped.is-grouped-multiline:last-child {
+    margin-bottom: -.75rem
+}
+
+.field.is-grouped.is-grouped-multiline:not(:last-child) {
+    margin-bottom: 0
+}
+
+@media screen and (min-width: 769px),
+print {
+    .field.is-horizontal {
+        display: flex
+    }
+}
+
+.field-label .label {
+    font-size: inherit
+}
+
+@media screen and (max-width: 768px) {
+    .field-label {
+        margin-bottom: .5rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .field-label {
+        flex-basis: 0;
+        flex-grow: 1;
+        flex-shrink: 0;
+        margin-right: 1.5rem;
+        text-align: right
+    }
+
+    .field-label.is-small {
+        font-size: .85em;
+        padding-top: .375em
+    }
+
+    .field-label.is-normal {
+        padding-top: .375em
+    }
+
+    .field-label.is-medium {
+        font-size: 1.25rem;
+        padding-top: .375em
+    }
+
+    .field-label.is-large {
+        font-size: 1.5rem;
+        padding-top: .375em
+    }
+}
+
+.field-body .field .field {
+    margin-bottom: 0
+}
+
+@media screen and (min-width: 769px),
+print {
+    .field-body {
+        display: flex;
+        flex-basis: 0;
+        flex-grow: 5
+    }
+
+    .field-body .field {
+        margin-bottom: 0
+    }
+
+    .field-body,
+    .field-body>.field {
+        flex-shrink: 1
+    }
+
+    .field-body>.field:not(.is-narrow) {
+        flex-grow: 1
+    }
+
+    .field-body>.field:not(:last-child) {
+        margin-right: .75rem
+    }
+}
+
+.control {
+    box-sizing: border-box;
+    clear: both;
+    font-size: 15px;
+    position: relative;
+    text-align: left
+}
+
+.control.has-icons-left .input:focus~.icon,
+.control.has-icons-left .select:focus~.icon,
+.control.has-icons-right .input:focus~.icon,
+.control.has-icons-right .select:focus~.icon {
+    color: #d4d4d4
+}
+
+.breadcrumb.is-small,
+.control.has-icons-left .input.is-small~.icon,
+.control.has-icons-left .select.is-small~.icon,
+.control.has-icons-right .input.is-small~.icon,
+.control.has-icons-right .select.is-small~.icon,
+.control.is-loading.is-small:after {
+    font-size: .85em
+}
+
+.breadcrumb.is-medium,
+.control.has-icons-left .input.is-medium~.icon,
+.control.has-icons-left .select.is-medium~.icon,
+.control.has-icons-right .input.is-medium~.icon,
+.control.has-icons-right .select.is-medium~.icon,
+.control.is-loading.is-medium:after {
+    font-size: 1.25rem
+}
+
+.breadcrumb.is-large,
+.control.has-icons-left .input.is-large~.icon,
+.control.has-icons-left .select.is-large~.icon,
+.control.has-icons-right .input.is-large~.icon,
+.control.has-icons-right .select.is-large~.icon,
+.control.is-loading.is-large:after {
+    font-size: 1.5rem
+}
+
+.control.has-icons-left .icon,
+.control.has-icons-right .icon {
+    color: #d4d4d4;
+    height: 2.5em;
+    pointer-events: none;
+    position: absolute;
+    top: 0;
+    width: 2.5em;
+    z-index: 4
+}
+
+.control.has-icons-left .input,
+.control.has-icons-left .select select {
+    padding-left: 2.5em
+}
+
+.control.has-icons-left .icon.is-left {
+    left: 0
+}
+
+.control.has-icons-right .input,
+.control.has-icons-right .select select {
+    padding-right: 2.5em
+}
+
+.control.has-icons-right .icon.is-right {
+    right: 0
+}
+
+.control.is-loading::after {
+    position: absolute !important;
+    right: .625em;
+    top: .625em;
+    z-index: 4
+}
+
+.breadcrumb {
+    font-size: 15px;
+    white-space: nowrap
+}
+
+.breadcrumb a {
+    justify-content: center;
+    padding: 0 .75em
+}
+
+.breadcrumb a:hover {
+    color: hsl(var(--main), 75%, 90%)
+}
+
+.breadcrumb a,
+.breadcrumb li {
+    align-items: center;
+    display: flex
+}
+
+.breadcrumb li:first-child a {
+    padding-left: 0
+}
+
+.breadcrumb li.is-active a {
+    color: #f2f2f2;
+    cursor: default;
+    pointer-events: none
+}
+
+.breadcrumb li+li::before {
+    color: #8c9b9d;
+    content: "\0002f"
+}
+
+.breadcrumb ol,
+.breadcrumb ul {
+    align-items: flex-start;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start
+}
+
+.breadcrumb .icon:first-child {
+    margin-right: .5em
+}
+
+.breadcrumb .icon:last-child {
+    margin-left: .5em
+}
+
+.breadcrumb.has-arrow-separator li+li::before {
+    content: "\02192"
+}
+
+.breadcrumb.has-bullet-separator li+li::before {
+    content: "\02022"
+}
+
+.breadcrumb.has-dot-separator li+li::before {
+    content: "\000b7"
+}
+
+.breadcrumb.has-succeeds-separator li+li::before {
+    content: "\0227B"
+}
+
+.card {
+    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .02);
+    color: #fff;
+    max-width: 100%;
+    position: relative
+}
+
+.card-header {
+    background-color: transparent;
+    align-items: stretch;
+    box-shadow: 0 .125em .25em rgba(10, 10, 10, .1);
+    display: flex
+}
+
+.card-header-title {
+    align-items: center;
+    color: #f2f2f2;
+    display: flex;
+    flex-grow: 1;
+    font-weight: 700;
+    padding: .75rem 1rem
+}
+
+.card-header-icon,
+.card-header-title.is-centered {
+    justify-content: center
+}
+
+.card-header-icon {
+    align-items: center;
+    cursor: pointer;
+    display: flex;
+    padding: .75rem 1rem
+}
+
+.card-image {
+    display: block;
+    position: relative
+}
+
+.card-content,
+.card-footer {
+    background-color: transparent
+}
+
+.card-content {
+    padding: 1.5rem
+}
+
+.card-footer {
+    border-top: 1px solid #ededed;
+    align-items: stretch;
+    display: flex
+}
+
+.card-footer-item {
+    align-items: center;
+    display: flex;
+    flex-basis: 0;
+    flex-grow: 1;
+    flex-shrink: 0;
+    justify-content: center;
+    padding: .75rem
+}
+
+.card-footer-item:not(:last-child) {
+    border-right: 1px solid #ededed
+}
+
+.card .media:not(:last-child) {
+    margin-bottom: 1.5rem
+}
+
+.dropdown {
+    display: inline-flex;
+    position: relative;
+    vertical-align: top
+}
+
+.dropdown.is-active .dropdown-menu,
+.dropdown.is-hoverable:hover .dropdown-menu {
+    display: block
+}
+
+.dropdown.is-right .dropdown-menu {
+    left: auto;
+    right: 0
+}
+
+.dropdown.is-up .dropdown-menu {
+    bottom: 100%;
+    padding-bottom: 4px;
+    padding-top: initial;
+    top: auto
+}
+
+.dropdown-menu {
+    display: none;
+    left: 0;
+    min-width: 12rem;
+    padding-top: 4px;
+    position: absolute;
+    top: 100%;
+    z-index: 20
+}
+
+.dropdown-content {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: .4em;
+    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .02);
+    padding-bottom: .5rem;
+    padding-top: .5rem
+}
+
+.dropdown-item {
+    color: #fff;
+    display: block;
+    font-size: .875rem;
+    line-height: 1.5;
+    padding: .375rem 1rem;
+    position: relative
+}
+
+a.dropdown-item,
+button.dropdown-item {
+    padding-right: 3rem;
+    text-align: left;
+    white-space: nowrap;
+    width: 100%
+}
+
+a.dropdown-item:hover,
+button.dropdown-item:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #0a0a0a
+}
+
+a.dropdown-item.is-active,
+button.dropdown-item.is-active {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.dropdown-divider {
+    background-color: #ededed;
+    border: 0;
+    display: block;
+    height: 1px;
+    margin: .5rem 0
+}
+
+.level {
+    align-items: center;
+    justify-content: space-between
+}
+
+.level img {
+    display: inline-block;
+    vertical-align: top
+}
+
+.level.is-mobile,
+.level.is-mobile .level-left,
+.level.is-mobile .level-right {
+    display: flex
+}
+
+.level.is-mobile .level-left+.level-right {
+    margin-top: 0
+}
+
+.level.is-mobile .level-item:not(:last-child) {
+    margin-bottom: 0;
+    margin-right: .75rem
+}
+
+.level.is-mobile .level-item:not(.is-narrow) {
+    flex-grow: 1
+}
+
+@media screen and (min-width: 769px),
+print {
+    .level {
+        display: flex
+    }
+
+    .level>.level-item:not(.is-narrow) {
+        flex-grow: 1
+    }
+}
+
+.level-item {
+    align-items: center;
+    display: flex;
+    justify-content: center
+}
+
+.level-item .subtitle,
+.level-item .title {
+    margin-bottom: 0
+}
+
+@media screen and (max-width: 768px) {
+    .level-item:not(:last-child) {
+        margin-bottom: .75rem
+    }
+}
+
+.level-item,
+.level-left,
+.level-right {
+    flex-basis: auto;
+    flex-grow: 0;
+    flex-shrink: 0
+}
+
+.level-left .level-item.is-flexible,
+.level-right .level-item.is-flexible {
+    flex-grow: 1
+}
+
+@media screen and (min-width: 769px),
+print {
+
+    .level-left .level-item:not(:last-child),
+    .level-right .level-item:not(:last-child) {
+        margin-right: .75rem
+    }
+}
+
+.level-left {
+    align-items: center;
+    justify-content: flex-start
+}
+
+@media screen and (max-width: 768px) {
+    .level-left+.level-right {
+        margin-top: 1.5rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .level-left {
+        display: flex
+    }
+}
+
+.level-right {
+    align-items: center;
+    justify-content: flex-end
+}
+
+@media screen and (min-width: 769px),
+print {
+    .level-right {
+        display: flex
+    }
+}
+
+.list {
+    background-color: #fff;
+    border-radius: .4em;
+    box-shadow: 0 2px 3px rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .1)
+}
+
+.list-item {
+    display: block;
+    padding: .5em 1em
+}
+
+.list-item:not(a) {
+    color: #fff
+}
+
+.list-item:first-child {
+    border-top-left-radius: .4em;
+    border-top-right-radius: .4em
+}
+
+.list-item:last-child {
+    border-bottom-left-radius: .4em;
+    border-bottom-right-radius: .4em
+}
+
+.list-item:not(:last-child) {
+    border-bottom: 1px solid #5e6d6f
+}
+
+.list-item.is-active {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+a.list-item {
+    background-color: hsl(var(--main), 10%, 15%);
+    cursor: pointer
+}
+
+.media {
+    align-items: flex-start;
+    display: flex;
+    text-align: left
+}
+
+.media .content:not(:last-child) {
+    margin-bottom: .75rem
+}
+
+.media .media {
+    border-top: 1px solid rgba(94, 109, 111, .5);
+    display: flex;
+    padding-top: .75rem
+}
+
+.media .media .content:not(:last-child),
+.media .media .control:not(:last-child) {
+    margin-bottom: .5rem
+}
+
+.media .media .media {
+    padding-top: .5rem
+}
+
+.media .media .media+.media {
+    margin-top: .5rem
+}
+
+.media+.media {
+    border-top: 1px solid rgba(94, 109, 111, .5);
+    margin-top: 1rem;
+    padding-top: 1rem
+}
+
+.media.is-large+.media {
+    margin-top: 1.5rem;
+    padding-top: 1.5rem
+}
+
+.media-left,
+.media-right {
+    flex-basis: auto;
+    flex-grow: 0;
+    flex-shrink: 0
+}
+
+.media-left {
+    margin-right: 1rem
+}
+
+.media-right {
+    margin-left: 1rem
+}
+
+.media-content {
+    flex-basis: auto;
+    flex-grow: 1;
+    flex-shrink: 1;
+    text-align: left
+}
+
+@media screen and (max-width: 768px) {
+    .media-content {
+        overflow-x: auto
+    }
+}
+
+.menu {
+    font-size: 15px
+}
+
+.menu.is-small {
+    font-size: .85em
+}
+
+.menu.is-medium {
+    font-size: 1.25rem
+}
+
+.menu.is-large {
+    font-size: 1.5rem
+}
+
+.menu-list {
+    line-height: 1.25
+}
+
+.menu-list a {
+    border-radius: 3px;
+    color: #fff;
+    display: block;
+    padding: .5em .75em
+}
+
+.menu-list a:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #f2f2f2
+}
+
+.menu-list a.is-active {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.menu-list li ul {
+    border-left: 1px solid #5e6d6f;
+    margin: .75em;
+    padding-left: .75em
+}
+
+.menu-label {
+    color: #fff;
+    font-size: .75em;
+    letter-spacing: .1em;
+    text-transform: uppercase
+}
+
+.menu-label:not(:first-child) {
+    margin-top: 1em
+}
+
+.menu-label:not(:last-child) {
+    margin-bottom: 1em
+}
+
+.message {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: .4em;
+    font-size: 15px
+}
+
+.message strong {
+    color: currentColor
+}
+
+.message.is-small {
+    font-size: .85em
+}
+
+.message.is-medium {
+    font-size: 1.25rem
+}
+
+.message.is-large {
+    font-size: 1.5rem
+}
+
+.message-body code,
+.message-body pre,
+.message.is-white {
+    background-color: #fff
+}
+
+.message.is-white .message-header {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.message.is-white .message-body {
+    border-color: #fff;
+    color: #000
+}
+
+.message.is-black {
+    background-color: #fafafa
+}
+
+.message.is-black .message-header {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.message.is-black .message-body,
+.navbar.is-white .navbar-brand .navbar-link::after {
+    border-color: #0a0a0a;
+    color: #000
+}
+
+.message.is-light {
+    background-color: #f9fafb
+}
+
+.message.is-light .message-header {
+    background-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.message.is-light .message-body {
+    border-color: #ecf0f1;
+    color: #000
+}
+
+.message.is-dark {
+    background-color: #f9fafa
+}
+
+.message.is-dark .message-header {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.message.is-dark .message-body {
+    border-color: hsl(var(--main), 10%, 15%);
+    color: #000
+}
+
+.message.is-primary {
+    background-color: hsl(var(--main), 50%, 90%)
+}
+
+.message.is-primary .message-header {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.message.is-primary .message-body {
+    border-color: hsl(var(--main), 45%, 45%);
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.message.is-info {
+    background-color: #eef6fc
+}
+
+.message.is-info .message-header {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.message.is-info .message-body {
+    border-color: #3298dc;
+    color: #1d72aa
+}
+
+.message.is-success {
+    background-color: #eefbf4
+}
+
+.message.is-success .message-header {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.message.is-success .message-body {
+    border-color: #2ecc71;
+    color: #1d8147
+}
+
+.message.is-warning {
+    background-color: #fef9ec
+}
+
+.message.is-warning .message-header {
+    background-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.message.is-warning .message-body {
+    border-color: #f1b70e;
+    color: #8c6a08
+}
+
+.message.is-danger {
+    background-color: #fdeeed
+}
+
+.message.is-danger .message-header {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.message.is-danger .message-body {
+    border-color: #e74c3c;
+    color: #c32818
+}
+
+.message-header {
+    align-items: center;
+    border-radius: .4em .4em 0 0;
+    color: rgba(0, 0, 0, .7);
+    display: flex;
+    justify-content: space-between;
+    line-height: 1.25;
+    padding: .75em 1em;
+    position: relative
+}
+
+.message-header .delete {
+    flex-grow: 0;
+    flex-shrink: 0;
+    margin-left: .75em
+}
+
+.message-header+.message-body {
+    border-width: 0;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0
+}
+
+.message-body {
+    border-radius: .4em;
+    border-style: solid;
+    color: #fff;
+    padding: 1.25em 1.5em
+}
+
+.modal {
+    align-items: center;
+    display: none;
+    flex-direction: column;
+    justify-content: center;
+    overflow: hidden;
+    position: fixed;
+    z-index: 40
+}
+
+.modal.is-active {
+    display: flex
+}
+
+.modal-background {
+    background-color: rgba(10, 10, 10, .86)
+}
+
+.modal-content {
+    max-height: calc(100vh - 160px);
+    overflow: auto
+}
+
+.modal-card,
+.modal-content {
+    margin: 0 20px;
+    position: relative;
+    width: 100%
+}
+
+@media screen and (min-width: 769px),
+print {
+
+    .modal-card,
+    .modal-content {
+        margin: 0 auto;
+        max-height: calc(100vh - 40px);
+        width: 640px
+    }
+}
+
+.modal-close {
+    background: 0 0;
+    height: 40px;
+    position: fixed;
+    right: 20px;
+    top: 20px;
+    width: 40px
+}
+
+.modal-card {
+    display: flex;
+    flex-direction: column;
+    max-height: calc(100vh - 40px);
+    overflow: hidden;
+    -ms-overflow-y: visible
+}
+
+.modal-card-foot,
+.modal-card-head {
+    align-items: center;
+    background-color: hsl(var(--main), 10%, 15%);
+    display: flex;
+    flex-shrink: 0;
+    justify-content: flex-start;
+    padding: 20px;
+    position: relative
+}
+
+.modal-card-head {
+    border-bottom: 1px solid #5e6d6f;
+    border-top-left-radius: 8px;
+    border-top-right-radius: 8px
+}
+
+.modal-card-title {
+    color: #f2f2f2;
+    flex-grow: 1;
+    flex-shrink: 0;
+    font-size: 1.5rem;
+    line-height: 1
+}
+
+.modal-card-foot {
+    border-bottom-left-radius: 8px;
+    border-bottom-right-radius: 8px;
+    border-top: 1px solid #5e6d6f
+}
+
+.modal-card-foot .button:not(:last-child) {
+    margin-right: .5em
+}
+
+.modal-card-body {
+    -webkit-overflow-scrolling: touch;
+    flex-grow: 1;
+    flex-shrink: 1;
+    overflow: auto;
+    padding: 20px
+}
+
+.navbar {
+    background-color: hsl(var(--main), 45%, 45%);
+    min-height: 4rem;
+    position: relative;
+    z-index: 30
+}
+
+.navbar>.container {
+    align-items: stretch;
+    display: flex;
+    min-height: 4rem;
+    width: 100%
+}
+
+.navbar.has-shadow {
+    box-shadow: 0 2px 0 0 hsl(var(--main), 10%, 15%)
+}
+
+.navbar.is-fixed-bottom,
+.navbar.is-fixed-top {
+    left: 0;
+    position: fixed;
+    right: 0;
+    z-index: 30
+}
+
+.navbar.is-fixed-bottom {
+    bottom: 0
+}
+
+.navbar.is-fixed-bottom.has-shadow {
+    box-shadow: 0 -2px 0 0 hsl(var(--main), 10%, 15%)
+}
+
+.navbar.is-fixed-top {
+    top: 0
+}
+
+body.has-navbar-fixed-top,
+html.has-navbar-fixed-top {
+    padding-top: 4rem
+}
+
+body.has-navbar-fixed-bottom,
+html.has-navbar-fixed-bottom {
+    padding-bottom: 4rem
+}
+
+.navbar-brand,
+.navbar-tabs {
+    align-items: stretch;
+    display: flex;
+    flex-shrink: 0;
+    min-height: 4rem
+}
+
+.navbar-brand a.navbar-item:focus,
+.navbar-brand a.navbar-item:hover {
+    background-color: transparent
+}
+
+.navbar-tabs {
+    -webkit-overflow-scrolling: touch;
+    max-width: 100vw;
+    overflow-x: auto;
+    overflow-y: hidden
+}
+
+.navbar-burger {
+    color: #fff;
+    cursor: pointer;
+    display: block;
+    height: 4rem;
+    position: relative;
+    width: 4rem;
+    margin-left: auto
+}
+
+.navbar-burger span {
+    background-color: currentColor;
+    display: block;
+    height: 1px;
+    left: calc(50% - 8px);
+    position: absolute;
+    transform-origin: center;
+    transition-duration: 86ms;
+    transition-property: background-color, opacity, transform;
+    transition-timing-function: ease-out;
+    width: 16px
+}
+
+.navbar-burger span:nth-child(1) {
+    top: calc(50% - 6px)
+}
+
+.navbar-burger span:nth-child(2) {
+    top: calc(50% - 1px)
+}
+
+.navbar-burger span:nth-child(3) {
+    top: calc(50% + 4px)
+}
+
+.navbar-burger:hover {
+    background-color: rgba(0, 0, 0, .05)
+}
+
+.navbar-burger.is-active span:nth-child(1) {
+    transform: translateY(5px) rotate(45deg)
+}
+
+.navbar-burger.is-active span:nth-child(2) {
+    opacity: 0
+}
+
+.navbar-burger.is-active span:nth-child(3) {
+    transform: translateY(-5px) rotate(-45deg)
+}
+
+.navbar-menu {
+    display: none
+}
+
+.navbar-item,
+.navbar-link {
+    color: #fff;
+    display: block;
+    line-height: 1.5;
+    padding: .5rem .75rem;
+    position: relative
+}
+
+.navbar-item .icon:only-child,
+.navbar-link .icon:only-child {
+    margin-left: -.25rem;
+    margin-right: -.25rem
+}
+
+.navbar-link,
+a.navbar-item {
+    cursor: pointer
+}
+
+.navbar-link.is-active,
+.navbar-link:focus,
+.navbar-link:focus-within,
+.navbar-link:hover,
+a.navbar-item.is-active,
+a.navbar-item:focus,
+a.navbar-item:focus-within,
+a.navbar-item:hover {
+    background-color: transparent;
+    color: hsl(var(--main), 50%, 75%)
+}
+
+.navbar-item {
+    flex-grow: 0;
+    flex-shrink: 0
+}
+
+.navbar-item img {
+    max-height: 1.75rem
+}
+
+.navbar-item.has-dropdown {
+    padding: 0
+}
+
+.navbar-content,
+.navbar-item.is-expanded {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.navbar-item.is-tab {
+    border-bottom: 1px solid transparent;
+    min-height: 4rem;
+    padding-bottom: calc(.5rem - 1px)
+}
+
+.navbar-item.is-tab:focus,
+.navbar-item.is-tab:hover {
+    background-color: transparent;
+    border-bottom-color: hsl(var(--main), 45%, 45%)
+}
+
+.navbar-item.is-tab.is-active {
+    background-color: transparent;
+    border-bottom-color: hsl(var(--main), 45%, 45%);
+    border-bottom-style: solid;
+    border-bottom-width: 3px;
+    color: hsl(var(--main), 45%, 45%);
+    padding-bottom: calc(.5rem - 3px)
+}
+
+.navbar-link:not(.is-arrowless) {
+    padding-right: 2.5em
+}
+
+.navbar-link:not(.is-arrowless)::after {
+    border-color: #fff;
+    margin-top: -.375em;
+    right: 1.125em
+}
+
+.navbar-dropdown {
+    font-size: .875rem;
+    padding-bottom: .5rem;
+    padding-top: .5rem
+}
+
+.navbar-dropdown .navbar-item {
+    padding-left: 1.5rem;
+    padding-right: 1.5rem
+}
+
+.navbar-divider {
+    background-color: rgba(0, 0, 0, .2);
+    border: 0;
+    display: none;
+    height: 2px;
+    margin: .5rem 0
+}
+
+@media screen and (max-width: 1023px) {
+    .navbar>.container {
+        display: block
+    }
+
+    .navbar-brand .navbar-item,
+    .navbar-tabs .navbar-item {
+        align-items: center;
+        display: flex
+    }
+
+    .navbar-link::after {
+        display: none
+    }
+
+    .navbar-menu {
+        background-color: hsl(var(--main), 45%, 45%);
+        box-shadow: 0 8px 16px rgba(10, 10, 10, .1);
+        padding: .5rem 0
+    }
+
+    .navbar-menu.is-active {
+        display: block
+    }
+
+    .navbar.is-fixed-bottom-touch,
+    .navbar.is-fixed-top-touch {
+        left: 0;
+        position: fixed;
+        right: 0;
+        z-index: 30
+    }
+
+    .navbar.is-fixed-bottom-touch {
+        bottom: 0
+    }
+
+    .navbar.is-fixed-bottom-touch.has-shadow {
+        box-shadow: 0 -2px 3px rgba(10, 10, 10, .1)
+    }
+
+    .navbar.is-fixed-top-touch {
+        top: 0
+    }
+
+    .navbar.is-fixed-top .navbar-menu,
+    .navbar.is-fixed-top-touch .navbar-menu {
+        -webkit-overflow-scrolling: touch;
+        max-height: calc(100vh - 4rem);
+        overflow: auto
+    }
+
+    body.has-navbar-fixed-top-touch,
+    html.has-navbar-fixed-top-touch {
+        padding-top: 4rem
+    }
+
+    body.has-navbar-fixed-bottom-touch,
+    html.has-navbar-fixed-bottom-touch {
+        padding-bottom: 4rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+
+    .navbar,
+    .navbar-end,
+    .navbar-menu,
+    .navbar-start {
+        align-items: stretch;
+        display: flex
+    }
+
+    .navbar {
+        min-height: 4rem
+    }
+
+    .navbar.is-spaced {
+        padding: 1rem 2rem
+    }
+
+    .navbar.is-spaced .navbar-end,
+    .navbar.is-spaced .navbar-start {
+        align-items: center
+    }
+
+    .navbar.is-spaced .navbar-link,
+    .navbar.is-spaced a.navbar-item {
+        border-radius: .4em
+    }
+
+    .navbar.is-transparent .navbar-link.is-active,
+    .navbar.is-transparent .navbar-link:focus,
+    .navbar.is-transparent .navbar-link:hover,
+    .navbar.is-transparent a.navbar-item.is-active,
+    .navbar.is-transparent a.navbar-item:focus,
+    .navbar.is-transparent a.navbar-item:hover {
+        background-color: transparent !important
+    }
+
+    .navbar.is-transparent .navbar-item.has-dropdown.is-active .navbar-link,
+    .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:focus .navbar-link,
+    .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:focus-within .navbar-link,
+    .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:hover .navbar-link {
+        background-color: transparent !important
+    }
+
+    .navbar-dropdown a.navbar-item:focus,
+    .navbar-dropdown a.navbar-item:hover,
+    .navbar.is-transparent .navbar-dropdown a.navbar-item:focus,
+    .navbar.is-transparent .navbar-dropdown a.navbar-item:hover {
+        background-color: transparent;
+        color: #dbdee0
+    }
+
+    .navbar-dropdown a.navbar-item.is-active,
+    .navbar.is-transparent .navbar-dropdown a.navbar-item.is-active {
+        background-color: transparent;
+        color: hsl(var(--main), 45%, 45%)
+    }
+
+    .navbar-burger {
+        display: none
+    }
+
+    .navbar-item,
+    .navbar-link {
+        align-items: center
+    }
+
+    .navbar-link {
+        display: flex
+    }
+
+    .navbar-item {
+        display: flex
+    }
+
+    .navbar-item.has-dropdown {
+        align-items: stretch
+    }
+
+    .navbar-item.has-dropdown-up .navbar-link::after {
+        transform: rotate(135deg) translate(.25em, -.25em)
+    }
+
+    .navbar-item.has-dropdown-up .navbar-dropdown {
+        border-bottom: 1px solid rgba(0, 0, 0, .2);
+        border-radius: 8px 8px 0 0;
+        border-top: none;
+        bottom: 100%;
+        box-shadow: 0 -8px 8px rgba(10, 10, 10, .1);
+        top: auto
+    }
+
+    .navbar-item.is-active .navbar-dropdown,
+    .navbar-item.is-hoverable:focus .navbar-dropdown,
+    .navbar-item.is-hoverable:focus-within .navbar-dropdown,
+    .navbar-item.is-hoverable:hover .navbar-dropdown {
+        display: block
+    }
+
+    .navbar-item.is-active .navbar-dropdown.is-boxed,
+    .navbar-item.is-hoverable:focus .navbar-dropdown.is-boxed,
+    .navbar-item.is-hoverable:focus-within .navbar-dropdown.is-boxed,
+    .navbar-item.is-hoverable:hover .navbar-dropdown.is-boxed,
+    .navbar.is-spaced .navbar-item.is-active .navbar-dropdown,
+    .navbar.is-spaced .navbar-item.is-hoverable:focus .navbar-dropdown,
+    .navbar.is-spaced .navbar-item.is-hoverable:focus-within .navbar-dropdown,
+    .navbar.is-spaced .navbar-item.is-hoverable:hover .navbar-dropdown {
+        opacity: 1;
+        pointer-events: auto;
+        transform: translateY(0)
+    }
+
+    .navbar-menu {
+        flex-grow: 1;
+        flex-shrink: 0
+    }
+
+    .navbar-start {
+        justify-content: flex-start;
+        margin-right: auto
+    }
+
+    .navbar-end {
+        justify-content: flex-end;
+        margin-left: auto
+    }
+
+    .navbar-dropdown {
+        background-color: hsl(var(--main), 45%, 45%);
+        border-bottom-left-radius: 8px;
+        border-bottom-right-radius: 8px;
+        border-top: 1px solid rgba(0, 0, 0, .2);
+        box-shadow: 0 8px 8px rgba(10, 10, 10, .1);
+        display: none;
+        font-size: .875rem;
+        left: 0;
+        min-width: 100%;
+        position: absolute;
+        top: 100%;
+        z-index: 20
+    }
+
+    .navbar-dropdown .navbar-item {
+        padding: .375rem 1rem;
+        white-space: nowrap
+    }
+
+    .navbar-dropdown a.navbar-item {
+        padding-right: 3rem
+    }
+
+    .navbar-dropdown.is-boxed,
+    .navbar.is-spaced .navbar-dropdown {
+        border-radius: 8px;
+        border-top: none;
+        box-shadow: 0 8px 8px rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .1);
+        display: block;
+        opacity: 0;
+        pointer-events: none;
+        top: calc(100% + (-4px));
+        transform: translateY(-5px);
+        transition-duration: 86ms;
+        transition-property: opacity, transform
+    }
+
+    .navbar-dropdown.is-right {
+        left: auto;
+        right: 0
+    }
+
+    .navbar-divider {
+        display: block
+    }
+
+    .container>.navbar .navbar-brand,
+    .navbar>.container .navbar-brand {
+        margin-left: -.75rem
+    }
+
+    .container>.navbar .navbar-menu,
+    .navbar>.container .navbar-menu {
+        margin-right: -.75rem
+    }
+
+    .navbar.is-fixed-bottom-desktop,
+    .navbar.is-fixed-top-desktop {
+        left: 0;
+        position: fixed;
+        right: 0;
+        z-index: 30
+    }
+
+    .navbar.is-fixed-bottom-desktop {
+        bottom: 0
+    }
+
+    .navbar.is-fixed-bottom-desktop.has-shadow {
+        box-shadow: 0 -2px 3px rgba(10, 10, 10, .1)
+    }
+
+    .navbar.is-fixed-top-desktop {
+        top: 0
+    }
+
+    body.has-navbar-fixed-top-desktop,
+    html.has-navbar-fixed-top-desktop {
+        padding-top: 4rem
+    }
+
+    body.has-navbar-fixed-bottom-desktop,
+    html.has-navbar-fixed-bottom-desktop {
+        padding-bottom: 4rem
+    }
+
+    body.has-spaced-navbar-fixed-top,
+    html.has-spaced-navbar-fixed-top {
+        padding-top: 6rem
+    }
+
+    body.has-spaced-navbar-fixed-bottom,
+    html.has-spaced-navbar-fixed-bottom {
+        padding-bottom: 6rem
+    }
+
+    .navbar-link.is-active,
+    a.navbar-item.is-active {
+        color: hsl(var(--main), 45%, 85%)
+    }
+
+    .navbar-link.is-active:not(:focus):not(:hover),
+    a.navbar-item.is-active:not(:focus):not(:hover) {
+        background-color: transparent
+    }
+
+    .navbar-item.has-dropdown.is-active .navbar-link,
+    .navbar-item.has-dropdown:focus .navbar-link,
+    .navbar-item.has-dropdown:hover .navbar-link {
+        background-color: transparent
+    }
+}
+
+.hero.is-fullheight-with-navbar {
+    min-height: calc(100vh - 4rem)
+}
+
+.pagination {
+    font-size: 15px;
+    margin: -.25rem
+}
+
+.pagination.is-small {
+    font-size: .85em
+}
+
+.pagination.is-medium {
+    font-size: 1.25rem
+}
+
+.pagination.is-large {
+    font-size: 1.5rem
+}
+
+.pagination.is-rounded .pagination-next,
+.pagination.is-rounded .pagination-previous {
+    padding-left: 1em;
+    padding-right: 1em;
+    border-radius: 290486px
+}
+
+.pagination.is-rounded .pagination-link {
+    border-radius: 290486px
+}
+
+.pagination,
+.pagination-list {
+    align-items: center;
+    display: flex;
+    justify-content: center;
+    text-align: center
+}
+
+.pagination-ellipsis,
+.pagination-link,
+.pagination-next,
+.pagination-previous {
+    font-size: 1em;
+    justify-content: center;
+    margin: .25rem;
+    text-align: center
+}
+
+.pagination-ellipsis,
+.pagination-link {
+    padding-left: .5em;
+    padding-right: .5em
+}
+
+.pagination-link,
+.pagination-next,
+.pagination-previous {
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff;
+    background: hsl(var(--main), 45%, 45%);
+    min-width: 2.5em
+}
+
+.pagination-link:hover,
+.pagination-next:hover,
+.pagination-previous:hover {
+    border-color: hsl(var(--main), 85%, 85%);
+    color: hsl(var(--main), 65%, 85%)
+}
+
+.pagination-link:focus,
+.pagination-next:focus,
+.pagination-previous:focus {
+    border-color: #8c9b9d
+}
+
+.pagination-link:active,
+.pagination-next:active,
+.pagination-previous:active {
+    box-shadow: inset 0 1px 2px rgb(10 10 10 / 20%)
+}
+
+.pagination-link[disabled],
+.pagination-next[disabled],
+.pagination-previous[disabled] {
+    background-color: #5e6d6f;
+    border-color: #5e6d6f;
+    box-shadow: none;
+    color: #fff;
+    opacity: .5
+}
+
+.pagination-next,
+.pagination-previous {
+    padding-left: .75em;
+    padding-right: .75em;
+    white-space: nowrap
+}
+
+.pagination-link.is-current {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.pagination-ellipsis {
+    color: #8c9b9d;
+    pointer-events: none
+}
+
+.pagination-list {
+    flex-wrap: wrap
+}
+
+@media screen and (max-width: 768px) {
+    .pagination {
+        flex-wrap: wrap
+    }
+
+    .pagination-list li,
+    .pagination-next,
+    .pagination-previous {
+        flex-grow: 1;
+        flex-shrink: 1
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .pagination-list {
+        flex-grow: 1;
+        flex-shrink: 1;
+        justify-content: flex-start;
+        order: 1
+    }
+
+    .pagination-previous {
+        order: 2
+    }
+
+    .pagination-next {
+        order: 3
+    }
+
+    .pagination {
+        justify-content: space-between
+    }
+
+    .pagination.is-centered .pagination-previous {
+        order: 1
+    }
+
+    .pagination.is-centered .pagination-list {
+        justify-content: center;
+        order: 2
+    }
+
+    .pagination.is-centered .pagination-next {
+        order: 3
+    }
+
+    .pagination.is-right .pagination-previous {
+        order: 1
+    }
+
+    .pagination.is-right .pagination-next {
+        order: 2
+    }
+
+    .pagination.is-right .pagination-list {
+        justify-content: flex-end;
+        order: 3
+    }
+}
+
+.panel {
+    border-radius: 8px;
+    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .02);
+    font-size: 15px;
+    background: hsl(var(--main), 15%, 12%)
+}
+
+.panel:not(:last-child) {
+    margin-bottom: 1.5rem
+}
+
+.panel.is-white .panel-heading {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.panel.is-white .panel-tabs a.is-active {
+    border-bottom-color: #fff
+}
+
+.panel.is-white .panel-block.is-active .panel-icon {
+    color: #fff
+}
+
+.panel.is-black .panel-heading {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.panel.is-black .panel-tabs a.is-active {
+    border-bottom-color: #0a0a0a
+}
+
+.panel.is-black .panel-block.is-active .panel-icon {
+    color: #0a0a0a
+}
+
+.panel.is-light .panel-heading {
+    background-color: #ecf0f1;
+    color: rgba(0, 0, 0, .7)
+}
+
+.panel.is-light .panel-tabs a.is-active {
+    border-bottom-color: #ecf0f1
+}
+
+.panel.is-light .panel-block.is-active .panel-icon {
+    color: #ecf0f1
+}
+
+.panel.is-dark .panel-heading {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.panel.is-dark .panel-tabs a.is-active {
+    border-bottom-color: hsl(var(--main), 10%, 15%)
+}
+
+.panel.is-dark .panel-block.is-active .panel-icon {
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.panel.is-primary .panel-heading {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.panel.is-primary .panel-tabs a.is-active {
+    border-bottom-color: hsl(var(--main), 45%, 45%)
+}
+
+.panel.is-primary .panel-block.is-active .panel-icon {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.panel.is-link .panel-heading {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.panel.is-link .panel-tabs a.is-active {
+    border-bottom-color: hsl(var(--main), 45%, 45%)
+}
+
+.panel.is-link .panel-block.is-active .panel-icon {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.panel.is-info .panel-heading {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.panel.is-info .panel-tabs a.is-active {
+    border-bottom-color: #3298dc
+}
+
+.panel.is-info .panel-block.is-active .panel-icon {
+    color: #3298dc
+}
+
+.panel.is-success .panel-heading {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.panel.is-success .panel-tabs a.is-active {
+    border-bottom-color: #2ecc71
+}
+
+.panel.is-success .panel-block.is-active .panel-icon {
+    color: #2ecc71
+}
+
+.panel.is-warning .panel-heading {
+    background-color: #f1b70e;
+    color: rgba(0, 0, 0, .7)
+}
+
+.panel.is-warning .panel-tabs a.is-active {
+    border-bottom-color: #f1b70e
+}
+
+.panel.is-warning .panel-block.is-active .panel-icon {
+    color: #f1b70e
+}
+
+.panel.is-danger .panel-heading {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.panel.is-danger .panel-tabs a.is-active {
+    border-bottom-color: #e74c3c
+}
+
+.panel.is-danger .panel-block.is-active .panel-icon {
+    color: #e74c3c
+}
+
+.panel-heading {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: 8px 8px 0 0;
+    color: #f2f2f2;
+    font-size: 1.25em;
+    line-height: 1.25;
+    padding: .75em 1em
+}
+
+.panel-tabs {
+    align-items: flex-end;
+    display: flex;
+    font-size: .875em;
+    justify-content: center
+}
+
+.panel-tabs a {
+    border-bottom: 1px solid #5e6d6f;
+    padding: .5em
+}
+
+.panel-tabs a.is-active {
+    color: hsl(var(--main), 75%, 80%)
+}
+
+.panel-list a {
+    color: #fff
+}
+
+.panel-list a:hover {
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.panel-block {
+    align-items: center;
+    color: #f2f2f2;
+    display: flex;
+    justify-content: flex-start;
+    padding: .5em 1.15em
+}
+
+.panel-block input[type=checkbox] {
+    margin-right: .75em
+}
+
+.panel-block>.control {
+    flex-grow: 1;
+    flex-shrink: 1;
+    width: 100%
+}
+
+.panel-block.is-wrapped {
+    flex-wrap: wrap
+}
+
+.panel-block.is-active {
+    border-left-color: hsl(var(--main), 45%, 45%);
+    color: hsl(var(--main), 75%, 80%)
+}
+
+.panel-block:last-child {
+    border-bottom-left-radius: 8px;
+    border-bottom-right-radius: 8px
+}
+
+a.panel-block,
+label.panel-block {
+    cursor: pointer
+}
+
+a.panel-block:hover,
+label.panel-block:hover {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.panel-icon {
+    display: inline-block;
+    font-size: 14px;
+    height: 1em;
+    line-height: 1em;
+    text-align: center;
+    vertical-align: top;
+    width: 1em;
+    color: #fff;
+    margin-right: .75em
+}
+
+.panel-icon .fa {
+    font-size: inherit;
+    line-height: inherit
+}
+
+.tabs {
+    -webkit-overflow-scrolling: touch;
+    align-items: stretch;
+    display: flex;
+    font-size: 15px;
+    justify-content: space-between;
+    overflow: hidden;
+    overflow-x: auto;
+    white-space: nowrap
+}
+
+.tabs a,
+.tabs ul {
+    align-items: center;
+    border-bottom-color: #5e6d6f;
+    border-bottom-style: solid;
+    display: flex
+}
+
+.tabs a {
+    color: #fff;
+    padding: .5em 1em;
+    vertical-align: top;
+    justify-content: center
+}
+
+.tabs a:hover {
+    border-bottom-color: #f2f2f2;
+    color: #f2f2f2
+}
+
+.tabs li {
+    display: block
+}
+
+.tabs li.is-active a {
+    border-bottom-color: hsl(var(--main), 45%, 45%);
+    color: hsl(var(--main), 65%, 65%)
+}
+
+.tabs ul {
+    flex-grow: 1;
+    flex-shrink: 0;
+    justify-content: flex-start;
+    border-bottom-width: 2px
+}
+
+.tabs ul.is-center,
+.tabs ul.is-left {
+    padding-right: .75em
+}
+
+.tabs ul.is-center {
+    flex: none;
+    justify-content: center;
+    padding-left: .75em
+}
+
+.tabs ul.is-right {
+    justify-content: flex-end;
+    padding-left: .75em
+}
+
+.tabs .icon:first-child {
+    margin-right: .5em
+}
+
+.tabs .icon:last-child {
+    margin-left: .5em
+}
+
+.tabs.is-centered ul {
+    justify-content: center
+}
+
+.tabs.is-right ul {
+    justify-content: flex-end
+}
+
+.tabs.is-boxed a {
+    border: 1px solid transparent;
+    border-radius: .4em .4em 0 0
+}
+
+.tabs.is-boxed a:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-bottom-color: #5e6d6f
+}
+
+.tabs.is-boxed li.is-active a {
+    border-color: #5e6d6f;
+    border-bottom-color: transparent !important
+}
+
+.tabs.is-toggle a {
+    border-color: #5e6d6f;
+    border-style: solid;
+    border-width: 1px;
+    margin-bottom: 0;
+    position: relative
+}
+
+.tabs.is-toggle a:hover {
+    background-color: hsl(var(--main), 10%, 15%);
+    border-color: #8c9b9d;
+    z-index: 2
+}
+
+.tabs.is-toggle li+li {
+    margin-left: -2px
+}
+
+.tabs.is-toggle li:first-child a {
+    border-radius: .4em 0 0 .4em
+}
+
+.tabs.is-toggle li:last-child a {
+    border-radius: 0 .4em .4em 0
+}
+
+.tabs.is-toggle li.is-active a {
+    background-color: hsl(var(--main), 45%, 45%);
+    border-color: hsl(var(--main), 45%, 45%);
+    color: #fff;
+    z-index: 1
+}
+
+.hero .tabs ul,
+.tabs.is-toggle ul {
+    border-bottom: none
+}
+
+.tabs.is-toggle.is-toggle-rounded li:first-child a {
+    border-bottom-left-radius: 290486px;
+    border-top-left-radius: 290486px;
+    padding-left: 1.25em
+}
+
+.tabs.is-toggle.is-toggle-rounded li:last-child a {
+    border-bottom-right-radius: 290486px;
+    border-top-right-radius: 290486px;
+    padding-right: 1.25em
+}
+
+.tabs.is-small {
+    font-size: .85em
+}
+
+.tabs.is-medium {
+    font-size: 1.25rem
+}
+
+.tabs.is-large {
+    font-size: 1.5rem
+}
+
+.column {
+    display: block;
+    flex-basis: 0;
+    flex-grow: 1;
+    flex-shrink: 1;
+    padding: .75rem
+}
+
+.columns.is-mobile>.column.is-narrow {
+    flex: none
+}
+
+.columns.is-mobile>.column.is-full {
+    flex: none;
+    width: 100%
+}
+
+.columns.is-mobile>.column.is-three-quarters {
+    flex: none;
+    width: 75%
+}
+
+.columns.is-mobile>.column.is-two-thirds {
+    flex: none;
+    width: 66.6666%
+}
+
+.columns.is-mobile>.column.is-half {
+    flex: none;
+    width: 50%
+}
+
+.columns.is-mobile>.column.is-one-third {
+    flex: none;
+    width: 33.3333%
+}
+
+.columns.is-mobile>.column.is-one-quarter {
+    flex: none;
+    width: 25%
+}
+
+.columns.is-mobile>.column.is-one-fifth {
+    flex: none;
+    width: 20%
+}
+
+.columns.is-mobile>.column.is-two-fifths {
+    flex: none;
+    width: 40%
+}
+
+.columns.is-mobile>.column.is-three-fifths {
+    flex: none;
+    width: 60%
+}
+
+.columns.is-mobile>.column.is-four-fifths {
+    flex: none;
+    width: 80%
+}
+
+.columns.is-mobile>.column.is-offset-three-quarters {
+    margin-left: 75%
+}
+
+.columns.is-mobile>.column.is-offset-two-thirds {
+    margin-left: 66.6666%
+}
+
+.columns.is-mobile>.column.is-offset-half {
+    margin-left: 50%
+}
+
+.columns.is-mobile>.column.is-offset-one-third {
+    margin-left: 33.3333%
+}
+
+.columns.is-mobile>.column.is-offset-one-quarter {
+    margin-left: 25%
+}
+
+.columns.is-mobile>.column.is-offset-one-fifth {
+    margin-left: 20%
+}
+
+.columns.is-mobile>.column.is-offset-two-fifths {
+    margin-left: 40%
+}
+
+.columns.is-mobile>.column.is-offset-three-fifths {
+    margin-left: 60%
+}
+
+.columns.is-mobile>.column.is-offset-four-fifths {
+    margin-left: 80%
+}
+
+.columns.is-mobile>.column.is-0 {
+    flex: none;
+    width: 0%
+}
+
+.columns.is-mobile>.column.is-offset-0 {
+    margin-left: 0
+}
+
+.columns.is-mobile>.column.is-1 {
+    flex: none;
+    width: 8.33333%
+}
+
+.columns.is-mobile>.column.is-offset-1 {
+    margin-left: 8.33333%
+}
+
+.columns.is-mobile>.column.is-2 {
+    flex: none;
+    width: 16.66667%
+}
+
+.columns.is-mobile>.column.is-offset-2 {
+    margin-left: 16.66667%
+}
+
+.columns.is-mobile>.column.is-3 {
+    flex: none;
+    width: 25%
+}
+
+.columns.is-mobile>.column.is-offset-3 {
+    margin-left: 25%
+}
+
+.columns.is-mobile>.column.is-4 {
+    flex: none;
+    width: 33.33333%
+}
+
+.columns.is-mobile>.column.is-offset-4 {
+    margin-left: 33.33333%
+}
+
+.columns.is-mobile>.column.is-5 {
+    flex: none;
+    width: 41.66667%
+}
+
+.columns.is-mobile>.column.is-offset-5 {
+    margin-left: 41.66667%
+}
+
+.columns.is-mobile>.column.is-6 {
+    flex: none;
+    width: 50%
+}
+
+.columns.is-mobile>.column.is-offset-6 {
+    margin-left: 50%
+}
+
+.columns.is-mobile>.column.is-7 {
+    flex: none;
+    width: 58.33333%
+}
+
+.columns.is-mobile>.column.is-offset-7 {
+    margin-left: 58.33333%
+}
+
+.columns.is-mobile>.column.is-8 {
+    flex: none;
+    width: 66.66667%
+}
+
+.columns.is-mobile>.column.is-offset-8 {
+    margin-left: 66.66667%
+}
+
+.columns.is-mobile>.column.is-9 {
+    flex: none;
+    width: 75%
+}
+
+.columns.is-mobile>.column.is-offset-9 {
+    margin-left: 75%
+}
+
+.columns.is-mobile>.column.is-10 {
+    flex: none;
+    width: 83.33333%
+}
+
+.columns.is-mobile>.column.is-offset-10 {
+    margin-left: 83.33333%
+}
+
+.columns.is-mobile>.column.is-11 {
+    flex: none;
+    width: 91.66667%
+}
+
+.columns.is-mobile>.column.is-offset-11 {
+    margin-left: 91.66667%
+}
+
+.columns.is-mobile>.column.is-12 {
+    flex: none;
+    width: 100%
+}
+
+.columns.is-mobile>.column.is-offset-12 {
+    margin-left: 100%
+}
+
+@media screen and (max-width: 768px) {
+    .column.is-narrow-mobile {
+        flex: none
+    }
+
+    .column.is-full-mobile {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-mobile {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-mobile {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-mobile {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-mobile {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-mobile {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-mobile {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-mobile {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-mobile {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-mobile {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-mobile {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-mobile {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-mobile {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-mobile {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-mobile {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-mobile {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-mobile {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-mobile {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-mobile {
+        margin-left: 80%
+    }
+
+    .column.is-0-mobile {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-mobile {
+        margin-left: 0
+    }
+
+    .column.is-1-mobile {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-mobile {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-mobile {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-mobile {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-mobile {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-mobile {
+        margin-left: 25%
+    }
+
+    .column.is-4-mobile {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-mobile {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-mobile {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-mobile {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-mobile {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-mobile {
+        margin-left: 50%
+    }
+
+    .column.is-7-mobile {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-mobile {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-mobile {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-mobile {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-mobile {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-mobile {
+        margin-left: 75%
+    }
+
+    .column.is-10-mobile {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-mobile {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-mobile {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-mobile {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-mobile {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-mobile {
+        margin-left: 100%
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+
+    .column.is-narrow,
+    .column.is-narrow-tablet {
+        flex: none
+    }
+
+    .column.is-full,
+    .column.is-full-tablet {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters,
+    .column.is-three-quarters-tablet {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds,
+    .column.is-two-thirds-tablet {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half,
+    .column.is-half-tablet {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third,
+    .column.is-one-third-tablet {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter,
+    .column.is-one-quarter-tablet {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth,
+    .column.is-one-fifth-tablet {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths,
+    .column.is-two-fifths-tablet {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths,
+    .column.is-three-fifths-tablet {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths,
+    .column.is-four-fifths-tablet {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters,
+    .column.is-offset-three-quarters-tablet {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds,
+    .column.is-offset-two-thirds-tablet {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half,
+    .column.is-offset-half-tablet {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third,
+    .column.is-offset-one-third-tablet {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter,
+    .column.is-offset-one-quarter-tablet {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth,
+    .column.is-offset-one-fifth-tablet {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths,
+    .column.is-offset-two-fifths-tablet {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths,
+    .column.is-offset-three-fifths-tablet {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths,
+    .column.is-offset-four-fifths-tablet {
+        margin-left: 80%
+    }
+
+    .column.is-0,
+    .column.is-0-tablet {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0,
+    .column.is-offset-0-tablet {
+        margin-left: 0
+    }
+
+    .column.is-1,
+    .column.is-1-tablet {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1,
+    .column.is-offset-1-tablet {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2,
+    .column.is-2-tablet {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2,
+    .column.is-offset-2-tablet {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3,
+    .column.is-3-tablet {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3,
+    .column.is-offset-3-tablet {
+        margin-left: 25%
+    }
+
+    .column.is-4,
+    .column.is-4-tablet {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4,
+    .column.is-offset-4-tablet {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5,
+    .column.is-5-tablet {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5,
+    .column.is-offset-5-tablet {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6,
+    .column.is-6-tablet {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6,
+    .column.is-offset-6-tablet {
+        margin-left: 50%
+    }
+
+    .column.is-7,
+    .column.is-7-tablet {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7,
+    .column.is-offset-7-tablet {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8,
+    .column.is-8-tablet {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8,
+    .column.is-offset-8-tablet {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9,
+    .column.is-9-tablet {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9,
+    .column.is-offset-9-tablet {
+        margin-left: 75%
+    }
+
+    .column.is-10,
+    .column.is-10-tablet {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10,
+    .column.is-offset-10-tablet {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11,
+    .column.is-11-tablet {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11,
+    .column.is-offset-11-tablet {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12,
+    .column.is-12-tablet {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12,
+    .column.is-offset-12-tablet {
+        margin-left: 100%
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .column.is-narrow-touch {
+        flex: none
+    }
+
+    .column.is-full-touch {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-touch {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-touch {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-touch {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-touch {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-touch {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-touch {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-touch {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-touch {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-touch {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-touch {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-touch {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-touch {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-touch {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-touch {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-touch {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-touch {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-touch {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-touch {
+        margin-left: 80%
+    }
+
+    .column.is-0-touch {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-touch {
+        margin-left: 0
+    }
+
+    .column.is-1-touch {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-touch {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-touch {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-touch {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-touch {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-touch {
+        margin-left: 25%
+    }
+
+    .column.is-4-touch {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-touch {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-touch {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-touch {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-touch {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-touch {
+        margin-left: 50%
+    }
+
+    .column.is-7-touch {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-touch {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-touch {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-touch {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-touch {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-touch {
+        margin-left: 75%
+    }
+
+    .column.is-10-touch {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-touch {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-touch {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-touch {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-touch {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-touch {
+        margin-left: 100%
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .column.is-narrow-desktop {
+        flex: none
+    }
+
+    .column.is-full-desktop {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-desktop {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-desktop {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-desktop {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-desktop {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-desktop {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-desktop {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-desktop {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-desktop {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-desktop {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-desktop {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-desktop {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-desktop {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-desktop {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-desktop {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-desktop {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-desktop {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-desktop {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-desktop {
+        margin-left: 80%
+    }
+
+    .column.is-0-desktop {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-desktop {
+        margin-left: 0
+    }
+
+    .column.is-1-desktop {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-desktop {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-desktop {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-desktop {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-desktop {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-desktop {
+        margin-left: 25%
+    }
+
+    .column.is-4-desktop {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-desktop {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-desktop {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-desktop {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-desktop {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-desktop {
+        margin-left: 50%
+    }
+
+    .column.is-7-desktop {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-desktop {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-desktop {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-desktop {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-desktop {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-desktop {
+        margin-left: 75%
+    }
+
+    .column.is-10-desktop {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-desktop {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-desktop {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-desktop {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-desktop {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-desktop {
+        margin-left: 100%
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .column.is-narrow-widescreen {
+        flex: none
+    }
+
+    .column.is-full-widescreen {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-widescreen {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-widescreen {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-widescreen {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-widescreen {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-widescreen {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-widescreen {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-widescreen {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-widescreen {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-widescreen {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-widescreen {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-widescreen {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-widescreen {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-widescreen {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-widescreen {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-widescreen {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-widescreen {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-widescreen {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-widescreen {
+        margin-left: 80%
+    }
+
+    .column.is-0-widescreen {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-widescreen {
+        margin-left: 0
+    }
+
+    .column.is-1-widescreen {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-widescreen {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-widescreen {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-widescreen {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-widescreen {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-widescreen {
+        margin-left: 25%
+    }
+
+    .column.is-4-widescreen {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-widescreen {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-widescreen {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-widescreen {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-widescreen {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-widescreen {
+        margin-left: 50%
+    }
+
+    .column.is-7-widescreen {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-widescreen {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-widescreen {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-widescreen {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-widescreen {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-widescreen {
+        margin-left: 75%
+    }
+
+    .column.is-10-widescreen {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-widescreen {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-widescreen {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-widescreen {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-widescreen {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-widescreen {
+        margin-left: 100%
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .column.is-narrow-fullhd {
+        flex: none
+    }
+
+    .column.is-full-fullhd {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-three-quarters-fullhd {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-two-thirds-fullhd {
+        flex: none;
+        width: 66.6666%
+    }
+
+    .column.is-half-fullhd {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-one-third-fullhd {
+        flex: none;
+        width: 33.3333%
+    }
+
+    .column.is-one-quarter-fullhd {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-one-fifth-fullhd {
+        flex: none;
+        width: 20%
+    }
+
+    .column.is-two-fifths-fullhd {
+        flex: none;
+        width: 40%
+    }
+
+    .column.is-three-fifths-fullhd {
+        flex: none;
+        width: 60%
+    }
+
+    .column.is-four-fifths-fullhd {
+        flex: none;
+        width: 80%
+    }
+
+    .column.is-offset-three-quarters-fullhd {
+        margin-left: 75%
+    }
+
+    .column.is-offset-two-thirds-fullhd {
+        margin-left: 66.6666%
+    }
+
+    .column.is-offset-half-fullhd {
+        margin-left: 50%
+    }
+
+    .column.is-offset-one-third-fullhd {
+        margin-left: 33.3333%
+    }
+
+    .column.is-offset-one-quarter-fullhd {
+        margin-left: 25%
+    }
+
+    .column.is-offset-one-fifth-fullhd {
+        margin-left: 20%
+    }
+
+    .column.is-offset-two-fifths-fullhd {
+        margin-left: 40%
+    }
+
+    .column.is-offset-three-fifths-fullhd {
+        margin-left: 60%
+    }
+
+    .column.is-offset-four-fifths-fullhd {
+        margin-left: 80%
+    }
+
+    .column.is-0-fullhd {
+        flex: none;
+        width: 0%
+    }
+
+    .column.is-offset-0-fullhd {
+        margin-left: 0
+    }
+
+    .column.is-1-fullhd {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .column.is-offset-1-fullhd {
+        margin-left: 8.33333%
+    }
+
+    .column.is-2-fullhd {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .column.is-offset-2-fullhd {
+        margin-left: 16.66667%
+    }
+
+    .column.is-3-fullhd {
+        flex: none;
+        width: 25%
+    }
+
+    .column.is-offset-3-fullhd {
+        margin-left: 25%
+    }
+
+    .column.is-4-fullhd {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .column.is-offset-4-fullhd {
+        margin-left: 33.33333%
+    }
+
+    .column.is-5-fullhd {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .column.is-offset-5-fullhd {
+        margin-left: 41.66667%
+    }
+
+    .column.is-6-fullhd {
+        flex: none;
+        width: 50%
+    }
+
+    .column.is-offset-6-fullhd {
+        margin-left: 50%
+    }
+
+    .column.is-7-fullhd {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .column.is-offset-7-fullhd {
+        margin-left: 58.33333%
+    }
+
+    .column.is-8-fullhd {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .column.is-offset-8-fullhd {
+        margin-left: 66.66667%
+    }
+
+    .column.is-9-fullhd {
+        flex: none;
+        width: 75%
+    }
+
+    .column.is-offset-9-fullhd {
+        margin-left: 75%
+    }
+
+    .column.is-10-fullhd {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .column.is-offset-10-fullhd {
+        margin-left: 83.33333%
+    }
+
+    .column.is-11-fullhd {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .column.is-offset-11-fullhd {
+        margin-left: 91.66667%
+    }
+
+    .column.is-12-fullhd {
+        flex: none;
+        width: 100%
+    }
+
+    .column.is-offset-12-fullhd {
+        margin-left: 100%
+    }
+}
+
+.columns {
+    margin-left: -.75rem;
+    margin-right: -.75rem;
+    margin-top: -.75rem
+}
+
+.columns:last-child {
+    margin-bottom: -.75rem
+}
+
+.columns:not(:last-child) {
+    margin-bottom: calc(1.5rem - .75rem)
+}
+
+.columns.is-centered {
+    justify-content: center
+}
+
+.columns.is-gapless {
+    margin-left: 0;
+    margin-right: 0;
+    margin-top: 0
+}
+
+.columns.is-gapless>.column {
+    margin: 0;
+    padding: 0 !important
+}
+
+.columns.is-gapless:not(:last-child) {
+    margin-bottom: 1.5rem
+}
+
+.columns.is-gapless:last-child {
+    margin-bottom: 0
+}
+
+.columns.is-mobile {
+    display: flex
+}
+
+.columns.is-multiline {
+    flex-wrap: wrap
+}
+
+.columns.is-vcentered {
+    align-items: center
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns:not(.is-desktop) {
+        display: flex
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-desktop {
+        display: flex
+    }
+}
+
+.columns.is-variable {
+    --columnGap: 0.75rem;
+    margin-left: calc(-1 * var(--columnGap));
+    margin-right: calc(-1 * var(--columnGap))
+}
+
+.columns.is-variable .column {
+    padding-left: var(--columnGap);
+    padding-right: var(--columnGap)
+}
+
+.columns.is-variable.is-0 {
+    --columnGap: 0rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-0-mobile {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-0-tablet {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-0-tablet-only {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-0-touch {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-0-desktop {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-0-desktop-only {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-0-widescreen {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-0-widescreen-only {
+        --columnGap: 0rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-0-fullhd {
+        --columnGap: 0rem
+    }
+}
+
+.columns.is-variable.is-1 {
+    --columnGap: 0.25rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-1-mobile {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-1-tablet {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-1-tablet-only {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-1-touch {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-1-desktop {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-1-desktop-only {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-1-widescreen {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-1-widescreen-only {
+        --columnGap: 0.25rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-1-fullhd {
+        --columnGap: 0.25rem
+    }
+}
+
+.columns.is-variable.is-2 {
+    --columnGap: 0.5rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-2-mobile {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-2-tablet {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-2-tablet-only {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-2-touch {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-2-desktop {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-2-desktop-only {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-2-widescreen {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-2-widescreen-only {
+        --columnGap: 0.5rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-2-fullhd {
+        --columnGap: 0.5rem
+    }
+}
+
+.columns.is-variable.is-3 {
+    --columnGap: 0.75rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-3-mobile {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-3-tablet {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-3-tablet-only {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-3-touch {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-3-desktop {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-3-desktop-only {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-3-widescreen {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-3-widescreen-only {
+        --columnGap: 0.75rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-3-fullhd {
+        --columnGap: 0.75rem
+    }
+}
+
+.columns.is-variable.is-4 {
+    --columnGap: 1rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-4-mobile {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-4-tablet {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-4-tablet-only {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-4-touch {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-4-desktop {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-4-desktop-only {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-4-widescreen {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-4-widescreen-only {
+        --columnGap: 1rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-4-fullhd {
+        --columnGap: 1rem
+    }
+}
+
+.columns.is-variable.is-5 {
+    --columnGap: 1.25rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-5-mobile {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-5-tablet {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-5-tablet-only {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-5-touch {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-5-desktop {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-5-desktop-only {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-5-widescreen {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-5-widescreen-only {
+        --columnGap: 1.25rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-5-fullhd {
+        --columnGap: 1.25rem
+    }
+}
+
+.columns.is-variable.is-6 {
+    --columnGap: 1.5rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-6-mobile {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-6-tablet {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-6-tablet-only {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-6-touch {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-6-desktop {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-6-desktop-only {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-6-widescreen {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-6-widescreen-only {
+        --columnGap: 1.5rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-6-fullhd {
+        --columnGap: 1.5rem
+    }
+}
+
+.columns.is-variable.is-7 {
+    --columnGap: 1.75rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-7-mobile {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-7-tablet {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-7-tablet-only {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-7-touch {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-7-desktop {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-7-desktop-only {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-7-widescreen {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-7-widescreen-only {
+        --columnGap: 1.75rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-7-fullhd {
+        --columnGap: 1.75rem
+    }
+}
+
+.columns.is-variable.is-8 {
+    --columnGap: 2rem
+}
+
+@media screen and (max-width: 768px) {
+    .columns.is-variable.is-8-mobile {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .columns.is-variable.is-8-tablet {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 769px) and (max-width:1023px) {
+    .columns.is-variable.is-8-tablet-only {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .columns.is-variable.is-8-touch {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .columns.is-variable.is-8-desktop {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1024px) and (max-width:1215px) {
+    .columns.is-variable.is-8-desktop-only {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .columns.is-variable.is-8-widescreen {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1216px) and (max-width:1407px) {
+    .columns.is-variable.is-8-widescreen-only {
+        --columnGap: 2rem
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .columns.is-variable.is-8-fullhd {
+        --columnGap: 2rem
+    }
+}
+
+.tile {
+    align-items: stretch;
+    display: block;
+    flex-basis: 0;
+    flex-grow: 1;
+    flex-shrink: 1;
+    min-height: -webkit-min-content;
+    min-height: -moz-min-content;
+    min-height: min-content
+}
+
+.tile.is-ancestor {
+    margin-left: -.75rem;
+    margin-right: -.75rem;
+    margin-top: -.75rem
+}
+
+.tile.is-ancestor:last-child {
+    margin-bottom: -.75rem
+}
+
+.tile.is-ancestor:not(:last-child) {
+    margin-bottom: .75rem
+}
+
+.tile.is-child {
+    margin: 0 !important
+}
+
+.tile.is-parent {
+    padding: .75rem
+}
+
+.tile.is-vertical {
+    flex-direction: column
+}
+
+.tile.is-vertical>.tile.is-child:not(:last-child) {
+    margin-bottom: 1.5rem !important
+}
+
+@media screen and (min-width: 769px),
+print {
+    .tile:not(.is-child) {
+        display: flex
+    }
+
+    .tile.is-1 {
+        flex: none;
+        width: 8.33333%
+    }
+
+    .tile.is-2 {
+        flex: none;
+        width: 16.66667%
+    }
+
+    .tile.is-3 {
+        flex: none;
+        width: 25%
+    }
+
+    .tile.is-4 {
+        flex: none;
+        width: 33.33333%
+    }
+
+    .tile.is-5 {
+        flex: none;
+        width: 41.66667%
+    }
+
+    .tile.is-6 {
+        flex: none;
+        width: 50%
+    }
+
+    .tile.is-7 {
+        flex: none;
+        width: 58.33333%
+    }
+
+    .tile.is-8 {
+        flex: none;
+        width: 66.66667%
+    }
+
+    .tile.is-9 {
+        flex: none;
+        width: 75%
+    }
+
+    .tile.is-10 {
+        flex: none;
+        width: 83.33333%
+    }
+
+    .tile.is-11 {
+        flex: none;
+        width: 91.66667%
+    }
+
+    .tile.is-12 {
+        flex: none;
+        width: 100%
+    }
+}
+
+.hero {
+    align-items: stretch;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between
+}
+
+.hero .navbar {
+    background: 0 0
+}
+
+.hero.is-white {
+    background-color: #fff;
+    color: #0a0a0a
+}
+
+.hero.is-black a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-black strong,
+.hero.is-danger a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-danger strong,
+.hero.is-dark a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-dark strong,
+.hero.is-info a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-info strong,
+.hero.is-light a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-light strong,
+.hero.is-link a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-link strong,
+.hero.is-primary a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-primary strong,
+.hero.is-success a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-success strong,
+.hero.is-warning a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-warning strong,
+.hero.is-white a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
+.hero.is-white strong {
+    color: inherit
+}
+
+.hero.is-white .title {
+    color: #0a0a0a
+}
+
+.hero.is-white .subtitle {
+    color: rgba(10, 10, 10, .9)
+}
+
+.hero.is-white .subtitle a:not(.button),
+.hero.is-white .subtitle strong {
+    color: #0a0a0a
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-white .navbar-menu {
+        background-color: #fff
+    }
+}
+
+.hero.is-white .navbar-item,
+.hero.is-white .navbar-link {
+    color: rgba(10, 10, 10, .7)
+}
+
+.hero.is-white .navbar-link.is-active,
+.hero.is-white .navbar-link:hover,
+.hero.is-white a.navbar-item.is-active,
+.hero.is-white a.navbar-item:hover {
+    background-color: #f2f2f2;
+    color: #0a0a0a
+}
+
+.hero.is-white .tabs a {
+    color: #0a0a0a;
+    opacity: .9
+}
+
+.hero.is-white .tabs a:hover,
+.hero.is-white .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-white .tabs.is-boxed a,
+.hero.is-white .tabs.is-toggle a {
+    color: #0a0a0a
+}
+
+.hero.is-black .tabs.is-boxed a:hover,
+.hero.is-black .tabs.is-toggle a:hover,
+.hero.is-danger .tabs.is-boxed a:hover,
+.hero.is-danger .tabs.is-toggle a:hover,
+.hero.is-dark .tabs.is-boxed a:hover,
+.hero.is-dark .tabs.is-toggle a:hover,
+.hero.is-info .tabs.is-boxed a:hover,
+.hero.is-info .tabs.is-toggle a:hover,
+.hero.is-light .tabs.is-boxed a:hover,
+.hero.is-light .tabs.is-toggle a:hover,
+.hero.is-link .tabs.is-boxed a:hover,
+.hero.is-link .tabs.is-toggle a:hover,
+.hero.is-primary .tabs.is-boxed a:hover,
+.hero.is-primary .tabs.is-toggle a:hover,
+.hero.is-success .tabs.is-boxed a:hover,
+.hero.is-success .tabs.is-toggle a:hover,
+.hero.is-warning .tabs.is-boxed a:hover,
+.hero.is-warning .tabs.is-toggle a:hover,
+.hero.is-white .tabs.is-boxed a:hover,
+.hero.is-white .tabs.is-toggle a:hover {
+    background-color: rgba(10, 10, 10, .1)
+}
+
+.hero.is-white.is-bold {
+    background-image: linear-gradient(141deg, #e6e6e6 0, #fff 71%, #fff 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-white.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #e6e6e6 0, #fff 71%, #fff 100%)
+    }
+}
+
+.hero.is-black {
+    background-color: #0a0a0a;
+    color: #fff
+}
+
+.hero.is-black .title {
+    color: #fff
+}
+
+.hero.is-black .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-black .subtitle a:not(.button),
+.hero.is-black .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-black .navbar-menu {
+        background-color: #0a0a0a
+    }
+}
+
+.hero.is-black .navbar-item,
+.hero.is-black .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-black .navbar-link.is-active,
+.hero.is-black .navbar-link:hover,
+.hero.is-black a.navbar-item.is-active,
+.hero.is-black a.navbar-item:hover {
+    background-color: #000;
+    color: #fff
+}
+
+.hero.is-black .tabs a {
+    color: #fff;
+    opacity: .9
+}
+
+.hero.is-black .tabs a:hover,
+.hero.is-black .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-black .tabs.is-boxed a,
+.hero.is-black .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-black .tabs.is-boxed li.is-active a,
+.hero.is-black .tabs.is-boxed li.is-active a:hover,
+.hero.is-black .tabs.is-toggle li.is-active a,
+.hero.is-black .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #0a0a0a
+}
+
+.hero.is-black.is-bold {
+    background-image: linear-gradient(141deg, #000 0, #0a0a0a 71%, #181616 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-black.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #000 0, #0a0a0a 71%, #181616 100%)
+    }
+}
+
+.hero.is-light {
+    background-color: #ecf0f1
+}
+
+.hero.is-light,
+.hero.is-light .title {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-light .subtitle {
+    color: rgba(0, 0, 0, .9)
+}
+
+.hero.is-light .subtitle a:not(.button),
+.hero.is-light .subtitle strong {
+    color: rgba(0, 0, 0, .7)
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-light .navbar-menu {
+        background-color: #ecf0f1
+    }
+}
+
+.hero.is-light .navbar-item,
+.hero.is-light .navbar-link {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-light .navbar-link.is-active,
+.hero.is-light .navbar-link:hover,
+.hero.is-light a.navbar-item.is-active,
+.hero.is-light a.navbar-item:hover {
+    background-color: #dde4e6;
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-light .tabs a {
+    color: rgba(0, 0, 0, .7);
+    opacity: .9
+}
+
+.hero.is-light .tabs a:hover,
+.hero.is-light .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-light .tabs.is-boxed a,
+.hero.is-light .tabs.is-toggle a {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-light .tabs.is-boxed li.is-active a,
+.hero.is-light .tabs.is-boxed li.is-active a:hover,
+.hero.is-light .tabs.is-toggle li.is-active a,
+.hero.is-light .tabs.is-toggle li.is-active a:hover {
+    background-color: rgba(0, 0, 0, .7);
+    border-color: rgba(0, 0, 0, .7);
+    color: #ecf0f1
+}
+
+.hero.is-light.is-bold {
+    background-image: linear-gradient(141deg, #cadfe0 0, #ecf0f1 71%, #fafbfc 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-light.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #cadfe0 0, #ecf0f1 71%, #fafbfc 100%)
+    }
+}
+
+.hero.is-dark {
+    background-color: hsl(var(--main), 10%, 15%);
+    color: #fff
+}
+
+.hero.is-dark .title {
+    color: #fff
+}
+
+.hero.is-dark .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-dark .subtitle a:not(.button),
+.hero.is-dark .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-dark .navbar-menu {
+        background-color: hsl(var(--main), 10%, 15%)
+    }
+}
+
+.hero.is-dark .navbar-item,
+.hero.is-dark .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-dark .navbar-link.is-active,
+.hero.is-dark .navbar-link:hover,
+.hero.is-dark a.navbar-item.is-active,
+.hero.is-dark a.navbar-item:hover {
+    background-color: #1d2122;
+    color: #fff
+}
+
+.hero.is-dark .tabs a,
+.hero.is-info .tabs a,
+.hero.is-link .tabs a,
+.hero.is-primary .tabs a,
+.hero.is-success .tabs a {
+    color: #fff;
+    opacity: .9
+}
+
+.hero.is-dark .tabs a:hover,
+.hero.is-dark .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-dark .tabs.is-boxed li.is-active a,
+.hero.is-dark .tabs.is-boxed li.is-active a:hover,
+.hero.is-dark .tabs.is-toggle li.is-active a,
+.hero.is-dark .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: hsl(var(--main), 10%, 15%)
+}
+
+.hero.is-dark.is-bold {
+    background-image: linear-gradient(141deg, #0f1615 0, hsl(var(--main), 10%, 15%) 71%, #313c40 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-dark.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #0f1615 0, hsl(var(--main), 10%, 15%) 71%, #313c40 100%)
+    }
+}
+
+.hero.is-primary {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.hero.is-dark .tabs.is-boxed a,
+.hero.is-dark .tabs.is-toggle a,
+.hero.is-primary .title {
+    color: #fff
+}
+
+.hero.is-primary .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-primary .subtitle a:not(.button),
+.hero.is-primary .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-primary .navbar-menu {
+        background-color: hsl(var(--main), 45%, 45%)
+    }
+}
+
+.hero.is-primary .navbar-item,
+.hero.is-primary .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-primary .navbar-link.is-active,
+.hero.is-primary .navbar-link:hover,
+.hero.is-primary a.navbar-item.is-active,
+.hero.is-primary a.navbar-item:hover {
+    background-color: #2f4d6d;
+    color: #fff
+}
+
+.hero.is-primary .tabs a:hover,
+.hero.is-primary .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-primary .tabs.is-boxed li.is-active a,
+.hero.is-primary .tabs.is-boxed li.is-active a:hover,
+.hero.is-primary .tabs.is-toggle li.is-active a,
+.hero.is-primary .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.hero.is-primary.is-bold {
+    background-image: linear-gradient(141deg, #214b62 0, hsl(var(--main), 45%, 45%) 71%, #3a5796 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-primary.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #214b62 0, hsl(var(--main), 45%, 45%) 71%, #3a5796 100%)
+    }
+}
+
+.hero.is-link {
+    background-color: hsl(var(--main), 45%, 45%);
+    color: #fff
+}
+
+.hero.is-link .title,
+.hero.is-primary .tabs.is-boxed a,
+.hero.is-primary .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-link .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-link .subtitle a:not(.button),
+.hero.is-link .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-link .navbar-menu {
+        background-color: hsl(var(--main), 45%, 45%)
+    }
+}
+
+.hero.is-link .navbar-item,
+.hero.is-link .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-link .navbar-link.is-active,
+.hero.is-link .navbar-link:hover,
+.hero.is-link a.navbar-item.is-active,
+.hero.is-link a.navbar-item:hover {
+    background-color: hsl(var(--main), 75%, 80%);
+    color: #fff
+}
+
+.hero.is-link .tabs a:hover,
+.hero.is-link .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-link .tabs.is-boxed li.is-active a,
+.hero.is-link .tabs.is-boxed li.is-active a:hover,
+.hero.is-link .tabs.is-toggle li.is-active a,
+.hero.is-link .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: hsl(var(--main), 45%, 45%)
+}
+
+.hero.is-link.is-bold {
+    background-image: linear-gradient(141deg, #0c9764 0, hsl(var(--main), 45%, 45%) 71%, #17d8d2 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-link.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #0c9764 0, hsl(var(--main), 45%, 45%) 71%, #17d8d2 100%)
+    }
+}
+
+.hero.is-info {
+    background-color: #3298dc;
+    color: #fff
+}
+
+.hero.is-info .title,
+.hero.is-link .tabs.is-boxed a,
+.hero.is-link .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-info .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-info .subtitle a:not(.button),
+.hero.is-info .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-info .navbar-menu {
+        background-color: #3298dc
+    }
+}
+
+.hero.is-info .navbar-item,
+.hero.is-info .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-info .navbar-link.is-active,
+.hero.is-info .navbar-link:hover,
+.hero.is-info a.navbar-item.is-active,
+.hero.is-info a.navbar-item:hover {
+    background-color: #238cd1;
+    color: #fff
+}
+
+.hero.is-info .tabs a:hover,
+.hero.is-info .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-info .tabs.is-boxed li.is-active a,
+.hero.is-info .tabs.is-boxed li.is-active a:hover,
+.hero.is-info .tabs.is-toggle li.is-active a,
+.hero.is-info .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #3298dc
+}
+
+.hero.is-info.is-bold {
+    background-image: linear-gradient(141deg, #159dc6 0, #3298dc 71%, #4389e5 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-info.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #159dc6 0, #3298dc 71%, #4389e5 100%)
+    }
+}
+
+.hero.is-success {
+    background-color: #2ecc71;
+    color: #fff
+}
+
+.hero.is-info .tabs.is-boxed a,
+.hero.is-info .tabs.is-toggle a,
+.hero.is-success .title {
+    color: #fff
+}
+
+.hero.is-success .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-success .subtitle a:not(.button),
+.hero.is-success .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-success .navbar-menu {
+        background-color: #2ecc71
+    }
+}
+
+.hero.is-success .navbar-item,
+.hero.is-success .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-success .navbar-link.is-active,
+.hero.is-success .navbar-link:hover,
+.hero.is-success a.navbar-item.is-active,
+.hero.is-success a.navbar-item:hover {
+    background-color: #29b765;
+    color: #fff
+}
+
+.hero.is-success .tabs a:hover,
+.hero.is-success .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-success .tabs.is-boxed a,
+.hero.is-success .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-success .tabs.is-boxed li.is-active a,
+.hero.is-success .tabs.is-boxed li.is-active a:hover,
+.hero.is-success .tabs.is-toggle li.is-active a,
+.hero.is-success .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #2ecc71
+}
+
+.hero.is-success.is-bold {
+    background-image: linear-gradient(141deg, #1bac40 0, #2ecc71 71%, #3ada98 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-success.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #1bac40 0, #2ecc71 71%, #3ada98 100%)
+    }
+}
+
+.hero.is-warning {
+    background-color: #f1b70e
+}
+
+.hero.is-warning,
+.hero.is-warning .title {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-warning .subtitle {
+    color: rgba(0, 0, 0, .9)
+}
+
+.hero.is-warning .subtitle a:not(.button),
+.hero.is-warning .subtitle strong {
+    color: rgba(0, 0, 0, .7)
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-warning .navbar-menu {
+        background-color: #f1b70e
+    }
+}
+
+.hero.is-warning .navbar-item,
+.hero.is-warning .navbar-link {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-warning .navbar-link.is-active,
+.hero.is-warning .navbar-link:hover,
+.hero.is-warning a.navbar-item.is-active,
+.hero.is-warning a.navbar-item:hover {
+    background-color: #d9a50d;
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-warning .tabs a {
+    color: rgba(0, 0, 0, .7);
+    opacity: .9
+}
+
+.hero.is-warning .tabs a:hover,
+.hero.is-warning .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-warning .tabs.is-boxed a,
+.hero.is-warning .tabs.is-toggle a {
+    color: rgba(0, 0, 0, .7)
+}
+
+.hero.is-warning .tabs.is-boxed li.is-active a,
+.hero.is-warning .tabs.is-boxed li.is-active a:hover,
+.hero.is-warning .tabs.is-toggle li.is-active a,
+.hero.is-warning .tabs.is-toggle li.is-active a:hover {
+    background-color: rgba(0, 0, 0, .7);
+    border-color: rgba(0, 0, 0, .7);
+    color: #f1b70e
+}
+
+.hero.is-warning.is-bold {
+    background-image: linear-gradient(141deg, #cb7601 0, #f1b70e 71%, #f8e520 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-warning.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #cb7601 0, #f1b70e 71%, #f8e520 100%)
+    }
+}
+
+.hero.is-danger {
+    background-color: #e74c3c;
+    color: #fff
+}
+
+.hero.is-danger .title {
+    color: #fff
+}
+
+.hero.is-danger .subtitle {
+    color: rgba(255, 255, 255, .9)
+}
+
+.hero.is-danger .subtitle a:not(.button),
+.hero.is-danger .subtitle strong {
+    color: #fff
+}
+
+@media screen and (max-width: 1023px) {
+    .hero.is-danger .navbar-menu {
+        background-color: #e74c3c
+    }
+}
+
+.hero.is-danger .navbar-item,
+.hero.is-danger .navbar-link {
+    color: rgba(255, 255, 255, .7)
+}
+
+.hero.is-danger .navbar-link.is-active,
+.hero.is-danger .navbar-link:hover,
+.hero.is-danger a.navbar-item.is-active,
+.hero.is-danger a.navbar-item:hover {
+    background-color: #e43725;
+    color: #fff
+}
+
+.hero.is-danger .tabs a {
+    color: #fff;
+    opacity: .9
+}
+
+.hero.is-danger .tabs a:hover,
+.hero.is-danger .tabs li.is-active a {
+    opacity: 1
+}
+
+.hero.is-danger .tabs.is-boxed a,
+.hero.is-danger .tabs.is-toggle a {
+    color: #fff
+}
+
+.hero.is-danger .tabs.is-boxed li.is-active a,
+.hero.is-danger .tabs.is-boxed li.is-active a:hover,
+.hero.is-danger .tabs.is-toggle li.is-active a,
+.hero.is-danger .tabs.is-toggle li.is-active a:hover {
+    background-color: #fff;
+    border-color: #fff;
+    color: #e74c3c
+}
+
+.hero.is-danger.is-bold {
+    background-image: linear-gradient(141deg, #e20e1e 0, #e74c3c 71%, #ef784e 100%)
+}
+
+@media screen and (max-width: 768px) {
+    .hero.is-danger.is-bold .navbar-menu {
+        background-image: linear-gradient(141deg, #e20e1e 0, #e74c3c 71%, #ef784e 100%)
+    }
+}
+
+.hero.is-small .hero-body {
+    padding: 1.5rem
+}
+
+@media screen and (min-width: 769px),
+print {
+    .hero.is-medium .hero-body {
+        padding: 9rem 1.5rem
+    }
+
+    .hero.is-large .hero-body {
+        padding: 18rem 1.5rem
+    }
+}
+
+.hero.is-fullheight .hero-body,
+.hero.is-fullheight-with-navbar .hero-body,
+.hero.is-halfheight .hero-body {
+    align-items: center;
+    display: flex
+}
+
+.hero.is-fullheight .hero-body>.container,
+.hero.is-fullheight-with-navbar .hero-body>.container,
+.hero.is-halfheight .hero-body>.container {
+    flex-grow: 1;
+    flex-shrink: 1
+}
+
+.hero.is-halfheight {
+    min-height: 50vh
+}
+
+.hero.is-fullheight {
+    min-height: 100vh
+}
+
+.hero-video {
+    overflow: hidden
+}
+
+.hero-video video {
+    left: 50%;
+    min-height: 100%;
+    min-width: 100%;
+    position: absolute;
+    top: 50%;
+    transform: translate3d(-50%, -50%, 0)
+}
+
+.hero-video.is-transparent {
+    opacity: .3
+}
+
+@media screen and (max-width: 768px) {
+    .hero-video {
+        display: none
+    }
+}
+
+.hero-buttons {
+    margin-top: 1.5rem
+}
+
+@media screen and (max-width: 768px) {
+    .hero-buttons .button {
+        display: flex
+    }
+
+    .hero-buttons .button:not(:last-child) {
+        margin-bottom: .75rem
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .hero-buttons {
+        display: flex;
+        justify-content: center
+    }
+
+    .hero-buttons .button:not(:last-child) {
+        margin-right: 1.5rem
+    }
+}
+
+.hero-body,
+.hero-foot,
+.hero-head {
+    flex-grow: 0;
+    flex-shrink: 0
+}
+
+.hero-body {
+    flex-grow: 1
+}
+
+.hero-body,
+.section {
+    padding: 3rem 1.5rem
+}
+
+@media screen and (min-width: 1024px) {
+    .section.is-medium {
+        padding: 9rem 1.5rem
+    }
+
+    .section.is-large {
+        padding: 18rem 1.5rem
+    }
+}
+
+.footer {
+    background-color: hsl(var(--main), 10%, 15%);
+    padding: 3rem 1.5rem 6rem
+}
+
+h6 {
+    text-transform: uppercase;
+    letter-spacing: .5px
+}
+
+.hero {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.button {
+    transition: all .2s ease;
+    border-width: 2px;
+    color: #fff
+}
+
+.button.is-active,
+.button.is-focused,
+.button:active,
+.button:focus {
+    box-shadow: 0 0 0 2px rgba(140, 155, 157, .5)
+}
+
+.button.is-white.is-hovered,
+.button.is-white:hover {
+    background-color: #fff
+}
+
+.button.is-white.is-active,
+.button.is-white.is-focused,
+.button.is-white:active,
+.button.is-white:focus {
+    border-color: #fff;
+    box-shadow: 0 0 0 2px rgba(255, 255, 255, .5)
+}
+
+.button.is-black.is-hovered,
+.button.is-black:hover {
+    background-color: #1d1d1d
+}
+
+.button.is-black.is-active,
+.button.is-black.is-focused,
+.button.is-black:active,
+.button.is-black:focus {
+    border-color: #0a0a0a;
+    box-shadow: 0 0 0 2px rgba(10, 10, 10, .5)
+}
+
+.button.is-light.is-hovered,
+.button.is-light:hover {
+    background-color: #fff
+}
+
+.button.is-light.is-active,
+.button.is-light.is-focused,
+.button.is-light:active,
+.button.is-light:focus {
+    border-color: #ecf0f1;
+    box-shadow: 0 0 0 2px rgba(236, 240, 241, .5)
+}
+
+.button.is-dark.is-hovered,
+.button.is-dark:hover {
+    background-color: #3a4344
+}
+
+.button.is-dark.is-active,
+.button.is-dark.is-focused,
+.button.is-dark:active,
+.button.is-dark:focus {
+    border-color: hsl(var(--main), 10%, 15%);
+    box-shadow: 0 0 0 2px rgba(40, 47, 47, .5)
+}
+
+.button.is-primary.is-hovered,
+.button.is-primary:hover {
+    background-color: hsl(var(--main), 65%, 35%)
+}
+
+.button.is-primary.is-active,
+.button.is-primary.is-focused,
+.button.is-primary:active,
+.button.is-primary:focus {
+    box-shadow: 0 0 0 2px rgb(140 155 157 / 50%)
+}
+
+.button.is-link.is-hovered,
+.button.is-link:hover {
+    background-color: #1fdeb8
+}
+
+.button.is-link.is-active,
+.button.is-link.is-focused,
+.button.is-link:active,
+.button.is-link:focus {
+    border-color: hsl(var(--main), 45%, 45%);
+    box-shadow: 0 0 0 2px rgba(26, 188, 156, .5)
+}
+
+.button.is-info.is-hovered,
+.button.is-info:hover {
+    background-color: #53a9e2
+}
+
+.button.is-info.is-active,
+.button.is-info.is-focused,
+.button.is-info:active,
+.button.is-info:focus {
+    border-color: #3298dc;
+    box-shadow: 0 0 0 2px rgba(50, 152, 220, .5)
+}
+
+.button.is-success.is-hovered,
+.button.is-success:hover {
+    background-color: #4ad685
+}
+
+.button.is-success.is-active,
+.button.is-success.is-focused,
+.button.is-success:active,
+.button.is-success:focus {
+    border-color: #2ecc71;
+    box-shadow: 0 0 0 2px rgba(46, 204, 113, .5)
+}
+
+.button.is-warning.is-hovered,
+.button.is-warning:hover {
+    background-color: #f3c232
+}
+
+.button.is-warning.is-active,
+.button.is-warning.is-focused,
+.button.is-warning:active,
+.button.is-warning:focus {
+    border-color: #f1b70e;
+    box-shadow: 0 0 0 2px rgba(241, 183, 14, .5)
+}
+
+.button.is-danger.is-hovered,
+.button.is-danger:hover {
+    background-color: #eb6b5e
+}
+
+.button.is-danger.is-active,
+.button.is-danger.is-focused,
+.button.is-danger:active,
+.button.is-danger:focus {
+    border-color: #e74c3c;
+    box-shadow: 0 0 0 2px rgba(231, 76, 60, .5)
+}
+
+.label {
+    color: #dbdee0
+}
+
+.input,
+.textarea {
+    transition: all .2s ease;
+    box-shadow: none;
+    border-width: 2px;
+    padding-left: 1em;
+    padding-right: 1em
+}
+
+.select select,
+.select:after {
+    border-width: 2px
+}
+
+.control.has-addons .button,
+.control.has-addons .input,
+.control.has-addons .select {
+    margin-right: -2px
+}
+
+.notification {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.card {
+    box-shadow: none;
+    border: 2px solid hsl(var(--main), 10%, 15%);
+    background-color: hsl(var(--main), 10%, 15%);
+    border-radius: .4em
+}
+
+.card .card-header {
+    box-shadow: none;
+    border-radius: .4em .4em 0 0
+}
+
+.card .card-footer,
+.card .card-header {
+    background-color: rgba(18, 18, 18, .2)
+}
+
+.card .card-footer,
+.card .card-footer-item {
+    border-width: 2px;
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.notification.is-white a:not(.button) {
+    color: #0a0a0a;
+    text-decoration: underline
+}
+
+.notification.is-black a:not(.button) {
+    color: #fff;
+    text-decoration: underline
+}
+
+.notification.is-light a:not(.button) {
+    color: rgba(0, 0, 0, .7);
+    text-decoration: underline
+}
+
+.notification.is-dark a:not(.button),
+.notification.is-info a:not(.button),
+.notification.is-link a:not(.button),
+.notification.is-primary a:not(.button),
+.notification.is-success a:not(.button) {
+    color: #fff;
+    text-decoration: underline
+}
+
+.notification.is-warning a:not(.button) {
+    color: rgba(0, 0, 0, .7);
+    text-decoration: underline
+}
+
+.notification.is-danger a:not(.button) {
+    color: #fff;
+    text-decoration: underline
+}
+
+.tag {
+    border-radius: .4em
+}
+
+.menu-list a {
+    transition: all .3s ease
+}
+
+.modal-card-body {
+    background-color: hsl(var(--main), 10%, 15%)
+}
+
+.modal-card-foot,
+.modal-card-head {
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.message-header {
+    font-weight: 700;
+    background-color: hsl(var(--main), 30%, 20%);
+    color: #fff
+}
+
+.message-body {
+    border-width: 2px;
+    border-color: hsl(var(--main), 10%, 15%)
+}
+
+.navbar.is-transparent {
+    background: 0 0
+}
+
+.navbar.is-primary .navbar-dropdown a.navbar-item.is-active {
+    background-color: hsl(var(--main), 45%, 45%)
+}
+
+@media screen and (max-width: 1023px) {
+    .navbar .navbar-menu {
+        background-color: hsl(var(--main), 45%, 45%);
+        border-radius: 0 0 .4em .4em
+    }
+}
+
+.hero .navbar,
+body>.navbar {
+    border-radius: 0
+}
+
+.pagination-link,
+.pagination-next,
+.pagination-previous,
+.panel-block,
+.panel-heading,
+.panel-tabs {
+    border-width: 2px
+}
+
+.panel-block:first-child,
+.panel-heading:first-child,
+.panel-tabs:first-child {
+    border-top-width: 2px
+}
+
+.panel-heading {
+    font-weight: 700
+}
+
+.panel-tabs a {
+    border-width: 2px;
+    margin-bottom: -2px
+}
+
+.panel-tabs a.is-active {
+    border-bottom-color: hsl(var(--main), 75%, 80%)
+}
+
+.panel-block:hover,
+.panel-block:hover .panel-icon {
+    color: hsl(var(--main), 85%, 95%)
+}
+
+.panel-block.is-active .panel-icon {
+    color: hsl(var(--main), 75%, 80%)
+}
+
+.tabs a {
+    border-bottom-width: 2px;
+    margin-bottom: -2px
+}
+
+.tabs.is-boxed a {
+    border-width: 2px
+}
+
+.tabs.is-boxed li.is-active a {
+    background-color: hsl(var(--main), 10%, 10%)
+}
+
+.tabs.is-toggle li a {
+    border-width: 2px;
+    margin-bottom: 0
+}
+
+.hero.is-black .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-danger .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-dark .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-info .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-light .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-link .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-primary .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-success .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-warning .navbar .navbar-dropdown .navbar-item:hover,
+.hero.is-white .navbar .navbar-dropdown .navbar-item:hover {
+    background-color: transparent
+}
+
+.is-flex-direction-row {
+    flex-direction: row !important
+}
+
+.is-flex-direction-row-reverse {
+    flex-direction: row-reverse !important
+}
+
+.is-flex-direction-column {
+    flex-direction: column !important
+}
+
+.is-flex-direction-column-reverse {
+    flex-direction: column-reverse !important
+}
+
+.is-flex-wrap-nowrap {
+    flex-wrap: nowrap !important
+}
+
+.is-flex-wrap-wrap {
+    flex-wrap: wrap !important
+}
+
+.is-flex-wrap-wrap-reverse {
+    flex-wrap: wrap-reverse !important
+}
+
+.is-justify-content-flex-start {
+    justify-content: flex-start !important
+}
+
+.is-justify-content-flex-end {
+    justify-content: flex-end !important
+}
+
+.is-justify-content-center {
+    justify-content: center !important
+}
+
+.is-justify-content-space-between {
+    justify-content: space-between !important
+}
+
+.is-justify-content-space-around {
+    justify-content: space-around !important
+}
+
+.is-justify-content-space-evenly {
+    justify-content: space-evenly !important
+}
+
+.is-justify-content-start {
+    justify-content: start !important
+}
+
+.is-justify-content-end {
+    justify-content: end !important
+}
+
+.is-justify-content-left {
+    justify-content: left !important
+}
+
+.is-justify-content-right {
+    justify-content: right !important
+}
+
+.is-align-content-flex-start {
+    align-content: flex-start !important
+}
+
+.is-align-content-flex-end {
+    align-content: flex-end !important
+}
+
+.is-align-content-center {
+    align-content: center !important
+}
+
+.is-align-content-space-between {
+    align-content: space-between !important
+}
+
+.is-align-content-space-around {
+    align-content: space-around !important
+}
+
+.is-align-content-space-evenly {
+    align-content: space-evenly !important
+}
+
+.is-align-content-stretch {
+    align-content: stretch !important
+}
+
+.is-align-content-start {
+    align-content: start !important
+}
+
+.is-align-content-end {
+    align-content: end !important
+}
+
+.is-align-content-baseline {
+    align-content: baseline !important
+}
+
+.is-align-items-stretch {
+    align-items: stretch !important
+}
+
+.is-align-items-flex-start {
+    align-items: flex-start !important
+}
+
+.is-align-items-flex-end {
+    align-items: flex-end !important
+}
+
+.is-align-items-center {
+    align-items: center !important
+}
+
+.is-align-items-baseline {
+    align-items: baseline !important
+}
+
+.is-align-items-start {
+    align-items: start !important
+}
+
+.is-align-items-end {
+    align-items: end !important
+}
+
+.is-align-items-self-start {
+    align-items: self-start !important
+}
+
+.is-align-items-self-end {
+    align-items: self-end !important
+}
+
+.is-align-self-auto {
+    align-self: auto !important
+}
+
+.is-align-self-flex-start {
+    align-self: flex-start !important
+}
+
+.is-align-self-flex-end {
+    align-self: flex-end !important
+}
+
+.is-align-self-center {
+    align-self: center !important
+}
+
+.is-align-self-baseline {
+    align-self: baseline !important
+}
+
+.is-align-self-stretch {
+    align-self: stretch !important
+}
+
+.is-flex-grow-0 {
+    flex-grow: 0 !important
+}
+
+.is-flex-grow-1 {
+    flex-grow: 1 !important
+}
+
+.is-flex-grow-2 {
+    flex-grow: 2 !important
+}
+
+.is-flex-grow-3 {
+    flex-grow: 3 !important
+}
+
+.is-flex-grow-4 {
+    flex-grow: 4 !important
+}
+
+.is-flex-grow-5 {
+    flex-grow: 5 !important
+}
+
+.is-flex-shrink-0 {
+    flex-shrink: 0 !important
+}
+
+.is-flex-shrink-1 {
+    flex-shrink: 1 !important
+}
+
+.is-flex-shrink-2 {
+    flex-shrink: 2 !important
+}
+
+.is-flex-shrink-3 {
+    flex-shrink: 3 !important
+}
+
+.is-flex-shrink-4 {
+    flex-shrink: 4 !important
+}
+
+.is-flex-shrink-5 {
+    flex-shrink: 5 !important
+}
+
+.is-clearfix::after {
+    clear: both;
+    content: " ";
+    display: table
+}
+
+.is-pulled-left {
+    float: left !important
+}
+
+.is-pulled-right {
+    float: right !important
+}
+
+.is-radiusless {
+    border-radius: 0 !important
+}
+
+.is-shadowless {
+    box-shadow: none !important
+}
+
+.is-clickable {
+    cursor: pointer !important
+}
+
+.is-clipped {
+    overflow: hidden !important
+}
+
+.is-relative {
+    position: relative !important
+}
+
+.is-marginless {
+    margin: 0 !important
+}
+
+.is-paddingless {
+    padding: 0 !important
+}
+
+.m-0 {
+    margin: 0 !important
+}
+
+.mt-0 {
+    margin-top: 0 !important
+}
+
+.mr-0 {
+    margin-right: 0 !important
+}
+
+.mb-0 {
+    margin-bottom: 0 !important
+}
+
+.ml-0 {
+    margin-left: 0 !important
+}
+
+.mx-0 {
+    margin-left: 0 !important;
+    margin-right: 0 !important
+}
+
+.my-0 {
+    margin-top: 0 !important;
+    margin-bottom: 0 !important
+}
+
+.m-1 {
+    margin: .25rem !important
+}
+
+.mt-1 {
+    margin-top: .25rem !important
+}
+
+.mr-1 {
+    margin-right: .25rem !important
+}
+
+.mb-1 {
+    margin-bottom: .25rem !important
+}
+
+.ml-1 {
+    margin-left: .25rem !important
+}
+
+.mx-1 {
+    margin-left: .25rem !important;
+    margin-right: .25rem !important
+}
+
+.my-1 {
+    margin-top: .25rem !important;
+    margin-bottom: .25rem !important
+}
+
+.m-2 {
+    margin: .5rem !important
+}
+
+.mt-2 {
+    margin-top: .5rem !important
+}
+
+.mr-2 {
+    margin-right: .5rem !important
+}
+
+.mb-2 {
+    margin-bottom: .5rem !important
+}
+
+.ml-2 {
+    margin-left: .5rem !important
+}
+
+.mx-2 {
+    margin-left: .5rem !important;
+    margin-right: .5rem !important
+}
+
+.my-2 {
+    margin-top: .5rem !important;
+    margin-bottom: .5rem !important
+}
+
+.m-3 {
+    margin: .75rem !important
+}
+
+.mt-3 {
+    margin-top: .75rem !important
+}
+
+.mr-3 {
+    margin-right: .75rem !important
+}
+
+.mb-3 {
+    margin-bottom: .75rem !important
+}
+
+.ml-3 {
+    margin-left: .75rem !important
+}
+
+.mx-3 {
+    margin-left: .75rem !important;
+    margin-right: .75rem !important
+}
+
+.my-3 {
+    margin-top: .75rem !important;
+    margin-bottom: .75rem !important
+}
+
+.m-4 {
+    margin: 1rem !important
+}
+
+.mt-4 {
+    margin-top: 1rem !important
+}
+
+.mr-4 {
+    margin-right: 1rem !important
+}
+
+.mb-4 {
+    margin-bottom: 1rem !important
+}
+
+.ml-4 {
+    margin-left: 1rem !important
+}
+
+.mx-4 {
+    margin-left: 1rem !important;
+    margin-right: 1rem !important
+}
+
+.my-4 {
+    margin-top: 1rem !important;
+    margin-bottom: 1rem !important
+}
+
+.m-5 {
+    margin: 1.5rem !important
+}
+
+.mt-5 {
+    margin-top: 1.5rem !important
+}
+
+.mr-5 {
+    margin-right: 1.5rem !important
+}
+
+.mb-5 {
+    margin-bottom: 1.5rem !important
+}
+
+.ml-5 {
+    margin-left: 1.5rem !important
+}
+
+.mx-5 {
+    margin-left: 1.5rem !important;
+    margin-right: 1.5rem !important
+}
+
+.my-5 {
+    margin-top: 1.5rem !important;
+    margin-bottom: 1.5rem !important
+}
+
+.m-6 {
+    margin: 3rem !important
+}
+
+.mt-6 {
+    margin-top: 3rem !important
+}
+
+.mr-6 {
+    margin-right: 3rem !important
+}
+
+.mb-6 {
+    margin-bottom: 3rem !important
+}
+
+.ml-6 {
+    margin-left: 3rem !important
+}
+
+.mx-6 {
+    margin-left: 3rem !important;
+    margin-right: 3rem !important
+}
+
+.my-6 {
+    margin-top: 3rem !important;
+    margin-bottom: 3rem !important
+}
+
+.p-0 {
+    padding: 0 !important
+}
+
+.pt-0 {
+    padding-top: 0 !important
+}
+
+.pr-0 {
+    padding-right: 0 !important
+}
+
+.pb-0 {
+    padding-bottom: 0 !important
+}
+
+.pl-0 {
+    padding-left: 0 !important
+}
+
+.px-0 {
+    padding-left: 0 !important;
+    padding-right: 0 !important
+}
+
+.py-0 {
+    padding-top: 0 !important;
+    padding-bottom: 0 !important
+}
+
+.p-1 {
+    padding: .25rem !important
+}
+
+.pt-1 {
+    padding-top: .25rem !important
+}
+
+.pr-1 {
+    padding-right: .25rem !important
+}
+
+.pb-1 {
+    padding-bottom: .25rem !important
+}
+
+.pl-1 {
+    padding-left: .25rem !important
+}
+
+.px-1 {
+    padding-left: .25rem !important;
+    padding-right: .25rem !important
+}
+
+.py-1 {
+    padding-top: .25rem !important;
+    padding-bottom: .25rem !important
+}
+
+.p-2 {
+    padding: .5rem !important
+}
+
+.pt-2 {
+    padding-top: .5rem !important
+}
+
+.pr-2 {
+    padding-right: .5rem !important
+}
+
+.pb-2 {
+    padding-bottom: .5rem !important
+}
+
+.pl-2 {
+    padding-left: .5rem !important
+}
+
+.px-2 {
+    padding-left: .5rem !important;
+    padding-right: .5rem !important
+}
+
+.py-2 {
+    padding-top: .5rem !important;
+    padding-bottom: .5rem !important
+}
+
+.p-3 {
+    padding: .75rem !important
+}
+
+.pt-3 {
+    padding-top: .75rem !important
+}
+
+.pr-3 {
+    padding-right: .75rem !important
+}
+
+.pb-3 {
+    padding-bottom: .75rem !important
+}
+
+.pl-3 {
+    padding-left: .75rem !important
+}
+
+.px-3 {
+    padding-left: .75rem !important;
+    padding-right: .75rem !important
+}
+
+.py-3 {
+    padding-top: .75rem !important;
+    padding-bottom: .75rem !important
+}
+
+.p-4 {
+    padding: 1rem !important
+}
+
+.pt-4 {
+    padding-top: 1rem !important
+}
+
+.pr-4 {
+    padding-right: 1rem !important
+}
+
+.pb-4 {
+    padding-bottom: 1rem !important
+}
+
+.pl-4 {
+    padding-left: 1rem !important
+}
+
+.px-4 {
+    padding-left: 1rem !important;
+    padding-right: 1rem !important
+}
+
+.py-4 {
+    padding-top: 1rem !important;
+    padding-bottom: 1rem !important
+}
+
+.p-5 {
+    padding: 1.5rem !important
+}
+
+.pt-5 {
+    padding-top: 1.5rem !important
+}
+
+.pr-5 {
+    padding-right: 1.5rem !important
+}
+
+.pb-5 {
+    padding-bottom: 1.5rem !important
+}
+
+.pl-5 {
+    padding-left: 1.5rem !important
+}
+
+.px-5 {
+    padding-left: 1.5rem !important;
+    padding-right: 1.5rem !important
+}
+
+.py-5 {
+    padding-top: 1.5rem !important;
+    padding-bottom: 1.5rem !important
+}
+
+.p-6 {
+    padding: 3rem !important
+}
+
+.pt-6 {
+    padding-top: 3rem !important
+}
+
+.pr-6 {
+    padding-right: 3rem !important
+}
+
+.pb-6 {
+    padding-bottom: 3rem !important
+}
+
+.pl-6 {
+    padding-left: 3rem !important
+}
+
+.px-6 {
+    padding-left: 3rem !important;
+    padding-right: 3rem !important
+}
+
+.py-6 {
+    padding-top: 3rem !important;
+    padding-bottom: 3rem !important
+}
+
+.is-size-1 {
+    font-size: 3rem !important
+}
+
+.is-size-2 {
+    font-size: 2.5rem !important
+}
+
+.is-size-3 {
+    font-size: 2rem !important
+}
+
+.is-size-4 {
+    font-size: 1.5rem !important
+}
+
+.is-size-5 {
+    font-size: 1.25rem !important
+}
+
+.is-size-6 {
+    font-size: 1rem !important
+}
+
+.is-size-7 {
+    font-size: .75rem !important
+}
+
+@media screen and (max-width: 768px) {
+    .is-size-1-mobile {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-mobile {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-mobile {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-mobile {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-mobile {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-mobile {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-mobile {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (min-width: 769px),
+print {
+    .is-size-1-tablet {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-tablet {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-tablet {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-tablet {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-tablet {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-tablet {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-tablet {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (max-width: 1023px) {
+    .is-size-1-touch {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-touch {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-touch {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-touch {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-touch {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-touch {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-touch {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (min-width: 1024px) {
+    .is-size-1-desktop {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-desktop {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-desktop {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-desktop {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-desktop {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-desktop {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-desktop {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (min-width: 1216px) {
+    .is-size-1-widescreen {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-widescreen {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-widescreen {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-widescreen {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-widescreen {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-widescreen {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-widescreen {
+        font-size: .75rem !important
+    }
+}
+
+@media screen and (min-width: 1408px) {
+    .is-size-1-fullhd {
+        font-size: 3rem !important
+    }
+
+    .is-size-2-fullhd {
+        font-size: 2.5rem !important
+    }
+
+    .is-size-3-fullhd {
+        font-size: 2rem !important
+    }
+
+    .is-size-4-fullhd {
+        font-size: 1.5rem !important
+    }
+
+    .is-size-5-fullhd {
+        font-size: 1.25rem !important
+    }
+
+    .is-size-6-fullhd {
+        font-size: 1rem !important
+    }
+
+    .is-size-7-fullhd {
+        font-size: .75rem !important
+    }
+}
+
+.has-text-centered {
+    text-align: center !important
+}
+
+.has-text-justified {
+    text-align: justify !important
+}
+
+.has-text-left {
+    text-align: left !important
+}
+
+.has-text-right {
+    text-align: right !important
+}
\ No newline at end of file
diff --git a/static/css/style.css b/static/css/style.css
index 1150943c..02e676b3 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -29,6 +29,12 @@ body {
   justify-content: center
 }
 
+div#app{
+  border-radius: 2em;
+  overflow: hidden;
+}
+
+
 #title {
   font-size: 6.5rem
 }
@@ -165,6 +171,11 @@ html {
   height: 100%;
 }
 
+.header
+{
+  border-radius: 1em 1em 0 0;
+}
+
 .w-locked {
   width: 1152px;
 }
@@ -368,6 +379,16 @@ a.foot-link {
   width: 152px;
 }
 
+.scores + .extra-block
+{
+  border-radius: 0 0 1em 1em;
+}
+
+.stats-block
+{
+  border-radius: 0 0 1em 1em;
+}
+
 .input,
 .select select,
 .textarea {
diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index 3f741316..016ac6e7 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -27,7 +27,7 @@
                 </a>
                 <div class="navbar-dropdown">
                     <a class="navbar-item">
-                        Todo...
+                        {{t("navbar.todo")}}
                     </a>
                 </div>
             </div>
@@ -65,16 +65,16 @@
                 </a>
                 <div class="navbar-dropdown">
                     <a class="navbar-item" href="/u/{{ session.user_data['id'] }}">
-                        Profile
+                        {{t("navbar.profile")}}
                     </a>
                     <a class="navbar-item" href="/settings">
-                        Settings
+                        {{t("navbar.settings")}}
                     </a>
                 </div>
             </div>
             <div class="navbar-item">
                 <a class="button is-light" href="/logout">
-                    Logout
+                    {{t("navbar.logout")}}
                 </a>
             </div>
             {% else %}
diff --git a/templates/profile.html b/templates/profile.html
index 623d0a1c..93cf551a 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -78,7 +78,7 @@ <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
 <div class="log-block" v-bind:class="{ 'load' : data.maps.{{ id }}.load }">
     <div class="header">
         <div class="title">
-            <i class="fas fa-address-book"></i> {{ t('profile.most-played-beatmaps') }}
+            <i class="fas fa-address-book"></i> {{ title }}
         </div>
     </div>
     <div v-if="data.maps.{{ id }}.out.length != 0" class="beatmaps">
@@ -337,9 +337,9 @@ <h1 class="title">
                 </div>-->
             </div>
             <div class="column">
-                {{ scores('Best Scores', 'best')}}
-                {{ scores('Recent Scores', 'recent')}}
-                {{ maps('Most Beatmaps Played', 'most')}}
+                {{ scores(t('profile.best-scores')  , 'best')}}
+                {{ scores(t('profile.recent-scores'), 'recent')}}
+                {{ maps(t('profile.most-played-beatmaps'), 'most')}}
             </div>
         </div>
     </div>
diff --git a/templates/settings/sidebar.html b/templates/settings/sidebar.html
index cfa0809b..9b258d87 100644
--- a/templates/settings/sidebar.html
+++ b/templates/settings/sidebar.html
@@ -4,7 +4,7 @@
             style="background-image: url(https://a.{{ domain() }}/{{ session.user_data['id']}});"></a>
         <div class="welcome-text">
             <span class="username pink-bold">{{ session.user_data['name']}}</span>
-            <span class="welcome">{{ ('settings.settings') }}</span>
+            <span class="welcome">{{ t('settings.settings') }}</span>
         </div>
     </div>
     <div class="left-selector">

From 2503a5d72310f26118e396d206fe50df5a315e8b Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Thu, 9 Jun 2022 19:20:24 +0800
Subject: [PATCH 077/278] resolve the conflict

---
 main.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/main.py b/main.py
index f597bc84..e0a5aa73 100755
--- a/main.py
+++ b/main.py
@@ -90,4 +90,4 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    app.run(port=8000, debug=glob.config.debug)  # blocking call
+    app.run(port=10000, debug=glob.config.debug)  # blocking call
\ No newline at end of file

From bd5ee433bf1dc9c9b34047464bfce4eebce5f4c5 Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Thu, 9 Jun 2022 19:22:34 +0800
Subject: [PATCH 078/278] resolve the conflict

---
 main.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/main.py b/main.py
index e0a5aa73..572cce12 100755
--- a/main.py
+++ b/main.py
@@ -90,4 +90,4 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    app.run(port=10000, debug=glob.config.debug)  # blocking call
\ No newline at end of file
+    app.run(port=8000, debug=glob.config.debug)  # blocking call
\ No newline at end of file

From 574926ced235b9ab586277e3064c4a1f032baf70 Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Fri, 10 Jun 2022 22:39:58 +0800
Subject: [PATCH 079/278] resolve the conflict

---
 main.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/main.py b/main.py
index 572cce12..f597bc84 100755
--- a/main.py
+++ b/main.py
@@ -90,4 +90,4 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    app.run(port=8000, debug=glob.config.debug)  # blocking call
\ No newline at end of file
+    app.run(port=8000, debug=glob.config.debug)  # blocking call

From 17014ca41b6339823d1f6623298ca437776d4f84 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 15:42:54 +0900
Subject: [PATCH 080/278] auto save & format

---
 .vscode/settings.json           | 17 ++++++++++++-
 package.json                    |  1 +
 utils/i18n/commands/compile.mjs |  9 ++++++-
 utils/i18n/commands/format.mjs  | 43 ++++++++++++++++++++++++++++-----
 utils/i18n/original-writer.mjs  |  6 +++--
 5 files changed, 66 insertions(+), 10 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 3f255736..d67a3a84 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -4,6 +4,7 @@
   "i18n-ally.pathMatcher": "{namespaces}/{locale}.{ext}",
   "i18n-ally.localesPaths": "locales",
   "i18n-ally.extract.keygenStyle": "kebab-case",
+  "i18n-ally.translate.engines": ["google-cn"],
   "i18n-ally.extract.keyMaxLength": 50,
   "i18n-ally.extract.parsers.html": {
     "attributes": [
@@ -39,5 +40,19 @@
     }
     // ...
   ],
-  "i18n-ally.keystyle": "nested"
+  "i18n-ally.keystyle": "nested",
+  "emeraldwalk.runonsave": {
+    "commands": [
+      {
+        "match": ".(yml | yaml)$",
+        "isAsync": true,
+        "cmd": "npm run i18n:format && npm run i18n:compile"
+      },
+      {
+        "match": ".html",
+        "isAsync": true,
+        "cmd": "npm run i18n:format"
+      },
+    ]
+  }
 }
diff --git a/package.json b/package.json
index 50451306..4d3e84ec 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
     "js-yaml": "^4.1.0"
   },
   "dependencies": {
+    "clui": "^0.3.6",
     "lodash-es": "^4.17.21",
     "nodemon": "^2.0.16"
   }
diff --git a/utils/i18n/commands/compile.mjs b/utils/i18n/commands/compile.mjs
index d3e1a4e9..dd62dccc 100644
--- a/utils/i18n/commands/compile.mjs
+++ b/utils/i18n/commands/compile.mjs
@@ -1,5 +1,12 @@
 
 import { readLocales } from '../reader.mjs'
 import { writeToDisk } from '../original-writer.mjs'
+import clui from 'clui'
+const { Spinner } = clui
 
-readLocales().then(locales => writeToDisk(locales))
\ No newline at end of file
+const work = new Spinner('reading locales...')
+const data = await readLocales()
+work.message('transforming to python-i18n format...')
+await writeToDisk(data)
+work.stop()
+console.log('transformed to python-i18n format')
\ No newline at end of file
diff --git a/utils/i18n/commands/format.mjs b/utils/i18n/commands/format.mjs
index 2ef469cc..f179e44f 100644
--- a/utils/i18n/commands/format.mjs
+++ b/utils/i18n/commands/format.mjs
@@ -3,19 +3,50 @@ import yaml from 'js-yaml'
 import glob from 'glob'
 import path from 'path'
 import fs from 'fs/promises'
+import clui from 'clui'
+const { Spinner } = clui
 
+import { path as translationPath } from '../config.mjs'
 
-import { compiledFileSchema, path as translationPath, contextFromFileName } from '../config.mjs'
 
 glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
     if (err) throw err
-    const locales = matches.reduce(async (acc, match) => {
+    const work = new Spinner(`formatting locales...`)
+    work.start()
+    await Promise.all(matches.map(async (match) => {
+        const work = new Spinner(`formatting locale: ${match}`)
+        work.start()
         try {
-            const data = yaml.load(await fs.readFile(match, {encoding: 'utf8'}))
+            const data = yaml.load(await fs.readFile(match, { encoding: 'utf8' }))
             const formatted = yaml.dump(data)
-            fs.writeFile(match, formatted, 'utf8')
+            await fs.writeFile(match, formatted, 'utf8')
         } catch (error) {
-            reject(error)
+            console.error(error)
+        } finally {
+            work.stop()
         }
-    }, {})
+    }))
+    work.stop()
+    console.log(`formatting locales...  done`)
+})
+
+glob(path.join(translationPath, '../templates/**/*.html'), async (err, matches) => {
+    if (err) throw err
+    const work = new Spinner(`formatting templates...`)
+    work.start()
+    await Promise.all(matches.map(async match => {
+        const work = new Spinner(`formatting locale: ${match}`)
+        work.start()
+        try {
+            const template = await fs.readFile(match, { encoding: 'utf8' })
+            const wb = template.replace(/\{\{\s?t\('(.*)'\s?(,\s?(.+)\s?)?\)\s?\}\}/gmu, '{{ t(\'$1\'$2) }}')
+            await fs.writeFile(match, wb, 'utf8')
+        } catch (error) {
+            console.error(error)
+        } finally {
+            work.stop()
+        }
+    }))
+    work.stop()
+    console.log(`formatting templates...  done`)
 })
\ No newline at end of file
diff --git a/utils/i18n/original-writer.mjs b/utils/i18n/original-writer.mjs
index dbf986c2..7b9613e5 100644
--- a/utils/i18n/original-writer.mjs
+++ b/utils/i18n/original-writer.mjs
@@ -36,7 +36,8 @@ export function generateFileName(context) {
     return compiledFileNameSchema.map(k => context[k].replace('-','_')).join(divider)
 }
 
-export function writeToDisk(locales) {
+export async function writeToDisk(locales) {
+    const works = []
     for (const locale in locales) {
         const namespaces = locales[locale]
         for (const namespace in namespaces) {
@@ -53,7 +54,8 @@ export function writeToDisk(locales) {
             if (!existsSync(path)) {
                 mkdirSync(dir, {recursive: true})
             }
-            fs.writeFile(path, yaml, 'utf8')
+            works.push(fs.writeFile(path, yaml, 'utf8'))
         }
     }
+    return Promise.all(works)
 }

From 4c174294ebf998ee4490818fb0cc5b6b648440a9 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 15:43:07 +0900
Subject: [PATCH 081/278] work @ jun 12

---
 .locales/admin.en_GB.yml         |  7 +++++++
 .locales/admin.en_US.yml         |  4 ++++
 .locales/admin.zh_CN.yml         | 14 +++++++++-----
 .locales/global.en_GB.yml        |  2 ++
 locales/admin/base/en-US.yml     |  2 ++
 locales/admin/base/zh-CN.yml     | 10 ++++++----
 locales/admin/home/en-GB.yml     |  7 +++++++
 locales/admin/home/en-US.yml     |  2 ++
 locales/admin/home/zh-CN.yml     |  4 +++-
 locales/global/en-GB.yml         |  2 ++
 templates/admin/home.html        | 20 ++++++++++----------
 templates/components/navbar.html |  8 ++++----
 templates/settings/avatar.html   |  6 +++---
 templates/settings/custom.html   | 10 +++++-----
 templates/settings/password.html | 10 +++++-----
 templates/settings/profile.html  |  4 ++--
 16 files changed, 73 insertions(+), 39 deletions(-)

diff --git a/.locales/admin.en_GB.yml b/.locales/admin.en_GB.yml
index 87690c80..146aca29 100644
--- a/.locales/admin.en_GB.yml
+++ b/.locales/admin.en_GB.yml
@@ -13,3 +13,10 @@ en_GB:
     total-users: total users
     that-s-a-lot-of-people: that's a lot of people!
     total-online: total online
+    rising-in-popularity-aren-t-we: rising in popularity are we?
+    latest-and-greatest-welcome: latest and greatest! welcome!
+    latest-user: latest user
+    total-banned: total banned
+    naughty-sad-face: naughty naughty :(
+    recent-users: Recent Users
+    recent-score: Recent Score
diff --git a/.locales/admin.en_US.yml b/.locales/admin.en_US.yml
index 26354469..134aa27b 100644
--- a/.locales/admin.en_US.yml
+++ b/.locales/admin.en_US.yml
@@ -6,5 +6,9 @@ en_US:
     discord: Discord
     admin-panel: '%{appName} Admin Panel'
     instagram: Instagram
+    github: GitHub
+    twitter: Twitter
   home:
     that-s-a-lot-of-people: that's a lot of people!
+    total-users: total users
+    total-online: total online
diff --git a/.locales/admin.zh_CN.yml b/.locales/admin.zh_CN.yml
index 2d84d3d6..85c814e5 100644
--- a/.locales/admin.zh_CN.yml
+++ b/.locales/admin.zh_CN.yml
@@ -1,10 +1,14 @@
 zh_CN:
   base:
-    admin: Admin
-    dashboard: Dashboard
-    welcome-to-admin-panel: Welcome to %{appName} admin panel!
+    admin: 管理员
+    dashboard: 控制面板
+    welcome-to-admin-panel: 欢迎来到 %{appName} 管理面板!
     discord: Discord
-    admin-panel: '%{appName} Admin Panel'
+    admin-panel: '%{appName} 管理员面板'
     instagram: Instagram
+    github: GitHub
+    twitter: 推特
   home:
-    that-s-a-lot-of-people: that's a lot of people!
+    that-s-a-lot-of-people: 好多人！
+    total-users: 总用户
+    total-online: 总在线
diff --git a/.locales/global.en_GB.yml b/.locales/global.en_GB.yml
index 28cefcbe..aca8d4c5 100644
--- a/.locales/global.en_GB.yml
+++ b/.locales/global.en_GB.yml
@@ -12,3 +12,5 @@ en_GB:
   uh-oh-be-careful: uh oh! Be careful!
   hey-listen: Hey! Listen!
   verify: Verify
+  pp: pp
+  accuracy: accuracy
diff --git a/locales/admin/base/en-US.yml b/locales/admin/base/en-US.yml
index f473d69e..1c5e5eb7 100644
--- a/locales/admin/base/en-US.yml
+++ b/locales/admin/base/en-US.yml
@@ -4,3 +4,5 @@ welcome-to-admin-panel: Welcome to %{appName} admin panel!
 discord: Discord
 admin-panel: '%{appName} Admin Panel'
 instagram: Instagram
+github: GitHub
+twitter: Twitter
diff --git a/locales/admin/base/zh-CN.yml b/locales/admin/base/zh-CN.yml
index f473d69e..f098bb7d 100644
--- a/locales/admin/base/zh-CN.yml
+++ b/locales/admin/base/zh-CN.yml
@@ -1,6 +1,8 @@
-admin: Admin
-dashboard: Dashboard
-welcome-to-admin-panel: Welcome to %{appName} admin panel!
+admin: 管理员
+dashboard: 控制面板
+welcome-to-admin-panel: 欢迎来到 %{appName} 管理面板!
 discord: Discord
-admin-panel: '%{appName} Admin Panel'
+admin-panel: '%{appName} 管理员面板'
 instagram: Instagram
+github: GitHub
+twitter: 推特
diff --git a/locales/admin/home/en-GB.yml b/locales/admin/home/en-GB.yml
index d3fe3048..ca838172 100644
--- a/locales/admin/home/en-GB.yml
+++ b/locales/admin/home/en-GB.yml
@@ -1,3 +1,10 @@
 total-users: total users
 that-s-a-lot-of-people: that's a lot of people!
 total-online: total online
+rising-in-popularity-aren-t-we: rising in popularity are we?
+latest-and-greatest-welcome: latest and greatest! welcome!
+latest-user: latest user
+total-banned: total banned
+naughty-sad-face: naughty naughty :(
+recent-users: Recent Users
+recent-score: Recent Score
diff --git a/locales/admin/home/en-US.yml b/locales/admin/home/en-US.yml
index dab3e7a9..1174603b 100644
--- a/locales/admin/home/en-US.yml
+++ b/locales/admin/home/en-US.yml
@@ -1 +1,3 @@
 that-s-a-lot-of-people: that's a lot of people!
+total-users: total users
+total-online: total online
diff --git a/locales/admin/home/zh-CN.yml b/locales/admin/home/zh-CN.yml
index dab3e7a9..b347dc1d 100644
--- a/locales/admin/home/zh-CN.yml
+++ b/locales/admin/home/zh-CN.yml
@@ -1 +1,3 @@
-that-s-a-lot-of-people: that's a lot of people!
+that-s-a-lot-of-people: 好多人！
+total-users: 总用户
+total-online: 总在线
diff --git a/locales/global/en-GB.yml b/locales/global/en-GB.yml
index be6998b6..f2d3c263 100644
--- a/locales/global/en-GB.yml
+++ b/locales/global/en-GB.yml
@@ -11,3 +11,5 @@ notice: Notice
 uh-oh-be-careful: uh oh! Be careful!
 hey-listen: Hey! Listen!
 verify: Verify
+pp: pp
+accuracy: accuracy
diff --git a/templates/admin/home.html b/templates/admin/home.html
index 82a43ace..a188afbf 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -15,7 +15,7 @@
     <div class="columns is-marginless is-paddingless">
         <div class="column is-paddingless p-3">
             <div class="card">
-                <div class="title">{{ ('admin.home.total-users') }}</div>
+                <div class="title">{{ t('admin.home.total-users') }}</div>
                 <i class="fa fa-users"></i>
                 <div class="value">{{ dashdata['count'] }}</div>
                 <div class="stat">{{ t('admin.home.that-s-a-lot-of-people') }}</div>
@@ -28,23 +28,23 @@
                 <div class="value">
                     <% online_users %>
                 </div>
-                <div class="stat">rising in popularity are we?</div>
+                <div class="stat">{{ t('admin.home.rising-in-popularity-aren-t-we') }}</div>
             </div>
         </div>
         <div class="column is-paddingless p-3">
             <div class="card">
-                <div class="title">lastest user</div>
+                <div class="title">{{ t('admin.home.latest-user') }}</div>
                 <i class="fa fa-book"></i>
                 <div class="value">{{ dashdata['lastest_user'] }}</div>
-                <div class="stat">latest and greatest! welcome!</div>
+                <div class="stat">{{ t('admin.home.latest-and-greatest-welcome') }}</div>
             </div>
         </div>
         <div class="column is-paddingless p-3">
             <div class="card">
-                <div class="title">total banned</div>
+                <div class="title">{{ t('admin.home.total-banned') }}</div>
                 <i class="fa fa-calendar"></i>
                 <div class="value">{{ dashdata['banned'] }}</div>
-                <div class="stat">naughty naughty :(</div>
+                <div class="stat">{{ t('admin.home.naughty-sad-face') }}</div>
             </div>
         </div>
     </div>
@@ -54,7 +54,7 @@
         <div class="recent-beat">
             <div class="columns is-marginless">
                 <div class="column is-paddingless flex-vcenter">
-                    <h2 class="section-title">Recent Users</h2>
+                    <h2 class="section-title">{{ t('admin.home.recent-users') }}</h2>
                 </div>
             </div>
             <div class="blockdata">
@@ -93,7 +93,7 @@ <h2 class="section-title">Recent Users</h2>
         <div class="recent-beat">
             <div class="columns is-marginless">
                 <div class="column is-paddingless flex-vcenter">
-                    <h2 class="section-title">Recent Score</h2>
+                    <h2 class="section-title">{{ t('admin.home.recent-score') }}</h2>
                 </div>
             </div>
             <div class="blockdata">
@@ -119,8 +119,8 @@ <h2 class="section-title">Recent Score</h2>
                             <div class="score-details_right-block">
                                 <div class="score-details_pp-block">
                                     <div class="map-pp">
-                                        {{ maps.pp }}<span class="map-pp-unit">pp</span></div>
-                                    <div class="map-acc">accuracy:&nbsp;<b>
+                                        {{ maps.pp }}<span class="map-pp-unit">{{ t('global.pp') }}</span></div>
+                                    <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
                                         {{ maps.acc }}%
                                         </b></div>
                                 </div>
diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index 016ac6e7..1d79d5f5 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -27,7 +27,7 @@
                 </a>
                 <div class="navbar-dropdown">
                     <a class="navbar-item">
-                        {{t("navbar.todo")}}
+                        {{ t('navbar.todo') }}
                     </a>
                 </div>
             </div>
@@ -65,16 +65,16 @@
                 </a>
                 <div class="navbar-dropdown">
                     <a class="navbar-item" href="/u/{{ session.user_data['id'] }}">
-                        {{t("navbar.profile")}}
+                        {{ t('navbar.profile') }}
                     </a>
                     <a class="navbar-item" href="/settings">
-                        {{t("navbar.settings")}}
+                        {{ t('navbar.settings') }}
                     </a>
                 </div>
             </div>
             <div class="navbar-item">
                 <a class="button is-light" href="/logout">
-                    {{t("navbar.logout")}}
+                    {{ t('navbar.logout') }}
                 </a>
             </div>
             {% else %}
diff --git a/templates/settings/avatar.html b/templates/settings/avatar.html
index 476a7c3a..c65cc8f6 100644
--- a/templates/settings/avatar.html
+++ b/templates/settings/avatar.html
@@ -23,7 +23,7 @@ <h4 class="mb-4">{{ t('settings.avatar') }}</h4>
                     <input class="file-input" id="file" type="file" accept="image/jpeg" name="avatar">
                     <span class="file-cta">
                       <span class="file-label">
-                        {{ t('settings.choose-file')}}
+                        {{ t('settings.choose-file') }}
                       </span>
                       <span class="file-icon">
                         <i class="fa fa-upload"></i>
@@ -84,9 +84,9 @@ <h4 class="mb-4">{{ t('settings.preview') }}</h4>
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-            {{ t('global.uh-oh-be-careful')}}
+            {{ t('global.uh-oh-be-careful') }}
           {% elif status=='success' %}
-            {{ t('global.hey-listen')}}
+            {{ t('global.hey-listen') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/custom.html b/templates/settings/custom.html
index 4911f5a4..ef53b947 100644
--- a/templates/settings/custom.html
+++ b/templates/settings/custom.html
@@ -23,7 +23,7 @@ <h4 class="mb-4">{{ t('settings.banner') }}</h4>
                     <input class="file-input" id="file-bn" type="file" name="banner">
                     <span class="file-cta">
                       <span class="file-label">
-                        {{ t('settings.choose-file')}}
+                        {{ t('settings.choose-file') }}
                       </span>
                       <span class="file-icon">
                         <i class="fa fa-upload"></i>
@@ -33,16 +33,16 @@ <h4 class="mb-4">{{ t('settings.banner') }}</h4>
                 </div>
               </div>
               <div class="single-block-content avatar-block-content">
-                <h4 class="mb-4">{{ t('settings.profile-background')}}</h4>
+                <h4 class="mb-4">{{ t('settings.profile-background') }}</h4>
                 <div class="subtitle">
-                    {{ t('settings.profile-background-description')}}
+                    {{ t('settings.profile-background-description') }}
                 </div>
                 <div class="buttons margin-top" id="selection">
                   <label class="file-label">
                     <input class="file-input" id="file-bg" type="file" name="background">
                     <span class="file-cta">
                       <span class="file-label">
-                        {{ t('settings.choose-file')}}
+                        {{ t('settings.choose-file') }}
                       </span>
                       <span class="file-icon">
                         <i class="fa fa-upload"></i>
@@ -118,7 +118,7 @@ <h4 class="mb-4">{{ t('settings.preview') }}</h4>
           {% if status=='error' %}
           {{ t('global.uh-oh-be-careful') }}
           {% elif status=='success' %}
-          {{ t('global.hey-listen')}}
+          {{ t('global.hey-listen') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/password.html b/templates/settings/password.html
index 3729d37c..e6b39640 100644
--- a/templates/settings/password.html
+++ b/templates/settings/password.html
@@ -9,13 +9,13 @@
   <div class="block-content right" id="settings-content">
     <div id="general" class="single-right-block">
       <div class="right-block-header">
-          {{ t('settings.password-change')}}
+          {{ t('settings.password-change') }}
       </div>
       <form action="/settings/password" method="post" class="right-block-content">
         <div class="single-block-content">
           <div class="block-content--left">
             <div class="field-label is-normal">
-              <label class="label">{{ t('settings.old-password')}}</label>
+              <label class="label">{{ t('settings.old-password') }}</label>
             </div>
           </div>
           <div class="block-content--right">
@@ -31,7 +31,7 @@
         <div class="single-block-content">
             <div class="block-content--left">
               <div class="field-label is-normal">
-                <label class="label">{{ t('settings.new-password')}}</label>
+                <label class="label">{{ t('settings.new-password') }}</label>
               </div>
             </div>
             <div class="block-content--right">
@@ -47,7 +47,7 @@
           <div class="single-block-content">
             <div class="block-content--left">
               <div class="field-label is-normal">
-                <label class="label">{{ t('settings.repeat-password')}}</label>
+                <label class="label">{{ t('settings.repeat-password') }}</label>
               </div>
             </div>
             <div class="block-content--right">
@@ -83,7 +83,7 @@
           {% if status=='error' %}
           {{ t('global.uh-oh-be-careful') }}
           {% elif status=='success' %}
-            {{ t('global.hey-listen')}}
+            {{ t('global.hey-listen') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/profile.html b/templates/settings/profile.html
index 8bd706ee..b6270ebb 100644
--- a/templates/settings/profile.html
+++ b/templates/settings/profile.html
@@ -9,7 +9,7 @@
   <div class="block-content right">
     <div id="general" class="single-right-block">
       <div class="right-block-header">
-          {{ t('settings.user-information')}}
+          {{ t('settings.user-information') }}
       </div>
       <form action="/settings/profile" method="post" class="setting-block-content">
         <div class="single-block-content">
@@ -86,7 +86,7 @@
           {% if status=='error' %}
           {{ t('global.uh-oh-be-careful') }}
           {% elif status=='success' %}
-            {{ t('global.hey-listen')}}
+            {{ t('global.hey-listen') }}
           {% endif %}
         </div>
       </div>

From 078c0ec01ffeb90c6cf6f0e804cd6cb506a904fa Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 15:49:02 +0900
Subject: [PATCH 082/278] follow status

---
 templates/settings/avatar.html   | 4 ++--
 templates/settings/custom.html   | 4 ++--
 templates/settings/password.html | 4 ++--
 templates/settings/profile.html  | 4 ++--
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/templates/settings/avatar.html b/templates/settings/avatar.html
index c65cc8f6..b3e37aff 100644
--- a/templates/settings/avatar.html
+++ b/templates/settings/avatar.html
@@ -84,9 +84,9 @@ <h4 class="mb-4">{{ t('settings.preview') }}</h4>
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-            {{ t('global.uh-oh-be-careful') }}
+            {{ t('global.error') }}
           {% elif status=='success' %}
-            {{ t('global.hey-listen') }}
+            {{ t('global.success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/custom.html b/templates/settings/custom.html
index ef53b947..68e0c24c 100644
--- a/templates/settings/custom.html
+++ b/templates/settings/custom.html
@@ -116,9 +116,9 @@ <h4 class="mb-4">{{ t('settings.preview') }}</h4>
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          {{ t('global.uh-oh-be-careful') }}
+          {{ t('global.error') }}
           {% elif status=='success' %}
-          {{ t('global.hey-listen') }}
+          {{ t('global.success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/password.html b/templates/settings/password.html
index e6b39640..43a68c64 100644
--- a/templates/settings/password.html
+++ b/templates/settings/password.html
@@ -81,9 +81,9 @@
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          {{ t('global.uh-oh-be-careful') }}
+          {{ t('global.error') }}
           {% elif status=='success' %}
-            {{ t('global.hey-listen') }}
+            {{ t('global.success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/profile.html b/templates/settings/profile.html
index b6270ebb..27fdc11b 100644
--- a/templates/settings/profile.html
+++ b/templates/settings/profile.html
@@ -84,9 +84,9 @@
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          {{ t('global.uh-oh-be-careful') }}
+          {{ t('global.error') }}
           {% elif status=='success' %}
-            {{ t('global.hey-listen') }}
+            {{ t('global.success') }}
           {% endif %}
         </div>
       </div>

From e84f5f09ab4ea71f812ab9ed9ff154409f8e1ea0 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 15:54:06 +0900
Subject: [PATCH 083/278] do not format yaml while saving

---
 .vscode/settings.json | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index d67a3a84..500a2306 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -45,12 +45,10 @@
     "commands": [
       {
         "match": ".(yml | yaml)$",
-        "isAsync": true,
-        "cmd": "npm run i18n:format && npm run i18n:compile"
+        "cmd": "npm run i18n:compile"
       },
       {
         "match": ".html",
-        "isAsync": true,
         "cmd": "npm run i18n:format"
       },
     ]

From 113294acde1d53fe0e2b04a70bec33bb998dc26f Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 16:00:22 +0900
Subject: [PATCH 084/278] no space

---
 .vscode/settings.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 500a2306..5341e398 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -44,7 +44,7 @@
   "emeraldwalk.runonsave": {
     "commands": [
       {
-        "match": ".(yml | yaml)$",
+        "match": ".(yml|yaml)$",
         "cmd": "npm run i18n:compile"
       },
       {

From 1d7b11e0949d68341b357f6a236e1849c7600c87 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 16:18:33 +0900
Subject: [PATCH 085/278] workspace plugins

---
 .vscode/extensions.json | 9 +++++++++
 .vscode/settings.json   | 7 +++++--
 2 files changed, 14 insertions(+), 2 deletions(-)
 create mode 100644 .vscode/extensions.json

diff --git a/.vscode/extensions.json b/.vscode/extensions.json
new file mode 100644
index 00000000..a79b1348
--- /dev/null
+++ b/.vscode/extensions.json
@@ -0,0 +1,9 @@
+{
+    "recommendations": [
+        "samuelcolvin.jinjahtml",
+        "lokalise.i18n-ally",
+        "ms-python.vscode-pylance",
+        "ms-python.python",
+        "emeraldwalk.RunOnSave"
+    ]
+}
\ No newline at end of file
diff --git a/.vscode/settings.json b/.vscode/settings.json
index 5341e398..c7ad7637 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -36,7 +36,7 @@
       "source": "html-attribute",
       "templates": ["i18n.t('{key}'{args})", "custom.t('{key}'{args})"],
       // accept globs, resolved to project root (optional)
-      "include": ["templates/**/*.html"],
+      "include": ["templates/**/*.html"]
     }
     // ...
   ],
@@ -50,7 +50,10 @@
       {
         "match": ".html",
         "cmd": "npm run i18n:format"
-      },
+      }
     ]
+  },
+  "files.associations": {
+    "*.html": "jinja-html"
   }
 }

From d746727aadb84527a2fec99ae530949cb264146c Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 16:20:14 +0900
Subject: [PATCH 086/278] i18n ally jinja-html

---
 .vscode/i18n-ally-custom-framework.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.vscode/i18n-ally-custom-framework.yml b/.vscode/i18n-ally-custom-framework.yml
index 142de182..2e18e4f1 100644
--- a/.vscode/i18n-ally-custom-framework.yml
+++ b/.vscode/i18n-ally-custom-framework.yml
@@ -4,6 +4,7 @@
 # You can check avaliable language ids here: https://code.visualstudio.com/docs/languages/overview#_language-id
 languageIds:
   - html
+  - jinja-html
   
 
 # An array of RegExes to find the key usage. **The key should be captured in the first match group**.

From e4c2df72d4163fa5463d4d75c41c875f9398483e Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 16:26:33 +0900
Subject: [PATCH 087/278] follow 'success' 'error' pattern from python

---
 .locales/global.en_US.yml | 4 ++--
 .locales/global.zh_CN.yml | 4 ++--
 locales/global/en-US.yml  | 4 ++--
 locales/global/zh-CN.yml  | 4 ++--
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/.locales/global.en_US.yml b/.locales/global.en_US.yml
index 2b9ca6eb..e50069ee 100644
--- a/.locales/global.en_US.yml
+++ b/.locales/global.en_US.yml
@@ -9,6 +9,6 @@ en_US:
   register: Register
   notice: Notice
   warning: Warning
-  uh-oh-be-careful: uh oh! Be careful!
-  hey-listen: Hey! Listen!
+  error: uh oh! Be careful!
+  success: Hey! Listen!
   verify: Verify
diff --git a/.locales/global.zh_CN.yml b/.locales/global.zh_CN.yml
index eedc351f..db93f8f7 100644
--- a/.locales/global.zh_CN.yml
+++ b/.locales/global.zh_CN.yml
@@ -9,6 +9,6 @@ zh_CN:
   register: Register
   notice: Notice
   warning: Warning
-  uh-oh-be-careful: uh oh! Be careful!
-  hey-listen: Hey! Listen!
+  error: uh oh! Be careful!
+  success: Hey! Listen!
   verify: Verify
diff --git a/locales/global/en-US.yml b/locales/global/en-US.yml
index 94b343de..a319f15e 100644
--- a/locales/global/en-US.yml
+++ b/locales/global/en-US.yml
@@ -8,6 +8,6 @@ profile: Profile
 register: Register
 notice: Notice
 warning: Warning
-uh-oh-be-careful: uh oh! Be careful!
-hey-listen: Hey! Listen!
+error: uh oh! Be careful!
+success: Hey! Listen!
 verify: Verify
diff --git a/locales/global/zh-CN.yml b/locales/global/zh-CN.yml
index d0b695d9..e7ccbf78 100644
--- a/locales/global/zh-CN.yml
+++ b/locales/global/zh-CN.yml
@@ -8,6 +8,6 @@ profile: Profile
 register: Register
 notice: Notice
 warning: Warning
-uh-oh-be-careful: uh oh! Be careful!
-hey-listen: Hey! Listen!
+error: uh oh! Be careful!
+success: Hey! Listen!
 verify: Verify

From a0c1911f660ab5152221bcaa0de9058b1583d0a6 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 16:40:01 +0900
Subject: [PATCH 088/278] leaderboard, profile, password

---
 .locales/global.en_GB.yml        | 23 ++++++++++++++++++++---
 locales/global/en-GB.yml         | 23 ++++++++++++++++++++---
 templates/leaderboard.html       | 32 ++++++++++++++++----------------
 templates/profile.html           | 24 ++++++++++++------------
 templates/settings/password.html |  2 +-
 5 files changed, 69 insertions(+), 35 deletions(-)

diff --git a/.locales/global.en_GB.yml b/.locales/global.en_GB.yml
index aca8d4c5..3590bcae 100644
--- a/.locales/global.en_GB.yml
+++ b/.locales/global.en_GB.yml
@@ -9,8 +9,25 @@ en_GB:
   register: Register
   warning: Warning
   notice: Notice
-  uh-oh-be-careful: uh oh! Be careful!
-  hey-listen: Hey! Listen!
+  error: uh oh! Be careful!
+  success: Hey! Listen!
   verify: Verify
   pp: pp
-  accuracy: accuracy
+  PP: PP
+  accuracy: Accuracy
+  score: Score
+  acc: Acc
+  playcount: Play Count
+  playtime: Play Time
+  max-combo: Max Combo
+  mode:
+    vanilla: Vanilla
+    relax: Relax
+    autopilot: Autopilot
+    taiko: osu!taiko
+    osu: osu!
+    catch: osu!catch
+    mania: osu!mania
+    VN: VN
+    RX: RX
+    AP: AP
diff --git a/locales/global/en-GB.yml b/locales/global/en-GB.yml
index f2d3c263..169ce656 100644
--- a/locales/global/en-GB.yml
+++ b/locales/global/en-GB.yml
@@ -8,8 +8,25 @@ profile: Profile
 register: Register
 warning: Warning
 notice: Notice
-uh-oh-be-careful: uh oh! Be careful!
-hey-listen: Hey! Listen!
+error: uh oh! Be careful!
+success: Hey! Listen!
 verify: Verify
 pp: pp
-accuracy: accuracy
+PP: PP
+accuracy: Accuracy
+score: Score
+acc: Acc
+playcount: Play Count
+playtime: Play Time
+max-combo: Max Combo
+mode:
+  vanilla: Vanilla
+  relax: Relax
+  autopilot: Autopilot
+  taiko: osu!taiko
+  osu: osu!
+  catch: osu!catch
+  mania: osu!mania
+  VN: VN
+  RX: RX
+  AP: AP
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index 9071c8ea..fa20a849 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -21,42 +21,42 @@
         <div class="main-selector">
             <a class="mode-select" v-bind:class="{ 'active': mode === 'std' }"
             @click="LoadLeaderboard(sort, 'std', mods)">
-                <i class="mode-icon mode-osu"></i><span class="modetext"> osu!</span>
+                <i class="mode-icon mode-osu"></i><span class="modetext"> {{ t('global.mode.osu') }}</span>
             </a>
             <a class="mode-select" v-bind:class="{ 'active': mode === 'taiko', 'disabled': mods === 'ap' }"
             @click="LoadLeaderboard(sort, 'taiko', mods)">
-                <i class="mode-icon mode-taiko"></i><span class="modetext"> osu!taiko</span>
+                <i class="mode-icon mode-taiko"></i><span class="modetext"> {{ t('global.mode.taiko') }}</span>
             </a>
             <a class="mode-select" v-bind:class="{ 'active': mode === 'catch', 'disabled': mods === 'ap' }"
             @click="LoadLeaderboard(sort, 'catch', mods)">
-                <i class="mode-icon mode-catch"></i><span class="modetext"> osu!catch</span>
+                <i class="mode-icon mode-catch"></i><span class="modetext"> {{ t('global.mode.catch') }}</span>
             </a>
             <a class="mode-select" v-bind:class="{ 'active': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
             @click="LoadLeaderboard(sort, 'mania', mods)">
-                <i class="mode-icon mode-mania"></i><span class="modetext"> osu!mania</span>
+                <i class="mode-icon mode-mania"></i><span class="modetext"> {{ t('global.mode.mania') }}</span>
             </a>
         </div>
         <div class="banner-text">{{ t('leaderboard.leaderboard') }}</div>
         <div class="selector">
             <div class="left">
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'pp' }"
-                @click="LoadLeaderboard('pp', mode, mods, '')">PP</a>
+                @click="LoadLeaderboard('pp', mode, mods, '')">{{ t('global.PP') }}</a>
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'rscore' }"
-                @click="LoadLeaderboard('rscore', mode, mods, '')">Score</a>
+                @click="LoadLeaderboard('rscore', mode, mods, '')">{{ t('global.score') }}</a>
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'acc' }"
-                @click="LoadLeaderboard('acc', mode, mods, '')">Acc</a>
+                @click="LoadLeaderboard('acc', mode, mods, '')">{{ t('global.acc') }}</a>
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'plays' }"
-                @click="LoadLeaderboard('plays', mode, mods, '')">PlayCount</a>
+                @click="LoadLeaderboard('plays', mode, mods, '')">{{ t('global.playcount') }}</a>
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'playtime' }"
-                @click="LoadLeaderboard('playtime', mode, mods, '')">PlayTime</a>
+                @click="LoadLeaderboard('playtime', mode, mods, '')">{{ t('global.playtime') }}</a>
             </div>
             <div class="right">
                 <a class="simple-banner-switch" v-bind:class=" { 'active': mods === 'vn' }"
-                @click="LoadLeaderboard(sort, mode, 'vn')">Vanilla</a>
+                @click="LoadLeaderboard(sort, mode, 'vn')">{{ t('global.mode.vanilla') }}</a>
                 <a class="simple-banner-switch" v-bind:class=" { 'active': mods === 'rx', 'disabled': mode === 'mania' }"
-                @click="LoadLeaderboard(sort, mode, 'rx')">Relax</a>
+                @click="LoadLeaderboard(sort, mode, 'rx')">{{ t('global.mode.relax') }}</a>
                 <a class="simple-banner-switch" v-bind:class=" { 'active': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
-                @click="LoadLeaderboard(sort, mode, 'ap')">Autopilot</a>
+                @click="LoadLeaderboard(sort, mode, 'ap')">{{ t('global.mode.autopilot') }}</a>
             </div>
         </div>
     </div>
@@ -72,10 +72,10 @@
                                 <% (sort=='pp' ? "PP" : "" ) %>
                                     <% (sort=='rscore' ? "Score" : "" ) %>
                             </th>
-                            <th class="t-heading"> Accuracy </th>
-                            <th class="t-heading"> Playcount </th>
-                            <th class="t-heading"> Max Combo </th>
-                            <th class="t-heading"> Play Time </th>
+                            <th class="t-heading"> {{ t('global.accuracy') }} </th>
+                            <th class="t-heading"> {{ t('global.playcount') }} </th>
+                            <th class="t-heading"> {{ t('global.max-combo') }} </th>
+                            <th class="t-heading"> {{ t('global.playtime') }}</th>
                         </tr>
                     </thead>
                     <tbody>
diff --git a/templates/profile.html b/templates/profile.html
index 93cf551a..1895549c 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -38,9 +38,9 @@
                         <div class="score-details_right-block">
                             <div class="score-details_pp-block">
                                 <div class="map-pp">
-                                    <% map.pp.toFixed() %><span class="map-pp-unit">pp</span>
+                                    <% map.pp.toFixed() %><span class="map-pp-unit">{{ t('global.pp') }}</span>
                                 </div>
-                                <div class="map-acc">accuracy:&nbsp;<b>
+                                <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
                                         <% map.acc.toFixed(2) %>%
                                     </b></div>
                             </div>
@@ -177,27 +177,27 @@ <h1 class="title">
                 <div class="select-left">
                     <a class="simple-banner-switch" v-bind:class="{ 'selected': mode === 'std' }"
                         @click="ChangeModeMods('std',mods)"><i class="mode-icon mode-osu"></i><span
-                            class="mode-text">osu!</span></a>
+                            class="mode-text">{{ t('global.mode.osu') }}</span></a>
                     <a class="simple-banner-switch" v-bind:class="{ 'selected': mode === 'taiko', 'disabled': mods === 'ap' }"
                         @click="ChangeModeMods('taiko',mods)"><i class="mode-icon mode-taiko"></i><span
-                            class="mode-text">osu!taiko</span></a>
+                            class="mode-text">{{ t('global.mode.taiko') }}</span></a>
                     <a class="simple-banner-switch" v-bind:class="{ 'selected': mode === 'catch', 'disabled': mods === 'ap' }"
                         @click="ChangeModeMods('catch',mods)"><i class="mode-icon mode-catch"></i><span
-                            class="mode-text">osu!catch</span></a>
+                            class="mode-text">{{ t('global.mode.catch') }}</span></a>
                     <a class="simple-banner-switch" v-bind:class="{ 'selected': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
                         @click="ChangeModeMods('mania',mods)"><i class="mode-icon mode-mania"></i><span
-                            class="mode-text">osu!mania</span></a>
+                            class="mode-text">{{ t('global.mode.mania') }}</span></a>
                 </div>
                 <div class="select-right">
                     <a class="simple-banner-switch" v-bind:class=" { 'selected': mods === 'vn' }"
-                        @click="ChangeModeMods(mode,'vn')"><span class="mods-fulltext">Vanilla</span>
-                        <span class="mods-shorttext">VN</span></a>
+                        @click="ChangeModeMods(mode,'vn')"><span class="mods-fulltext">{{ t('global.mode.vanilla') }}</span>
+                        <span class="mods-shorttext">{{ t('global.mode.VN') }}</span></a>
                     <a class="simple-banner-switch" v-bind:class=" { 'selected': mods === 'rx', 'disabled': mode === 'mania' }"
-                        @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">Relax</span>
-                        <span class="mods-shorttext">RX</span></a>
+                        @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">{{ t('global.mode.relax') }}</span>
+                        <span class="mods-shorttext">{{ t('global.mode.RX') }}</span></a>
                     <a class="simple-banner-switch" v-bind:class=" { 'selected': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
-                        @click="ChangeModeMods(mode,'ap')"><span class="mods-fulltext">Autopilot</span><span
-                            class="mods-shorttext">AP</span></a>
+                        @click="ChangeModeMods(mode,'ap')"><span class="mods-fulltext">{{ t('global.mode.autopilot') }}</span><span
+                            class="mods-shorttext">{{ t('global.mode.AP') }}</span></a>
                 </div>
             </div>
         </div>
diff --git a/templates/settings/password.html b/templates/settings/password.html
index 43a68c64..f0a1268e 100644
--- a/templates/settings/password.html
+++ b/templates/settings/password.html
@@ -60,7 +60,7 @@
               </div>
             </div>
           </div>
-        <button class='button is-primary' type='submit'><span>Save</span><span class='icon is-small'><i class='fas fa-check'></i></span></button>
+        <button class='button is-primary' type='submit'><span>{{ t('settings.save') }}</span><span class='icon is-small'><i class='fas fa-check'></i></span></button>
         </form>
     </div>
   </div>

From 1e39acc52e046fffd25cfcff1ac8bb19d75c94d1 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 16:47:54 +0900
Subject: [PATCH 089/278] captured all literals

---
 locales/404/en-GB.yml           |  1 +
 locales/global/en-GB.yml        |  8 ++++++++
 locales/profile/en-GB.yml       |  4 ++++
 templates/404.html              |  2 +-
 templates/profile.html          | 30 +++++++++++++++---------------
 templates/settings/custom.html  |  2 +-
 templates/settings/profile.html |  2 +-
 7 files changed, 31 insertions(+), 18 deletions(-)

diff --git a/locales/404/en-GB.yml b/locales/404/en-GB.yml
index 7cc2f30a..3740fb1e 100644
--- a/locales/404/en-GB.yml
+++ b/locales/404/en-GB.yml
@@ -1,3 +1,4 @@
+'404': '404'
 page-not-found: Page not found
 where-am-i: Where am I?
 check-url: Check that the URL you entered is correct.
diff --git a/locales/global/en-GB.yml b/locales/global/en-GB.yml
index 169ce656..0501af89 100644
--- a/locales/global/en-GB.yml
+++ b/locales/global/en-GB.yml
@@ -30,3 +30,11 @@ mode:
   VN: VN
   RX: RX
   AP: AP
+ranked-score: Ranked score
+total-score: Total score
+rank:
+  ss: SS
+  ssh: SS
+  s: S
+  sh: S
+  a: A
diff --git a/locales/profile/en-GB.yml b/locales/profile/en-GB.yml
index ea0c45a8..171763f2 100644
--- a/locales/profile/en-GB.yml
+++ b/locales/profile/en-GB.yml
@@ -6,3 +6,7 @@ most-played-beatmaps: Most Played Beatmaps
 no-beatmaps-available: No beatmaps available
 statistics: Statistics
 recent-scores: Recent Scores
+by: by
+global-rank: Global Rank
+country-rank: Country Rank
+name-aka: name aka
diff --git a/templates/404.html b/templates/404.html
index 0a2e7dd4..168146a2 100644
--- a/templates/404.html
+++ b/templates/404.html
@@ -9,7 +9,7 @@
 {% block content %}
 <div class="main-block">
 	<div class="title-block">
-		<span>404</span>
+		<span>{{ t('404.404') }}</span>
 		<h2 class="error-title">
             {{ t('404.page-not-found') }}
 		</h2>
diff --git a/templates/profile.html b/templates/profile.html
index 1895549c..d43e7b9c 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -91,7 +91,7 @@ <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
                 </span> <span class="beatmap-artist">
                     <% map.artist %>
                 </span>
-                <div class="beatmap-footer"><span class="beatmap-mapper"> by <span
+                <div class="beatmap-footer"><span class="beatmap-mapper"> {{ t('profile.by') }} <span
                             class="newmaps-color">
                             <% map.creator %>
                         </span></span>
@@ -214,7 +214,7 @@ <h1 class="title">
                     <table class="is-striped">
                         <tbody>
                             <tr>
-                                <td>Global rank</td>
+                                <td>{{ t('profile.global-rank') }}</td>
                                 <td class="right-aligned">
                                     <span id="global-rank">
                                         <% '#' + data.stats[`rank_global_${modegulag}`] %>
@@ -222,7 +222,7 @@ <h1 class="title">
                                 </td>
                             </tr>
                             <tr>
-                                <td>Country rank</td>
+                                <td>{{ t('profile.country-rank') }}</td>
                                 <td class="right-aligned">
                                     <span id="country-rank">
                                         <% '#' + data.stats[`rank_country_${modegulag}`] %>
@@ -241,43 +241,43 @@ <h1 class="title">
                     <table class="is-striped">
                         <tbody>
                             <tr>
-                                <td><b>PP</b></td>
+                                <td><b>{{ t('global.PP') }}</b></td>
                                 <td class="right-aligned">
                                     <% addCommas(data.stats.out[modegulag].pp) %>
                                 </td>
                             </tr>
                             <tr>
-                                <td><b>Ranked score</b></td>
+                                <td><b>{{ t('global.ranked-score') }}</b></td>
                                 <td class="right-aligned">
                                     <% addCommas(data.stats.out[modegulag].rscore) %>
                                 </td>
                             </tr>
                             <tr>
-                                <td><b>Total score</b></td>
+                                <td><b>{{ t('global.total-score') }}</b></td>
                                 <td class="right-aligned">
                                     <% addCommas(data.stats.out[modegulag].tscore) %>
                                 </td>
                             </tr>
                             <tr>
-                                <td><b>Max combo</b></td>
+                                <td><b>{{ t('global.max-combo') }}</b></td>
                                 <td class="right-aligned">
                                     <% addCommas(data.stats.out[modegulag].max_combo) %>
                                 </td>
                             </tr>
                             <tr>
-                                <td><b>Playcount</b></td>
+                                <td><b>{{ t('global.playcount') }}</b></td>
                                 <td class="right-aligned">
                                     <% addCommas(data.stats.out[modegulag].plays) %>
                                 </td>
                             </tr>
                             <tr>
-                                <td><b>Playtime</b></td>
+                                <td><b>{{ t('global.playtime') }}</b></td>
                                 <td class="right-aligned">
                                     <% secondsToDhm(data.stats.out[modegulag].playtime) %>
                                 </td>
                             </tr>
                             <tr>
-                                <td><b>Accuracy</b></td>
+                                <td><b>{{ t('global.accuracy') }}</b></td>
                                 <td class="right-aligned">
                                     <% data.stats.out[modegulag].acc %>%
                                 </td>
@@ -289,13 +289,13 @@ <h1 class="title">
                             <div class="media-content">
                                 <div class="grade-line">
                                     <div class="rank-single">
-                                        <div class="map-rank rank-X">SS</div>
+                                        <div class="map-rank rank-X">{{ t('global.rank.ss') }}</div>
                                         <div class="rank-amount">
                                             <% data.stats.out[modegulag].x_count %>
                                         </div>
                                     </div>
                                     <div class="rank-single">
-                                        <div class="map-rank rank-XH">SS</div>
+                                        <div class="map-rank rank-XH">{{ t('global.rank.ssh') }}</div>
                                         <div class="rank-amount">
                                             <% data.stats.out[modegulag].xh_count %>
                                         </div>
@@ -303,19 +303,19 @@ <h1 class="title">
                                 </div>
                                 <div class="grade-line">
                                     <div class="rank-single">
-                                        <div class="map-rank rank-S">S</div>
+                                        <div class="map-rank rank-S">{{ t('global.rank.s') }}</div>
                                         <div class="rank-amount">
                                             <% data.stats.out[modegulag].s_count %>
                                         </div>
                                     </div>
                                     <div class="rank-single">
-                                        <div class="map-rank rank-SH">S</div>
+                                        <div class="map-rank rank-SH">{{ t('global.rank.sh') }}</div>
                                         <div class="rank-amount">
                                             <% data.stats.out[modegulag].sh_count %>
                                         </div>
                                     </div>
                                     <div class="rank-single">
-                                        <div class="map-rank rank-A">A</div>
+                                        <div class="map-rank rank-A">{{ t('global.rank.a') }}</div>
                                         <div class="rank-amount">
                                             <% data.stats.out[modegulag].a_count %>
                                         </div>
diff --git a/templates/settings/custom.html b/templates/settings/custom.html
index 68e0c24c..3a0fe21c 100644
--- a/templates/settings/custom.html
+++ b/templates/settings/custom.html
@@ -52,7 +52,7 @@ <h4 class="mb-4">{{ t('settings.profile-background') }}</h4>
                 </div>
               </div>
               <div class="custom-button buttons mt-6">
-                <button class='button is-primary' type='submit'><span class='icon is-small'><i class='fas fa-check'></i></span><span>Save</span></button>
+                <button class='button is-primary' type='submit'><span class='icon is-small'><i class='fas fa-check'></i></span><span>{{ t('settings.save') }}</span></button>
               </div>
             </form>
           </div>
diff --git a/templates/settings/profile.html b/templates/settings/profile.html
index 27fdc11b..59bda026 100644
--- a/templates/settings/profile.html
+++ b/templates/settings/profile.html
@@ -49,7 +49,7 @@
         <div class="single-block-content">
           <div class="block-content--left">
             <div class="field-label is-normal">
-              <label class="label">name aka</label>
+              <label class="label">{{ t('profile.name-aka') }}</label>
             </div>
           </div>
           <div class="block-content--right">

From 7fa31a97e1a126aa2c1b37bd3840d9262cfad0bc Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 16:55:19 +0900
Subject: [PATCH 090/278] all translations

---
 locales/404/en-US.yml        |  1 +
 locales/404/zh-CN.yml        |  1 +
 locales/admin/base/en-US.yml |  1 +
 locales/admin/base/zh-CN.yml |  1 +
 locales/admin/home/en-US.yml |  7 +++++++
 locales/admin/home/zh-CN.yml |  7 +++++++
 locales/global/en-GB.yml     |  2 +-
 locales/global/en-US.yml     | 27 +++++++++++++++++++++++++++
 locales/global/zh-CN.yml     | 27 +++++++++++++++++++++++++++
 locales/profile/en-US.yml    |  4 ++++
 locales/profile/zh-CN.yml    |  4 ++++
 11 files changed, 81 insertions(+), 1 deletion(-)

diff --git a/locales/404/en-US.yml b/locales/404/en-US.yml
index 7cc2f30a..3740fb1e 100644
--- a/locales/404/en-US.yml
+++ b/locales/404/en-US.yml
@@ -1,3 +1,4 @@
+'404': '404'
 page-not-found: Page not found
 where-am-i: Where am I?
 check-url: Check that the URL you entered is correct.
diff --git a/locales/404/zh-CN.yml b/locales/404/zh-CN.yml
index aeedcdbb..aac2ca6b 100644
--- a/locales/404/zh-CN.yml
+++ b/locales/404/zh-CN.yml
@@ -1,3 +1,4 @@
+'404': '404'
 page-not-found: 404 查无此页
 where-am-i: 我是谁 我在哪 我在干什么?
 check-url: 请检查下你输入的链接是否正确。
diff --git a/locales/admin/base/en-US.yml b/locales/admin/base/en-US.yml
index 1c5e5eb7..5fe3f095 100644
--- a/locales/admin/base/en-US.yml
+++ b/locales/admin/base/en-US.yml
@@ -6,3 +6,4 @@ admin-panel: '%{appName} Admin Panel'
 instagram: Instagram
 github: GitHub
 twitter: Twitter
+youtube: YouTube
diff --git a/locales/admin/base/zh-CN.yml b/locales/admin/base/zh-CN.yml
index f098bb7d..835803bf 100644
--- a/locales/admin/base/zh-CN.yml
+++ b/locales/admin/base/zh-CN.yml
@@ -6,3 +6,4 @@ admin-panel: '%{appName} 管理员面板'
 instagram: Instagram
 github: GitHub
 twitter: 推特
+youtube: YouTube
diff --git a/locales/admin/home/en-US.yml b/locales/admin/home/en-US.yml
index 1174603b..e6edf886 100644
--- a/locales/admin/home/en-US.yml
+++ b/locales/admin/home/en-US.yml
@@ -1,3 +1,10 @@
 that-s-a-lot-of-people: that's a lot of people!
 total-users: total users
 total-online: total online
+latest-and-greatest-welcome: latest and greatest! welcome!
+latest-user: latest user
+naughty-sad-face: naughty naughty :(
+recent-score: Recent Score
+recent-users: Recent Users
+rising-in-popularity-aren-t-we: rising in popularity are we?
+total-banned: total banned
diff --git a/locales/admin/home/zh-CN.yml b/locales/admin/home/zh-CN.yml
index b347dc1d..4d50149a 100644
--- a/locales/admin/home/zh-CN.yml
+++ b/locales/admin/home/zh-CN.yml
@@ -1,3 +1,10 @@
 that-s-a-lot-of-people: 好多人！
 total-users: 总用户
 total-online: 总在线
+latest-and-greatest-welcome: 最新最热！欢迎！
+latest-user: 最新用户
+naughty-sad-face: 坏坏 :(
+recent-score: 最近成绩
+recent-users: 最新用户
+rising-in-popularity-aren-t-we: 要火了咱们？
+total-banned: 总被ban
diff --git a/locales/global/en-GB.yml b/locales/global/en-GB.yml
index 0501af89..e43ff408 100644
--- a/locales/global/en-GB.yml
+++ b/locales/global/en-GB.yml
@@ -31,7 +31,7 @@ mode:
   RX: RX
   AP: AP
 ranked-score: Ranked score
-total-score: Total score
+total-score: Total Score
 rank:
   ss: SS
   ssh: SS
diff --git a/locales/global/en-US.yml b/locales/global/en-US.yml
index a319f15e..ed7634b6 100644
--- a/locales/global/en-US.yml
+++ b/locales/global/en-US.yml
@@ -11,3 +11,30 @@ warning: Warning
 error: uh oh! Be careful!
 success: Hey! Listen!
 verify: Verify
+PP: PP
+acc: Acc
+accuracy: Accuracy
+max-combo: Max Combo
+mode:
+  AP: AP
+  RX: RX
+  VN: VN
+  autopilot: Autopilot
+  catch: osu!catch
+  mania: osu!mania
+  osu: osu!
+  relax: Relax
+  taiko: osu!taiko
+  vanilla: Vanilla
+playcount: Play Count
+playtime: Play Time
+pp: pp
+rank:
+  a: A
+  s: S
+  sh: S
+  ss: SS
+  ssh: SS
+ranked-score: Ranked score
+score: Score
+total-score: Total Score
diff --git a/locales/global/zh-CN.yml b/locales/global/zh-CN.yml
index e7ccbf78..548c7179 100644
--- a/locales/global/zh-CN.yml
+++ b/locales/global/zh-CN.yml
@@ -11,3 +11,30 @@ warning: Warning
 error: uh oh! Be careful!
 success: Hey! Listen!
 verify: Verify
+PP: PP
+acc: Acc
+accuracy: 准确度
+max-combo: 最大连击
+mode:
+  AP: AP
+  RX: RX
+  VN: VN
+  autopilot: Autopilot
+  catch: osu!接水果
+  mania: osu!面条
+  osu: osu!
+  relax: Relax
+  taiko: osu!太鼓
+  vanilla: Vanilla
+playcount: 游玩次数
+playtime: 游玩时间
+pp: pp
+rank:
+  a: A
+  s: S
+  sh: S
+  ss: SS
+  ssh: SS
+score: 分数
+total-score: 总分
+ranked-score: 记分总分
diff --git a/locales/profile/en-US.yml b/locales/profile/en-US.yml
index ea0c45a8..0459c1d1 100644
--- a/locales/profile/en-US.yml
+++ b/locales/profile/en-US.yml
@@ -6,3 +6,7 @@ most-played-beatmaps: Most Played Beatmaps
 no-beatmaps-available: No beatmaps available
 statistics: Statistics
 recent-scores: Recent Scores
+by: by
+country-rank: Country Rank
+global-rank: Global Rank
+name-aka: name aka
diff --git a/locales/profile/zh-CN.yml b/locales/profile/zh-CN.yml
index ccbe0a58..e45592ef 100644
--- a/locales/profile/zh-CN.yml
+++ b/locales/profile/zh-CN.yml
@@ -6,3 +6,7 @@ most-played-beatmaps: 游玩最多的铺面
 no-beatmaps-available: 暂无有效铺面
 statistics: 数据统计
 recent-scores: 最近的成绩
+by: 作者
+country-rank: 国内排名
+global-rank: 全球排名
+name-aka: 别名

From 1ae0c54e62f39f834aa7857f88fe5772463ecfc1 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 17:20:17 +0900
Subject: [PATCH 091/278] Update zh-CN.yml

---
 locales/global/zh-CN.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/locales/global/zh-CN.yml b/locales/global/zh-CN.yml
index 548c7179..40f1eab6 100644
--- a/locales/global/zh-CN.yml
+++ b/locales/global/zh-CN.yml
@@ -7,7 +7,7 @@ login: Login
 profile: Profile
 register: Register
 notice: Notice
-warning: Warning
+warning: 注意
 error: uh oh! Be careful!
 success: Hey! Listen!
 verify: Verify

From 171f0ff8b65104f6cf175d708f2b2ea223f39ae7 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 12 Jun 2022 17:45:24 +0900
Subject: [PATCH 092/278] python translations

---
 .locales/404.en_GB.yml                 |  1 +
 .locales/404.en_US.yml                 |  1 +
 .locales/404.zh_CN.yml                 |  3 ++-
 .locales/admin.en_US.yml               |  8 +++++++
 .locales/admin.zh_CN.yml               |  8 +++++++
 .locales/global.en_GB.yml              |  8 +++++++
 .locales/global.en_US.yml              | 27 ++++++++++++++++++++++
 .locales/global.zh_CN.yml              | 31 ++++++++++++++++++++++++--
 .locales/profile.en_GB.yml             |  4 ++++
 .locales/profile.en_US.yml             |  4 ++++
 .locales/profile.zh_CN.yml             |  4 ++++
 .locales/settings.en_GB.yml            |  3 ++-
 .vscode/i18n-ally-custom-framework.yml |  1 +
 blueprints/frontend.py                 |  3 ++-
 locales/404/zh-CN.yml                  |  2 +-
 locales/global/zh-CN.yml               |  2 +-
 locales/settings/profile/en_GB.yml     |  1 +
 templates/settings/profile.html        |  2 +-
 templates/settings/sidebar.html        |  2 +-
 19 files changed, 106 insertions(+), 9 deletions(-)
 create mode 100644 locales/settings/profile/en_GB.yml

diff --git a/.locales/404.en_GB.yml b/.locales/404.en_GB.yml
index 0bd22e57..c1948c75 100644
--- a/.locales/404.en_GB.yml
+++ b/.locales/404.en_GB.yml
@@ -1,4 +1,5 @@
 en_GB:
+  '404': '404'
   page-not-found: Page not found
   where-am-i: Where am I?
   check-url: Check that the URL you entered is correct.
diff --git a/.locales/404.en_US.yml b/.locales/404.en_US.yml
index 4ce2e89c..9f78cce2 100644
--- a/.locales/404.en_US.yml
+++ b/.locales/404.en_US.yml
@@ -1,4 +1,5 @@
 en_US:
+  '404': '404'
   page-not-found: Page not found
   where-am-i: Where am I?
   check-url: Check that the URL you entered is correct.
diff --git a/.locales/404.zh_CN.yml b/.locales/404.zh_CN.yml
index 857a1214..7f0bb9ed 100644
--- a/.locales/404.zh_CN.yml
+++ b/.locales/404.zh_CN.yml
@@ -1,5 +1,6 @@
 zh_CN:
-  page-not-found: 404 查无此页
+  '404': '404'
+  page-not-found: 找不到页面
   where-am-i: 我是谁 我在哪 我在干什么?
   check-url: 请检查下你输入的链接是否正确。
   make-sure-visit: 或者确保你想访问的地方没有在维护中!
diff --git a/.locales/admin.en_US.yml b/.locales/admin.en_US.yml
index 134aa27b..794dd248 100644
--- a/.locales/admin.en_US.yml
+++ b/.locales/admin.en_US.yml
@@ -8,7 +8,15 @@ en_US:
     instagram: Instagram
     github: GitHub
     twitter: Twitter
+    youtube: YouTube
   home:
     that-s-a-lot-of-people: that's a lot of people!
     total-users: total users
     total-online: total online
+    latest-and-greatest-welcome: latest and greatest! welcome!
+    latest-user: latest user
+    naughty-sad-face: naughty naughty :(
+    recent-score: Recent Score
+    recent-users: Recent Users
+    rising-in-popularity-aren-t-we: rising in popularity are we?
+    total-banned: total banned
diff --git a/.locales/admin.zh_CN.yml b/.locales/admin.zh_CN.yml
index 85c814e5..ae760ecd 100644
--- a/.locales/admin.zh_CN.yml
+++ b/.locales/admin.zh_CN.yml
@@ -8,7 +8,15 @@ zh_CN:
     instagram: Instagram
     github: GitHub
     twitter: 推特
+    youtube: YouTube
   home:
     that-s-a-lot-of-people: 好多人！
     total-users: 总用户
     total-online: 总在线
+    latest-and-greatest-welcome: 最新最热！欢迎！
+    latest-user: 最新用户
+    naughty-sad-face: 坏坏 :(
+    recent-score: 最近成绩
+    recent-users: 最新用户
+    rising-in-popularity-aren-t-we: 要火了咱们？
+    total-banned: 总被ban
diff --git a/.locales/global.en_GB.yml b/.locales/global.en_GB.yml
index 3590bcae..127b9155 100644
--- a/.locales/global.en_GB.yml
+++ b/.locales/global.en_GB.yml
@@ -31,3 +31,11 @@ en_GB:
     VN: VN
     RX: RX
     AP: AP
+  ranked-score: Ranked score
+  total-score: Total Score
+  rank:
+    ss: SS
+    ssh: SS
+    s: S
+    sh: S
+    a: A
diff --git a/.locales/global.en_US.yml b/.locales/global.en_US.yml
index e50069ee..1f487c5c 100644
--- a/.locales/global.en_US.yml
+++ b/.locales/global.en_US.yml
@@ -12,3 +12,30 @@ en_US:
   error: uh oh! Be careful!
   success: Hey! Listen!
   verify: Verify
+  PP: PP
+  acc: Acc
+  accuracy: Accuracy
+  max-combo: Max Combo
+  mode:
+    AP: AP
+    RX: RX
+    VN: VN
+    autopilot: Autopilot
+    catch: osu!catch
+    mania: osu!mania
+    osu: osu!
+    relax: Relax
+    taiko: osu!taiko
+    vanilla: Vanilla
+  playcount: Play Count
+  playtime: Play Time
+  pp: pp
+  rank:
+    a: A
+    s: S
+    sh: S
+    ss: SS
+    ssh: SS
+  ranked-score: Ranked score
+  score: Score
+  total-score: Total Score
diff --git a/.locales/global.zh_CN.yml b/.locales/global.zh_CN.yml
index db93f8f7..f0c1249a 100644
--- a/.locales/global.zh_CN.yml
+++ b/.locales/global.zh_CN.yml
@@ -3,12 +3,39 @@ zh_CN:
   log-in: 登录
   offline: 离线
   online: 在线
-  leaderboard: 排行榜2
+  leaderboard: 排行榜
   login: Login
   profile: Profile
   register: Register
   notice: Notice
-  warning: Warning
+  warning: 注意
   error: uh oh! Be careful!
   success: Hey! Listen!
   verify: Verify
+  PP: PP
+  acc: Acc
+  accuracy: 准确度
+  max-combo: 最大连击
+  mode:
+    AP: AP
+    RX: RX
+    VN: VN
+    autopilot: Autopilot
+    catch: osu!接水果
+    mania: osu!面条
+    osu: osu!
+    relax: Relax
+    taiko: osu!太鼓
+    vanilla: Vanilla
+  playcount: 游玩次数
+  playtime: 游玩时间
+  pp: pp
+  rank:
+    a: A
+    s: S
+    sh: S
+    ss: SS
+    ssh: SS
+  score: 分数
+  total-score: 总分
+  ranked-score: 记分总分
diff --git a/.locales/profile.en_GB.yml b/.locales/profile.en_GB.yml
index 53ce3557..e0370f4e 100644
--- a/.locales/profile.en_GB.yml
+++ b/.locales/profile.en_GB.yml
@@ -7,3 +7,7 @@ en_GB:
   no-beatmaps-available: No beatmaps available
   statistics: Statistics
   recent-scores: Recent Scores
+  by: by
+  global-rank: Global Rank
+  country-rank: Country Rank
+  name-aka: name aka
diff --git a/.locales/profile.en_US.yml b/.locales/profile.en_US.yml
index 9bc61132..ed967bd7 100644
--- a/.locales/profile.en_US.yml
+++ b/.locales/profile.en_US.yml
@@ -7,3 +7,7 @@ en_US:
   no-beatmaps-available: No beatmaps available
   statistics: Statistics
   recent-scores: Recent Scores
+  by: by
+  country-rank: Country Rank
+  global-rank: Global Rank
+  name-aka: name aka
diff --git a/.locales/profile.zh_CN.yml b/.locales/profile.zh_CN.yml
index 6bfcf4f0..a83db250 100644
--- a/.locales/profile.zh_CN.yml
+++ b/.locales/profile.zh_CN.yml
@@ -7,3 +7,7 @@ zh_CN:
   no-beatmaps-available: 暂无有效铺面
   statistics: 数据统计
   recent-scores: 最近的成绩
+  by: 作者
+  country-rank: 国内排名
+  global-rank: 全球排名
+  name-aka: 别名
diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
index fb6d5870..78a20873 100644
--- a/.locales/settings.en_GB.yml
+++ b/.locales/settings.en_GB.yml
@@ -16,7 +16,8 @@ en_GB:
   old-password: Old Password
   new-password: New Password
   repeat-password: Repeat Password
-  profile: Profile
+  profile:
+    invalid-parameters: Invalid parameters.
   user-information: User Infomation
   username: Username
   settings: Settings
diff --git a/.vscode/i18n-ally-custom-framework.yml b/.vscode/i18n-ally-custom-framework.yml
index 2e18e4f1..a4e6eda4 100644
--- a/.vscode/i18n-ally-custom-framework.yml
+++ b/.vscode/i18n-ally-custom-framework.yml
@@ -5,6 +5,7 @@
 languageIds:
   - html
   - jinja-html
+  - python
   
 
 # An array of RegExes to find the key usage. **The key should be captured in the first match group**.
diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 46dc4663..f15e1d97 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -20,6 +20,7 @@
 from quart import send_file
 
 from constants import regexes
+from main import t
 from objects import glob
 from objects import utils
 from objects.privileges import Privileges
@@ -65,7 +66,7 @@ async def settings_profile_post():
     new_email = form.get('email', type=str)
 
     if new_name is None or new_email is None:
-        return await flash('error', 'Invalid parameters.', 'home')
+        return await flash('error', t('settings.profile.invalid-parameters'), 'home')
 
     old_name = session['user_data']['name']
     old_email = session['user_data']['email']
diff --git a/locales/404/zh-CN.yml b/locales/404/zh-CN.yml
index aac2ca6b..4c197ec1 100644
--- a/locales/404/zh-CN.yml
+++ b/locales/404/zh-CN.yml
@@ -1,5 +1,5 @@
 '404': '404'
-page-not-found: 404 查无此页
+page-not-found: 找不到页面
 where-am-i: 我是谁 我在哪 我在干什么?
 check-url: 请检查下你输入的链接是否正确。
 make-sure-visit: 或者确保你想访问的地方没有在维护中!
diff --git a/locales/global/zh-CN.yml b/locales/global/zh-CN.yml
index 40f1eab6..da3b0543 100644
--- a/locales/global/zh-CN.yml
+++ b/locales/global/zh-CN.yml
@@ -2,7 +2,7 @@ sign-up: 注册
 log-in: 登录
 offline: 离线
 online: 在线
-leaderboard: 排行榜2
+leaderboard: 排行榜
 login: Login
 profile: Profile
 register: Register
diff --git a/locales/settings/profile/en_GB.yml b/locales/settings/profile/en_GB.yml
new file mode 100644
index 00000000..18d6dc79
--- /dev/null
+++ b/locales/settings/profile/en_GB.yml
@@ -0,0 +1 @@
+invalid-parameters: Invalid parameters.
\ No newline at end of file
diff --git a/templates/settings/profile.html b/templates/settings/profile.html
index 59bda026..08ef461d 100644
--- a/templates/settings/profile.html
+++ b/templates/settings/profile.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} {{ t('settings.profile') }} {% endblock %}
+{% block title %} {{ t('global.profile') }} {% endblock %}
 
 {% block content %}
 <link rel="stylesheet" href="/static/css/pages/settings/style.css">
diff --git a/templates/settings/sidebar.html b/templates/settings/sidebar.html
index 9b258d87..c26fe51e 100644
--- a/templates/settings/sidebar.html
+++ b/templates/settings/sidebar.html
@@ -9,7 +9,7 @@
     </div>
     <div class="left-selector">
         <a class="single-menu single-menu--active router-link" href="/settings/profile">
-            <i class="fas fa-user"></i><span class="single-menu--text"> {{ t('settings.profile') }} </span>
+            <i class="fas fa-user"></i><span class="single-menu--text"> {{ t('global.profile') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/avatar">
             <i class="fas fa-brush"></i><span class="single-menu--text"> {{ t('settings.avatar') }} </span>

From ea11278cadcc6ceb458bf5a3cc878c50a02fda3f Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 13 Jun 2022 14:36:45 +0900
Subject: [PATCH 093/278] remove upper case PP

---
 templates/admin/home.html  | 2 +-
 templates/leaderboard.html | 2 +-
 templates/profile.html     | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/templates/admin/home.html b/templates/admin/home.html
index a188afbf..203f6f69 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -119,7 +119,7 @@ <h2 class="section-title">{{ t('admin.home.recent-score') }}</h2>
                             <div class="score-details_right-block">
                                 <div class="score-details_pp-block">
                                     <div class="map-pp">
-                                        {{ maps.pp }}<span class="map-pp-unit">{{ t('global.pp') }}</span></div>
+                                        {{ maps.pp }}<span class="map-pp-unit">{{ t('global.pp').upper() }}</span></div>
                                     <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
                                         {{ maps.acc }}%
                                         </b></div>
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index fa20a849..3cf306a1 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -40,7 +40,7 @@
         <div class="selector">
             <div class="left">
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'pp' }"
-                @click="LoadLeaderboard('pp', mode, mods, '')">{{ t('global.PP') }}</a>
+                @click="LoadLeaderboard('pp', mode, mods, '')">{{ t('global.pp').upper() }}</a>
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'rscore' }"
                 @click="LoadLeaderboard('rscore', mode, mods, '')">{{ t('global.score') }}</a>
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'acc' }"
diff --git a/templates/profile.html b/templates/profile.html
index d43e7b9c..da14a07d 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -38,7 +38,7 @@
                         <div class="score-details_right-block">
                             <div class="score-details_pp-block">
                                 <div class="map-pp">
-                                    <% map.pp.toFixed() %><span class="map-pp-unit">{{ t('global.pp') }}</span>
+                                    <% map.pp.toFixed() %><span class="map-pp-unit">{{ t('global.pp').upper() }}</span>
                                 </div>
                                 <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
                                         <% map.acc.toFixed(2) %>%
@@ -241,7 +241,7 @@ <h1 class="title">
                     <table class="is-striped">
                         <tbody>
                             <tr>
-                                <td><b>{{ t('global.PP') }}</b></td>
+                                <td><b>{{ t('global.pp').upper() }}</b></td>
                                 <td class="right-aligned">
                                     <% addCommas(data.stats.out[modegulag].pp) %>
                                 </td>

From de468f9857c83c8b954d5c4d0b7cb0437a1ebd9a Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 13 Jun 2022 14:38:32 +0900
Subject: [PATCH 094/278] python translation

---
 blueprints/admin.py    |  5 +++--
 blueprints/frontend.py | 32 ++++++++++++++++----------------
 2 files changed, 19 insertions(+), 18 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index a7585450..89508659 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -8,6 +8,7 @@
 from quart import Blueprint
 from quart import render_template
 from quart import session
+from main import t
 
 from objects import glob
 from objects.utils import flash
@@ -20,10 +21,10 @@
 async def home():
     """Render the homepage of guweb's admin panel."""
     if not 'authenticated' in session:
-        return await flash('error', 'Please login first.', 'login')
+        return await flash('error', t('admin.please-login-in-first'), 'login')
 
     if not session['user_data']['is_staff']:
-        return await flash('error', f'You have insufficient privileges.', 'home')
+        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
 
     # fetch data from database
     dash_data = await glob.db.fetch(
diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index f15e1d97..d8f50250 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -38,7 +38,7 @@ def login_required(func):
     @wraps(func)
     async def wrapper(*args, **kwargs):
         if not session:
-            return await flash('error', 'You must be logged in to access that page.', 'login')
+            return await flash('error', t('global.you-must-be-logged-in-to-access-this-page'), 'login')
         return await func(*args, **kwargs)
     return wrapper
 
@@ -76,11 +76,11 @@ async def settings_profile_post():
         new_name == old_name and
         new_email == old_email
     ):
-        return await flash('error', 'No changes have been made.', 'settings/profile')
+        return await flash('error', t('settings.profile.no-changes-have-been-made'), 'settings/profile')
 
     if new_name != old_name:
         if not session['user_data']['is_donator']:
-            return await flash('error', 'Username changes are currently a supporter perk.', 'settings/profile')
+            return await flash('error', t('settings.profile.username-changes-supporter-only'), 'settings/profile')
 
         # Usernames must:
         # - be within 2-15 characters in length
@@ -88,16 +88,16 @@ async def settings_profile_post():
         # - not be in the config's `disallowed_names` list
         # - not already be taken by another player
         if not regexes.username.match(new_name):
-            return await flash('error', 'Your new username syntax is invalid.', 'settings/profile')
+            return await flash('error', t('settings.profile.new-username-is-invalid'), 'settings/profile')
 
         if '_' in new_name and ' ' in new_name:
-            return await flash('error', 'Your new username may contain "_" or " ", but not both.', 'settings/profile')
+            return await flash('error', t('settings.profile.username-cannot-contains-both-dash-and-space'), 'settings/profile')
 
         if new_name in glob.config.disallowed_names:
-            return await flash('error', "Your new username isn't allowed; pick another.", 'settings/profile')
+            return await flash('error', t("settings.profile.username-disallowed"), 'settings/profile')
 
         if await glob.db.fetch('SELECT 1 FROM users WHERE name = %s', [new_name]):
-            return await flash('error', 'Your new username already taken by another user.', 'settings/profile')
+            return await flash('error', t('settings.profile.username-already-taken-by-others'), 'settings/profile')
 
         safe_name = utils.get_safe_name(new_name)
 
@@ -114,10 +114,10 @@ async def settings_profile_post():
         # - match the regex `^[^@\s]{1,200}@[^@\s\.]{1,30}\.[^@\.\s]{1,24}$`
         # - not already be taken by another player
         if not regexes.email.match(new_email):
-            return await flash('error', 'Your new email syntax is invalid.', 'settings/profile')
+            return await flash('error', t('settings.profile.email-is-invalid'), 'settings/profile')
 
         if await glob.db.fetch('SELECT 1 FROM users WHERE email = %s', [new_email]):
-            return await flash('error', 'Your new email already taken by another user.', 'settings/profile')
+            return await flash('error', '', 'settings/profile')
 
         # email change successful
         await glob.db.execute(
@@ -130,7 +130,7 @@ async def settings_profile_post():
     # logout
     session.pop('authenticated', None)
     session.pop('user_data', None)
-    return await flash('success', 'Your username/email have been changed! Please login again.', 'login')
+    return await flash('success', t('settings.profile.succeed-please-login-again'), 'login')
 
 @frontend.route('/settings/avatar')
 @login_required
@@ -148,13 +148,13 @@ async def settings_avatar_post():
 
     # no file uploaded; deny post
     if avatar is None or not avatar.filename:
-        return await flash('error', 'No image was selected!', 'settings/avatar')
+        return await flash('error', t('settings.no-image-was-selected'), 'settings/avatar')
 
     filename, file_extension = os.path.splitext(avatar.filename.lower())
 
     # bad file extension; deny post
     if not file_extension in ALLOWED_EXTENSIONS:
-        return await flash('error', 'The image you select must be either a .JPG, .JPEG, or .PNG file!', 'settings/avatar')
+        return await flash('error', t('settings.bad-image-extension', imageFor = t('settings.avatar').lower()), 'settings/avatar')
 
     # remove old avatars
     for fx in ALLOWED_EXTENSIONS:
@@ -167,7 +167,7 @@ async def settings_avatar_post():
     # avatar change success
     pilavatar = utils.crop_image(pilavatar)
     pilavatar.save(os.path.join(AVATARS_PATH, f'{session["user_data"]["id"]}{file_extension.lower()}'))
-    return await flash('success', 'Your avatar has been successfully changed!', 'settings/avatar')
+    return await flash('success', t('settings.image-change-succeed', imageFor = t('settings.avatar').lower()), 'settings/avatar')
 
 @frontend.route('/settings/custom')
 @login_required
@@ -185,12 +185,12 @@ async def settings_custom_post():
 
     # no file uploaded; deny post
     if banner is None and background is None:
-        return await flash_with_customizations('error', 'No image was selected!', 'settings/custom')
+        return await flash_with_customizations('error', t('settings.no-image-was-selected'), 'settings/custom')
 
     if banner is not None and banner.filename:
         _, file_extension = os.path.splitext(banner.filename.lower())
         if not file_extension in ALLOWED_EXTENSIONS:
-            return await flash_with_customizations('error', f'The banner you select must be either a .JPG, .JPEG, .PNG or .GIF file!', 'settings/custom')
+            return await flash_with_customizations('error', t('settings.bad-image-extension', imageFor = t('settings.banner').lower()), 'settings/custom')
 
         banner_file_no_ext = os.path.join(f'.data/banners', f'{session["user_data"]["id"]}')
 
@@ -205,7 +205,7 @@ async def settings_custom_post():
     if background is not None and background.filename:
         _, file_extension = os.path.splitext(background.filename.lower())
         if not file_extension in ALLOWED_EXTENSIONS:
-            return await flash_with_customizations('error', f'The background you select must be either a .JPG, .JPEG, .PNG or .GIF file!', 'settings/custom')
+            return await flash_with_customizations('error', t('settings.bad-image-extension', imageFor = t('settings.background').lower()), 'settings/custom')
 
         background_file_no_ext = os.path.join(f'.data/backgrounds', f'{session["user_data"]["id"]}')
 

From 6f62db62ed4d47ae29db38db2a35f416a5610283 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 13 Jun 2022 14:42:12 +0900
Subject: [PATCH 095/278] server side literals

---
 .locales/admin.en_GB.yml    |  2 ++
 .locales/global.en_GB.yml   |  1 +
 .locales/settings.en_GB.yml | 11 +++++++++++
 locales/admin/en-GB.yml     |  2 ++
 locales/global/en-GB.yml    |  1 +
 locales/settings/en_GB.yml  | 12 ++++++++++++
 6 files changed, 29 insertions(+)
 create mode 100644 locales/admin/en-GB.yml

diff --git a/.locales/admin.en_GB.yml b/.locales/admin.en_GB.yml
index 146aca29..1ae6520e 100644
--- a/.locales/admin.en_GB.yml
+++ b/.locales/admin.en_GB.yml
@@ -9,6 +9,8 @@ en_GB:
     youtube: YouTube
     twitter: Twitter
     instagram: Instagram
+  please-login-in-first: Please login first.
+  you-have-sufficient-privileges: You have insufficient privileges
   home:
     total-users: total users
     that-s-a-lot-of-people: that's a lot of people!
diff --git a/.locales/global.en_GB.yml b/.locales/global.en_GB.yml
index 127b9155..83a24400 100644
--- a/.locales/global.en_GB.yml
+++ b/.locales/global.en_GB.yml
@@ -39,3 +39,4 @@ en_GB:
     s: S
     sh: S
     a: A
+  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
index 78a20873..717bda86 100644
--- a/.locales/settings.en_GB.yml
+++ b/.locales/settings.en_GB.yml
@@ -21,3 +21,14 @@ en_GB:
   user-information: User Infomation
   username: Username
   settings: Settings
+  no-changes-have-been-made: No changes have been made.
+  username-changes-supporter-only: Username changes are currently a supporter perk.
+  new-username-is-invalid: Your new username syntax is invalid.
+  username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
+  username-disallowed: Your new username isn't allowed; pick another.
+  username-already-taken-by-others: Your new username already taken by another user.
+  email-is-invalid: Your new email syntax is invalid.
+  succeed-please-login-again: Your username/email have been changed! Please login again.
+  bad-image-extension: The %{imageFor} you select must be either a .JPG, .JPEG, or .PNG file!
+  image-change-succeed: Your %{imageFor} has been successfully changed!
+  no-image-was-selected: No image was selected!
diff --git a/locales/admin/en-GB.yml b/locales/admin/en-GB.yml
new file mode 100644
index 00000000..865fac79
--- /dev/null
+++ b/locales/admin/en-GB.yml
@@ -0,0 +1,2 @@
+please-login-in-first: Please login first.
+you-have-sufficient-privileges: You have insufficient privileges
diff --git a/locales/global/en-GB.yml b/locales/global/en-GB.yml
index e43ff408..8ed54650 100644
--- a/locales/global/en-GB.yml
+++ b/locales/global/en-GB.yml
@@ -38,3 +38,4 @@ rank:
   s: S
   sh: S
   a: A
+you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
\ No newline at end of file
diff --git a/locales/settings/en_GB.yml b/locales/settings/en_GB.yml
index 0efdd461..c9136163 100644
--- a/locales/settings/en_GB.yml
+++ b/locales/settings/en_GB.yml
@@ -19,3 +19,15 @@ profile: Profile
 user-information: User Infomation
 username: Username
 settings: Settings
+# server literals
+no-changes-have-been-made: No changes have been made.
+username-changes-supporter-only: Username changes are currently a supporter perk.
+new-username-is-invalid: Your new username syntax is invalid.
+username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
+username-disallowed: Your new username isn't allowed; pick another.
+username-already-taken-by-others: Your new username already taken by another user.
+email-is-invalid: Your new email syntax is invalid.
+succeed-please-login-again: Your username/email have been changed! Please login again.
+bad-image-extension: The %{imageFor} you select must be either a .JPG, .JPEG, or .PNG file!
+image-change-succeed: Your %{imageFor} has been successfully changed!
+no-image-was-selected: No image was selected!
\ No newline at end of file

From 3fae2ebb5de1570f8c64f41b1ea922818928857c Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 13 Jun 2022 14:43:19 +0900
Subject: [PATCH 096/278] format file name

---
 locales/settings/{en_GB.yml => en-GB.yml}         | 0
 locales/settings/{en_US.yml => en-US.yml}         | 0
 locales/settings/profile/{en_GB.yml => en-GB.yml} | 0
 locales/settings/{zh_CN.yml => zh-CN.yml}         | 0
 4 files changed, 0 insertions(+), 0 deletions(-)
 rename locales/settings/{en_GB.yml => en-GB.yml} (100%)
 rename locales/settings/{en_US.yml => en-US.yml} (100%)
 rename locales/settings/profile/{en_GB.yml => en-GB.yml} (100%)
 rename locales/settings/{zh_CN.yml => zh-CN.yml} (100%)

diff --git a/locales/settings/en_GB.yml b/locales/settings/en-GB.yml
similarity index 100%
rename from locales/settings/en_GB.yml
rename to locales/settings/en-GB.yml
diff --git a/locales/settings/en_US.yml b/locales/settings/en-US.yml
similarity index 100%
rename from locales/settings/en_US.yml
rename to locales/settings/en-US.yml
diff --git a/locales/settings/profile/en_GB.yml b/locales/settings/profile/en-GB.yml
similarity index 100%
rename from locales/settings/profile/en_GB.yml
rename to locales/settings/profile/en-GB.yml
diff --git a/locales/settings/zh_CN.yml b/locales/settings/zh-CN.yml
similarity index 100%
rename from locales/settings/zh_CN.yml
rename to locales/settings/zh-CN.yml

From e424bf1daf0572515c04d41bd7593794144e72df Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 13 Jun 2022 15:43:21 +0900
Subject: [PATCH 097/278] complete capture

---
 .locales/settings.en_GB.yml                   | 20 ++---
 .vscode/settings.json                         |  8 +-
 blueprints/frontend.py                        | 86 +++++++++----------
 locales/admin/en-US.yml                       |  1 +
 locales/admin/zh-CN.yml                       |  1 +
 locales/global/en-GB.yml                      |  7 +-
 locales/global/en-US.yml                      |  2 +-
 locales/global/zh-CN.yml                      |  2 +-
 locales/login/en-GB.yml                       |  5 +-
 locales/login/en-US.yml                       |  1 -
 locales/login/zh-CN.yml                       |  1 -
 locales/logout/en-GB.yml                      |  2 +
 locales/register/en-GB.yml                    | 14 ++-
 locales/register/en-US.yml                    |  1 -
 locales/register/zh-CN.yml                    |  1 -
 locales/settings/en-GB.yml                    | 18 ++--
 locales/settings/password/en-GB.yml           |  6 ++
 locales/settings/password/en-US.yml           |  0
 locales/settings/password/zh-CN.yml           |  0
 locales/settings/profile/en-GB.yml            |  9 +-
 locales/settings/profile/en-US.yml            |  0
 locales/settings/profile/zn-CN.yml            |  0
 package.json                                  |  2 +-
 templates/login.html                          |  2 +-
 templates/register.html                       |  2 +-
 templates/settings/password.html              |  2 +-
 .../commands/{format.mjs => format-html.mjs}  | 22 -----
 utils/i18n/commands/format-yaml.mjs           | 31 +++++++
 28 files changed, 139 insertions(+), 107 deletions(-)
 create mode 100644 locales/admin/en-US.yml
 create mode 100644 locales/admin/zh-CN.yml
 create mode 100644 locales/logout/en-GB.yml
 create mode 100644 locales/settings/password/en-GB.yml
 create mode 100644 locales/settings/password/en-US.yml
 create mode 100644 locales/settings/password/zh-CN.yml
 create mode 100644 locales/settings/profile/en-US.yml
 create mode 100644 locales/settings/profile/zn-CN.yml
 rename utils/i18n/commands/{format.mjs => format-html.mjs} (58%)
 create mode 100644 utils/i18n/commands/format-yaml.mjs

diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
index 717bda86..02778373 100644
--- a/.locales/settings.en_GB.yml
+++ b/.locales/settings.en_GB.yml
@@ -18,17 +18,17 @@ en_GB:
   repeat-password: Repeat Password
   profile:
     invalid-parameters: Invalid parameters.
+    no-changes-have-been-made: No changes have been made.
+    username-changes-supporter-only: Username changes are currently a supporter perk.
+    new-username-is-invalid: Your new username syntax is invalid.
+    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
+    new-username-disallowed: Your new username isn't allowed; pick another.
+    new-username-already-taken-by-others: Your new username already taken by another user.
+    new-email-is-invalid: Your new email syntax is invalid.
+    succeed-please-login-again: Your username/email have been changed! Please login again.
   user-information: User Infomation
   username: Username
   settings: Settings
-  no-changes-have-been-made: No changes have been made.
-  username-changes-supporter-only: Username changes are currently a supporter perk.
-  new-username-is-invalid: Your new username syntax is invalid.
-  username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
-  username-disallowed: Your new username isn't allowed; pick another.
-  username-already-taken-by-others: Your new username already taken by another user.
-  email-is-invalid: Your new email syntax is invalid.
-  succeed-please-login-again: Your username/email have been changed! Please login again.
-  bad-image-extension: The %{imageFor} you select must be either a .JPG, .JPEG, or .PNG file!
-  image-change-succeed: Your %{imageFor} has been successfully changed!
+  bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
+  change-succeed: Your %{something} has been successfully changed!
   no-image-was-selected: No image was selected!
diff --git a/.vscode/settings.json b/.vscode/settings.json
index c7ad7637..c0f65c98 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -4,7 +4,7 @@
   "i18n-ally.pathMatcher": "{namespaces}/{locale}.{ext}",
   "i18n-ally.localesPaths": "locales",
   "i18n-ally.extract.keygenStyle": "kebab-case",
-  "i18n-ally.translate.engines": ["google-cn"],
+  "i18n-ally.translate.engines": ["google"],
   "i18n-ally.extract.keyMaxLength": 50,
   "i18n-ally.extract.parsers.html": {
     "attributes": [
@@ -33,8 +33,8 @@
     {
       // affect scope (optional)
       // see https://github.com/lokalise/i18n-ally/blob/master/src/core/types.ts#L156-L156
-      "source": "html-attribute",
-      "templates": ["i18n.t('{key}'{args})", "custom.t('{key}'{args})"],
+      "source": "html-inline",
+      "templates": ["t('{key}'{args})", "t('{key}'{args})"],
       // accept globs, resolved to project root (optional)
       "include": ["templates/**/*.html"]
     }
@@ -49,7 +49,7 @@
       },
       {
         "match": ".html",
-        "cmd": "npm run i18n:format"
+        "cmd": "npm run i18n:format:templates"
       }
     ]
   },
diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index d8f50250..459041d3 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -66,7 +66,7 @@ async def settings_profile_post():
     new_email = form.get('email', type=str)
 
     if new_name is None or new_email is None:
-        return await flash('error', t('settings.profile.invalid-parameters'), 'home')
+        return await flash('error', t('global.invalid-parameters'), 'home')
 
     old_name = session['user_data']['name']
     old_email = session['user_data']['email']
@@ -91,13 +91,13 @@ async def settings_profile_post():
             return await flash('error', t('settings.profile.new-username-is-invalid'), 'settings/profile')
 
         if '_' in new_name and ' ' in new_name:
-            return await flash('error', t('settings.profile.username-cannot-contains-both-dash-and-space'), 'settings/profile')
+            return await flash('error', t('settings.profile.new-username-cannot-contains-both-dash-and-space'), 'settings/profile')
 
         if new_name in glob.config.disallowed_names:
-            return await flash('error', t("settings.profile.username-disallowed"), 'settings/profile')
+            return await flash('error', t("settings.profile.new-username-disallowed"), 'settings/profile')
 
         if await glob.db.fetch('SELECT 1 FROM users WHERE name = %s', [new_name]):
-            return await flash('error', t('settings.profile.username-already-taken-by-others'), 'settings/profile')
+            return await flash('error', t('settings.profile.new-username-already-taken-by-others'), 'settings/profile')
 
         safe_name = utils.get_safe_name(new_name)
 
@@ -114,7 +114,7 @@ async def settings_profile_post():
         # - match the regex `^[^@\s]{1,200}@[^@\s\.]{1,30}\.[^@\.\s]{1,24}$`
         # - not already be taken by another player
         if not regexes.email.match(new_email):
-            return await flash('error', t('settings.profile.email-is-invalid'), 'settings/profile')
+            return await flash('error', t('settings.profile.new-email-is-invalid'), 'settings/profile')
 
         if await glob.db.fetch('SELECT 1 FROM users WHERE email = %s', [new_email]):
             return await flash('error', '', 'settings/profile')
@@ -154,7 +154,7 @@ async def settings_avatar_post():
 
     # bad file extension; deny post
     if not file_extension in ALLOWED_EXTENSIONS:
-        return await flash('error', t('settings.bad-image-extension', imageFor = t('settings.avatar').lower()), 'settings/avatar')
+        return await flash('error', t('settings.bad-image-extension', something = t('settings.avatar').lower()), 'settings/avatar')
 
     # remove old avatars
     for fx in ALLOWED_EXTENSIONS:
@@ -167,7 +167,7 @@ async def settings_avatar_post():
     # avatar change success
     pilavatar = utils.crop_image(pilavatar)
     pilavatar.save(os.path.join(AVATARS_PATH, f'{session["user_data"]["id"]}{file_extension.lower()}'))
-    return await flash('success', t('settings.image-change-succeed', imageFor = t('settings.avatar').lower()), 'settings/avatar')
+    return await flash('success', t('settings.change-succeed', something = t('settings.avatar').lower()), 'settings/avatar')
 
 @frontend.route('/settings/custom')
 @login_required
@@ -190,7 +190,7 @@ async def settings_custom_post():
     if banner is not None and banner.filename:
         _, file_extension = os.path.splitext(banner.filename.lower())
         if not file_extension in ALLOWED_EXTENSIONS:
-            return await flash_with_customizations('error', t('settings.bad-image-extension', imageFor = t('settings.banner').lower()), 'settings/custom')
+            return await flash_with_customizations('error', t('settings.bad-image-extension', something = t('settings.banner').lower()), 'settings/custom')
 
         banner_file_no_ext = os.path.join(f'.data/banners', f'{session["user_data"]["id"]}')
 
@@ -205,7 +205,7 @@ async def settings_custom_post():
     if background is not None and background.filename:
         _, file_extension = os.path.splitext(background.filename.lower())
         if not file_extension in ALLOWED_EXTENSIONS:
-            return await flash_with_customizations('error', t('settings.bad-image-extension', imageFor = t('settings.background').lower()), 'settings/custom')
+            return await flash_with_customizations('error', t('settings.bad-image-extension', something = t('settings.background').lower()), 'settings/custom')
 
         background_file_no_ext = os.path.join(f'.data/backgrounds', f'{session["user_data"]["id"]}')
 
@@ -217,7 +217,7 @@ async def settings_custom_post():
 
         await background.save(f'{background_file_no_ext}{file_extension}')
 
-    return await flash_with_customizations('success', 'Your customisation has been successfully changed!', 'settings/custom')
+    return await flash_with_customizations('success', t('settings.change-succeed', something = t('settings.customization').lower()), 'settings/custom')
 
 
 @frontend.route('/settings/password')
@@ -235,24 +235,24 @@ async def settings_password_post():
 
     # new password and repeat password don't match; deny post
     if new_password != repeat_password:
-        return await flash('error', "Your new password doesn't match your repeated password!", 'settings/password')
+        return await flash('error', t("settings.password.new-passoword-mismatch-repeated-password"), 'settings/password')
 
     # new password and old password match; deny post
     if old_password == new_password:
-        return await flash('error', 'Your new password cannot be the same as your old password!', 'settings/password')
+        return await flash('error', t('settings.password.new-passoword-cannot-be-same-as-old-password'), 'settings/password')
 
     # Passwords must:
     # - be within 8-32 characters in length
     # - have more than 3 unique characters
     # - not be in the config's `disallowed_passwords` list
     if not 8 < len(new_password) <= 32:
-        return await flash('error', 'Your new password must be 8-32 characters in length.', 'settings/password')
+        return await flash('error', t('settings.password.must-between-8-32-characters-in-length'), 'settings/password')
 
     if len(set(new_password)) <= 3:
-        return await flash('error', 'Your new password must have more than 3 unique characters.', 'settings/password')
+        return await flash('error', t('settings.password.must-have-more-than-3-unique-characters'), 'settings/password')
 
     if new_password.lower() in glob.config.disallowed_passwords:
-        return await flash('error', 'Your new password was deemed too simple.', 'settings/password')
+        return await flash('error', t('settings.password.too-simple'), 'settings/password')
 
     # cache and other password related information
     bcrypt_cache = glob.cache['bcrypt']
@@ -271,12 +271,12 @@ async def settings_password_post():
         if pw_md5 != bcrypt_cache[pw_bcrypt]: # ~0.1ms
             if glob.config.debug:
                 log(f"{session['user_data']['name']}'s change pw failed - pw incorrect.", Ansi.LYELLOW)
-            return await flash('error', 'Your old password is incorrect.', 'settings/password')
+            return await flash('error', t('settings.password.old-password-incorrect'), 'settings/password')
     else: # ~200ms
         if not bcrypt.checkpw(pw_md5, pw_bcrypt):
             if glob.config.debug:
                 log(f"{session['user_data']['name']}'s change pw failed - pw incorrect.", Ansi.LYELLOW)
-            return await flash('error', 'Your old password is incorrect.', 'settings/password')
+            return await flash('error', t('settings.password.old-password-incorrect'), 'settings/password')
 
     # remove old password from cache
     if pw_bcrypt in bcrypt_cache:
@@ -298,7 +298,7 @@ async def settings_password_post():
     # logout
     session.pop('authenticated', None)
     session.pop('user_data', None)
-    return await flash('success', 'Your password has been changed! Please log in again.', 'login')
+    return await flash('success', t('settings.change-succeed', something = t('global.password')), 'login')
 
 
 @frontend.route('/u/<id>')
@@ -342,14 +342,14 @@ async def leaderboard(mode='std', sort='pp', mods='vn'):
 @frontend.route('/login')
 async def login():
     if 'authenticated' in session:
-        return await flash('error', "You're already logged in!", 'home')
+        return await flash('error', t("global.you-are-already-logged-in"), 'home')
 
     return await render_template('login.html')
 
 @frontend.route('/login', methods=['POST'])
 async def login_post():
     if 'authenticated' in session:
-        return await flash('error', "You're already logged in!", 'home')
+        return await flash('error', t("global.you-are-already-logged-in"), 'home')
 
     if glob.config.debug:
         login_time = time.time_ns()
@@ -359,7 +359,7 @@ async def login_post():
     passwd_txt = form.get('password', type=str)
 
     if username is None or passwd_txt is None:
-        return await flash('error', 'Invalid parameters.', 'home')
+        return await flash('error', t('global.invalid-parameters'), 'home')
 
     # check if account exists
     user_info = await glob.db.fetch(
@@ -375,7 +375,7 @@ async def login_post():
     if not user_info or user_info['id'] == 1:
         if glob.config.debug:
             log(f"{username}'s login failed - account doesn't exist.", Ansi.LYELLOW)
-        return await flash('error', 'Account does not exist.', 'login')
+        return await flash('error', t('login.account-does-not-exist'), 'login')
 
     # cache and other related password information
     bcrypt_cache = glob.cache['bcrypt']
@@ -388,12 +388,12 @@ async def login_post():
         if pw_md5 != bcrypt_cache[pw_bcrypt]: # ~0.1ms
             if glob.config.debug:
                 log(f"{username}'s login failed - pw incorrect.", Ansi.LYELLOW)
-            return await flash('error', 'Password is incorrect.', 'login')
+            return await flash('error', t('login.password-incorrect'), 'login')
     else: # ~200ms
         if not bcrypt.checkpw(pw_md5, pw_bcrypt):
             if glob.config.debug:
                 log(f"{username}'s login failed - pw incorrect.", Ansi.LYELLOW)
-            return await flash('error', 'Password is incorrect.', 'login')
+            return await flash('error', t('login.password-incorrect'), 'login')
 
         # login successful; cache password for next login
         bcrypt_cache[pw_bcrypt] = pw_md5
@@ -408,7 +408,7 @@ async def login_post():
     if not user_info['priv'] & Privileges.Normal:
         if glob.config.debug:
             log(f"{username}'s login failed - banned.", Ansi.RED)
-        return await flash('error', 'Your account is restricted. You are not allowed to log in.', 'login')
+        return await flash('error', t('login.restricted-not-allowed-to-login'), 'login')
 
     # login successful; store session data
     if glob.config.debug:
@@ -429,25 +429,25 @@ async def login_post():
         login_time = (time.time_ns() - login_time) / 1e6
         log(f'Login took {login_time:.2f}ms!', Ansi.LYELLOW)
 
-    return await flash('success', f'Hey, welcome back {username}!', 'home')
+    return await flash('success', t('login.welcome-back', username = username), 'home')
 
 @frontend.route('/register')
 async def register():
     if 'authenticated' in session:
-        return await flash('error', "You're already logged in.", 'home')
+        return await flash('error', t("global.you-are-already-logged-in"), 'home')
 
     if not glob.config.registration:
-        return await flash('error', 'Registrations are currently disabled.', 'home')
+        return await flash('error', t('register.currently-disabled'), 'home')
 
     return await render_template('register.html')
 
 @frontend.route('/register', methods=['POST'])
 async def register_post():
     if 'authenticated' in session:
-        return await flash('error', "You're already logged in.", 'home')
+        return await flash('error', t("global.you-are-already-logged-in"), 'home')
 
     if not glob.config.registration:
-        return await flash('error', 'Registrations are currently disabled.', 'home')
+        return await flash('error', t('register.currently-disabled'), 'home')
 
     form = await request.form
     username = form.get('username', type=str)
@@ -455,7 +455,7 @@ async def register_post():
     passwd_txt = form.get('password', type=str)
 
     if username is None or email is None or passwd_txt is None:
-        return await flash('error', 'Invalid parameters.', 'home')
+        return await flash('error', t('global.invalid-parameters'), 'home')
 
     if glob.config.hCaptcha_sitekey != 'changeme':
         captcha_data = form.get('h-captcha-response', type=str)
@@ -463,7 +463,7 @@ async def register_post():
             captcha_data is None or
             not await utils.validate_captcha(captcha_data)
         ):
-            return await flash('error', 'Captcha failed.', 'register')
+            return await flash('error', t('register.captcha-failed'), 'register')
 
     # Usernames must:
     # - be within 2-15 characters in length
@@ -472,38 +472,38 @@ async def register_post():
     # - not already be taken by another player
     # check if username exists
     if not regexes.username.match(username):
-        return await flash('error', 'Invalid username syntax.', 'register')
+        return await flash('error', t('register.username-syntax-is-invalid'), 'register')
 
     if '_' in username and ' ' in username:
-        return await flash('error', 'Username may contain "_" or " ", but not both.', 'register')
+        return await flash('error', t('register.username-cannot-contains-both-dash-and-space'), 'register')
 
     if username in glob.config.disallowed_names:
-        return await flash('error', 'Disallowed username; pick another.', 'register')
+        return await flash('error', t("register.username-disallowed"), 'register')
 
     if await glob.db.fetch('SELECT 1 FROM users WHERE name = %s', username):
-        return await flash('error', 'Username already taken by another user.', 'register')
+        return await flash('error', t('register.username-already-taken-by-others'), 'register')
 
     # Emails must:
     # - match the regex `^[^@\s]{1,200}@[^@\s\.]{1,30}\.[^@\.\s]{1,24}$`
     # - not already be taken by another player
     if not regexes.email.match(email):
-        return await flash('error', 'Invalid email syntax.', 'register')
+        return await flash('error', t('register.email-is-invalid'), 'register')
 
     if await glob.db.fetch('SELECT 1 FROM users WHERE email = %s', email):
-        return await flash('error', 'Email already taken by another user.', 'register')
+        return await flash('error', t('register.email-already-taken'), 'register')
 
     # Passwords must:
     # - be within 8-32 characters in length
     # - have more than 3 unique characters
     # - not be in the config's `disallowed_passwords` list
     if not 8 <= len(passwd_txt) <= 32:
-        return await flash('error', 'Password must be 8-32 characters in length.', 'register')
+        return await flash('error', t('register.password.must-between-8-32-characters-in-length'), 'register')
 
     if len(set(passwd_txt)) <= 3:
-        return await flash('error', 'Password must have more than 3 unique characters.', 'register')
+        return await flash('error', t('register.password.must-have-more-than-3-unique-characters'), 'register')
 
     if passwd_txt.lower() in glob.config.disallowed_passwords:
-        return await flash('error', 'That password was deemed too simple.', 'register')
+        return await flash('error', t('register.password.too-simple'), 'register')
 
     # TODO: add correct locking
     # (start of lock)
@@ -560,7 +560,7 @@ async def register_post():
 @frontend.route('/logout')
 async def logout():
     if 'authenticated' not in session:
-        return await flash('error', "You can't logout if you aren't logged in!", 'login')
+        return await flash('error', t("logout.cannot-logout-if-not-logged-in"), 'login')
 
     if glob.config.debug:
         log(f'{session["user_data"]["name"]} logged out.', Ansi.LGREEN)
@@ -570,7 +570,7 @@ async def logout():
     session.pop('user_data', None)
 
     # render login
-    return await flash('success', 'Successfully logged out!', 'login')
+    return await flash('success', t('logout.succeed'), 'login')
 
 # social media redirections
 
diff --git a/locales/admin/en-US.yml b/locales/admin/en-US.yml
new file mode 100644
index 00000000..9c81aaf2
--- /dev/null
+++ b/locales/admin/en-US.yml
@@ -0,0 +1 @@
+please-login-in-first: Please login first.
diff --git a/locales/admin/zh-CN.yml b/locales/admin/zh-CN.yml
new file mode 100644
index 00000000..940bbd45
--- /dev/null
+++ b/locales/admin/zh-CN.yml
@@ -0,0 +1 @@
+please-login-in-first: 请先登录。
diff --git a/locales/global/en-GB.yml b/locales/global/en-GB.yml
index 8ed54650..e29a069a 100644
--- a/locales/global/en-GB.yml
+++ b/locales/global/en-GB.yml
@@ -6,13 +6,13 @@ leaderboard: Leaderboard
 login: Login
 profile: Profile
 register: Register
+password: Password
 warning: Warning
 notice: Notice
 error: uh oh! Be careful!
 success: Hey! Listen!
 verify: Verify
 pp: pp
-PP: PP
 accuracy: Accuracy
 score: Score
 acc: Acc
@@ -38,4 +38,7 @@ rank:
   s: S
   sh: S
   a: A
-you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
\ No newline at end of file
+# server literals
+you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
+invalid-parameters: Invalid parameters.
+you-are-already-logged-in: You're already logged in!
\ No newline at end of file
diff --git a/locales/global/en-US.yml b/locales/global/en-US.yml
index ed7634b6..cbd00440 100644
--- a/locales/global/en-US.yml
+++ b/locales/global/en-US.yml
@@ -11,7 +11,6 @@ warning: Warning
 error: uh oh! Be careful!
 success: Hey! Listen!
 verify: Verify
-PP: PP
 acc: Acc
 accuracy: Accuracy
 max-combo: Max Combo
@@ -38,3 +37,4 @@ rank:
 ranked-score: Ranked score
 score: Score
 total-score: Total Score
+password: Password
diff --git a/locales/global/zh-CN.yml b/locales/global/zh-CN.yml
index da3b0543..0c04448a 100644
--- a/locales/global/zh-CN.yml
+++ b/locales/global/zh-CN.yml
@@ -11,7 +11,6 @@ warning: 注意
 error: uh oh! Be careful!
 success: Hey! Listen!
 verify: Verify
-PP: PP
 acc: Acc
 accuracy: 准确度
 max-combo: 最大连击
@@ -38,3 +37,4 @@ rank:
 score: 分数
 total-score: 总分
 ranked-score: 记分总分
+password: 密码
diff --git a/locales/login/en-GB.yml b/locales/login/en-GB.yml
index 7ea8f054..0643ce7c 100644
--- a/locales/login/en-GB.yml
+++ b/locales/login/en-GB.yml
@@ -2,5 +2,8 @@ dont-have-an-account: Don't have an account?
 register: Register
 forgot-login: Forgot login?
 username: Username
-password: Password
 email: Email
+password-incorrect: Password is incorrect.
+restricted-not-allowed-to-login: Your account is restricted. You are not allowed to log in.
+welcome-back: Hey, welcome back %{username}!
+account-does-not-exist: Account does not exist.
diff --git a/locales/login/en-US.yml b/locales/login/en-US.yml
index 7ea8f054..6f86bd8a 100644
--- a/locales/login/en-US.yml
+++ b/locales/login/en-US.yml
@@ -2,5 +2,4 @@ dont-have-an-account: Don't have an account?
 register: Register
 forgot-login: Forgot login?
 username: Username
-password: Password
 email: Email
diff --git a/locales/login/zh-CN.yml b/locales/login/zh-CN.yml
index ef59445c..b528ab03 100644
--- a/locales/login/zh-CN.yml
+++ b/locales/login/zh-CN.yml
@@ -2,5 +2,4 @@ dont-have-an-account: 还未拥有一个账号？
 register: 注册
 forgot-login: 忘记账号?
 username: 你的用户名
-password: 你的密码
 email: 电子邮箱
diff --git a/locales/logout/en-GB.yml b/locales/logout/en-GB.yml
new file mode 100644
index 00000000..af3ce378
--- /dev/null
+++ b/locales/logout/en-GB.yml
@@ -0,0 +1,2 @@
+cannot-logout-if-not-logged-in: You can't logout if you aren't logged in!
+succeed: Successfully logged out!
diff --git a/locales/register/en-GB.yml b/locales/register/en-GB.yml
index 3aa8a758..88aa703a 100644
--- a/locales/register/en-GB.yml
+++ b/locales/register/en-GB.yml
@@ -1,6 +1,18 @@
 registration: Registration
 register: register
 email: Email
-password: Password
 already-have-an-account: Already have an account?
 username: Username
+# server literals
+currently-disabled: Registrations are currently disabled.
+captcha-failed: Captcha failed.
+username-syntax-is-invalid: Invalid username syntax.
+username-cannot-contains-both-dash-and-space: Username may contain "_" or " ", but not both.
+username-disallowed: Disallowed username; pick another.
+username-already-taken-by-others: Username already taken by another user.
+email-is-invalid: Invalid email syntax.
+email-already-taken: Email already taken by another user.
+password:
+  must-between-8-32-characters-in-length: Password must be 8-32 characters in length.
+  must-have-more-than-3-unique-characters: Password must have more than 3 unique characters.
+  too-simple: That password was deemed too simple.
diff --git a/locales/register/en-US.yml b/locales/register/en-US.yml
index 3aa8a758..b7346e37 100644
--- a/locales/register/en-US.yml
+++ b/locales/register/en-US.yml
@@ -1,6 +1,5 @@
 registration: Registration
 register: register
 email: Email
-password: Password
 already-have-an-account: Already have an account?
 username: Username
diff --git a/locales/register/zh-CN.yml b/locales/register/zh-CN.yml
index 724cda1b..3f67de73 100644
--- a/locales/register/zh-CN.yml
+++ b/locales/register/zh-CN.yml
@@ -1,7 +1,6 @@
 registration: 注册
 register: 注册账号
 email: 电子邮箱
-password: 密码
 already-have-an-account: 已经拥有账号了?
 username: |
   你的用户名
diff --git a/locales/settings/en-GB.yml b/locales/settings/en-GB.yml
index c9136163..391ebd4a 100644
--- a/locales/settings/en-GB.yml
+++ b/locales/settings/en-GB.yml
@@ -10,7 +10,7 @@ banner: Banner
 banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
 profile-background: Profile Background
 profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-password: Password
+# password: Password // used by password/{locale}.yml relocated to global.passowrd
 password-change: Password Change
 old-password: Old Password
 new-password: New Password
@@ -19,15 +19,7 @@ profile: Profile
 user-information: User Infomation
 username: Username
 settings: Settings
-# server literals
-no-changes-have-been-made: No changes have been made.
-username-changes-supporter-only: Username changes are currently a supporter perk.
-new-username-is-invalid: Your new username syntax is invalid.
-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
-username-disallowed: Your new username isn't allowed; pick another.
-username-already-taken-by-others: Your new username already taken by another user.
-email-is-invalid: Your new email syntax is invalid.
-succeed-please-login-again: Your username/email have been changed! Please login again.
-bad-image-extension: The %{imageFor} you select must be either a .JPG, .JPEG, or .PNG file!
-image-change-succeed: Your %{imageFor} has been successfully changed!
-no-image-was-selected: No image was selected!
\ No newline at end of file
+bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
+change-succeed: Your %{something} has been successfully changed!
+no-image-was-selected: No image was selected!
+customization: customization
diff --git a/locales/settings/password/en-GB.yml b/locales/settings/password/en-GB.yml
new file mode 100644
index 00000000..d11a8254
--- /dev/null
+++ b/locales/settings/password/en-GB.yml
@@ -0,0 +1,6 @@
+new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
+new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
+must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
+must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
+too-simple: Your new password was deemed too simple.
+old-password-incorrect: Your old password is incorrect.
diff --git a/locales/settings/password/en-US.yml b/locales/settings/password/en-US.yml
new file mode 100644
index 00000000..e69de29b
diff --git a/locales/settings/password/zh-CN.yml b/locales/settings/password/zh-CN.yml
new file mode 100644
index 00000000..e69de29b
diff --git a/locales/settings/profile/en-GB.yml b/locales/settings/profile/en-GB.yml
index 18d6dc79..c8fc0d11 100644
--- a/locales/settings/profile/en-GB.yml
+++ b/locales/settings/profile/en-GB.yml
@@ -1 +1,8 @@
-invalid-parameters: Invalid parameters.
\ No newline at end of file
+no-changes-have-been-made: No changes have been made.
+username-changes-supporter-only: Username changes are currently a supporter perk.
+new-username-is-invalid: Your new username syntax is invalid.
+new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
+new-username-disallowed: Your new username isn't allowed; pick another.
+new-username-already-taken-by-others: Your new username already taken by another user.
+new-email-is-invalid: Your new email syntax is invalid.
+succeed-please-login-again: Your username/email have been changed! Please login again.
\ No newline at end of file
diff --git a/locales/settings/profile/en-US.yml b/locales/settings/profile/en-US.yml
new file mode 100644
index 00000000..e69de29b
diff --git a/locales/settings/profile/zn-CN.yml b/locales/settings/profile/zn-CN.yml
new file mode 100644
index 00000000..e69de29b
diff --git a/package.json b/package.json
index 4d3e84ec..f7b469a4 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "i18n:compile": "node utils/i18n/commands/compile.mjs",
-    "i18n:format": "node utils/i18n/commands/format.mjs",
+    "i18n:format:templates": "node utils/i18n/commands/format-html.mjs",
     "i18n:dev": "nodemon --watch ./locales -e yml, yaml utils/i18n/commands/compile.mjs",
     "i18n:make-sure-you-understand-what-you-are-doing:migrate": "node utils/i18n/commands/migrate.mjs"
   },
diff --git a/templates/login.html b/templates/login.html
index 5fccf233..2ad02533 100644
--- a/templates/login.html
+++ b/templates/login.html
@@ -27,7 +27,7 @@ <h1 class="title" id="regtitle">{{ t('global.log-in') }}</h1>
         </div>
       </div>
       <div class="field">
-        <label for="pass" class="label">{{ t('login.password') }}</label>
+        <label for="pass" class="label">{{ t('global.password') }}</label>
         <div class="control has-icons-left">
           <input id="pass" type="password" name="password" placeholder="Password" class="input" autocomplete="current-password" required>
           <span class="icon is-small is-left">
diff --git a/templates/register.html b/templates/register.html
index e97becc9..9a49eefe 100644
--- a/templates/register.html
+++ b/templates/register.html
@@ -35,7 +35,7 @@ <h1 class="title" id="regtitle">{{ t('register.registration') }}</h1>
           </div>
         </div>
         <div class="field">
-          <label for="pass" class="label">{{ t('register.password') }}</label>
+          <label for="pass" class="label">{{ t('global.password') }}</label>
           <div class="control has-icons-left">
             <input id="pass" type="password" name="password" placeholder="*************" class="input" autocomplete="new-password" required>
             <span class="icon is-small is-left">
diff --git a/templates/settings/password.html b/templates/settings/password.html
index f0a1268e..6188bb4c 100644
--- a/templates/settings/password.html
+++ b/templates/settings/password.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} {{ t('settings.password') }} {% endblock %}
+{% block title %} {{ t('global.password') }} {% endblock %}
 
 {% block content %}
 <link rel="stylesheet" href="/static/css/pages/settings/style.css">
diff --git a/utils/i18n/commands/format.mjs b/utils/i18n/commands/format-html.mjs
similarity index 58%
rename from utils/i18n/commands/format.mjs
rename to utils/i18n/commands/format-html.mjs
index f179e44f..104aa3e1 100644
--- a/utils/i18n/commands/format.mjs
+++ b/utils/i18n/commands/format-html.mjs
@@ -8,28 +8,6 @@ const { Spinner } = clui
 
 import { path as translationPath } from '../config.mjs'
 
-
-glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
-    if (err) throw err
-    const work = new Spinner(`formatting locales...`)
-    work.start()
-    await Promise.all(matches.map(async (match) => {
-        const work = new Spinner(`formatting locale: ${match}`)
-        work.start()
-        try {
-            const data = yaml.load(await fs.readFile(match, { encoding: 'utf8' }))
-            const formatted = yaml.dump(data)
-            await fs.writeFile(match, formatted, 'utf8')
-        } catch (error) {
-            console.error(error)
-        } finally {
-            work.stop()
-        }
-    }))
-    work.stop()
-    console.log(`formatting locales...  done`)
-})
-
 glob(path.join(translationPath, '../templates/**/*.html'), async (err, matches) => {
     if (err) throw err
     const work = new Spinner(`formatting templates...`)
diff --git a/utils/i18n/commands/format-yaml.mjs b/utils/i18n/commands/format-yaml.mjs
new file mode 100644
index 00000000..bd891c5c
--- /dev/null
+++ b/utils/i18n/commands/format-yaml.mjs
@@ -0,0 +1,31 @@
+import yaml from 'js-yaml'
+
+import glob from 'glob'
+import path from 'path'
+import fs from 'fs/promises'
+import clui from 'clui'
+const { Spinner } = clui
+
+import { path as translationPath } from '../config.mjs'
+
+
+glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
+    if (err) throw err
+    const work = new Spinner(`formatting locales...`)
+    work.start()
+    await Promise.all(matches.map(async (match) => {
+        const work = new Spinner(`formatting locale: ${match}`)
+        work.start()
+        try {
+            const data = yaml.load(await fs.readFile(match, { encoding: 'utf8' }))
+            const formatted = yaml.dump(data)
+            await fs.writeFile(match, formatted, 'utf8')
+        } catch (error) {
+            console.error(error)
+        } finally {
+            work.stop()
+        }
+    }))
+    work.stop()
+    console.log(`formatting locales...  done`)
+})
\ No newline at end of file

From 635c20bb637523aae8f0a6c64525ac0c86dcd199 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 13 Jun 2022 15:50:44 +0900
Subject: [PATCH 098/278] defaults to non-parallel i18n utils

---
 utils/i18n/commands/format-html.mjs | 34 +++++++++++++++++++----------
 utils/i18n/commands/format-yaml.mjs | 33 ++++++++++++++++++----------
 2 files changed, 44 insertions(+), 23 deletions(-)

diff --git a/utils/i18n/commands/format-html.mjs b/utils/i18n/commands/format-html.mjs
index 104aa3e1..4cbd30d1 100644
--- a/utils/i18n/commands/format-html.mjs
+++ b/utils/i18n/commands/format-html.mjs
@@ -1,4 +1,4 @@
-import yaml from 'js-yaml'
+const parallel = process.env.PARALLEL || false
 
 import glob from 'glob'
 import path from 'path'
@@ -8,23 +8,33 @@ const { Spinner } = clui
 
 import { path as translationPath } from '../config.mjs'
 
+const doWork = async (match) => {
+    try {
+        const template = await fs.readFile(match, { encoding: 'utf8' })
+        const wb = template.replace(/\{\{\s?t\('(.*)'\s?(,\s?(.+)\s?)?\)\s?\}\}/gmu, '{{ t(\'$1\'$2) }}')
+        await fs.writeFile(match, wb, 'utf8')
+    } catch (error) {
+        console.error(error)
+    }
+}
+
 glob(path.join(translationPath, '../templates/**/*.html'), async (err, matches) => {
     if (err) throw err
     const work = new Spinner(`formatting templates...`)
     work.start()
-    await Promise.all(matches.map(async match => {
-        const work = new Spinner(`formatting locale: ${match}`)
-        work.start()
-        try {
-            const template = await fs.readFile(match, { encoding: 'utf8' })
-            const wb = template.replace(/\{\{\s?t\('(.*)'\s?(,\s?(.+)\s?)?\)\s?\}\}/gmu, '{{ t(\'$1\'$2) }}')
-            await fs.writeFile(match, wb, 'utf8')
-        } catch (error) {
-            console.error(error)
-        } finally {
+    if (parallel) {
+        await Promise.all(matches.map(async match => {
+            const work = new Spinner(`formatting template: ${match}`)
+            work.start()
+            await doWork(match)
             work.stop()
+        }))
+    } else {
+        for (const match of matches) {
+            work.message(`formatting template: ${match}`)
+            await doWork(match)
         }
-    }))
+    }
     work.stop()
     console.log(`formatting templates...  done`)
 })
\ No newline at end of file
diff --git a/utils/i18n/commands/format-yaml.mjs b/utils/i18n/commands/format-yaml.mjs
index bd891c5c..972b71b6 100644
--- a/utils/i18n/commands/format-yaml.mjs
+++ b/utils/i18n/commands/format-yaml.mjs
@@ -1,3 +1,5 @@
+const parallel = process.env.PARALLEL || false
+
 import yaml from 'js-yaml'
 
 import glob from 'glob'
@@ -8,24 +10,33 @@ const { Spinner } = clui
 
 import { path as translationPath } from '../config.mjs'
 
+const doWork = async (match) => {
+    try {
+        const data = yaml.load(await fs.readFile(match, { encoding: 'utf8' }))
+        const formatted = yaml.dump(data)
+        await fs.writeFile(match, formatted, 'utf8')
+    } catch (error) {
+        console.error(error)
+    }
+}
 
 glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
     if (err) throw err
     const work = new Spinner(`formatting locales...`)
     work.start()
-    await Promise.all(matches.map(async (match) => {
-        const work = new Spinner(`formatting locale: ${match}`)
-        work.start()
-        try {
-            const data = yaml.load(await fs.readFile(match, { encoding: 'utf8' }))
-            const formatted = yaml.dump(data)
-            await fs.writeFile(match, formatted, 'utf8')
-        } catch (error) {
-            console.error(error)
-        } finally {
+    if (parallel) {
+        await Promise.all(matches.map(async (match) => {
+            const work = new Spinner(`formatting locale: ${match}`)
+            work.start()
+            await doWork(match)
             work.stop()
+        }))
+    } else {
+        for (const match of matches) {
+            work.message(`formatting locale: ${match}`)
+            await doWork(match)
         }
-    }))
+    }
     work.stop()
     console.log(`formatting locales...  done`)
 })
\ No newline at end of file

From 36c032c50fa0f7eb5c280c337dcd5bbcd167ea1c Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 13 Jun 2022 15:53:16 +0900
Subject: [PATCH 099/278] lint

---
 locales/settings/profile/en-GB.yml | 2 +-
 package.json                       | 3 +++
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/locales/settings/profile/en-GB.yml b/locales/settings/profile/en-GB.yml
index c8fc0d11..111f48b6 100644
--- a/locales/settings/profile/en-GB.yml
+++ b/locales/settings/profile/en-GB.yml
@@ -5,4 +5,4 @@ new-username-cannot-contains-both-dash-and-space: Your new username may contain
 new-username-disallowed: Your new username isn't allowed; pick another.
 new-username-already-taken-by-others: Your new username already taken by another user.
 new-email-is-invalid: Your new email syntax is invalid.
-succeed-please-login-again: Your username/email have been changed! Please login again.
\ No newline at end of file
+succeed-please-login-again: Your username/email have been changed! Please login again.
diff --git a/package.json b/package.json
index f7b469a4..7d118e7c 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,9 @@
     "test": "echo \"Error: no test specified\" && exit 1",
     "i18n:compile": "node utils/i18n/commands/compile.mjs",
     "i18n:format:templates": "node utils/i18n/commands/format-html.mjs",
+    "i18n:format:locales": "node utils/i18n/commands/format-yaml.mjs",
+    "i18n:format": "npm run i18n:format:templates & npm run i18n:format:locales",
+    "i18n:format:parallel": "PARALLEL=TRUE npm run i18n:format",
     "i18n:dev": "nodemon --watch ./locales -e yml, yaml utils/i18n/commands/compile.mjs",
     "i18n:make-sure-you-understand-what-you-are-doing:migrate": "node utils/i18n/commands/migrate.mjs"
   },

From 68423e4f08eabbaf11bfc5807f204d9711186da3 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 13 Jun 2022 16:19:18 +0900
Subject: [PATCH 100/278] single lined formatting

---
 locales/global/en-GB.yml            |  2 +-
 locales/home/en-GB.yml              | 31 ++++++++++-------------------
 locales/home/en-US.yml              | 31 ++++++++++-------------------
 locales/home/zh-CN.yml              | 27 ++++++++++---------------
 locales/register/zh-CN.yml          |  3 +--
 locales/settings/en-GB.yml          |  5 ++---
 locales/settings/en-US.yml          |  5 ++---
 locales/settings/password/en-US.yml |  1 +
 locales/settings/password/zh-CN.yml |  1 +
 locales/settings/profile/en-US.yml  |  1 +
 locales/settings/profile/zn-CN.yml  |  1 +
 locales/verify/en-GB.yml            |  5 ++---
 locales/verify/en-US.yml            |  5 ++---
 locales/verify/zh-CN.yml            |  5 ++---
 14 files changed, 46 insertions(+), 77 deletions(-)

diff --git a/locales/global/en-GB.yml b/locales/global/en-GB.yml
index e29a069a..54243eeb 100644
--- a/locales/global/en-GB.yml
+++ b/locales/global/en-GB.yml
@@ -41,4 +41,4 @@ rank:
 # server literals
 you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
 invalid-parameters: Invalid parameters.
-you-are-already-logged-in: You're already logged in!
\ No newline at end of file
+you-are-already-logged-in: You're already logged in!
diff --git a/locales/home/en-GB.yml b/locales/home/en-GB.yml
index a1823e8c..f03cf7d6 100644
--- a/locales/home/en-GB.yml
+++ b/locales/home/en-GB.yml
@@ -2,30 +2,19 @@ warning: Warning
 notice: Notice
 error: Uh oh! Be careful!
 success: Hey! Listen!
-subtitle-big: >-
-  We are an osu! private server built from the ground up with many unique
-  features not seen elsewhere - for more information, check out gulag and guweb
-  on GitHub - we're fully open source!
+subtitle-big: |-
+  We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
 some-of-our-coolest-features: Some of our coolest features
 features-title-1: PP for Relax and Autopilot
-features-content-1: >-
-  Our server has unique pp formula for relax and autopilot.Good at waving your
-  cursor or just smashing your keyboard? Join %{appName} and get a fair reward
-  foryour skills!
+features-content-1: |-
+  Our server has unique pp formula for relax and autopilot.Good at waving your cursor or just smashing your keyboard? Join %{appName} and get a fair reward foryour skills!
 features-title-2: Free osu!direct
-features-content-2: >-
-  You won't have to pay for osu!supporter to have a convenient gameplay
-  experience in the client - osu!direct is available for everyone! Keep in mind
-  supporting us still grants a huge set of cool perks but absense of it doesn't
-  affect your game sessions!
+features-content-2: |-
+  You won't have to pay for osu!supporter to have a convenient gameplay experience in the client - osu!direct is available for everyone! Keep in mind supporting us still grants a huge set of cool perks but absense of it doesn't affect your game sessions!
 features-title-3: Flexible library
-features-content-3: >-
-  We're written on top of cmyui's multipurpose library allowing for a fully
-  asynchronous environment, both improving performance and the user's experience
-  in the long term!
+features-content-3: |-
+  We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
 what-are-you-waiting-for: What are you waiting for?
-subtitle: >-
-  Join %{appName}! It's risk-free! You won't get your account banned on official
-  servers if you play here with us! And don't worry, as you can always switch
-  between the official servers and us at any time!
+subtitle: |-
+  Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
 sign-up-for-free: Sign up for free
diff --git a/locales/home/en-US.yml b/locales/home/en-US.yml
index 94410f05..185502a8 100644
--- a/locales/home/en-US.yml
+++ b/locales/home/en-US.yml
@@ -1,29 +1,18 @@
-subtitle-big: >-
-  We are an osu! private server built from the ground up with many unique
-  features not seen elsewhere - for more information, check out gulag and guweb
-  on GitHub - we're fully open source!
+subtitle-big: |-
+  We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
 some-of-our-coolest-features: Some of our coolest features
 features-title-1: PP for Relax and Autopilot
-features-content-1: >-
-  Our server has unique pp formula for relax and autopilot.Good at waving your
-  cursor or just smashing your keyboard? Join %{appName} and get a fair reward
-  foryour skills!
+features-content-1: |-
+  Our server has unique pp formula for relax and autopilot.Good at waving your cursor or just smashing your keyboard? Join %{appName} and get a fair reward foryour skills!
 features-title-2: Free osu!direct
-features-content-2: >-
-  You won't have to pay for osu!supporter to have a convenient gameplay
-  experience in the client - osu!direct is available for everyone! Keep in mind
-  supporting us still grants a huge set of cool perks but absense of it doesn't
-  affect your game sessions!
+features-content-2: |-
+  You won't have to pay for osu!supporter to have a convenient gameplay experience in the client - osu!direct is available for everyone! Keep in mind supporting us still grants a huge set of cool perks but absense of it doesn't affect your game sessions!
 features-title-3: Flexible library
-features-content-3: >-
-  We're written on top of cmyui's multipurpose library allowing for a fully
-  asynchronous environment, both improving performance and the user's experience
-  in the long term!
+features-content-3: |-
+  We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
 what-are-you-waiting-for: What are you waiting for?
-subtitle: >-
-  Join %{appName}! It's risk-free! You won't get your account banned on official
-  servers if you play here with us! And don't worry, as you can always switch
-  between the official servers and us at any time!
+subtitle: |-
+  Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
 sign-up-for-free: Sign up for free
 error: Uh oh! Be careful!
 success: Hey! Listen!
diff --git a/locales/home/zh-CN.yml b/locales/home/zh-CN.yml
index 3d8e0ecd..2707a623 100644
--- a/locales/home/zh-CN.yml
+++ b/locales/home/zh-CN.yml
@@ -1,25 +1,18 @@
-subtitle-big: >-
-  欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜,
-  以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段,
-  如出现问题或有改进建议, 欢迎与我们联系与沟通.
+subtitle-big: |-
+  欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
 some-of-our-coolest-features: 我们觉得最酷的一些功能
 features-title-1: 对Relax 和 Autopilot mod的PP计算
-features-content-1: >-
-  我们的服务器针对RX和AP有专门的PP计算算法。有超高的AIM移动能力但是左手无力？又或者左手超强的手速speed却不会移动AIM? 在
-  %{appName} 当中都可以完美发挥你的强项。
+features-content-1: |-
+  我们的服务器针对RX和AP有专门的PP计算算法。有超高的AIM移动能力但是左手无力？又或者左手超强的手速speed却不会移动AIM? 在 %{appName} 当中都可以完美发挥你的强项。
 features-title-2: 免费的 osu!direct 服务
-features-content-2: >-
-  你不用特意成为 osu!supporter 以此来提高你在客户端下图方面的体验。osu!direct 对所有人开放(并且使用的是国内的sayo镜像站)!
-  虽然如此,如果你愿意支持我们,你仍然可以获得一些超酷的特权。只不过这些特权并不会影响到你的game sessions!
+features-content-2: |-
+  你不用特意成为 osu!supporter 以此来提高你在客户端下图方面的体验。osu!direct 对所有人开放(并且使用的是国内的sayo镜像站)! 虽然如此,如果你愿意支持我们,你仍然可以获得一些超酷的特权。只不过这些特权并不会影响到你的game sessions!
 features-title-3: Flexible library
-features-content-3: >-
-  We're written on top of cmyui's multipurpose library allowing for a fully
-  asynchronous environment, both improving performance and the user's experience
-  in the long term!
+features-content-3: |-
+  We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
 what-are-you-waiting-for: 你 还 在 等 什 么?
-subtitle: >-
-  赶紧加入到 %{appName} 当中吧! 没有风险!
-  并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
+subtitle: |-
+  赶紧加入到 %{appName} 当中吧! 没有风险! 并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
 sign-up-for-free: 免 费 注 册！
 error: Uh oh! Be careful!
 success: Hey! Listen!
diff --git a/locales/register/zh-CN.yml b/locales/register/zh-CN.yml
index 3f67de73..842a31b8 100644
--- a/locales/register/zh-CN.yml
+++ b/locales/register/zh-CN.yml
@@ -2,5 +2,4 @@ registration: 注册
 register: 注册账号
 email: 电子邮箱
 already-have-an-account: 已经拥有账号了?
-username: |
-  你的用户名
+username: 你的用户名
diff --git a/locales/settings/en-GB.yml b/locales/settings/en-GB.yml
index 391ebd4a..ea5bd316 100644
--- a/locales/settings/en-GB.yml
+++ b/locales/settings/en-GB.yml
@@ -1,7 +1,6 @@
 avatar: Avatar
-avatar-description: >-
-  We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG,
-  JPG under 5MB
+avatar-description: |-
+  We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG, JPG under 5MB
 choose-file: Choose file
 save: Save
 preview: Preview
diff --git a/locales/settings/en-US.yml b/locales/settings/en-US.yml
index 0efdd461..d001b8bc 100644
--- a/locales/settings/en-US.yml
+++ b/locales/settings/en-US.yml
@@ -1,7 +1,6 @@
 avatar: Avatar
-avatar-description: >-
-  We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG,
-  JPG under 5MB
+avatar-description: |-
+  We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG, JPG under 5MB
 choose-file: Choose file
 save: Save
 preview: Preview
diff --git a/locales/settings/password/en-US.yml b/locales/settings/password/en-US.yml
index e69de29b..19765bd5 100644
--- a/locales/settings/password/en-US.yml
+++ b/locales/settings/password/en-US.yml
@@ -0,0 +1 @@
+null
diff --git a/locales/settings/password/zh-CN.yml b/locales/settings/password/zh-CN.yml
index e69de29b..19765bd5 100644
--- a/locales/settings/password/zh-CN.yml
+++ b/locales/settings/password/zh-CN.yml
@@ -0,0 +1 @@
+null
diff --git a/locales/settings/profile/en-US.yml b/locales/settings/profile/en-US.yml
index e69de29b..19765bd5 100644
--- a/locales/settings/profile/en-US.yml
+++ b/locales/settings/profile/en-US.yml
@@ -0,0 +1 @@
+null
diff --git a/locales/settings/profile/zn-CN.yml b/locales/settings/profile/zn-CN.yml
index e69de29b..19765bd5 100644
--- a/locales/settings/profile/zn-CN.yml
+++ b/locales/settings/profile/zn-CN.yml
@@ -0,0 +1 @@
+null
diff --git a/locales/verify/en-GB.yml b/locales/verify/en-GB.yml
index 06060fa0..c452b20a 100644
--- a/locales/verify/en-GB.yml
+++ b/locales/verify/en-GB.yml
@@ -11,9 +11,8 @@ add-domain: Add -devserver %{domain} at the end of it
 login-to-your-account: Login to your account
 login-to-your-app-name-account: Login to your %{appName} account and you should be done!
 oh-crap-i-am-stuck: Oh crap! I'm stuck please help me!
-need-help-join-discord-server: >-
-  Need help? We've got you covered - join the Discord so our community can help
-  you out!
+need-help-join-discord-server: |-
+  Need help? We've got you covered - join the Discord so our community can help you out!
 click-here-to-join-our-discord: Click here to join our Discord!
 waiting-for-verification: Waiting for verification!
 follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
diff --git a/locales/verify/en-US.yml b/locales/verify/en-US.yml
index 06060fa0..c452b20a 100644
--- a/locales/verify/en-US.yml
+++ b/locales/verify/en-US.yml
@@ -11,9 +11,8 @@ add-domain: Add -devserver %{domain} at the end of it
 login-to-your-account: Login to your account
 login-to-your-app-name-account: Login to your %{appName} account and you should be done!
 oh-crap-i-am-stuck: Oh crap! I'm stuck please help me!
-need-help-join-discord-server: >-
-  Need help? We've got you covered - join the Discord so our community can help
-  you out!
+need-help-join-discord-server: |-
+  Need help? We've got you covered - join the Discord so our community can help you out!
 click-here-to-join-our-discord: Click here to join our Discord!
 waiting-for-verification: Waiting for verification!
 follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
diff --git a/locales/verify/zh-CN.yml b/locales/verify/zh-CN.yml
index f4d76542..79925521 100644
--- a/locales/verify/zh-CN.yml
+++ b/locales/verify/zh-CN.yml
@@ -11,9 +11,8 @@ add-domain: 在文本的末尾添加 -devserver %{domain}
 login-to-your-account: 登入你的账号
 login-to-your-app-name-account: 登录你的 %{appName} 账号,然后就应该万事大吉了!
 oh-crap-i-am-stuck: 妈的，我卡在这个步骤了,赶紧过来帮我一下
-need-help-join-discord-server: >-
-  Need help? We've got you covered - join the Discord so our community can help
-  you out!
+need-help-join-discord-server: |-
+  Need help? We've got you covered - join the Discord so our community can help you out!
 click-here-to-join-our-discord: Click here to join our Discord!
 waiting-for-verification: 正在等待验证结果~
 follow-the-simple-instructions: 只需按照上面的简单说明进行操作，完成后重新加载此页面！

From 7ebb23c2a2b074536ecf0af51323d66da99bb810 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 13 Jun 2022 16:19:26 +0900
Subject: [PATCH 101/278] new formatter

---
 package.json                        | 3 ++-
 utils/i18n/commands/format-yaml.mjs | 9 ++++++---
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index 7d118e7c..b28b74e8 100644
--- a/package.json
+++ b/package.json
@@ -28,7 +28,8 @@
   "homepage": "https://github.com/ppy-sb/guweb#readme",
   "devDependencies": {
     "glob": "^8.0.3",
-    "js-yaml": "^4.1.0"
+    "js-yaml": "^4.1.0",
+    "yaml": "^2.1.1"
   },
   "dependencies": {
     "clui": "^0.3.6",
diff --git a/utils/i18n/commands/format-yaml.mjs b/utils/i18n/commands/format-yaml.mjs
index 972b71b6..389e3402 100644
--- a/utils/i18n/commands/format-yaml.mjs
+++ b/utils/i18n/commands/format-yaml.mjs
@@ -1,6 +1,6 @@
 const parallel = process.env.PARALLEL || false
 
-import yaml from 'js-yaml'
+import YAML, { parseDocument } from 'yaml'
 
 import glob from 'glob'
 import path from 'path'
@@ -12,8 +12,11 @@ import { path as translationPath } from '../config.mjs'
 
 const doWork = async (match) => {
     try {
-        const data = yaml.load(await fs.readFile(match, { encoding: 'utf8' }))
-        const formatted = yaml.dump(data)
+        const data = parseDocument(await fs.readFile(match, { encoding: 'utf8' }))
+        const formatted = data.toString({
+            blockQuote: 'literal',
+            defaultStringType: 'BLOCK_FOLDED'
+        })
         await fs.writeFile(match, formatted, 'utf8')
     } catch (error) {
         console.error(error)

From 5eaa65e5c00e0ed303178c581d6de2e350fdcff4 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 13 Jun 2022 16:33:23 +0900
Subject: [PATCH 102/278] compiled

---
 .locales/admin.en_US.yml    |  1 +
 .locales/admin.zh_CN.yml    |  1 +
 .locales/global.en_GB.yml   |  4 +++-
 .locales/global.en_US.yml   |  2 +-
 .locales/global.zh_CN.yml   |  2 +-
 .locales/login.en_GB.yml    |  5 ++++-
 .locales/login.en_US.yml    |  1 -
 .locales/login.zh_CN.yml    |  1 -
 .locales/logout.en_GB.yml   |  3 +++
 .locales/register.en_GB.yml | 13 ++++++++++++-
 .locales/register.en_US.yml |  1 -
 .locales/register.zh_CN.yml |  4 +---
 .locales/settings.en_GB.yml | 10 ++++++++--
 .locales/settings.en_US.yml |  4 ++--
 .locales/settings.zh_CN.yml |  2 +-
 .locales/settings.zn_CN.yml |  2 ++
 package.json                |  8 ++++----
 utils/i18n/reader.mjs       |  2 +-
 18 files changed, 45 insertions(+), 21 deletions(-)
 create mode 100644 .locales/logout.en_GB.yml
 create mode 100644 .locales/settings.zn_CN.yml

diff --git a/.locales/admin.en_US.yml b/.locales/admin.en_US.yml
index 794dd248..41a6101d 100644
--- a/.locales/admin.en_US.yml
+++ b/.locales/admin.en_US.yml
@@ -9,6 +9,7 @@ en_US:
     github: GitHub
     twitter: Twitter
     youtube: YouTube
+  please-login-in-first: Please login first.
   home:
     that-s-a-lot-of-people: that's a lot of people!
     total-users: total users
diff --git a/.locales/admin.zh_CN.yml b/.locales/admin.zh_CN.yml
index ae760ecd..b2e91881 100644
--- a/.locales/admin.zh_CN.yml
+++ b/.locales/admin.zh_CN.yml
@@ -20,3 +20,4 @@ zh_CN:
     recent-users: 最新用户
     rising-in-popularity-aren-t-we: 要火了咱们？
     total-banned: 总被ban
+  please-login-in-first: 请先登录。
diff --git a/.locales/global.en_GB.yml b/.locales/global.en_GB.yml
index 83a24400..a2729c9c 100644
--- a/.locales/global.en_GB.yml
+++ b/.locales/global.en_GB.yml
@@ -7,13 +7,13 @@ en_GB:
   login: Login
   profile: Profile
   register: Register
+  password: Password
   warning: Warning
   notice: Notice
   error: uh oh! Be careful!
   success: Hey! Listen!
   verify: Verify
   pp: pp
-  PP: PP
   accuracy: Accuracy
   score: Score
   acc: Acc
@@ -40,3 +40,5 @@ en_GB:
     sh: S
     a: A
   you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
+  invalid-parameters: Invalid parameters.
+  you-are-already-logged-in: You're already logged in!
diff --git a/.locales/global.en_US.yml b/.locales/global.en_US.yml
index 1f487c5c..e7ee2db3 100644
--- a/.locales/global.en_US.yml
+++ b/.locales/global.en_US.yml
@@ -12,7 +12,6 @@ en_US:
   error: uh oh! Be careful!
   success: Hey! Listen!
   verify: Verify
-  PP: PP
   acc: Acc
   accuracy: Accuracy
   max-combo: Max Combo
@@ -39,3 +38,4 @@ en_US:
   ranked-score: Ranked score
   score: Score
   total-score: Total Score
+  password: Password
diff --git a/.locales/global.zh_CN.yml b/.locales/global.zh_CN.yml
index f0c1249a..bc024307 100644
--- a/.locales/global.zh_CN.yml
+++ b/.locales/global.zh_CN.yml
@@ -12,7 +12,6 @@ zh_CN:
   error: uh oh! Be careful!
   success: Hey! Listen!
   verify: Verify
-  PP: PP
   acc: Acc
   accuracy: 准确度
   max-combo: 最大连击
@@ -39,3 +38,4 @@ zh_CN:
   score: 分数
   total-score: 总分
   ranked-score: 记分总分
+  password: 密码
diff --git a/.locales/login.en_GB.yml b/.locales/login.en_GB.yml
index bcd941bf..728d49eb 100644
--- a/.locales/login.en_GB.yml
+++ b/.locales/login.en_GB.yml
@@ -3,5 +3,8 @@ en_GB:
   register: Register
   forgot-login: Forgot login?
   username: Username
-  password: Password
   email: Email
+  password-incorrect: Password is incorrect.
+  restricted-not-allowed-to-login: Your account is restricted. You are not allowed to log in.
+  welcome-back: Hey, welcome back %{username}!
+  account-does-not-exist: Account does not exist.
diff --git a/.locales/login.en_US.yml b/.locales/login.en_US.yml
index 56c54b50..e542cc05 100644
--- a/.locales/login.en_US.yml
+++ b/.locales/login.en_US.yml
@@ -3,5 +3,4 @@ en_US:
   register: Register
   forgot-login: Forgot login?
   username: Username
-  password: Password
   email: Email
diff --git a/.locales/login.zh_CN.yml b/.locales/login.zh_CN.yml
index fe9fa342..d0ad6235 100644
--- a/.locales/login.zh_CN.yml
+++ b/.locales/login.zh_CN.yml
@@ -3,5 +3,4 @@ zh_CN:
   register: 注册
   forgot-login: 忘记账号?
   username: 你的用户名
-  password: 你的密码
   email: 电子邮箱
diff --git a/.locales/logout.en_GB.yml b/.locales/logout.en_GB.yml
new file mode 100644
index 00000000..89596321
--- /dev/null
+++ b/.locales/logout.en_GB.yml
@@ -0,0 +1,3 @@
+en_GB:
+  cannot-logout-if-not-logged-in: You can't logout if you aren't logged in!
+  succeed: Successfully logged out!
diff --git a/.locales/register.en_GB.yml b/.locales/register.en_GB.yml
index 51de046b..95cae89f 100644
--- a/.locales/register.en_GB.yml
+++ b/.locales/register.en_GB.yml
@@ -2,6 +2,17 @@ en_GB:
   registration: Registration
   register: register
   email: Email
-  password: Password
   already-have-an-account: Already have an account?
   username: Username
+  currently-disabled: Registrations are currently disabled.
+  captcha-failed: Captcha failed.
+  username-syntax-is-invalid: Invalid username syntax.
+  username-cannot-contains-both-dash-and-space: Username may contain "_" or " ", but not both.
+  username-disallowed: Disallowed username; pick another.
+  username-already-taken-by-others: Username already taken by another user.
+  email-is-invalid: Invalid email syntax.
+  email-already-taken: Email already taken by another user.
+  password:
+    must-between-8-32-characters-in-length: Password must be 8-32 characters in length.
+    must-have-more-than-3-unique-characters: Password must have more than 3 unique characters.
+    too-simple: That password was deemed too simple.
diff --git a/.locales/register.en_US.yml b/.locales/register.en_US.yml
index 4f5d9ea4..e646f7ec 100644
--- a/.locales/register.en_US.yml
+++ b/.locales/register.en_US.yml
@@ -2,6 +2,5 @@ en_US:
   registration: Registration
   register: register
   email: Email
-  password: Password
   already-have-an-account: Already have an account?
   username: Username
diff --git a/.locales/register.zh_CN.yml b/.locales/register.zh_CN.yml
index bc49fd8a..b9576860 100644
--- a/.locales/register.zh_CN.yml
+++ b/.locales/register.zh_CN.yml
@@ -2,7 +2,5 @@ zh_CN:
   registration: 注册
   register: 注册账号
   email: 电子邮箱
-  password: 密码
   already-have-an-account: 已经拥有账号了?
-  username: |
-    你的用户名
+  username: 你的用户名
diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
index 02778373..382a205e 100644
--- a/.locales/settings.en_GB.yml
+++ b/.locales/settings.en_GB.yml
@@ -11,13 +11,11 @@ en_GB:
   banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
   profile-background: Profile Background
   profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password: Password
   password-change: Password Change
   old-password: Old Password
   new-password: New Password
   repeat-password: Repeat Password
   profile:
-    invalid-parameters: Invalid parameters.
     no-changes-have-been-made: No changes have been made.
     username-changes-supporter-only: Username changes are currently a supporter perk.
     new-username-is-invalid: Your new username syntax is invalid.
@@ -32,3 +30,11 @@ en_GB:
   bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
   change-succeed: Your %{something} has been successfully changed!
   no-image-was-selected: No image was selected!
+  customization: customization
+  password:
+    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
+    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
+    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
+    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
+    too-simple: Your new password was deemed too simple.
+    old-password-incorrect: Your old password is incorrect.
diff --git a/.locales/settings.en_US.yml b/.locales/settings.en_US.yml
index 1eb9c5e4..24bc13d8 100644
--- a/.locales/settings.en_US.yml
+++ b/.locales/settings.en_US.yml
@@ -11,12 +11,12 @@ en_US:
   banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
   profile-background: Profile Background
   profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password: Password
+  password: null
   password-change: Password Change
   old-password: Old Password
   new-password: New Password
   repeat-password: Repeat Password
-  profile: Profile
+  profile: null
   user-information: User Infomation
   username: Username
   settings: Settings
diff --git a/.locales/settings.zh_CN.yml b/.locales/settings.zh_CN.yml
index 87d35436..c59f822a 100644
--- a/.locales/settings.zh_CN.yml
+++ b/.locales/settings.zh_CN.yml
@@ -1,4 +1,5 @@
 zh_CN:
+  password: 密码
   avatar: 头像
   avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片.并且图片大小低于5MB
   choose-file: 选择一张图片
@@ -9,7 +10,6 @@ zh_CN:
   banner-description: 建议上传分辨率为 1440x262 的 GIF, PNG, JPG, JPEG 等四种格式的图片
   profile-background: 资料背景
   profile-background-description: 建议上传长宽比为 16:9  的 PNG, JPG, JPEG 格式的图片
-  password: 密码
   password-change: 更改密码
   old-password: 旧密码
   new-password: 新密码
diff --git a/.locales/settings.zn_CN.yml b/.locales/settings.zn_CN.yml
new file mode 100644
index 00000000..4d25dfa4
--- /dev/null
+++ b/.locales/settings.zn_CN.yml
@@ -0,0 +1,2 @@
+zn_CN:
+  profile: null
diff --git a/package.json b/package.json
index b28b74e8..dfb1a8d8 100644
--- a/package.json
+++ b/package.json
@@ -27,13 +27,13 @@
   },
   "homepage": "https://github.com/ppy-sb/guweb#readme",
   "devDependencies": {
+    "clui": "^0.3.6",
     "glob": "^8.0.3",
     "js-yaml": "^4.1.0",
-    "yaml": "^2.1.1"
+    "nodemon": "^2.0.16",
+    "yaml": "^2.1.1",
+    "lodash-es": "^4.17.21"
   },
   "dependencies": {
-    "clui": "^0.3.6",
-    "lodash-es": "^4.17.21",
-    "nodemon": "^2.0.16"
   }
 }
diff --git a/utils/i18n/reader.mjs b/utils/i18n/reader.mjs
index da33a617..8b55deae 100644
--- a/utils/i18n/reader.mjs
+++ b/utils/i18n/reader.mjs
@@ -2,7 +2,7 @@ import glob from 'glob'
 import path from 'path'
 import fs from 'fs'
 import yaml from 'js-yaml'
-import { merge }from 'lodash-es'
+import { merge } from 'lodash-es'
 
 import { compiledFileSchema, path as translationPath, contextFromFileName } from './config.mjs'
 

From c4409632c0f826edcfdded4bc272507308f0f4f9 Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Sun, 19 Jun 2022 11:14:30 +0800
Subject: [PATCH 103/278] completed python translation

---
 blueprints/admin.py                 |  1 -
 blueprints/frontend.py              |  4 +++-
 locales/admin/en-US.yml             |  1 +
 locales/admin/zh-CN.yml             |  1 +
 locales/global/en-US.yml            |  3 +++
 locales/global/zh-CN.yml            |  9 ++++++---
 locales/login/en-US.yml             |  4 ++++
 locales/login/zh-CN.yml             |  4 ++++
 locales/logout/en-US.yml            |  2 ++
 locales/logout/zh-CN.yml            |  2 ++
 locales/navbar/zh-CN.yml            |  2 +-
 locales/register/en-US.yml          | 12 ++++++++++++
 locales/register/zh-CN.yml          | 12 ++++++++++++
 locales/settings/en-GB.yml          |  8 ++++----
 locales/settings/en-US.yml          |  9 +++++++--
 locales/settings/password/en-US.yml |  7 ++++++-
 locales/settings/password/zh-CN.yml |  7 ++++++-
 locales/settings/profile/en-US.yml  |  9 ++++++++-
 locales/settings/profile/zh-CN.yml  |  8 ++++++++
 locales/settings/profile/zn-CN.yml  |  1 -
 locales/settings/zh-CN.yml          |  4 ++++
 locales/verify/zh-CN.yml            |  7 ++++---
 22 files changed, 98 insertions(+), 19 deletions(-)
 create mode 100644 locales/logout/en-US.yml
 create mode 100644 locales/logout/zh-CN.yml
 create mode 100644 locales/settings/profile/zh-CN.yml
 delete mode 100644 locales/settings/profile/zn-CN.yml

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 89508659..e2d41a95 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -8,7 +8,6 @@
 from quart import Blueprint
 from quart import render_template
 from quart import session
-from main import t
 
 from objects import glob
 from objects.utils import flash
diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 459041d3..fa10548e 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -7,6 +7,7 @@
 import os
 import time
 
+
 from cmyui.logging import Ansi
 from cmyui.logging import log
 from functools import wraps
@@ -20,7 +21,6 @@
 from quart import send_file
 
 from constants import regexes
-from main import t
 from objects import glob
 from objects import utils
 from objects.privileges import Privileges
@@ -29,6 +29,8 @@
 
 import i18n
 
+
+
 VALID_MODES = frozenset({'std', 'taiko', 'catch', 'mania'})
 VALID_MODS = frozenset({'vn', 'rx', 'ap'})
 
diff --git a/locales/admin/en-US.yml b/locales/admin/en-US.yml
index 9c81aaf2..865fac79 100644
--- a/locales/admin/en-US.yml
+++ b/locales/admin/en-US.yml
@@ -1 +1,2 @@
 please-login-in-first: Please login first.
+you-have-sufficient-privileges: You have insufficient privileges
diff --git a/locales/admin/zh-CN.yml b/locales/admin/zh-CN.yml
index 940bbd45..2a963d52 100644
--- a/locales/admin/zh-CN.yml
+++ b/locales/admin/zh-CN.yml
@@ -1 +1,2 @@
 please-login-in-first: 请先登录。
+you-have-sufficient-privileges: 您的权限不足
diff --git a/locales/global/en-US.yml b/locales/global/en-US.yml
index cbd00440..bcdbfc34 100644
--- a/locales/global/en-US.yml
+++ b/locales/global/en-US.yml
@@ -38,3 +38,6 @@ ranked-score: Ranked score
 score: Score
 total-score: Total Score
 password: Password
+invalid-parameters: Invalid parameters.
+you-are-already-logged-in: You're already logged in!
+you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
diff --git a/locales/global/zh-CN.yml b/locales/global/zh-CN.yml
index 0c04448a..8ea42dfe 100644
--- a/locales/global/zh-CN.yml
+++ b/locales/global/zh-CN.yml
@@ -3,14 +3,14 @@ log-in: 登录
 offline: 离线
 online: 在线
 leaderboard: 排行榜
-login: Login
+login: 登录
 profile: Profile
-register: Register
+register: 注册
 notice: Notice
 warning: 注意
 error: uh oh! Be careful!
 success: Hey! Listen!
-verify: Verify
+verify: 验证
 acc: Acc
 accuracy: 准确度
 max-combo: 最大连击
@@ -38,3 +38,6 @@ score: 分数
 total-score: 总分
 ranked-score: 记分总分
 password: 密码
+invalid-parameters: 请输入用户名密码以及邮箱
+you-are-already-logged-in: 你已经登录啦!
+you-must-be-logged-in-to-access-this-page: 你必须登录了才能访问该页面
diff --git a/locales/login/en-US.yml b/locales/login/en-US.yml
index 6f86bd8a..1329564a 100644
--- a/locales/login/en-US.yml
+++ b/locales/login/en-US.yml
@@ -3,3 +3,7 @@ register: Register
 forgot-login: Forgot login?
 username: Username
 email: Email
+password-incorrect: Password is incorrect.
+restricted-not-allowed-to-login: Your account is restricted. You are not allowed to log in.
+account-does-not-exist: Account does not exist.
+welcome-back: Hey, welcome back %{username}!
diff --git a/locales/login/zh-CN.yml b/locales/login/zh-CN.yml
index b528ab03..3e2021fc 100644
--- a/locales/login/zh-CN.yml
+++ b/locales/login/zh-CN.yml
@@ -3,3 +3,7 @@ register: 注册
 forgot-login: 忘记账号?
 username: 你的用户名
 email: 电子邮箱
+password-incorrect: 密码错误
+restricted-not-allowed-to-login: 你的账号被封禁了,因此我们不允许你登录
+account-does-not-exist: 该账号并不存在
+welcome-back: 欢迎回来 %{username}!
diff --git a/locales/logout/en-US.yml b/locales/logout/en-US.yml
new file mode 100644
index 00000000..af3ce378
--- /dev/null
+++ b/locales/logout/en-US.yml
@@ -0,0 +1,2 @@
+cannot-logout-if-not-logged-in: You can't logout if you aren't logged in!
+succeed: Successfully logged out!
diff --git a/locales/logout/zh-CN.yml b/locales/logout/zh-CN.yml
new file mode 100644
index 00000000..d50ea8ea
--- /dev/null
+++ b/locales/logout/zh-CN.yml
@@ -0,0 +1,2 @@
+cannot-logout-if-not-logged-in: 你得先登录了才能够进行登出
+succeed: 成功登出!
diff --git a/locales/navbar/zh-CN.yml b/locales/navbar/zh-CN.yml
index 6107aac8..929d9e2d 100644
--- a/locales/navbar/zh-CN.yml
+++ b/locales/navbar/zh-CN.yml
@@ -1,7 +1,7 @@
 home: 主页
 leaderboards: 排行榜
 information: Information
-admin: Admin
+admin: 管理员
 profile: 玩家资料
 settings: 设置
 logout: 登出
diff --git a/locales/register/en-US.yml b/locales/register/en-US.yml
index b7346e37..5287eb74 100644
--- a/locales/register/en-US.yml
+++ b/locales/register/en-US.yml
@@ -3,3 +3,15 @@ register: register
 email: Email
 already-have-an-account: Already have an account?
 username: Username
+captcha-failed: Captcha failed.
+currently-disabled: Registrations are currently disabled.
+email-already-taken: Email already taken by another user.
+email-is-invalid: Invalid email syntax.
+password:
+  must-have-more-than-3-unique-characters: Password must have more than 3 unique characters.
+  too-simple: That password was deemed too simple.
+  must-between-8-32-characters-in-length: Password must be 8-32 characters in length.
+username-cannot-contains-both-dash-and-space: Username may contain "_" or " ", but not both.
+username-already-taken-by-others: Username already taken by another user.
+username-disallowed: Disallowed username; pick another.
+username-syntax-is-invalid: Invalid username syntax.
diff --git a/locales/register/zh-CN.yml b/locales/register/zh-CN.yml
index 842a31b8..20384e0c 100644
--- a/locales/register/zh-CN.yml
+++ b/locales/register/zh-CN.yml
@@ -3,3 +3,15 @@ register: 注册账号
 email: 电子邮箱
 already-have-an-account: 已经拥有账号了?
 username: 你的用户名
+captcha-failed: Captcha failed.
+currently-disabled: 注册功能目前正在禁用中
+email-already-taken: 该电子邮箱已经被其他用户注册过了
+email-is-invalid: 无效的邮箱格式
+password:
+  must-have-more-than-3-unique-characters: 密码必须包含三个以上的特殊字符
+  too-simple: 这个密码看上去太简单了
+  must-between-8-32-characters-in-length: 密码的长度只能是8到32个字符之内
+username-cannot-contains-both-dash-and-space: 用户名不能同时存在"_"和" "(空格)符号
+username-already-taken-by-others: 该用户名已经被其他用户使用了
+username-disallowed: 该用户名不允许被使用,请选择别的
+username-syntax-is-invalid: 无效的用户名格式
diff --git a/locales/settings/en-GB.yml b/locales/settings/en-GB.yml
index ea5bd316..9e938374 100644
--- a/locales/settings/en-GB.yml
+++ b/locales/settings/en-GB.yml
@@ -1,6 +1,7 @@
 avatar: Avatar
-avatar-description: |-
-  We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG, JPG under 5MB
+avatar-description: >-
+  We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG,
+  JPG under 5MB
 choose-file: Choose file
 save: Save
 preview: Preview
@@ -9,7 +10,6 @@ banner: Banner
 banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
 profile-background: Profile Background
 profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-# password: Password // used by password/{locale}.yml relocated to global.passowrd
 password-change: Password Change
 old-password: Old Password
 new-password: New Password
@@ -21,4 +21,4 @@ settings: Settings
 bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
 change-succeed: Your %{something} has been successfully changed!
 no-image-was-selected: No image was selected!
-customization: customization
+customization: Customization
diff --git a/locales/settings/en-US.yml b/locales/settings/en-US.yml
index d001b8bc..6455c529 100644
--- a/locales/settings/en-US.yml
+++ b/locales/settings/en-US.yml
@@ -1,6 +1,7 @@
 avatar: Avatar
-avatar-description: |-
-  We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG, JPG under 5MB
+avatar-description: >-
+  We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a PNG,
+  JPG under 5MB
 choose-file: Choose file
 save: Save
 preview: Preview
@@ -18,3 +19,7 @@ profile: Profile
 user-information: User Infomation
 username: Username
 settings: Settings
+bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
+change-succeed: Your %{something} has been successfully changed!
+no-image-was-selected: No image was selected!
+customization: Customization
diff --git a/locales/settings/password/en-US.yml b/locales/settings/password/en-US.yml
index 19765bd5..d11a8254 100644
--- a/locales/settings/password/en-US.yml
+++ b/locales/settings/password/en-US.yml
@@ -1 +1,6 @@
-null
+new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
+new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
+must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
+must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
+too-simple: Your new password was deemed too simple.
+old-password-incorrect: Your old password is incorrect.
diff --git a/locales/settings/password/zh-CN.yml b/locales/settings/password/zh-CN.yml
index 19765bd5..edb2b678 100644
--- a/locales/settings/password/zh-CN.yml
+++ b/locales/settings/password/zh-CN.yml
@@ -1 +1,6 @@
-null
+new-passoword-mismatch-repeated-password: 你的新密码与确认密码不符
+new-passoword-cannot-be-same-as-old-password: 你的新密码不能是旧密码
+must-between-8-32-characters-in-length: 你的新密码只能在8到32个字符之间
+must-have-more-than-3-unique-characters: 你的新密码必须包含三个以上的特殊字符
+too-simple: 你的新密码看上去太简单了
+old-password-incorrect: 你的旧密码有误
diff --git a/locales/settings/profile/en-US.yml b/locales/settings/profile/en-US.yml
index 19765bd5..111f48b6 100644
--- a/locales/settings/profile/en-US.yml
+++ b/locales/settings/profile/en-US.yml
@@ -1 +1,8 @@
-null
+no-changes-have-been-made: No changes have been made.
+username-changes-supporter-only: Username changes are currently a supporter perk.
+new-username-is-invalid: Your new username syntax is invalid.
+new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
+new-username-disallowed: Your new username isn't allowed; pick another.
+new-username-already-taken-by-others: Your new username already taken by another user.
+new-email-is-invalid: Your new email syntax is invalid.
+succeed-please-login-again: Your username/email have been changed! Please login again.
diff --git a/locales/settings/profile/zh-CN.yml b/locales/settings/profile/zh-CN.yml
new file mode 100644
index 00000000..bde2fe14
--- /dev/null
+++ b/locales/settings/profile/zh-CN.yml
@@ -0,0 +1,8 @@
+no-changes-have-been-made: 没有任何改变
+username-changes-supporter-only: 用户名更改功能目前是支持者的福利
+new-username-is-invalid: 你的新用户名格式有误
+new-username-cannot-contains-both-dash-and-space: 你的新用户名不能同时存在"_"(下划线)和" "(空格)字符
+new-username-disallowed: 你的新用户名不允许被使用,再想一个新名字吧
+new-username-already-taken-by-others: 你的新用户名已经被其它用户使用
+new-email-is-invalid: 你的新邮箱格式有误
+succeed-please-login-again: 你的用户名或者邮箱地址被修改了!请重新登录
diff --git a/locales/settings/profile/zn-CN.yml b/locales/settings/profile/zn-CN.yml
deleted file mode 100644
index 19765bd5..00000000
--- a/locales/settings/profile/zn-CN.yml
+++ /dev/null
@@ -1 +0,0 @@
-null
diff --git a/locales/settings/zh-CN.yml b/locales/settings/zh-CN.yml
index 396069b0..2cbee9bd 100644
--- a/locales/settings/zh-CN.yml
+++ b/locales/settings/zh-CN.yml
@@ -17,3 +17,7 @@ profile: 玩家资料
 user-information: 用户信息
 username: 你的用户名
 settings: 设置
+bad-image-extension: 你选择的%{something}必须是 .jpg .jpeg .png 这三种文件之一
+change-succeed: 你的 %{something}已经修改成功!
+no-image-was-selected: 请选择一张图片
+customization: 个性化
diff --git a/locales/verify/zh-CN.yml b/locales/verify/zh-CN.yml
index 79925521..229085a2 100644
--- a/locales/verify/zh-CN.yml
+++ b/locales/verify/zh-CN.yml
@@ -4,15 +4,16 @@ what-do-you-mean-this-must-be-easy-right: 别想太复杂, 肯定很简单拉~
 follow-these-three-simple-steps: 跟随以下三个简单的步骤即可游玩 %{appName} 了!
 osu-shortcut: Osu! 快捷方式
 find-your-shortcut: 在桌面上寻找你的osu!快捷方式并复制一份 (如果没有，可以去osu!目录里创建一份)
-edit-it: Edit it
+edit-it: 修改属性
 right-click-properties: 右键快捷方式,在菜单中找到 "属性" 选项,(一般在最下边)
 find-target-element-box: 找到 "目标" 这一行
 add-domain: 在文本的末尾添加 -devserver %{domain}
 login-to-your-account: 登入你的账号
 login-to-your-app-name-account: 登录你的 %{appName} 账号,然后就应该万事大吉了!
 oh-crap-i-am-stuck: 妈的，我卡在这个步骤了,赶紧过来帮我一下
-need-help-join-discord-server: |-
-  Need help? We've got you covered - join the Discord so our community can help you out!
+need-help-join-discord-server: >-
+  Need help? We've got you covered - join the Discord so our community can help
+  you out!
 click-here-to-join-our-discord: Click here to join our Discord!
 waiting-for-verification: 正在等待验证结果~
 follow-the-simple-instructions: 只需按照上面的简单说明进行操作，完成后重新加载此页面！

From f720e01ba8be6ec787ee0eb012d255523d39ce79 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 20 Jun 2022 14:59:33 +0900
Subject: [PATCH 104/278] _string overload

---
 .locales/admin.en_US.yml    |  1 +
 .locales/admin.zh_CN.yml    |  1 +
 .locales/global.en_US.yml   |  3 +++
 .locales/global.zh_CN.yml   |  9 ++++++---
 .locales/home.zh_CN.yml     |  6 +++---
 .locales/login.en_US.yml    |  4 ++++
 .locales/login.zh_CN.yml    |  4 ++++
 .locales/logout.en_US.yml   |  3 +++
 .locales/logout.zh_CN.yml   |  3 +++
 .locales/navbar.zh_CN.yml   |  2 +-
 .locales/register.en_US.yml | 12 ++++++++++++
 .locales/register.zh_CN.yml | 12 ++++++++++++
 .locales/settings.en_GB.yml | 31 +-----------------------------
 .locales/settings.en_US.yml | 38 +++++++++++++++++--------------------
 .locales/settings.zh_CN.yml | 24 +++++++++++++++++++++--
 .locales/settings.zn_CN.yml |  2 --
 .locales/verify.zh_CN.yml   |  2 +-
 main.py                     |  5 ++++-
 utils/i18n/config.mjs       | 30 +++++++++++++++++++++++++++++
 utils/i18n/reader.mjs       | 25 +++++++++++++++++++++---
 20 files changed, 150 insertions(+), 67 deletions(-)
 create mode 100644 .locales/logout.en_US.yml
 create mode 100644 .locales/logout.zh_CN.yml
 delete mode 100644 .locales/settings.zn_CN.yml

diff --git a/.locales/admin.en_US.yml b/.locales/admin.en_US.yml
index 41a6101d..5a37a75c 100644
--- a/.locales/admin.en_US.yml
+++ b/.locales/admin.en_US.yml
@@ -10,6 +10,7 @@ en_US:
     twitter: Twitter
     youtube: YouTube
   please-login-in-first: Please login first.
+  you-have-sufficient-privileges: You have insufficient privileges
   home:
     that-s-a-lot-of-people: that's a lot of people!
     total-users: total users
diff --git a/.locales/admin.zh_CN.yml b/.locales/admin.zh_CN.yml
index b2e91881..68d2a9e6 100644
--- a/.locales/admin.zh_CN.yml
+++ b/.locales/admin.zh_CN.yml
@@ -21,3 +21,4 @@ zh_CN:
     rising-in-popularity-aren-t-we: 要火了咱们？
     total-banned: 总被ban
   please-login-in-first: 请先登录。
+  you-have-sufficient-privileges: 您的权限不足
diff --git a/.locales/global.en_US.yml b/.locales/global.en_US.yml
index e7ee2db3..c3b6f83d 100644
--- a/.locales/global.en_US.yml
+++ b/.locales/global.en_US.yml
@@ -39,3 +39,6 @@ en_US:
   score: Score
   total-score: Total Score
   password: Password
+  invalid-parameters: Invalid parameters.
+  you-are-already-logged-in: You're already logged in!
+  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
diff --git a/.locales/global.zh_CN.yml b/.locales/global.zh_CN.yml
index bc024307..1df668c4 100644
--- a/.locales/global.zh_CN.yml
+++ b/.locales/global.zh_CN.yml
@@ -4,14 +4,14 @@ zh_CN:
   offline: 离线
   online: 在线
   leaderboard: 排行榜
-  login: Login
+  login: 登录
   profile: Profile
-  register: Register
+  register: 注册
   notice: Notice
   warning: 注意
   error: uh oh! Be careful!
   success: Hey! Listen!
-  verify: Verify
+  verify: 验证
   acc: Acc
   accuracy: 准确度
   max-combo: 最大连击
@@ -39,3 +39,6 @@ zh_CN:
   total-score: 总分
   ranked-score: 记分总分
   password: 密码
+  invalid-parameters: 请输入用户名密码以及邮箱
+  you-are-already-logged-in: 你已经登录啦!
+  you-must-be-logged-in-to-access-this-page: 你必须登录了才能访问该页面
diff --git a/.locales/home.zh_CN.yml b/.locales/home.zh_CN.yml
index 156ac5c1..6641fa25 100644
--- a/.locales/home.zh_CN.yml
+++ b/.locales/home.zh_CN.yml
@@ -1,8 +1,8 @@
 zh_CN:
   subtitle-big: >-
-    欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会
-    群内的兽耳机器人24小时为您提供成绩查询等服务.详情请加QQ群: 792778662. 
-    ppysb新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
+    欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜,
+    以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段,
+    如出现问题或有改进建议, 欢迎与我们联系与沟通.
   some-of-our-coolest-features: 我们觉得最酷的一些功能
   features-title-1: 对Relax 和 Autopilot mod的PP计算
   features-content-1: >-
diff --git a/.locales/login.en_US.yml b/.locales/login.en_US.yml
index e542cc05..cd8457ea 100644
--- a/.locales/login.en_US.yml
+++ b/.locales/login.en_US.yml
@@ -4,3 +4,7 @@ en_US:
   forgot-login: Forgot login?
   username: Username
   email: Email
+  password-incorrect: Password is incorrect.
+  restricted-not-allowed-to-login: Your account is restricted. You are not allowed to log in.
+  account-does-not-exist: Account does not exist.
+  welcome-back: Hey, welcome back %{username}!
diff --git a/.locales/login.zh_CN.yml b/.locales/login.zh_CN.yml
index d0ad6235..8a5d6d2b 100644
--- a/.locales/login.zh_CN.yml
+++ b/.locales/login.zh_CN.yml
@@ -4,3 +4,7 @@ zh_CN:
   forgot-login: 忘记账号?
   username: 你的用户名
   email: 电子邮箱
+  password-incorrect: 密码错误
+  restricted-not-allowed-to-login: 你的账号被封禁了,因此我们不允许你登录
+  account-does-not-exist: 该账号并不存在
+  welcome-back: 欢迎回来 %{username}!
diff --git a/.locales/logout.en_US.yml b/.locales/logout.en_US.yml
new file mode 100644
index 00000000..90b413c1
--- /dev/null
+++ b/.locales/logout.en_US.yml
@@ -0,0 +1,3 @@
+en_US:
+  cannot-logout-if-not-logged-in: You can't logout if you aren't logged in!
+  succeed: Successfully logged out!
diff --git a/.locales/logout.zh_CN.yml b/.locales/logout.zh_CN.yml
new file mode 100644
index 00000000..8f15def2
--- /dev/null
+++ b/.locales/logout.zh_CN.yml
@@ -0,0 +1,3 @@
+zh_CN:
+  cannot-logout-if-not-logged-in: 你得先登录了才能够进行登出
+  succeed: 成功登出!
diff --git a/.locales/navbar.zh_CN.yml b/.locales/navbar.zh_CN.yml
index 23a84b0d..8a22834e 100644
--- a/.locales/navbar.zh_CN.yml
+++ b/.locales/navbar.zh_CN.yml
@@ -2,7 +2,7 @@ zh_CN:
   home: 主页
   leaderboards: 排行榜
   information: Information
-  admin: Admin
+  admin: 管理员
   profile: 玩家资料
   settings: 设置
   logout: 登出
diff --git a/.locales/register.en_US.yml b/.locales/register.en_US.yml
index e646f7ec..a08dabab 100644
--- a/.locales/register.en_US.yml
+++ b/.locales/register.en_US.yml
@@ -4,3 +4,15 @@ en_US:
   email: Email
   already-have-an-account: Already have an account?
   username: Username
+  captcha-failed: Captcha failed.
+  currently-disabled: Registrations are currently disabled.
+  email-already-taken: Email already taken by another user.
+  email-is-invalid: Invalid email syntax.
+  password:
+    must-have-more-than-3-unique-characters: Password must have more than 3 unique characters.
+    too-simple: That password was deemed too simple.
+    must-between-8-32-characters-in-length: Password must be 8-32 characters in length.
+  username-cannot-contains-both-dash-and-space: Username may contain "_" or " ", but not both.
+  username-already-taken-by-others: Username already taken by another user.
+  username-disallowed: Disallowed username; pick another.
+  username-syntax-is-invalid: Invalid username syntax.
diff --git a/.locales/register.zh_CN.yml b/.locales/register.zh_CN.yml
index b9576860..08fa5eef 100644
--- a/.locales/register.zh_CN.yml
+++ b/.locales/register.zh_CN.yml
@@ -4,3 +4,15 @@ zh_CN:
   email: 电子邮箱
   already-have-an-account: 已经拥有账号了?
   username: 你的用户名
+  captcha-failed: Captcha failed.
+  currently-disabled: 注册功能目前正在禁用中
+  email-already-taken: 该电子邮箱已经被其他用户注册过了
+  email-is-invalid: 无效的邮箱格式
+  password:
+    must-have-more-than-3-unique-characters: 密码必须包含三个以上的特殊字符
+    too-simple: 这个密码看上去太简单了
+    must-between-8-32-characters-in-length: 密码的长度只能是8到32个字符之内
+  username-cannot-contains-both-dash-and-space: 用户名不能同时存在"_"和" "(空格)符号
+  username-already-taken-by-others: 该用户名已经被其他用户使用了
+  username-disallowed: 该用户名不允许被使用,请选择别的
+  username-syntax-is-invalid: 无效的用户名格式
diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
index 382a205e..e5956ac4 100644
--- a/.locales/settings.en_GB.yml
+++ b/.locales/settings.en_GB.yml
@@ -1,20 +1,4 @@
 en_GB:
-  avatar: Avatar
-  avatar-description: >-
-    We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a
-    PNG, JPG under 5MB
-  choose-file: Choose file
-  save: Save
-  preview: Preview
-  customisation: Customisation
-  banner: Banner
-  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
-  profile-background: Profile Background
-  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password-change: Password Change
-  old-password: Old Password
-  new-password: New Password
-  repeat-password: Repeat Password
   profile:
     no-changes-have-been-made: No changes have been made.
     username-changes-supporter-only: Username changes are currently a supporter perk.
@@ -24,17 +8,4 @@ en_GB:
     new-username-already-taken-by-others: Your new username already taken by another user.
     new-email-is-invalid: Your new email syntax is invalid.
     succeed-please-login-again: Your username/email have been changed! Please login again.
-  user-information: User Infomation
-  username: Username
-  settings: Settings
-  bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
-  change-succeed: Your %{something} has been successfully changed!
-  no-image-was-selected: No image was selected!
-  customization: customization
-  password:
-    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
-    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
-    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
-    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
-    too-simple: Your new password was deemed too simple.
-    old-password-incorrect: Your old password is incorrect.
+    _string: Profile
diff --git a/.locales/settings.en_US.yml b/.locales/settings.en_US.yml
index 24bc13d8..810340a1 100644
--- a/.locales/settings.en_US.yml
+++ b/.locales/settings.en_US.yml
@@ -1,22 +1,18 @@
 en_US:
-  avatar: Avatar
-  avatar-description: >-
-    We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a
-    PNG, JPG under 5MB
-  choose-file: Choose file
-  save: Save
-  preview: Preview
-  customisation: Customisation
-  banner: Banner
-  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
-  profile-background: Profile Background
-  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password: null
-  password-change: Password Change
-  old-password: Old Password
-  new-password: New Password
-  repeat-password: Repeat Password
-  profile: null
-  user-information: User Infomation
-  username: Username
-  settings: Settings
+  password:
+    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
+    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
+    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
+    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
+    too-simple: Your new password was deemed too simple.
+    old-password-incorrect: Your old password is incorrect.
+    _string: Password
+  profile:
+    no-changes-have-been-made: No changes have been made.
+    username-changes-supporter-only: Username changes are currently a supporter perk.
+    new-username-is-invalid: Your new username syntax is invalid.
+    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
+    new-username-disallowed: Your new username isn't allowed; pick another.
+    new-username-already-taken-by-others: Your new username already taken by another user.
+    new-email-is-invalid: Your new email syntax is invalid.
+    succeed-please-login-again: Your username/email have been changed! Please login again.
diff --git a/.locales/settings.zh_CN.yml b/.locales/settings.zh_CN.yml
index c59f822a..bd62901b 100644
--- a/.locales/settings.zh_CN.yml
+++ b/.locales/settings.zh_CN.yml
@@ -1,5 +1,22 @@
 zh_CN:
-  password: 密码
+  password:
+    new-passoword-mismatch-repeated-password: 你的新密码与确认密码不符
+    new-passoword-cannot-be-same-as-old-password: 你的新密码不能是旧密码
+    must-between-8-32-characters-in-length: 你的新密码只能在8到32个字符之间
+    must-have-more-than-3-unique-characters: 你的新密码必须包含三个以上的特殊字符
+    too-simple: 你的新密码看上去太简单了
+    old-password-incorrect: 你的旧密码有误
+    _string: 密码
+  profile:
+    no-changes-have-been-made: 没有任何改变
+    username-changes-supporter-only: 用户名更改功能目前是支持者的福利
+    new-username-is-invalid: 你的新用户名格式有误
+    new-username-cannot-contains-both-dash-and-space: 你的新用户名不能同时存在"_"(下划线)和" "(空格)字符
+    new-username-disallowed: 你的新用户名不允许被使用,再想一个新名字吧
+    new-username-already-taken-by-others: 你的新用户名已经被其它用户使用
+    new-email-is-invalid: 你的新邮箱格式有误
+    succeed-please-login-again: 你的用户名或者邮箱地址被修改了!请重新登录
+    _string: 玩家资料
   avatar: 头像
   avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片.并且图片大小低于5MB
   choose-file: 选择一张图片
@@ -14,7 +31,10 @@ zh_CN:
   old-password: 旧密码
   new-password: 新密码
   repeat-password: 确认新密码
-  profile: 玩家资料
   user-information: 用户信息
   username: 你的用户名
   settings: 设置
+  bad-image-extension: 你选择的%{something}必须是 .jpg .jpeg .png 这三种文件之一
+  change-succeed: 你的 %{something}已经修改成功!
+  no-image-was-selected: 请选择一张图片
+  customization: 个性化
diff --git a/.locales/settings.zn_CN.yml b/.locales/settings.zn_CN.yml
deleted file mode 100644
index 4d25dfa4..00000000
--- a/.locales/settings.zn_CN.yml
+++ /dev/null
@@ -1,2 +0,0 @@
-zn_CN:
-  profile: null
diff --git a/.locales/verify.zh_CN.yml b/.locales/verify.zh_CN.yml
index d1885ffd..6b92a375 100644
--- a/.locales/verify.zh_CN.yml
+++ b/.locales/verify.zh_CN.yml
@@ -5,7 +5,7 @@ zh_CN:
   follow-these-three-simple-steps: 跟随以下三个简单的步骤即可游玩 %{appName} 了!
   osu-shortcut: Osu! 快捷方式
   find-your-shortcut: 在桌面上寻找你的osu!快捷方式并复制一份 (如果没有，可以去osu!目录里创建一份)
-  edit-it: Edit it
+  edit-it: 修改属性
   right-click-properties: 右键快捷方式,在菜单中找到 "属性" 选项,(一般在最下边)
   find-target-element-box: 找到 "目标" 这一行
   add-domain: 在文本的末尾添加 -devserver %{domain}
diff --git a/main.py b/main.py
index f597bc84..66ef4efc 100755
--- a/main.py
+++ b/main.py
@@ -59,7 +59,10 @@ def t(key, **kwargs) -> str:
     try:
         return i18n.t(key, **kwargs)
     except:
-        return key
+        try:
+            return i18n.t(key + '._string', **kwargs)
+        except:
+            return key
 
 @app.template_global()
 def appName() -> str:
diff --git a/utils/i18n/config.mjs b/utils/i18n/config.mjs
index 070b3436..c9189eea 100644
--- a/utils/i18n/config.mjs
+++ b/utils/i18n/config.mjs
@@ -1,6 +1,7 @@
 import { join } from 'path'
 import { dirname } from 'path';
 import { fileURLToPath } from 'url';
+import { merge } from 'lodash-es'
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
 
@@ -23,4 +24,33 @@ export const contextFromFileName = function generateContext(fileName) {
         locale: locale.replace('_', '-'),
         extension
     }
+}
+export function onConflictingKey(oldVal, newVal, key) {
+    if (!typeof newVal[key] === 'object' || !typeof oldVal[key] === 'object') {
+        console.error('onConflictingKey: unable to merge text with text.')
+    }
+    if (typeof newVal[key] === 'object' && typeof oldVal[key] === 'object') {
+        console.info('merged object', oldVal, newVal)
+        return merge(oldVal, newVal)
+    }
+    if (typeof newVal[key] === 'string') {
+        console.info(`[info] ${key} renamed into ${key}._string.`)
+        return {
+            ...oldVal,
+            [key]: {
+                ...oldVal[key],
+                _string: newVal[key]
+            }
+        }
+    }
+    else if (typeof oldVal[key] === 'string') {
+        console.info(`[info] ${key} renamed into ${key}._string.`)
+        return {
+            ...newVal,
+            [key]: {
+                ...newVal[key],
+                _string: oldVal[key]
+            }
+        }
+    }
 }
\ No newline at end of file
diff --git a/utils/i18n/reader.mjs b/utils/i18n/reader.mjs
index 8b55deae..d3cbf2ee 100644
--- a/utils/i18n/reader.mjs
+++ b/utils/i18n/reader.mjs
@@ -2,9 +2,9 @@ import glob from 'glob'
 import path from 'path'
 import fs from 'fs'
 import yaml from 'js-yaml'
-import { merge } from 'lodash-es'
+import { mergeWith, merge } from 'lodash-es'
 
-import { compiledFileSchema, path as translationPath, contextFromFileName } from './config.mjs'
+import { compiledFileSchema, path as translationPath, contextFromFileName, onConflictingKey } from './config.mjs'
 
 
 const parseLocale = (file, context) => {
@@ -62,7 +62,26 @@ export const readLocales = () => new Promise((resolve, reject) => {
                 const context = contextFromFileName(relative)
                 const data = await parseLocale(match, context)
                 if (!acc[context.locale]) acc[context.locale] = {}
-                acc[context.locale] = merge(acc[context.locale], data[context.locale])
+                acc[context.locale] = mergeWith(
+                    acc[context.locale],
+                    data[context.locale],
+                    (objValue, srcValue, key, object, source, stack) => {
+                        if (!objValue) {
+                            return srcValue
+                        }
+                        for (const k in srcValue) {
+                            if (objValue[k]) {
+                                console.warn(`[Warning] Merging into initilazed value:\n  ${key}.${k}:\n    [${typeof srcValue[k]}${typeof srcValue[k] === 'string' && ' `' + srcValue[k] + '`' || ''}] merging into [${typeof objValue[k]}${typeof objValue[k] === 'string' && ' `' + objValue[k] + '`' || ''}].`)
+                                objValue = onConflictingKey(objValue, srcValue, k)
+                                console.log('')
+                            } else {
+                                objValue[k] = srcValue[k]
+                            }
+                        }
+                        return objValue
+                        // return merge(objValue, srcValue)
+                    }
+                )
                 return acc
             } catch (error) {
                 reject(error)

From dd69508647da10ce30cf88ff9bfbae283144dc92 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 20 Jun 2022 17:32:32 +0900
Subject: [PATCH 105/278] Squashed commit of the following:

commit 4ac680fd341569c6cfa2712bd97ba3c8644fefb0
Author: arily <arily@arily.moe>
Date:   Mon Jun 20 17:29:25 2022 +0900

    export functions

commit 1d6bc9b40556dd00eb1ebbe0f39533c4ffcd67bc
Author: arily <arily@arily.moe>
Date:   Mon Jun 20 17:28:42 2022 +0900

    test new branch
---
 utils/i18n/config.mjs | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/utils/i18n/config.mjs b/utils/i18n/config.mjs
index c9189eea..c0a545ab 100644
--- a/utils/i18n/config.mjs
+++ b/utils/i18n/config.mjs
@@ -11,10 +11,10 @@ export const compiled = join(__dirname, '../../.locales')
 export const path = join(__dirname, '../../locales')
 export const divider = '.'
 
-export const contextToFileName = function generateFileName(context) {
+export function contextToFileName (context) {
     return `${context.namespace}/${context.locale}.${context.extension || 'yml'}`
 }
-export const contextFromFileName = function generateContext(fileName) {
+export function contextFromFileName(fileName) {
     const split = fileName.split('/').join(divider).split(divider)
     const namespaces = split.slice(0, split.length - 2)
     const [locale, extension] = split.slice(-2)

From f03c6294dc68b164bd363fba7c8e233023f82a97 Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Mon, 20 Jun 2022 16:39:54 +0800
Subject: [PATCH 106/278] resolov

---
 .locales/404.en_GB.yml           |   1 +
 .locales/404.en_US.yml           |   1 +
 .locales/404.zh_CN.yml           |   3 +-
 .locales/admin.en_GB.yml         |   9 +++
 .locales/admin.en_US.yml         |  13 ++++
 .locales/admin.zh_CN.yml         |  23 ++++--
 .locales/global.en_GB.yml        |  34 +++++++-
 .locales/global.en_US.yml        |  31 +++++++-
 .locales/global.zh_CN.yml        |  35 ++++++++-
 .locales/login.en_GB.yml         |   5 +-
 .locales/login.en_US.yml         |   1 -
 .locales/login.zh_CN.yml         |   1 -
 .locales/profile.en_GB.yml       |   4 +
 .locales/profile.en_US.yml       |   4 +
 .locales/profile.zh_CN.yml       |   4 +
 .locales/register.en_GB.yml      |  13 +++-
 .locales/register.en_US.yml      |   1 -
 .locales/register.zh_CN.yml      |   4 +-
 .locales/settings.en_GB.yml      |  22 +++++-
 .locales/settings.en_US.yml      |   4 +-
 .locales/settings.zh_CN.yml      |   2 +-
 blueprints/admin.py              |   4 +-
 blueprints/frontend.py           | 129 +++++++++++++++++++------------
 locales/404/en-GB.yml            |   1 +
 locales/404/en-US.yml            |   1 +
 locales/404/zh-CN.yml            |   3 +-
 locales/admin/base/en-US.yml     |   3 +
 locales/admin/base/zh-CN.yml     |  11 ++-
 locales/admin/home/en-GB.yml     |   7 ++
 locales/admin/home/en-US.yml     |   9 +++
 locales/admin/home/zh-CN.yml     |  11 ++-
 locales/global/en-GB.yml         |  35 ++++++++-
 locales/global/en-US.yml         |  34 +++++++-
 locales/global/zh-CN.yml         |  44 +++++++++--
 locales/home/en-GB.yml           |  31 +++-----
 locales/home/en-US.yml           |  31 +++-----
 locales/home/zh-CN.yml           |  27 +++----
 locales/login/en-GB.yml          |   5 +-
 locales/login/en-US.yml          |   5 +-
 locales/login/zh-CN.yml          |   5 +-
 locales/navbar/zh-CN.yml         |   2 +-
 locales/profile/en-GB.yml        |   4 +
 locales/profile/en-US.yml        |   4 +
 locales/profile/zh-CN.yml        |   4 +
 locales/register/en-GB.yml       |  14 +++-
 locales/register/en-US.yml       |  13 +++-
 locales/register/zh-CN.yml       |  16 +++-
 locales/verify/en-GB.yml         |   5 +-
 locales/verify/en-US.yml         |   5 +-
 locales/verify/zh-CN.yml         |   2 +-
 templates/404.html               |   2 +-
 templates/admin/home.html        |  20 ++---
 templates/components/navbar.html |   8 +-
 templates/home.html              |   2 +-
 templates/leaderboard.html       |  32 ++++----
 templates/login.html             |   2 +-
 templates/profile.html           |  54 ++++++-------
 templates/register.html          |   2 +-
 templates/settings/avatar.html   |   6 +-
 templates/settings/custom.html   |  14 ++--
 templates/settings/password.html |  16 ++--
 templates/settings/profile.html  |  10 +--
 templates/settings/sidebar.html  |   2 +-
 63 files changed, 593 insertions(+), 257 deletions(-)

diff --git a/.locales/404.en_GB.yml b/.locales/404.en_GB.yml
index 0bd22e57..c1948c75 100644
--- a/.locales/404.en_GB.yml
+++ b/.locales/404.en_GB.yml
@@ -1,4 +1,5 @@
 en_GB:
+  '404': '404'
   page-not-found: Page not found
   where-am-i: Where am I?
   check-url: Check that the URL you entered is correct.
diff --git a/.locales/404.en_US.yml b/.locales/404.en_US.yml
index 4ce2e89c..9f78cce2 100644
--- a/.locales/404.en_US.yml
+++ b/.locales/404.en_US.yml
@@ -1,4 +1,5 @@
 en_US:
+  '404': '404'
   page-not-found: Page not found
   where-am-i: Where am I?
   check-url: Check that the URL you entered is correct.
diff --git a/.locales/404.zh_CN.yml b/.locales/404.zh_CN.yml
index 857a1214..7f0bb9ed 100644
--- a/.locales/404.zh_CN.yml
+++ b/.locales/404.zh_CN.yml
@@ -1,5 +1,6 @@
 zh_CN:
-  page-not-found: 404 查无此页
+  '404': '404'
+  page-not-found: 找不到页面
   where-am-i: 我是谁 我在哪 我在干什么?
   check-url: 请检查下你输入的链接是否正确。
   make-sure-visit: 或者确保你想访问的地方没有在维护中!
diff --git a/.locales/admin.en_GB.yml b/.locales/admin.en_GB.yml
index 87690c80..1ae6520e 100644
--- a/.locales/admin.en_GB.yml
+++ b/.locales/admin.en_GB.yml
@@ -9,7 +9,16 @@ en_GB:
     youtube: YouTube
     twitter: Twitter
     instagram: Instagram
+  please-login-in-first: Please login first.
+  you-have-sufficient-privileges: You have insufficient privileges
   home:
     total-users: total users
     that-s-a-lot-of-people: that's a lot of people!
     total-online: total online
+    rising-in-popularity-aren-t-we: rising in popularity are we?
+    latest-and-greatest-welcome: latest and greatest! welcome!
+    latest-user: latest user
+    total-banned: total banned
+    naughty-sad-face: naughty naughty :(
+    recent-users: Recent Users
+    recent-score: Recent Score
diff --git a/.locales/admin.en_US.yml b/.locales/admin.en_US.yml
index 26354469..41a6101d 100644
--- a/.locales/admin.en_US.yml
+++ b/.locales/admin.en_US.yml
@@ -6,5 +6,18 @@ en_US:
     discord: Discord
     admin-panel: '%{appName} Admin Panel'
     instagram: Instagram
+    github: GitHub
+    twitter: Twitter
+    youtube: YouTube
+  please-login-in-first: Please login first.
   home:
     that-s-a-lot-of-people: that's a lot of people!
+    total-users: total users
+    total-online: total online
+    latest-and-greatest-welcome: latest and greatest! welcome!
+    latest-user: latest user
+    naughty-sad-face: naughty naughty :(
+    recent-score: Recent Score
+    recent-users: Recent Users
+    rising-in-popularity-aren-t-we: rising in popularity are we?
+    total-banned: total banned
diff --git a/.locales/admin.zh_CN.yml b/.locales/admin.zh_CN.yml
index 2d84d3d6..b2e91881 100644
--- a/.locales/admin.zh_CN.yml
+++ b/.locales/admin.zh_CN.yml
@@ -1,10 +1,23 @@
 zh_CN:
   base:
-    admin: Admin
-    dashboard: Dashboard
-    welcome-to-admin-panel: Welcome to %{appName} admin panel!
+    admin: 管理员
+    dashboard: 控制面板
+    welcome-to-admin-panel: 欢迎来到 %{appName} 管理面板!
     discord: Discord
-    admin-panel: '%{appName} Admin Panel'
+    admin-panel: '%{appName} 管理员面板'
     instagram: Instagram
+    github: GitHub
+    twitter: 推特
+    youtube: YouTube
   home:
-    that-s-a-lot-of-people: that's a lot of people!
+    that-s-a-lot-of-people: 好多人！
+    total-users: 总用户
+    total-online: 总在线
+    latest-and-greatest-welcome: 最新最热！欢迎！
+    latest-user: 最新用户
+    naughty-sad-face: 坏坏 :(
+    recent-score: 最近成绩
+    recent-users: 最新用户
+    rising-in-popularity-aren-t-we: 要火了咱们？
+    total-banned: 总被ban
+  please-login-in-first: 请先登录。
diff --git a/.locales/global.en_GB.yml b/.locales/global.en_GB.yml
index 28cefcbe..a2729c9c 100644
--- a/.locales/global.en_GB.yml
+++ b/.locales/global.en_GB.yml
@@ -7,8 +7,38 @@ en_GB:
   login: Login
   profile: Profile
   register: Register
+  password: Password
   warning: Warning
   notice: Notice
-  uh-oh-be-careful: uh oh! Be careful!
-  hey-listen: Hey! Listen!
+  error: uh oh! Be careful!
+  success: Hey! Listen!
   verify: Verify
+  pp: pp
+  accuracy: Accuracy
+  score: Score
+  acc: Acc
+  playcount: Play Count
+  playtime: Play Time
+  max-combo: Max Combo
+  mode:
+    vanilla: Vanilla
+    relax: Relax
+    autopilot: Autopilot
+    taiko: osu!taiko
+    osu: osu!
+    catch: osu!catch
+    mania: osu!mania
+    VN: VN
+    RX: RX
+    AP: AP
+  ranked-score: Ranked score
+  total-score: Total Score
+  rank:
+    ss: SS
+    ssh: SS
+    s: S
+    sh: S
+    a: A
+  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
+  invalid-parameters: Invalid parameters.
+  you-are-already-logged-in: You're already logged in!
diff --git a/.locales/global.en_US.yml b/.locales/global.en_US.yml
index 2b9ca6eb..e7ee2db3 100644
--- a/.locales/global.en_US.yml
+++ b/.locales/global.en_US.yml
@@ -9,6 +9,33 @@ en_US:
   register: Register
   notice: Notice
   warning: Warning
-  uh-oh-be-careful: uh oh! Be careful!
-  hey-listen: Hey! Listen!
+  error: uh oh! Be careful!
+  success: Hey! Listen!
   verify: Verify
+  acc: Acc
+  accuracy: Accuracy
+  max-combo: Max Combo
+  mode:
+    AP: AP
+    RX: RX
+    VN: VN
+    autopilot: Autopilot
+    catch: osu!catch
+    mania: osu!mania
+    osu: osu!
+    relax: Relax
+    taiko: osu!taiko
+    vanilla: Vanilla
+  playcount: Play Count
+  playtime: Play Time
+  pp: pp
+  rank:
+    a: A
+    s: S
+    sh: S
+    ss: SS
+    ssh: SS
+  ranked-score: Ranked score
+  score: Score
+  total-score: Total Score
+  password: Password
diff --git a/.locales/global.zh_CN.yml b/.locales/global.zh_CN.yml
index eedc351f..bc024307 100644
--- a/.locales/global.zh_CN.yml
+++ b/.locales/global.zh_CN.yml
@@ -3,12 +3,39 @@ zh_CN:
   log-in: 登录
   offline: 离线
   online: 在线
-  leaderboard: 排行榜2
+  leaderboard: 排行榜
   login: Login
   profile: Profile
   register: Register
   notice: Notice
-  warning: Warning
-  uh-oh-be-careful: uh oh! Be careful!
-  hey-listen: Hey! Listen!
+  warning: 注意
+  error: uh oh! Be careful!
+  success: Hey! Listen!
   verify: Verify
+  acc: Acc
+  accuracy: 准确度
+  max-combo: 最大连击
+  mode:
+    AP: AP
+    RX: RX
+    VN: VN
+    autopilot: Autopilot
+    catch: osu!接水果
+    mania: osu!面条
+    osu: osu!
+    relax: Relax
+    taiko: osu!太鼓
+    vanilla: Vanilla
+  playcount: 游玩次数
+  playtime: 游玩时间
+  pp: pp
+  rank:
+    a: A
+    s: S
+    sh: S
+    ss: SS
+    ssh: SS
+  score: 分数
+  total-score: 总分
+  ranked-score: 记分总分
+  password: 密码
diff --git a/.locales/login.en_GB.yml b/.locales/login.en_GB.yml
index bcd941bf..728d49eb 100644
--- a/.locales/login.en_GB.yml
+++ b/.locales/login.en_GB.yml
@@ -3,5 +3,8 @@ en_GB:
   register: Register
   forgot-login: Forgot login?
   username: Username
-  password: Password
   email: Email
+  password-incorrect: Password is incorrect.
+  restricted-not-allowed-to-login: Your account is restricted. You are not allowed to log in.
+  welcome-back: Hey, welcome back %{username}!
+  account-does-not-exist: Account does not exist.
diff --git a/.locales/login.en_US.yml b/.locales/login.en_US.yml
index 56c54b50..e542cc05 100644
--- a/.locales/login.en_US.yml
+++ b/.locales/login.en_US.yml
@@ -3,5 +3,4 @@ en_US:
   register: Register
   forgot-login: Forgot login?
   username: Username
-  password: Password
   email: Email
diff --git a/.locales/login.zh_CN.yml b/.locales/login.zh_CN.yml
index fe9fa342..d0ad6235 100644
--- a/.locales/login.zh_CN.yml
+++ b/.locales/login.zh_CN.yml
@@ -3,5 +3,4 @@ zh_CN:
   register: 注册
   forgot-login: 忘记账号?
   username: 你的用户名
-  password: 你的密码
   email: 电子邮箱
diff --git a/.locales/profile.en_GB.yml b/.locales/profile.en_GB.yml
index 53ce3557..e0370f4e 100644
--- a/.locales/profile.en_GB.yml
+++ b/.locales/profile.en_GB.yml
@@ -7,3 +7,7 @@ en_GB:
   no-beatmaps-available: No beatmaps available
   statistics: Statistics
   recent-scores: Recent Scores
+  by: by
+  global-rank: Global Rank
+  country-rank: Country Rank
+  name-aka: name aka
diff --git a/.locales/profile.en_US.yml b/.locales/profile.en_US.yml
index 9bc61132..ed967bd7 100644
--- a/.locales/profile.en_US.yml
+++ b/.locales/profile.en_US.yml
@@ -7,3 +7,7 @@ en_US:
   no-beatmaps-available: No beatmaps available
   statistics: Statistics
   recent-scores: Recent Scores
+  by: by
+  country-rank: Country Rank
+  global-rank: Global Rank
+  name-aka: name aka
diff --git a/.locales/profile.zh_CN.yml b/.locales/profile.zh_CN.yml
index 6bfcf4f0..a83db250 100644
--- a/.locales/profile.zh_CN.yml
+++ b/.locales/profile.zh_CN.yml
@@ -7,3 +7,7 @@ zh_CN:
   no-beatmaps-available: 暂无有效铺面
   statistics: 数据统计
   recent-scores: 最近的成绩
+  by: 作者
+  country-rank: 国内排名
+  global-rank: 全球排名
+  name-aka: 别名
diff --git a/.locales/register.en_GB.yml b/.locales/register.en_GB.yml
index 51de046b..95cae89f 100644
--- a/.locales/register.en_GB.yml
+++ b/.locales/register.en_GB.yml
@@ -2,6 +2,17 @@ en_GB:
   registration: Registration
   register: register
   email: Email
-  password: Password
   already-have-an-account: Already have an account?
   username: Username
+  currently-disabled: Registrations are currently disabled.
+  captcha-failed: Captcha failed.
+  username-syntax-is-invalid: Invalid username syntax.
+  username-cannot-contains-both-dash-and-space: Username may contain "_" or " ", but not both.
+  username-disallowed: Disallowed username; pick another.
+  username-already-taken-by-others: Username already taken by another user.
+  email-is-invalid: Invalid email syntax.
+  email-already-taken: Email already taken by another user.
+  password:
+    must-between-8-32-characters-in-length: Password must be 8-32 characters in length.
+    must-have-more-than-3-unique-characters: Password must have more than 3 unique characters.
+    too-simple: That password was deemed too simple.
diff --git a/.locales/register.en_US.yml b/.locales/register.en_US.yml
index 4f5d9ea4..e646f7ec 100644
--- a/.locales/register.en_US.yml
+++ b/.locales/register.en_US.yml
@@ -2,6 +2,5 @@ en_US:
   registration: Registration
   register: register
   email: Email
-  password: Password
   already-have-an-account: Already have an account?
   username: Username
diff --git a/.locales/register.zh_CN.yml b/.locales/register.zh_CN.yml
index bc49fd8a..b9576860 100644
--- a/.locales/register.zh_CN.yml
+++ b/.locales/register.zh_CN.yml
@@ -2,7 +2,5 @@ zh_CN:
   registration: 注册
   register: 注册账号
   email: 电子邮箱
-  password: 密码
   already-have-an-account: 已经拥有账号了?
-  username: |
-    你的用户名
+  username: 你的用户名
diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
index fb6d5870..382a205e 100644
--- a/.locales/settings.en_GB.yml
+++ b/.locales/settings.en_GB.yml
@@ -11,12 +11,30 @@ en_GB:
   banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
   profile-background: Profile Background
   profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password: Password
   password-change: Password Change
   old-password: Old Password
   new-password: New Password
   repeat-password: Repeat Password
-  profile: Profile
+  profile:
+    no-changes-have-been-made: No changes have been made.
+    username-changes-supporter-only: Username changes are currently a supporter perk.
+    new-username-is-invalid: Your new username syntax is invalid.
+    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
+    new-username-disallowed: Your new username isn't allowed; pick another.
+    new-username-already-taken-by-others: Your new username already taken by another user.
+    new-email-is-invalid: Your new email syntax is invalid.
+    succeed-please-login-again: Your username/email have been changed! Please login again.
   user-information: User Infomation
   username: Username
   settings: Settings
+  bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
+  change-succeed: Your %{something} has been successfully changed!
+  no-image-was-selected: No image was selected!
+  customization: customization
+  password:
+    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
+    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
+    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
+    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
+    too-simple: Your new password was deemed too simple.
+    old-password-incorrect: Your old password is incorrect.
diff --git a/.locales/settings.en_US.yml b/.locales/settings.en_US.yml
index 1eb9c5e4..24bc13d8 100644
--- a/.locales/settings.en_US.yml
+++ b/.locales/settings.en_US.yml
@@ -11,12 +11,12 @@ en_US:
   banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
   profile-background: Profile Background
   profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password: Password
+  password: null
   password-change: Password Change
   old-password: Old Password
   new-password: New Password
   repeat-password: Repeat Password
-  profile: Profile
+  profile: null
   user-information: User Infomation
   username: Username
   settings: Settings
diff --git a/.locales/settings.zh_CN.yml b/.locales/settings.zh_CN.yml
index 87d35436..c59f822a 100644
--- a/.locales/settings.zh_CN.yml
+++ b/.locales/settings.zh_CN.yml
@@ -1,4 +1,5 @@
 zh_CN:
+  password: 密码
   avatar: 头像
   avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片.并且图片大小低于5MB
   choose-file: 选择一张图片
@@ -9,7 +10,6 @@ zh_CN:
   banner-description: 建议上传分辨率为 1440x262 的 GIF, PNG, JPG, JPEG 等四种格式的图片
   profile-background: 资料背景
   profile-background-description: 建议上传长宽比为 16:9  的 PNG, JPG, JPEG 格式的图片
-  password: 密码
   password-change: 更改密码
   old-password: 旧密码
   new-password: 新密码
diff --git a/blueprints/admin.py b/blueprints/admin.py
index a7585450..e2d41a95 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -20,10 +20,10 @@
 async def home():
     """Render the homepage of guweb's admin panel."""
     if not 'authenticated' in session:
-        return await flash('error', 'Please login first.', 'login')
+        return await flash('error', t('admin.please-login-in-first'), 'login')
 
     if not session['user_data']['is_staff']:
-        return await flash('error', f'You have insufficient privileges.', 'home')
+        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
 
     # fetch data from database
     dash_data = await glob.db.fetch(
diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index dc99ab1d..fa10548e 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -7,6 +7,7 @@
 import os
 import time
 
+
 from cmyui.logging import Ansi
 from cmyui.logging import log
 from functools import wraps
@@ -28,6 +29,8 @@
 
 import i18n
 
+
+
 VALID_MODES = frozenset({'std', 'taiko', 'catch', 'mania'})
 VALID_MODS = frozenset({'vn', 'rx', 'ap'})
 
@@ -37,7 +40,7 @@ def login_required(func):
     @wraps(func)
     async def wrapper(*args, **kwargs):
         if not session:
-            return await flash('error', 'You must be logged in to access that page.', 'login')
+            return await flash('error', t('global.you-must-be-logged-in-to-access-this-page'), 'login')
         return await func(*args, **kwargs)
     return wrapper
 
@@ -65,7 +68,7 @@ async def settings_profile_post():
     new_email = form.get('email', type=str)
 
     if new_name is None or new_email is None:
-        return await flash('error', 'Invalid parameters.', 'home')
+        return await flash('error', t('global.invalid-parameters'), 'home')
 
     old_name = session['user_data']['name']
     old_email = session['user_data']['email']
@@ -75,11 +78,11 @@ async def settings_profile_post():
         new_name == old_name and
         new_email == old_email
     ):
-        return await flash('error', 'No changes have been made.', 'settings/profile')
+        return await flash('error', t('settings.profile.no-changes-have-been-made'), 'settings/profile')
 
     if new_name != old_name:
         if not session['user_data']['is_donator']:
-            return await flash('error', 'Username changes are currently a supporter perk.', 'settings/profile')
+            return await flash('error', t('settings.profile.username-changes-supporter-only'), 'settings/profile')
 
         # Usernames must:
         # - be within 2-15 characters in length
@@ -87,16 +90,16 @@ async def settings_profile_post():
         # - not be in the config's `disallowed_names` list
         # - not already be taken by another player
         if not regexes.username.match(new_name):
-            return await flash('error', 'Your new username syntax is invalid.', 'settings/profile')
+            return await flash('error', t('settings.profile.new-username-is-invalid'), 'settings/profile')
 
         if '_' in new_name and ' ' in new_name:
-            return await flash('error', 'Your new username may contain "_" or " ", but not both.', 'settings/profile')
+            return await flash('error', t('settings.profile.new-username-cannot-contains-both-dash-and-space'), 'settings/profile')
 
         if new_name in glob.config.disallowed_names:
-            return await flash('error', "Your new username isn't allowed; pick another.", 'settings/profile')
+            return await flash('error', t("settings.profile.new-username-disallowed"), 'settings/profile')
 
         if await glob.db.fetch('SELECT 1 FROM users WHERE name = %s', [new_name]):
-            return await flash('error', 'Your new username already taken by another user.', 'settings/profile')
+            return await flash('error', t('settings.profile.new-username-already-taken-by-others'), 'settings/profile')
 
         safe_name = utils.get_safe_name(new_name)
 
@@ -113,10 +116,10 @@ async def settings_profile_post():
         # - match the regex `^[^@\s]{1,200}@[^@\s\.]{1,30}\.[^@\.\s]{1,24}$`
         # - not already be taken by another player
         if not regexes.email.match(new_email):
-            return await flash('error', 'Your new email syntax is invalid.', 'settings/profile')
+            return await flash('error', t('settings.profile.new-email-is-invalid'), 'settings/profile')
 
         if await glob.db.fetch('SELECT 1 FROM users WHERE email = %s', [new_email]):
-            return await flash('error', 'Your new email already taken by another user.', 'settings/profile')
+            return await flash('error', '', 'settings/profile')
 
         # email change successful
         await glob.db.execute(
@@ -129,7 +132,7 @@ async def settings_profile_post():
     # logout
     session.pop('authenticated', None)
     session.pop('user_data', None)
-    return await flash('success', 'Your username/email have been changed! Please login again.', 'login')
+    return await flash('success', t('settings.profile.succeed-please-login-again'), 'login')
 
 @frontend.route('/settings/avatar')
 @login_required
@@ -147,13 +150,13 @@ async def settings_avatar_post():
 
     # no file uploaded; deny post
     if avatar is None or not avatar.filename:
-        return await flash('error', 'No image was selected!', 'settings/avatar')
+        return await flash('error', t('settings.no-image-was-selected'), 'settings/avatar')
 
     filename, file_extension = os.path.splitext(avatar.filename.lower())
 
     # bad file extension; deny post
     if not file_extension in ALLOWED_EXTENSIONS:
-        return await flash('error', 'The image you select must be either a .JPG, .JPEG, or .PNG file!', 'settings/avatar')
+        return await flash('error', t('settings.bad-image-extension', something = t('settings.avatar').lower()), 'settings/avatar')
 
     # remove old avatars
     for fx in ALLOWED_EXTENSIONS:
@@ -166,7 +169,7 @@ async def settings_avatar_post():
     # avatar change success
     pilavatar = utils.crop_image(pilavatar)
     pilavatar.save(os.path.join(AVATARS_PATH, f'{session["user_data"]["id"]}{file_extension.lower()}'))
-    return await flash('success', 'Your avatar has been successfully changed!', 'settings/avatar')
+    return await flash('success', t('settings.change-succeed', something = t('settings.avatar').lower()), 'settings/avatar')
 
 @frontend.route('/settings/custom')
 @login_required
@@ -184,12 +187,12 @@ async def settings_custom_post():
 
     # no file uploaded; deny post
     if banner is None and background is None:
-        return await flash_with_customizations('error', 'No image was selected!', 'settings/custom')
+        return await flash_with_customizations('error', t('settings.no-image-was-selected'), 'settings/custom')
 
     if banner is not None and banner.filename:
         _, file_extension = os.path.splitext(banner.filename.lower())
         if not file_extension in ALLOWED_EXTENSIONS:
-            return await flash_with_customizations('error', f'The banner you select must be either a .JPG, .JPEG, .PNG or .GIF file!', 'settings/custom')
+            return await flash_with_customizations('error', t('settings.bad-image-extension', something = t('settings.banner').lower()), 'settings/custom')
 
         banner_file_no_ext = os.path.join(f'.data/banners', f'{session["user_data"]["id"]}')
 
@@ -204,7 +207,7 @@ async def settings_custom_post():
     if background is not None and background.filename:
         _, file_extension = os.path.splitext(background.filename.lower())
         if not file_extension in ALLOWED_EXTENSIONS:
-            return await flash_with_customizations('error', f'The background you select must be either a .JPG, .JPEG, .PNG or .GIF file!', 'settings/custom')
+            return await flash_with_customizations('error', t('settings.bad-image-extension', something = t('settings.background').lower()), 'settings/custom')
 
         background_file_no_ext = os.path.join(f'.data/backgrounds', f'{session["user_data"]["id"]}')
 
@@ -216,7 +219,7 @@ async def settings_custom_post():
 
         await background.save(f'{background_file_no_ext}{file_extension}')
 
-    return await flash_with_customizations('success', 'Your customisation has been successfully changed!', 'settings/custom')
+    return await flash_with_customizations('success', t('settings.change-succeed', something = t('settings.customization').lower()), 'settings/custom')
 
 
 @frontend.route('/settings/password')
@@ -234,24 +237,24 @@ async def settings_password_post():
 
     # new password and repeat password don't match; deny post
     if new_password != repeat_password:
-        return await flash('error', "Your new password doesn't match your repeated password!", 'settings/password')
+        return await flash('error', t("settings.password.new-passoword-mismatch-repeated-password"), 'settings/password')
 
     # new password and old password match; deny post
     if old_password == new_password:
-        return await flash('error', 'Your new password cannot be the same as your old password!', 'settings/password')
+        return await flash('error', t('settings.password.new-passoword-cannot-be-same-as-old-password'), 'settings/password')
 
     # Passwords must:
     # - be within 8-32 characters in length
     # - have more than 3 unique characters
     # - not be in the config's `disallowed_passwords` list
     if not 8 < len(new_password) <= 32:
-        return await flash('error', 'Your new password must be 8-32 characters in length.', 'settings/password')
+        return await flash('error', t('settings.password.must-between-8-32-characters-in-length'), 'settings/password')
 
     if len(set(new_password)) <= 3:
-        return await flash('error', 'Your new password must have more than 3 unique characters.', 'settings/password')
+        return await flash('error', t('settings.password.must-have-more-than-3-unique-characters'), 'settings/password')
 
     if new_password.lower() in glob.config.disallowed_passwords:
-        return await flash('error', 'Your new password was deemed too simple.', 'settings/password')
+        return await flash('error', t('settings.password.too-simple'), 'settings/password')
 
     # cache and other password related information
     bcrypt_cache = glob.cache['bcrypt']
@@ -270,12 +273,12 @@ async def settings_password_post():
         if pw_md5 != bcrypt_cache[pw_bcrypt]: # ~0.1ms
             if glob.config.debug:
                 log(f"{session['user_data']['name']}'s change pw failed - pw incorrect.", Ansi.LYELLOW)
-            return await flash('error', 'Your old password is incorrect.', 'settings/password')
+            return await flash('error', t('settings.password.old-password-incorrect'), 'settings/password')
     else: # ~200ms
         if not bcrypt.checkpw(pw_md5, pw_bcrypt):
             if glob.config.debug:
                 log(f"{session['user_data']['name']}'s change pw failed - pw incorrect.", Ansi.LYELLOW)
-            return await flash('error', 'Your old password is incorrect.', 'settings/password')
+            return await flash('error', t('settings.password.old-password-incorrect'), 'settings/password')
 
     # remove old password from cache
     if pw_bcrypt in bcrypt_cache:
@@ -297,7 +300,7 @@ async def settings_password_post():
     # logout
     session.pop('authenticated', None)
     session.pop('user_data', None)
-    return await flash('success', 'Your password has been changed! Please log in again.', 'login')
+    return await flash('success', t('settings.change-succeed', something = t('global.password')), 'login')
 
 
 @frontend.route('/u/<id>')
@@ -341,14 +344,14 @@ async def leaderboard(mode='std', sort='pp', mods='vn'):
 @frontend.route('/login')
 async def login():
     if 'authenticated' in session:
-        return await flash('error', "You're already logged in!", 'home')
+        return await flash('error', t("global.you-are-already-logged-in"), 'home')
 
     return await render_template('login.html')
 
 @frontend.route('/login', methods=['POST'])
 async def login_post():
     if 'authenticated' in session:
-        return await flash('error', "You're already logged in!", 'home')
+        return await flash('error', t("global.you-are-already-logged-in"), 'home')
 
     if glob.config.debug:
         login_time = time.time_ns()
@@ -358,7 +361,7 @@ async def login_post():
     passwd_txt = form.get('password', type=str)
 
     if username is None or passwd_txt is None:
-        return await flash('error', 'Invalid parameters.', 'home')
+        return await flash('error', t('global.invalid-parameters'), 'home')
 
     # check if account exists
     user_info = await glob.db.fetch(
@@ -374,7 +377,7 @@ async def login_post():
     if not user_info or user_info['id'] == 1:
         if glob.config.debug:
             log(f"{username}'s login failed - account doesn't exist.", Ansi.LYELLOW)
-        return await flash('error', 'Account does not exist.', 'login')
+        return await flash('error', t('login.account-does-not-exist'), 'login')
 
     # cache and other related password information
     bcrypt_cache = glob.cache['bcrypt']
@@ -387,12 +390,12 @@ async def login_post():
         if pw_md5 != bcrypt_cache[pw_bcrypt]: # ~0.1ms
             if glob.config.debug:
                 log(f"{username}'s login failed - pw incorrect.", Ansi.LYELLOW)
-            return await flash('error', 'Password is incorrect.', 'login')
+            return await flash('error', t('login.password-incorrect'), 'login')
     else: # ~200ms
         if not bcrypt.checkpw(pw_md5, pw_bcrypt):
             if glob.config.debug:
                 log(f"{username}'s login failed - pw incorrect.", Ansi.LYELLOW)
-            return await flash('error', 'Password is incorrect.', 'login')
+            return await flash('error', t('login.password-incorrect'), 'login')
 
         # login successful; cache password for next login
         bcrypt_cache[pw_bcrypt] = pw_md5
@@ -407,7 +410,7 @@ async def login_post():
     if not user_info['priv'] & Privileges.Normal:
         if glob.config.debug:
             log(f"{username}'s login failed - banned.", Ansi.RED)
-        return await flash('error', 'Your account is restricted. You are not allowed to log in.', 'login')
+        return await flash('error', t('login.restricted-not-allowed-to-login'), 'login')
 
     # login successful; store session data
     if glob.config.debug:
@@ -428,25 +431,25 @@ async def login_post():
         login_time = (time.time_ns() - login_time) / 1e6
         log(f'Login took {login_time:.2f}ms!', Ansi.LYELLOW)
 
-    return await flash('success', f'Hey, welcome back {username}!', 'home')
+    return await flash('success', t('login.welcome-back', username = username), 'home')
 
 @frontend.route('/register')
 async def register():
     if 'authenticated' in session:
-        return await flash('error', "You're already logged in.", 'home')
+        return await flash('error', t("global.you-are-already-logged-in"), 'home')
 
     if not glob.config.registration:
-        return await flash('error', 'Registrations are currently disabled.', 'home')
+        return await flash('error', t('register.currently-disabled'), 'home')
 
     return await render_template('register.html')
 
 @frontend.route('/register', methods=['POST'])
 async def register_post():
     if 'authenticated' in session:
-        return await flash('error', "You're already logged in.", 'home')
+        return await flash('error', t("global.you-are-already-logged-in"), 'home')
 
     if not glob.config.registration:
-        return await flash('error', 'Registrations are currently disabled.', 'home')
+        return await flash('error', t('register.currently-disabled'), 'home')
 
     form = await request.form
     username = form.get('username', type=str)
@@ -454,7 +457,7 @@ async def register_post():
     passwd_txt = form.get('password', type=str)
 
     if username is None or email is None or passwd_txt is None:
-        return await flash('error', 'Invalid parameters.', 'home')
+        return await flash('error', t('global.invalid-parameters'), 'home')
 
     if glob.config.hCaptcha_sitekey != 'changeme':
         captcha_data = form.get('h-captcha-response', type=str)
@@ -462,7 +465,7 @@ async def register_post():
             captcha_data is None or
             not await utils.validate_captcha(captcha_data)
         ):
-            return await flash('error', 'Captcha failed.', 'register')
+            return await flash('error', t('register.captcha-failed'), 'register')
 
     # Usernames must:
     # - be within 2-15 characters in length
@@ -471,38 +474,38 @@ async def register_post():
     # - not already be taken by another player
     # check if username exists
     if not regexes.username.match(username):
-        return await flash('error', 'Invalid username syntax.', 'register')
+        return await flash('error', t('register.username-syntax-is-invalid'), 'register')
 
     if '_' in username and ' ' in username:
-        return await flash('error', 'Username may contain "_" or " ", but not both.', 'register')
+        return await flash('error', t('register.username-cannot-contains-both-dash-and-space'), 'register')
 
     if username in glob.config.disallowed_names:
-        return await flash('error', 'Disallowed username; pick another.', 'register')
+        return await flash('error', t("register.username-disallowed"), 'register')
 
     if await glob.db.fetch('SELECT 1 FROM users WHERE name = %s', username):
-        return await flash('error', 'Username already taken by another user.', 'register')
+        return await flash('error', t('register.username-already-taken-by-others'), 'register')
 
     # Emails must:
     # - match the regex `^[^@\s]{1,200}@[^@\s\.]{1,30}\.[^@\.\s]{1,24}$`
     # - not already be taken by another player
     if not regexes.email.match(email):
-        return await flash('error', 'Invalid email syntax.', 'register')
+        return await flash('error', t('register.email-is-invalid'), 'register')
 
     if await glob.db.fetch('SELECT 1 FROM users WHERE email = %s', email):
-        return await flash('error', 'Email already taken by another user.', 'register')
+        return await flash('error', t('register.email-already-taken'), 'register')
 
     # Passwords must:
     # - be within 8-32 characters in length
     # - have more than 3 unique characters
     # - not be in the config's `disallowed_passwords` list
     if not 8 <= len(passwd_txt) <= 32:
-        return await flash('error', 'Password must be 8-32 characters in length.', 'register')
+        return await flash('error', t('register.password.must-between-8-32-characters-in-length'), 'register')
 
     if len(set(passwd_txt)) <= 3:
-        return await flash('error', 'Password must have more than 3 unique characters.', 'register')
+        return await flash('error', t('register.password.must-have-more-than-3-unique-characters'), 'register')
 
     if passwd_txt.lower() in glob.config.disallowed_passwords:
-        return await flash('error', 'That password was deemed too simple.', 'register')
+        return await flash('error', t('register.password.too-simple'), 'register')
 
     # TODO: add correct locking
     # (start of lock)
@@ -559,7 +562,7 @@ async def register_post():
 @frontend.route('/logout')
 async def logout():
     if 'authenticated' not in session:
-        return await flash('error', "You can't logout if you aren't logged in!", 'login')
+        return await flash('error', t("logout.cannot-logout-if-not-logged-in"), 'login')
 
     if glob.config.debug:
         log(f'{session["user_data"]["name"]} logged out.', Ansi.LGREEN)
@@ -569,8 +572,32 @@ async def logout():
     session.pop('user_data', None)
 
     # render login
-    return await flash('success', 'Successfully logged out!', 'login')
+    return await flash('success', t('logout.succeed'), 'login')
+
+# social media redirections
+
+@frontend.route('/github')
+@frontend.route('/gh')
+async def github_redirect():
+    return redirect(glob.config.github)
+
+@frontend.route('/discord')
+async def discord_redirect():
+    return redirect(glob.config.discord_server)
+
+@frontend.route('/youtube')
+@frontend.route('/yt')
+async def youtube_redirect():
+    return redirect(glob.config.youtube)
+
+@frontend.route('/twitter')
+async def twitter_redirect():
+    return redirect(glob.config.twitter)
 
+@frontend.route('/instagram')
+@frontend.route('/ig')
+async def instagram_redirect():
+    return redirect(glob.config.instagram)
 
 # profile customisation
 BANNERS_PATH = Path.cwd() / '.data/banners'
diff --git a/locales/404/en-GB.yml b/locales/404/en-GB.yml
index 7cc2f30a..3740fb1e 100644
--- a/locales/404/en-GB.yml
+++ b/locales/404/en-GB.yml
@@ -1,3 +1,4 @@
+'404': '404'
 page-not-found: Page not found
 where-am-i: Where am I?
 check-url: Check that the URL you entered is correct.
diff --git a/locales/404/en-US.yml b/locales/404/en-US.yml
index 7cc2f30a..3740fb1e 100644
--- a/locales/404/en-US.yml
+++ b/locales/404/en-US.yml
@@ -1,3 +1,4 @@
+'404': '404'
 page-not-found: Page not found
 where-am-i: Where am I?
 check-url: Check that the URL you entered is correct.
diff --git a/locales/404/zh-CN.yml b/locales/404/zh-CN.yml
index aeedcdbb..4c197ec1 100644
--- a/locales/404/zh-CN.yml
+++ b/locales/404/zh-CN.yml
@@ -1,4 +1,5 @@
-page-not-found: 404 查无此页
+'404': '404'
+page-not-found: 找不到页面
 where-am-i: 我是谁 我在哪 我在干什么?
 check-url: 请检查下你输入的链接是否正确。
 make-sure-visit: 或者确保你想访问的地方没有在维护中!
diff --git a/locales/admin/base/en-US.yml b/locales/admin/base/en-US.yml
index f473d69e..5fe3f095 100644
--- a/locales/admin/base/en-US.yml
+++ b/locales/admin/base/en-US.yml
@@ -4,3 +4,6 @@ welcome-to-admin-panel: Welcome to %{appName} admin panel!
 discord: Discord
 admin-panel: '%{appName} Admin Panel'
 instagram: Instagram
+github: GitHub
+twitter: Twitter
+youtube: YouTube
diff --git a/locales/admin/base/zh-CN.yml b/locales/admin/base/zh-CN.yml
index f473d69e..835803bf 100644
--- a/locales/admin/base/zh-CN.yml
+++ b/locales/admin/base/zh-CN.yml
@@ -1,6 +1,9 @@
-admin: Admin
-dashboard: Dashboard
-welcome-to-admin-panel: Welcome to %{appName} admin panel!
+admin: 管理员
+dashboard: 控制面板
+welcome-to-admin-panel: 欢迎来到 %{appName} 管理面板!
 discord: Discord
-admin-panel: '%{appName} Admin Panel'
+admin-panel: '%{appName} 管理员面板'
 instagram: Instagram
+github: GitHub
+twitter: 推特
+youtube: YouTube
diff --git a/locales/admin/home/en-GB.yml b/locales/admin/home/en-GB.yml
index d3fe3048..ca838172 100644
--- a/locales/admin/home/en-GB.yml
+++ b/locales/admin/home/en-GB.yml
@@ -1,3 +1,10 @@
 total-users: total users
 that-s-a-lot-of-people: that's a lot of people!
 total-online: total online
+rising-in-popularity-aren-t-we: rising in popularity are we?
+latest-and-greatest-welcome: latest and greatest! welcome!
+latest-user: latest user
+total-banned: total banned
+naughty-sad-face: naughty naughty :(
+recent-users: Recent Users
+recent-score: Recent Score
diff --git a/locales/admin/home/en-US.yml b/locales/admin/home/en-US.yml
index dab3e7a9..e6edf886 100644
--- a/locales/admin/home/en-US.yml
+++ b/locales/admin/home/en-US.yml
@@ -1 +1,10 @@
 that-s-a-lot-of-people: that's a lot of people!
+total-users: total users
+total-online: total online
+latest-and-greatest-welcome: latest and greatest! welcome!
+latest-user: latest user
+naughty-sad-face: naughty naughty :(
+recent-score: Recent Score
+recent-users: Recent Users
+rising-in-popularity-aren-t-we: rising in popularity are we?
+total-banned: total banned
diff --git a/locales/admin/home/zh-CN.yml b/locales/admin/home/zh-CN.yml
index dab3e7a9..4d50149a 100644
--- a/locales/admin/home/zh-CN.yml
+++ b/locales/admin/home/zh-CN.yml
@@ -1 +1,10 @@
-that-s-a-lot-of-people: that's a lot of people!
+that-s-a-lot-of-people: 好多人！
+total-users: 总用户
+total-online: 总在线
+latest-and-greatest-welcome: 最新最热！欢迎！
+latest-user: 最新用户
+naughty-sad-face: 坏坏 :(
+recent-score: 最近成绩
+recent-users: 最新用户
+rising-in-popularity-aren-t-we: 要火了咱们？
+total-banned: 总被ban
diff --git a/locales/global/en-GB.yml b/locales/global/en-GB.yml
index be6998b6..54243eeb 100644
--- a/locales/global/en-GB.yml
+++ b/locales/global/en-GB.yml
@@ -6,8 +6,39 @@ leaderboard: Leaderboard
 login: Login
 profile: Profile
 register: Register
+password: Password
 warning: Warning
 notice: Notice
-uh-oh-be-careful: uh oh! Be careful!
-hey-listen: Hey! Listen!
+error: uh oh! Be careful!
+success: Hey! Listen!
 verify: Verify
+pp: pp
+accuracy: Accuracy
+score: Score
+acc: Acc
+playcount: Play Count
+playtime: Play Time
+max-combo: Max Combo
+mode:
+  vanilla: Vanilla
+  relax: Relax
+  autopilot: Autopilot
+  taiko: osu!taiko
+  osu: osu!
+  catch: osu!catch
+  mania: osu!mania
+  VN: VN
+  RX: RX
+  AP: AP
+ranked-score: Ranked score
+total-score: Total Score
+rank:
+  ss: SS
+  ssh: SS
+  s: S
+  sh: S
+  a: A
+# server literals
+you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
+invalid-parameters: Invalid parameters.
+you-are-already-logged-in: You're already logged in!
diff --git a/locales/global/en-US.yml b/locales/global/en-US.yml
index 94b343de..bcdbfc34 100644
--- a/locales/global/en-US.yml
+++ b/locales/global/en-US.yml
@@ -8,6 +8,36 @@ profile: Profile
 register: Register
 notice: Notice
 warning: Warning
-uh-oh-be-careful: uh oh! Be careful!
-hey-listen: Hey! Listen!
+error: uh oh! Be careful!
+success: Hey! Listen!
 verify: Verify
+acc: Acc
+accuracy: Accuracy
+max-combo: Max Combo
+mode:
+  AP: AP
+  RX: RX
+  VN: VN
+  autopilot: Autopilot
+  catch: osu!catch
+  mania: osu!mania
+  osu: osu!
+  relax: Relax
+  taiko: osu!taiko
+  vanilla: Vanilla
+playcount: Play Count
+playtime: Play Time
+pp: pp
+rank:
+  a: A
+  s: S
+  sh: S
+  ss: SS
+  ssh: SS
+ranked-score: Ranked score
+score: Score
+total-score: Total Score
+password: Password
+invalid-parameters: Invalid parameters.
+you-are-already-logged-in: You're already logged in!
+you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
diff --git a/locales/global/zh-CN.yml b/locales/global/zh-CN.yml
index d0b695d9..8ea42dfe 100644
--- a/locales/global/zh-CN.yml
+++ b/locales/global/zh-CN.yml
@@ -2,12 +2,42 @@ sign-up: 注册
 log-in: 登录
 offline: 离线
 online: 在线
-leaderboard: 排行榜2
-login: Login
+leaderboard: 排行榜
+login: 登录
 profile: Profile
-register: Register
+register: 注册
 notice: Notice
-warning: Warning
-uh-oh-be-careful: uh oh! Be careful!
-hey-listen: Hey! Listen!
-verify: Verify
+warning: 注意
+error: uh oh! Be careful!
+success: Hey! Listen!
+verify: 验证
+acc: Acc
+accuracy: 准确度
+max-combo: 最大连击
+mode:
+  AP: AP
+  RX: RX
+  VN: VN
+  autopilot: Autopilot
+  catch: osu!接水果
+  mania: osu!面条
+  osu: osu!
+  relax: Relax
+  taiko: osu!太鼓
+  vanilla: Vanilla
+playcount: 游玩次数
+playtime: 游玩时间
+pp: pp
+rank:
+  a: A
+  s: S
+  sh: S
+  ss: SS
+  ssh: SS
+score: 分数
+total-score: 总分
+ranked-score: 记分总分
+password: 密码
+invalid-parameters: 请输入用户名密码以及邮箱
+you-are-already-logged-in: 你已经登录啦!
+you-must-be-logged-in-to-access-this-page: 你必须登录了才能访问该页面
diff --git a/locales/home/en-GB.yml b/locales/home/en-GB.yml
index a1823e8c..f03cf7d6 100644
--- a/locales/home/en-GB.yml
+++ b/locales/home/en-GB.yml
@@ -2,30 +2,19 @@ warning: Warning
 notice: Notice
 error: Uh oh! Be careful!
 success: Hey! Listen!
-subtitle-big: >-
-  We are an osu! private server built from the ground up with many unique
-  features not seen elsewhere - for more information, check out gulag and guweb
-  on GitHub - we're fully open source!
+subtitle-big: |-
+  We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
 some-of-our-coolest-features: Some of our coolest features
 features-title-1: PP for Relax and Autopilot
-features-content-1: >-
-  Our server has unique pp formula for relax and autopilot.Good at waving your
-  cursor or just smashing your keyboard? Join %{appName} and get a fair reward
-  foryour skills!
+features-content-1: |-
+  Our server has unique pp formula for relax and autopilot.Good at waving your cursor or just smashing your keyboard? Join %{appName} and get a fair reward foryour skills!
 features-title-2: Free osu!direct
-features-content-2: >-
-  You won't have to pay for osu!supporter to have a convenient gameplay
-  experience in the client - osu!direct is available for everyone! Keep in mind
-  supporting us still grants a huge set of cool perks but absense of it doesn't
-  affect your game sessions!
+features-content-2: |-
+  You won't have to pay for osu!supporter to have a convenient gameplay experience in the client - osu!direct is available for everyone! Keep in mind supporting us still grants a huge set of cool perks but absense of it doesn't affect your game sessions!
 features-title-3: Flexible library
-features-content-3: >-
-  We're written on top of cmyui's multipurpose library allowing for a fully
-  asynchronous environment, both improving performance and the user's experience
-  in the long term!
+features-content-3: |-
+  We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
 what-are-you-waiting-for: What are you waiting for?
-subtitle: >-
-  Join %{appName}! It's risk-free! You won't get your account banned on official
-  servers if you play here with us! And don't worry, as you can always switch
-  between the official servers and us at any time!
+subtitle: |-
+  Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
 sign-up-for-free: Sign up for free
diff --git a/locales/home/en-US.yml b/locales/home/en-US.yml
index 94410f05..185502a8 100644
--- a/locales/home/en-US.yml
+++ b/locales/home/en-US.yml
@@ -1,29 +1,18 @@
-subtitle-big: >-
-  We are an osu! private server built from the ground up with many unique
-  features not seen elsewhere - for more information, check out gulag and guweb
-  on GitHub - we're fully open source!
+subtitle-big: |-
+  We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
 some-of-our-coolest-features: Some of our coolest features
 features-title-1: PP for Relax and Autopilot
-features-content-1: >-
-  Our server has unique pp formula for relax and autopilot.Good at waving your
-  cursor or just smashing your keyboard? Join %{appName} and get a fair reward
-  foryour skills!
+features-content-1: |-
+  Our server has unique pp formula for relax and autopilot.Good at waving your cursor or just smashing your keyboard? Join %{appName} and get a fair reward foryour skills!
 features-title-2: Free osu!direct
-features-content-2: >-
-  You won't have to pay for osu!supporter to have a convenient gameplay
-  experience in the client - osu!direct is available for everyone! Keep in mind
-  supporting us still grants a huge set of cool perks but absense of it doesn't
-  affect your game sessions!
+features-content-2: |-
+  You won't have to pay for osu!supporter to have a convenient gameplay experience in the client - osu!direct is available for everyone! Keep in mind supporting us still grants a huge set of cool perks but absense of it doesn't affect your game sessions!
 features-title-3: Flexible library
-features-content-3: >-
-  We're written on top of cmyui's multipurpose library allowing for a fully
-  asynchronous environment, both improving performance and the user's experience
-  in the long term!
+features-content-3: |-
+  We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
 what-are-you-waiting-for: What are you waiting for?
-subtitle: >-
-  Join %{appName}! It's risk-free! You won't get your account banned on official
-  servers if you play here with us! And don't worry, as you can always switch
-  between the official servers and us at any time!
+subtitle: |-
+  Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
 sign-up-for-free: Sign up for free
 error: Uh oh! Be careful!
 success: Hey! Listen!
diff --git a/locales/home/zh-CN.yml b/locales/home/zh-CN.yml
index 3d8e0ecd..2707a623 100644
--- a/locales/home/zh-CN.yml
+++ b/locales/home/zh-CN.yml
@@ -1,25 +1,18 @@
-subtitle-big: >-
-  欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜,
-  以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段,
-  如出现问题或有改进建议, 欢迎与我们联系与沟通.
+subtitle-big: |-
+  欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
 some-of-our-coolest-features: 我们觉得最酷的一些功能
 features-title-1: 对Relax 和 Autopilot mod的PP计算
-features-content-1: >-
-  我们的服务器针对RX和AP有专门的PP计算算法。有超高的AIM移动能力但是左手无力？又或者左手超强的手速speed却不会移动AIM? 在
-  %{appName} 当中都可以完美发挥你的强项。
+features-content-1: |-
+  我们的服务器针对RX和AP有专门的PP计算算法。有超高的AIM移动能力但是左手无力？又或者左手超强的手速speed却不会移动AIM? 在 %{appName} 当中都可以完美发挥你的强项。
 features-title-2: 免费的 osu!direct 服务
-features-content-2: >-
-  你不用特意成为 osu!supporter 以此来提高你在客户端下图方面的体验。osu!direct 对所有人开放(并且使用的是国内的sayo镜像站)!
-  虽然如此,如果你愿意支持我们,你仍然可以获得一些超酷的特权。只不过这些特权并不会影响到你的game sessions!
+features-content-2: |-
+  你不用特意成为 osu!supporter 以此来提高你在客户端下图方面的体验。osu!direct 对所有人开放(并且使用的是国内的sayo镜像站)! 虽然如此,如果你愿意支持我们,你仍然可以获得一些超酷的特权。只不过这些特权并不会影响到你的game sessions!
 features-title-3: Flexible library
-features-content-3: >-
-  We're written on top of cmyui's multipurpose library allowing for a fully
-  asynchronous environment, both improving performance and the user's experience
-  in the long term!
+features-content-3: |-
+  We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
 what-are-you-waiting-for: 你 还 在 等 什 么?
-subtitle: >-
-  赶紧加入到 %{appName} 当中吧! 没有风险!
-  并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
+subtitle: |-
+  赶紧加入到 %{appName} 当中吧! 没有风险! 并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
 sign-up-for-free: 免 费 注 册！
 error: Uh oh! Be careful!
 success: Hey! Listen!
diff --git a/locales/login/en-GB.yml b/locales/login/en-GB.yml
index 7ea8f054..0643ce7c 100644
--- a/locales/login/en-GB.yml
+++ b/locales/login/en-GB.yml
@@ -2,5 +2,8 @@ dont-have-an-account: Don't have an account?
 register: Register
 forgot-login: Forgot login?
 username: Username
-password: Password
 email: Email
+password-incorrect: Password is incorrect.
+restricted-not-allowed-to-login: Your account is restricted. You are not allowed to log in.
+welcome-back: Hey, welcome back %{username}!
+account-does-not-exist: Account does not exist.
diff --git a/locales/login/en-US.yml b/locales/login/en-US.yml
index 7ea8f054..1329564a 100644
--- a/locales/login/en-US.yml
+++ b/locales/login/en-US.yml
@@ -2,5 +2,8 @@ dont-have-an-account: Don't have an account?
 register: Register
 forgot-login: Forgot login?
 username: Username
-password: Password
 email: Email
+password-incorrect: Password is incorrect.
+restricted-not-allowed-to-login: Your account is restricted. You are not allowed to log in.
+account-does-not-exist: Account does not exist.
+welcome-back: Hey, welcome back %{username}!
diff --git a/locales/login/zh-CN.yml b/locales/login/zh-CN.yml
index ef59445c..3e2021fc 100644
--- a/locales/login/zh-CN.yml
+++ b/locales/login/zh-CN.yml
@@ -2,5 +2,8 @@ dont-have-an-account: 还未拥有一个账号？
 register: 注册
 forgot-login: 忘记账号?
 username: 你的用户名
-password: 你的密码
 email: 电子邮箱
+password-incorrect: 密码错误
+restricted-not-allowed-to-login: 你的账号被封禁了,因此我们不允许你登录
+account-does-not-exist: 该账号并不存在
+welcome-back: 欢迎回来 %{username}!
diff --git a/locales/navbar/zh-CN.yml b/locales/navbar/zh-CN.yml
index 6107aac8..929d9e2d 100644
--- a/locales/navbar/zh-CN.yml
+++ b/locales/navbar/zh-CN.yml
@@ -1,7 +1,7 @@
 home: 主页
 leaderboards: 排行榜
 information: Information
-admin: Admin
+admin: 管理员
 profile: 玩家资料
 settings: 设置
 logout: 登出
diff --git a/locales/profile/en-GB.yml b/locales/profile/en-GB.yml
index ea0c45a8..171763f2 100644
--- a/locales/profile/en-GB.yml
+++ b/locales/profile/en-GB.yml
@@ -6,3 +6,7 @@ most-played-beatmaps: Most Played Beatmaps
 no-beatmaps-available: No beatmaps available
 statistics: Statistics
 recent-scores: Recent Scores
+by: by
+global-rank: Global Rank
+country-rank: Country Rank
+name-aka: name aka
diff --git a/locales/profile/en-US.yml b/locales/profile/en-US.yml
index ea0c45a8..0459c1d1 100644
--- a/locales/profile/en-US.yml
+++ b/locales/profile/en-US.yml
@@ -6,3 +6,7 @@ most-played-beatmaps: Most Played Beatmaps
 no-beatmaps-available: No beatmaps available
 statistics: Statistics
 recent-scores: Recent Scores
+by: by
+country-rank: Country Rank
+global-rank: Global Rank
+name-aka: name aka
diff --git a/locales/profile/zh-CN.yml b/locales/profile/zh-CN.yml
index ccbe0a58..e45592ef 100644
--- a/locales/profile/zh-CN.yml
+++ b/locales/profile/zh-CN.yml
@@ -6,3 +6,7 @@ most-played-beatmaps: 游玩最多的铺面
 no-beatmaps-available: 暂无有效铺面
 statistics: 数据统计
 recent-scores: 最近的成绩
+by: 作者
+country-rank: 国内排名
+global-rank: 全球排名
+name-aka: 别名
diff --git a/locales/register/en-GB.yml b/locales/register/en-GB.yml
index 3aa8a758..88aa703a 100644
--- a/locales/register/en-GB.yml
+++ b/locales/register/en-GB.yml
@@ -1,6 +1,18 @@
 registration: Registration
 register: register
 email: Email
-password: Password
 already-have-an-account: Already have an account?
 username: Username
+# server literals
+currently-disabled: Registrations are currently disabled.
+captcha-failed: Captcha failed.
+username-syntax-is-invalid: Invalid username syntax.
+username-cannot-contains-both-dash-and-space: Username may contain "_" or " ", but not both.
+username-disallowed: Disallowed username; pick another.
+username-already-taken-by-others: Username already taken by another user.
+email-is-invalid: Invalid email syntax.
+email-already-taken: Email already taken by another user.
+password:
+  must-between-8-32-characters-in-length: Password must be 8-32 characters in length.
+  must-have-more-than-3-unique-characters: Password must have more than 3 unique characters.
+  too-simple: That password was deemed too simple.
diff --git a/locales/register/en-US.yml b/locales/register/en-US.yml
index 3aa8a758..5287eb74 100644
--- a/locales/register/en-US.yml
+++ b/locales/register/en-US.yml
@@ -1,6 +1,17 @@
 registration: Registration
 register: register
 email: Email
-password: Password
 already-have-an-account: Already have an account?
 username: Username
+captcha-failed: Captcha failed.
+currently-disabled: Registrations are currently disabled.
+email-already-taken: Email already taken by another user.
+email-is-invalid: Invalid email syntax.
+password:
+  must-have-more-than-3-unique-characters: Password must have more than 3 unique characters.
+  too-simple: That password was deemed too simple.
+  must-between-8-32-characters-in-length: Password must be 8-32 characters in length.
+username-cannot-contains-both-dash-and-space: Username may contain "_" or " ", but not both.
+username-already-taken-by-others: Username already taken by another user.
+username-disallowed: Disallowed username; pick another.
+username-syntax-is-invalid: Invalid username syntax.
diff --git a/locales/register/zh-CN.yml b/locales/register/zh-CN.yml
index 724cda1b..20384e0c 100644
--- a/locales/register/zh-CN.yml
+++ b/locales/register/zh-CN.yml
@@ -1,7 +1,17 @@
 registration: 注册
 register: 注册账号
 email: 电子邮箱
-password: 密码
 already-have-an-account: 已经拥有账号了?
-username: |
-  你的用户名
+username: 你的用户名
+captcha-failed: Captcha failed.
+currently-disabled: 注册功能目前正在禁用中
+email-already-taken: 该电子邮箱已经被其他用户注册过了
+email-is-invalid: 无效的邮箱格式
+password:
+  must-have-more-than-3-unique-characters: 密码必须包含三个以上的特殊字符
+  too-simple: 这个密码看上去太简单了
+  must-between-8-32-characters-in-length: 密码的长度只能是8到32个字符之内
+username-cannot-contains-both-dash-and-space: 用户名不能同时存在"_"和" "(空格)符号
+username-already-taken-by-others: 该用户名已经被其他用户使用了
+username-disallowed: 该用户名不允许被使用,请选择别的
+username-syntax-is-invalid: 无效的用户名格式
diff --git a/locales/verify/en-GB.yml b/locales/verify/en-GB.yml
index 06060fa0..c452b20a 100644
--- a/locales/verify/en-GB.yml
+++ b/locales/verify/en-GB.yml
@@ -11,9 +11,8 @@ add-domain: Add -devserver %{domain} at the end of it
 login-to-your-account: Login to your account
 login-to-your-app-name-account: Login to your %{appName} account and you should be done!
 oh-crap-i-am-stuck: Oh crap! I'm stuck please help me!
-need-help-join-discord-server: >-
-  Need help? We've got you covered - join the Discord so our community can help
-  you out!
+need-help-join-discord-server: |-
+  Need help? We've got you covered - join the Discord so our community can help you out!
 click-here-to-join-our-discord: Click here to join our Discord!
 waiting-for-verification: Waiting for verification!
 follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
diff --git a/locales/verify/en-US.yml b/locales/verify/en-US.yml
index 06060fa0..c452b20a 100644
--- a/locales/verify/en-US.yml
+++ b/locales/verify/en-US.yml
@@ -11,9 +11,8 @@ add-domain: Add -devserver %{domain} at the end of it
 login-to-your-account: Login to your account
 login-to-your-app-name-account: Login to your %{appName} account and you should be done!
 oh-crap-i-am-stuck: Oh crap! I'm stuck please help me!
-need-help-join-discord-server: >-
-  Need help? We've got you covered - join the Discord so our community can help
-  you out!
+need-help-join-discord-server: |-
+  Need help? We've got you covered - join the Discord so our community can help you out!
 click-here-to-join-our-discord: Click here to join our Discord!
 waiting-for-verification: Waiting for verification!
 follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
diff --git a/locales/verify/zh-CN.yml b/locales/verify/zh-CN.yml
index f4d76542..229085a2 100644
--- a/locales/verify/zh-CN.yml
+++ b/locales/verify/zh-CN.yml
@@ -4,7 +4,7 @@ what-do-you-mean-this-must-be-easy-right: 别想太复杂, 肯定很简单拉~
 follow-these-three-simple-steps: 跟随以下三个简单的步骤即可游玩 %{appName} 了!
 osu-shortcut: Osu! 快捷方式
 find-your-shortcut: 在桌面上寻找你的osu!快捷方式并复制一份 (如果没有，可以去osu!目录里创建一份)
-edit-it: Edit it
+edit-it: 修改属性
 right-click-properties: 右键快捷方式,在菜单中找到 "属性" 选项,(一般在最下边)
 find-target-element-box: 找到 "目标" 这一行
 add-domain: 在文本的末尾添加 -devserver %{domain}
diff --git a/templates/404.html b/templates/404.html
index 0a2e7dd4..168146a2 100644
--- a/templates/404.html
+++ b/templates/404.html
@@ -9,7 +9,7 @@
 {% block content %}
 <div class="main-block">
 	<div class="title-block">
-		<span>404</span>
+		<span>{{ t('404.404') }}</span>
 		<h2 class="error-title">
             {{ t('404.page-not-found') }}
 		</h2>
diff --git a/templates/admin/home.html b/templates/admin/home.html
index 82a43ace..203f6f69 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -15,7 +15,7 @@
     <div class="columns is-marginless is-paddingless">
         <div class="column is-paddingless p-3">
             <div class="card">
-                <div class="title">{{ ('admin.home.total-users') }}</div>
+                <div class="title">{{ t('admin.home.total-users') }}</div>
                 <i class="fa fa-users"></i>
                 <div class="value">{{ dashdata['count'] }}</div>
                 <div class="stat">{{ t('admin.home.that-s-a-lot-of-people') }}</div>
@@ -28,23 +28,23 @@
                 <div class="value">
                     <% online_users %>
                 </div>
-                <div class="stat">rising in popularity are we?</div>
+                <div class="stat">{{ t('admin.home.rising-in-popularity-aren-t-we') }}</div>
             </div>
         </div>
         <div class="column is-paddingless p-3">
             <div class="card">
-                <div class="title">lastest user</div>
+                <div class="title">{{ t('admin.home.latest-user') }}</div>
                 <i class="fa fa-book"></i>
                 <div class="value">{{ dashdata['lastest_user'] }}</div>
-                <div class="stat">latest and greatest! welcome!</div>
+                <div class="stat">{{ t('admin.home.latest-and-greatest-welcome') }}</div>
             </div>
         </div>
         <div class="column is-paddingless p-3">
             <div class="card">
-                <div class="title">total banned</div>
+                <div class="title">{{ t('admin.home.total-banned') }}</div>
                 <i class="fa fa-calendar"></i>
                 <div class="value">{{ dashdata['banned'] }}</div>
-                <div class="stat">naughty naughty :(</div>
+                <div class="stat">{{ t('admin.home.naughty-sad-face') }}</div>
             </div>
         </div>
     </div>
@@ -54,7 +54,7 @@
         <div class="recent-beat">
             <div class="columns is-marginless">
                 <div class="column is-paddingless flex-vcenter">
-                    <h2 class="section-title">Recent Users</h2>
+                    <h2 class="section-title">{{ t('admin.home.recent-users') }}</h2>
                 </div>
             </div>
             <div class="blockdata">
@@ -93,7 +93,7 @@ <h2 class="section-title">Recent Users</h2>
         <div class="recent-beat">
             <div class="columns is-marginless">
                 <div class="column is-paddingless flex-vcenter">
-                    <h2 class="section-title">Recent Score</h2>
+                    <h2 class="section-title">{{ t('admin.home.recent-score') }}</h2>
                 </div>
             </div>
             <div class="blockdata">
@@ -119,8 +119,8 @@ <h2 class="section-title">Recent Score</h2>
                             <div class="score-details_right-block">
                                 <div class="score-details_pp-block">
                                     <div class="map-pp">
-                                        {{ maps.pp }}<span class="map-pp-unit">pp</span></div>
-                                    <div class="map-acc">accuracy:&nbsp;<b>
+                                        {{ maps.pp }}<span class="map-pp-unit">{{ t('global.pp').upper() }}</span></div>
+                                    <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
                                         {{ maps.acc }}%
                                         </b></div>
                                 </div>
diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index 016ac6e7..1d79d5f5 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -27,7 +27,7 @@
                 </a>
                 <div class="navbar-dropdown">
                     <a class="navbar-item">
-                        {{t("navbar.todo")}}
+                        {{ t('navbar.todo') }}
                     </a>
                 </div>
             </div>
@@ -65,16 +65,16 @@
                 </a>
                 <div class="navbar-dropdown">
                     <a class="navbar-item" href="/u/{{ session.user_data['id'] }}">
-                        {{t("navbar.profile")}}
+                        {{ t('navbar.profile') }}
                     </a>
                     <a class="navbar-item" href="/settings">
-                        {{t("navbar.settings")}}
+                        {{ t('navbar.settings') }}
                     </a>
                 </div>
             </div>
             <div class="navbar-item">
                 <a class="button is-light" href="/logout">
-                    {{t("navbar.logout")}}
+                    {{ t('navbar.logout') }}
                 </a>
             </div>
             {% else %}
diff --git a/templates/home.html b/templates/home.html
index 27df86c8..61d1fefe 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -2,7 +2,7 @@
 {% block title %} Home {% endblock %}
 
 {% block header %}
-<link rel="stylesheet" href="/static/css/pages/home.css?v={{ rand() }}">
+<link rel="stylesheet" href="/static/css/pages/home.css">
 {% endblock %}
 
 {% block content %}
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index 9071c8ea..3cf306a1 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -21,42 +21,42 @@
         <div class="main-selector">
             <a class="mode-select" v-bind:class="{ 'active': mode === 'std' }"
             @click="LoadLeaderboard(sort, 'std', mods)">
-                <i class="mode-icon mode-osu"></i><span class="modetext"> osu!</span>
+                <i class="mode-icon mode-osu"></i><span class="modetext"> {{ t('global.mode.osu') }}</span>
             </a>
             <a class="mode-select" v-bind:class="{ 'active': mode === 'taiko', 'disabled': mods === 'ap' }"
             @click="LoadLeaderboard(sort, 'taiko', mods)">
-                <i class="mode-icon mode-taiko"></i><span class="modetext"> osu!taiko</span>
+                <i class="mode-icon mode-taiko"></i><span class="modetext"> {{ t('global.mode.taiko') }}</span>
             </a>
             <a class="mode-select" v-bind:class="{ 'active': mode === 'catch', 'disabled': mods === 'ap' }"
             @click="LoadLeaderboard(sort, 'catch', mods)">
-                <i class="mode-icon mode-catch"></i><span class="modetext"> osu!catch</span>
+                <i class="mode-icon mode-catch"></i><span class="modetext"> {{ t('global.mode.catch') }}</span>
             </a>
             <a class="mode-select" v-bind:class="{ 'active': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
             @click="LoadLeaderboard(sort, 'mania', mods)">
-                <i class="mode-icon mode-mania"></i><span class="modetext"> osu!mania</span>
+                <i class="mode-icon mode-mania"></i><span class="modetext"> {{ t('global.mode.mania') }}</span>
             </a>
         </div>
         <div class="banner-text">{{ t('leaderboard.leaderboard') }}</div>
         <div class="selector">
             <div class="left">
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'pp' }"
-                @click="LoadLeaderboard('pp', mode, mods, '')">PP</a>
+                @click="LoadLeaderboard('pp', mode, mods, '')">{{ t('global.pp').upper() }}</a>
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'rscore' }"
-                @click="LoadLeaderboard('rscore', mode, mods, '')">Score</a>
+                @click="LoadLeaderboard('rscore', mode, mods, '')">{{ t('global.score') }}</a>
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'acc' }"
-                @click="LoadLeaderboard('acc', mode, mods, '')">Acc</a>
+                @click="LoadLeaderboard('acc', mode, mods, '')">{{ t('global.acc') }}</a>
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'plays' }"
-                @click="LoadLeaderboard('plays', mode, mods, '')">PlayCount</a>
+                @click="LoadLeaderboard('plays', mode, mods, '')">{{ t('global.playcount') }}</a>
                 <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'playtime' }"
-                @click="LoadLeaderboard('playtime', mode, mods, '')">PlayTime</a>
+                @click="LoadLeaderboard('playtime', mode, mods, '')">{{ t('global.playtime') }}</a>
             </div>
             <div class="right">
                 <a class="simple-banner-switch" v-bind:class=" { 'active': mods === 'vn' }"
-                @click="LoadLeaderboard(sort, mode, 'vn')">Vanilla</a>
+                @click="LoadLeaderboard(sort, mode, 'vn')">{{ t('global.mode.vanilla') }}</a>
                 <a class="simple-banner-switch" v-bind:class=" { 'active': mods === 'rx', 'disabled': mode === 'mania' }"
-                @click="LoadLeaderboard(sort, mode, 'rx')">Relax</a>
+                @click="LoadLeaderboard(sort, mode, 'rx')">{{ t('global.mode.relax') }}</a>
                 <a class="simple-banner-switch" v-bind:class=" { 'active': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
-                @click="LoadLeaderboard(sort, mode, 'ap')">Autopilot</a>
+                @click="LoadLeaderboard(sort, mode, 'ap')">{{ t('global.mode.autopilot') }}</a>
             </div>
         </div>
     </div>
@@ -72,10 +72,10 @@
                                 <% (sort=='pp' ? "PP" : "" ) %>
                                     <% (sort=='rscore' ? "Score" : "" ) %>
                             </th>
-                            <th class="t-heading"> Accuracy </th>
-                            <th class="t-heading"> Playcount </th>
-                            <th class="t-heading"> Max Combo </th>
-                            <th class="t-heading"> Play Time </th>
+                            <th class="t-heading"> {{ t('global.accuracy') }} </th>
+                            <th class="t-heading"> {{ t('global.playcount') }} </th>
+                            <th class="t-heading"> {{ t('global.max-combo') }} </th>
+                            <th class="t-heading"> {{ t('global.playtime') }}</th>
                         </tr>
                     </thead>
                     <tbody>
diff --git a/templates/login.html b/templates/login.html
index 5fccf233..2ad02533 100644
--- a/templates/login.html
+++ b/templates/login.html
@@ -27,7 +27,7 @@ <h1 class="title" id="regtitle">{{ t('global.log-in') }}</h1>
         </div>
       </div>
       <div class="field">
-        <label for="pass" class="label">{{ t('login.password') }}</label>
+        <label for="pass" class="label">{{ t('global.password') }}</label>
         <div class="control has-icons-left">
           <input id="pass" type="password" name="password" placeholder="Password" class="input" autocomplete="current-password" required>
           <span class="icon is-small is-left">
diff --git a/templates/profile.html b/templates/profile.html
index 93cf551a..da14a07d 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -38,9 +38,9 @@
                         <div class="score-details_right-block">
                             <div class="score-details_pp-block">
                                 <div class="map-pp">
-                                    <% map.pp.toFixed() %><span class="map-pp-unit">pp</span>
+                                    <% map.pp.toFixed() %><span class="map-pp-unit">{{ t('global.pp').upper() }}</span>
                                 </div>
-                                <div class="map-acc">accuracy:&nbsp;<b>
+                                <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
                                         <% map.acc.toFixed(2) %>%
                                     </b></div>
                             </div>
@@ -91,7 +91,7 @@ <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
                 </span> <span class="beatmap-artist">
                     <% map.artist %>
                 </span>
-                <div class="beatmap-footer"><span class="beatmap-mapper"> by <span
+                <div class="beatmap-footer"><span class="beatmap-mapper"> {{ t('profile.by') }} <span
                             class="newmaps-color">
                             <% map.creator %>
                         </span></span>
@@ -177,27 +177,27 @@ <h1 class="title">
                 <div class="select-left">
                     <a class="simple-banner-switch" v-bind:class="{ 'selected': mode === 'std' }"
                         @click="ChangeModeMods('std',mods)"><i class="mode-icon mode-osu"></i><span
-                            class="mode-text">osu!</span></a>
+                            class="mode-text">{{ t('global.mode.osu') }}</span></a>
                     <a class="simple-banner-switch" v-bind:class="{ 'selected': mode === 'taiko', 'disabled': mods === 'ap' }"
                         @click="ChangeModeMods('taiko',mods)"><i class="mode-icon mode-taiko"></i><span
-                            class="mode-text">osu!taiko</span></a>
+                            class="mode-text">{{ t('global.mode.taiko') }}</span></a>
                     <a class="simple-banner-switch" v-bind:class="{ 'selected': mode === 'catch', 'disabled': mods === 'ap' }"
                         @click="ChangeModeMods('catch',mods)"><i class="mode-icon mode-catch"></i><span
-                            class="mode-text">osu!catch</span></a>
+                            class="mode-text">{{ t('global.mode.catch') }}</span></a>
                     <a class="simple-banner-switch" v-bind:class="{ 'selected': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
                         @click="ChangeModeMods('mania',mods)"><i class="mode-icon mode-mania"></i><span
-                            class="mode-text">osu!mania</span></a>
+                            class="mode-text">{{ t('global.mode.mania') }}</span></a>
                 </div>
                 <div class="select-right">
                     <a class="simple-banner-switch" v-bind:class=" { 'selected': mods === 'vn' }"
-                        @click="ChangeModeMods(mode,'vn')"><span class="mods-fulltext">Vanilla</span>
-                        <span class="mods-shorttext">VN</span></a>
+                        @click="ChangeModeMods(mode,'vn')"><span class="mods-fulltext">{{ t('global.mode.vanilla') }}</span>
+                        <span class="mods-shorttext">{{ t('global.mode.VN') }}</span></a>
                     <a class="simple-banner-switch" v-bind:class=" { 'selected': mods === 'rx', 'disabled': mode === 'mania' }"
-                        @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">Relax</span>
-                        <span class="mods-shorttext">RX</span></a>
+                        @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">{{ t('global.mode.relax') }}</span>
+                        <span class="mods-shorttext">{{ t('global.mode.RX') }}</span></a>
                     <a class="simple-banner-switch" v-bind:class=" { 'selected': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
-                        @click="ChangeModeMods(mode,'ap')"><span class="mods-fulltext">Autopilot</span><span
-                            class="mods-shorttext">AP</span></a>
+                        @click="ChangeModeMods(mode,'ap')"><span class="mods-fulltext">{{ t('global.mode.autopilot') }}</span><span
+                            class="mods-shorttext">{{ t('global.mode.AP') }}</span></a>
                 </div>
             </div>
         </div>
@@ -214,7 +214,7 @@ <h1 class="title">
                     <table class="is-striped">
                         <tbody>
                             <tr>
-                                <td>Global rank</td>
+                                <td>{{ t('profile.global-rank') }}</td>
                                 <td class="right-aligned">
                                     <span id="global-rank">
                                         <% '#' + data.stats[`rank_global_${modegulag}`] %>
@@ -222,7 +222,7 @@ <h1 class="title">
                                 </td>
                             </tr>
                             <tr>
-                                <td>Country rank</td>
+                                <td>{{ t('profile.country-rank') }}</td>
                                 <td class="right-aligned">
                                     <span id="country-rank">
                                         <% '#' + data.stats[`rank_country_${modegulag}`] %>
@@ -241,43 +241,43 @@ <h1 class="title">
                     <table class="is-striped">
                         <tbody>
                             <tr>
-                                <td><b>PP</b></td>
+                                <td><b>{{ t('global.pp').upper() }}</b></td>
                                 <td class="right-aligned">
                                     <% addCommas(data.stats.out[modegulag].pp) %>
                                 </td>
                             </tr>
                             <tr>
-                                <td><b>Ranked score</b></td>
+                                <td><b>{{ t('global.ranked-score') }}</b></td>
                                 <td class="right-aligned">
                                     <% addCommas(data.stats.out[modegulag].rscore) %>
                                 </td>
                             </tr>
                             <tr>
-                                <td><b>Total score</b></td>
+                                <td><b>{{ t('global.total-score') }}</b></td>
                                 <td class="right-aligned">
                                     <% addCommas(data.stats.out[modegulag].tscore) %>
                                 </td>
                             </tr>
                             <tr>
-                                <td><b>Max combo</b></td>
+                                <td><b>{{ t('global.max-combo') }}</b></td>
                                 <td class="right-aligned">
                                     <% addCommas(data.stats.out[modegulag].max_combo) %>
                                 </td>
                             </tr>
                             <tr>
-                                <td><b>Playcount</b></td>
+                                <td><b>{{ t('global.playcount') }}</b></td>
                                 <td class="right-aligned">
                                     <% addCommas(data.stats.out[modegulag].plays) %>
                                 </td>
                             </tr>
                             <tr>
-                                <td><b>Playtime</b></td>
+                                <td><b>{{ t('global.playtime') }}</b></td>
                                 <td class="right-aligned">
                                     <% secondsToDhm(data.stats.out[modegulag].playtime) %>
                                 </td>
                             </tr>
                             <tr>
-                                <td><b>Accuracy</b></td>
+                                <td><b>{{ t('global.accuracy') }}</b></td>
                                 <td class="right-aligned">
                                     <% data.stats.out[modegulag].acc %>%
                                 </td>
@@ -289,13 +289,13 @@ <h1 class="title">
                             <div class="media-content">
                                 <div class="grade-line">
                                     <div class="rank-single">
-                                        <div class="map-rank rank-X">SS</div>
+                                        <div class="map-rank rank-X">{{ t('global.rank.ss') }}</div>
                                         <div class="rank-amount">
                                             <% data.stats.out[modegulag].x_count %>
                                         </div>
                                     </div>
                                     <div class="rank-single">
-                                        <div class="map-rank rank-XH">SS</div>
+                                        <div class="map-rank rank-XH">{{ t('global.rank.ssh') }}</div>
                                         <div class="rank-amount">
                                             <% data.stats.out[modegulag].xh_count %>
                                         </div>
@@ -303,19 +303,19 @@ <h1 class="title">
                                 </div>
                                 <div class="grade-line">
                                     <div class="rank-single">
-                                        <div class="map-rank rank-S">S</div>
+                                        <div class="map-rank rank-S">{{ t('global.rank.s') }}</div>
                                         <div class="rank-amount">
                                             <% data.stats.out[modegulag].s_count %>
                                         </div>
                                     </div>
                                     <div class="rank-single">
-                                        <div class="map-rank rank-SH">S</div>
+                                        <div class="map-rank rank-SH">{{ t('global.rank.sh') }}</div>
                                         <div class="rank-amount">
                                             <% data.stats.out[modegulag].sh_count %>
                                         </div>
                                     </div>
                                     <div class="rank-single">
-                                        <div class="map-rank rank-A">A</div>
+                                        <div class="map-rank rank-A">{{ t('global.rank.a') }}</div>
                                         <div class="rank-amount">
                                             <% data.stats.out[modegulag].a_count %>
                                         </div>
diff --git a/templates/register.html b/templates/register.html
index e97becc9..9a49eefe 100644
--- a/templates/register.html
+++ b/templates/register.html
@@ -35,7 +35,7 @@ <h1 class="title" id="regtitle">{{ t('register.registration') }}</h1>
           </div>
         </div>
         <div class="field">
-          <label for="pass" class="label">{{ t('register.password') }}</label>
+          <label for="pass" class="label">{{ t('global.password') }}</label>
           <div class="control has-icons-left">
             <input id="pass" type="password" name="password" placeholder="*************" class="input" autocomplete="new-password" required>
             <span class="icon is-small is-left">
diff --git a/templates/settings/avatar.html b/templates/settings/avatar.html
index 476a7c3a..b3e37aff 100644
--- a/templates/settings/avatar.html
+++ b/templates/settings/avatar.html
@@ -23,7 +23,7 @@ <h4 class="mb-4">{{ t('settings.avatar') }}</h4>
                     <input class="file-input" id="file" type="file" accept="image/jpeg" name="avatar">
                     <span class="file-cta">
                       <span class="file-label">
-                        {{ t('settings.choose-file')}}
+                        {{ t('settings.choose-file') }}
                       </span>
                       <span class="file-icon">
                         <i class="fa fa-upload"></i>
@@ -84,9 +84,9 @@ <h4 class="mb-4">{{ t('settings.preview') }}</h4>
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-            {{ t('global.uh-oh-be-careful')}}
+            {{ t('global.error') }}
           {% elif status=='success' %}
-            {{ t('global.hey-listen')}}
+            {{ t('global.success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/custom.html b/templates/settings/custom.html
index 4911f5a4..3a0fe21c 100644
--- a/templates/settings/custom.html
+++ b/templates/settings/custom.html
@@ -23,7 +23,7 @@ <h4 class="mb-4">{{ t('settings.banner') }}</h4>
                     <input class="file-input" id="file-bn" type="file" name="banner">
                     <span class="file-cta">
                       <span class="file-label">
-                        {{ t('settings.choose-file')}}
+                        {{ t('settings.choose-file') }}
                       </span>
                       <span class="file-icon">
                         <i class="fa fa-upload"></i>
@@ -33,16 +33,16 @@ <h4 class="mb-4">{{ t('settings.banner') }}</h4>
                 </div>
               </div>
               <div class="single-block-content avatar-block-content">
-                <h4 class="mb-4">{{ t('settings.profile-background')}}</h4>
+                <h4 class="mb-4">{{ t('settings.profile-background') }}</h4>
                 <div class="subtitle">
-                    {{ t('settings.profile-background-description')}}
+                    {{ t('settings.profile-background-description') }}
                 </div>
                 <div class="buttons margin-top" id="selection">
                   <label class="file-label">
                     <input class="file-input" id="file-bg" type="file" name="background">
                     <span class="file-cta">
                       <span class="file-label">
-                        {{ t('settings.choose-file')}}
+                        {{ t('settings.choose-file') }}
                       </span>
                       <span class="file-icon">
                         <i class="fa fa-upload"></i>
@@ -52,7 +52,7 @@ <h4 class="mb-4">{{ t('settings.profile-background')}}</h4>
                 </div>
               </div>
               <div class="custom-button buttons mt-6">
-                <button class='button is-primary' type='submit'><span class='icon is-small'><i class='fas fa-check'></i></span><span>Save</span></button>
+                <button class='button is-primary' type='submit'><span class='icon is-small'><i class='fas fa-check'></i></span><span>{{ t('settings.save') }}</span></button>
               </div>
             </form>
           </div>
@@ -116,9 +116,9 @@ <h4 class="mb-4">{{ t('settings.preview') }}</h4>
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          {{ t('global.uh-oh-be-careful') }}
+          {{ t('global.error') }}
           {% elif status=='success' %}
-          {{ t('global.hey-listen')}}
+          {{ t('global.success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/password.html b/templates/settings/password.html
index 3729d37c..6188bb4c 100644
--- a/templates/settings/password.html
+++ b/templates/settings/password.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} {{ t('settings.password') }} {% endblock %}
+{% block title %} {{ t('global.password') }} {% endblock %}
 
 {% block content %}
 <link rel="stylesheet" href="/static/css/pages/settings/style.css">
@@ -9,13 +9,13 @@
   <div class="block-content right" id="settings-content">
     <div id="general" class="single-right-block">
       <div class="right-block-header">
-          {{ t('settings.password-change')}}
+          {{ t('settings.password-change') }}
       </div>
       <form action="/settings/password" method="post" class="right-block-content">
         <div class="single-block-content">
           <div class="block-content--left">
             <div class="field-label is-normal">
-              <label class="label">{{ t('settings.old-password')}}</label>
+              <label class="label">{{ t('settings.old-password') }}</label>
             </div>
           </div>
           <div class="block-content--right">
@@ -31,7 +31,7 @@
         <div class="single-block-content">
             <div class="block-content--left">
               <div class="field-label is-normal">
-                <label class="label">{{ t('settings.new-password')}}</label>
+                <label class="label">{{ t('settings.new-password') }}</label>
               </div>
             </div>
             <div class="block-content--right">
@@ -47,7 +47,7 @@
           <div class="single-block-content">
             <div class="block-content--left">
               <div class="field-label is-normal">
-                <label class="label">{{ t('settings.repeat-password')}}</label>
+                <label class="label">{{ t('settings.repeat-password') }}</label>
               </div>
             </div>
             <div class="block-content--right">
@@ -60,7 +60,7 @@
               </div>
             </div>
           </div>
-        <button class='button is-primary' type='submit'><span>Save</span><span class='icon is-small'><i class='fas fa-check'></i></span></button>
+        <button class='button is-primary' type='submit'><span>{{ t('settings.save') }}</span><span class='icon is-small'><i class='fas fa-check'></i></span></button>
         </form>
     </div>
   </div>
@@ -81,9 +81,9 @@
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          {{ t('global.uh-oh-be-careful') }}
+          {{ t('global.error') }}
           {% elif status=='success' %}
-            {{ t('global.hey-listen')}}
+            {{ t('global.success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/profile.html b/templates/settings/profile.html
index 8bd706ee..08ef461d 100644
--- a/templates/settings/profile.html
+++ b/templates/settings/profile.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} {{ t('settings.profile') }} {% endblock %}
+{% block title %} {{ t('global.profile') }} {% endblock %}
 
 {% block content %}
 <link rel="stylesheet" href="/static/css/pages/settings/style.css">
@@ -9,7 +9,7 @@
   <div class="block-content right">
     <div id="general" class="single-right-block">
       <div class="right-block-header">
-          {{ t('settings.user-information')}}
+          {{ t('settings.user-information') }}
       </div>
       <form action="/settings/profile" method="post" class="setting-block-content">
         <div class="single-block-content">
@@ -49,7 +49,7 @@
         <div class="single-block-content">
           <div class="block-content--left">
             <div class="field-label is-normal">
-              <label class="label">name aka</label>
+              <label class="label">{{ t('profile.name-aka') }}</label>
             </div>
           </div>
           <div class="block-content--right">
@@ -84,9 +84,9 @@
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          {{ t('global.uh-oh-be-careful') }}
+          {{ t('global.error') }}
           {% elif status=='success' %}
-            {{ t('global.hey-listen')}}
+            {{ t('global.success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/sidebar.html b/templates/settings/sidebar.html
index 9b258d87..c26fe51e 100644
--- a/templates/settings/sidebar.html
+++ b/templates/settings/sidebar.html
@@ -9,7 +9,7 @@
     </div>
     <div class="left-selector">
         <a class="single-menu single-menu--active router-link" href="/settings/profile">
-            <i class="fas fa-user"></i><span class="single-menu--text"> {{ t('settings.profile') }} </span>
+            <i class="fas fa-user"></i><span class="single-menu--text"> {{ t('global.profile') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/avatar">
             <i class="fas fa-brush"></i><span class="single-menu--text"> {{ t('settings.avatar') }} </span>

From aeeda243830957c66edd36a50ffd52581cf99899 Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Mon, 20 Jun 2022 16:45:09 +0800
Subject: [PATCH 107/278] true add

---
 .locales/admin.en_US.yml        |  1 +
 .locales/admin.zh_CN.yml        |  1 +
 .locales/global.en_GB.yml       |  2 +-
 .locales/global.en_US.yml       | 41 ++++++++++++++++--------------
 .locales/global.zh_CN.yml       | 11 +++++---
 .locales/home.en_GB.yml         |  4 ---
 .locales/home.en_US.yml         |  4 ---
 .locales/home.zh_CN.yml         | 10 +++-----
 .locales/login.en_US.yml        |  4 +++
 .locales/login.zh_CN.yml        |  4 +++
 .locales/navbar.zh_CN.yml       |  2 +-
 .locales/register.en_US.yml     | 12 +++++++++
 .locales/register.zh_CN.yml     | 12 +++++++++
 .locales/settings.en_GB.yml     | 21 +++++++--------
 .locales/settings.en_US.yml     | 23 +++++++++++++++--
 .locales/settings.zh_CN.yml     | 23 +++++++++++++++--
 .locales/verify.zh_CN.yml       |  2 +-
 blueprints/admin.py             |  3 +++
 blueprints/frontend.py          | 21 ++++++++-------
 locales/global/en-GB.yml        |  6 ++---
 locales/global/en-US.yml        | 45 +++++++++++++++++----------------
 locales/global/zh-CN.yml        |  9 ++++---
 locales/home/en-GB.yml          |  4 ---
 locales/home/en-US.yml          |  4 ---
 locales/home/zh-CN.yml          |  4 ---
 main.py                         |  9 ++++---
 templates/home.html             |  8 +++---
 templates/settings/sidebar.html |  2 +-
 28 files changed, 177 insertions(+), 115 deletions(-)

diff --git a/.locales/admin.en_US.yml b/.locales/admin.en_US.yml
index 41a6101d..5a37a75c 100644
--- a/.locales/admin.en_US.yml
+++ b/.locales/admin.en_US.yml
@@ -10,6 +10,7 @@ en_US:
     twitter: Twitter
     youtube: YouTube
   please-login-in-first: Please login first.
+  you-have-sufficient-privileges: You have insufficient privileges
   home:
     that-s-a-lot-of-people: that's a lot of people!
     total-users: total users
diff --git a/.locales/admin.zh_CN.yml b/.locales/admin.zh_CN.yml
index b2e91881..68d2a9e6 100644
--- a/.locales/admin.zh_CN.yml
+++ b/.locales/admin.zh_CN.yml
@@ -21,3 +21,4 @@ zh_CN:
     rising-in-popularity-aren-t-we: 要火了咱们？
     total-banned: 总被ban
   please-login-in-first: 请先登录。
+  you-have-sufficient-privileges: 您的权限不足
diff --git a/.locales/global.en_GB.yml b/.locales/global.en_GB.yml
index a2729c9c..f8a193cb 100644
--- a/.locales/global.en_GB.yml
+++ b/.locales/global.en_GB.yml
@@ -39,6 +39,6 @@ en_GB:
     s: S
     sh: S
     a: A
-  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
   invalid-parameters: Invalid parameters.
   you-are-already-logged-in: You're already logged in!
+  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
\ No newline at end of file
diff --git a/.locales/global.en_US.yml b/.locales/global.en_US.yml
index e7ee2db3..3b4aafe6 100644
--- a/.locales/global.en_US.yml
+++ b/.locales/global.en_US.yml
@@ -7,35 +7,38 @@ en_US:
   login: Login
   profile: Profile
   register: Register
-  notice: Notice
+  password: Password
   warning: Warning
+  notice: Notice
   error: uh oh! Be careful!
   success: Hey! Listen!
   verify: Verify
-  acc: Acc
+  pp: pp
   accuracy: Accuracy
+  score: Score
+  acc: Acc
+  playcount: Play Count
+  playtime: Play Time
   max-combo: Max Combo
   mode:
-    AP: AP
-    RX: RX
-    VN: VN
+    vanilla: Vanilla
+    relax: Relax
     autopilot: Autopilot
+    taiko: osu!taiko
+    osu: osu!
     catch: osu!catch
     mania: osu!mania
-    osu: osu!
-    relax: Relax
-    taiko: osu!taiko
-    vanilla: Vanilla
-  playcount: Play Count
-  playtime: Play Time
-  pp: pp
+    VN: VN
+    RX: RX
+    AP: AP
+  ranked-score: Ranked score
+  total-score: Total Score
   rank:
-    a: A
-    s: S
-    sh: S
     ss: SS
     ssh: SS
-  ranked-score: Ranked score
-  score: Score
-  total-score: Total Score
-  password: Password
+    s: S
+    sh: S
+    a: A
+  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
+  invalid-parameters: Invalid parameters.
+  you-are-already-logged-in: You're already logged in!
diff --git a/.locales/global.zh_CN.yml b/.locales/global.zh_CN.yml
index bc024307..785f4cf3 100644
--- a/.locales/global.zh_CN.yml
+++ b/.locales/global.zh_CN.yml
@@ -4,14 +4,14 @@ zh_CN:
   offline: 离线
   online: 在线
   leaderboard: 排行榜
-  login: Login
-  profile: Profile
-  register: Register
+  login: 登录
+  profile: 用户信息
+  register: 注册
   notice: Notice
   warning: 注意
   error: uh oh! Be careful!
   success: Hey! Listen!
-  verify: Verify
+  verify: 验证
   acc: Acc
   accuracy: 准确度
   max-combo: 最大连击
@@ -39,3 +39,6 @@ zh_CN:
   total-score: 总分
   ranked-score: 记分总分
   password: 密码
+  invalid-parameters: 请输入用户名密码以及邮箱
+  you-are-already-logged-in: 你已经登录啦!
+  you-must-be-logged-in-to-access-this-page: 你必须登录了才能访问该页面
diff --git a/.locales/home.en_GB.yml b/.locales/home.en_GB.yml
index 15f39ef3..3a1bcbc7 100644
--- a/.locales/home.en_GB.yml
+++ b/.locales/home.en_GB.yml
@@ -1,8 +1,4 @@
 en_GB:
-  warning: Warning
-  notice: Notice
-  error: Uh oh! Be careful!
-  success: Hey! Listen!
   subtitle-big: >-
     We are an osu! private server built from the ground up with many unique
     features not seen elsewhere - for more information, check out gulag and
diff --git a/.locales/home.en_US.yml b/.locales/home.en_US.yml
index e6e783b4..6ecef70a 100644
--- a/.locales/home.en_US.yml
+++ b/.locales/home.en_US.yml
@@ -26,7 +26,3 @@ en_US:
     official servers if you play here with us! And don't worry, as you can
     always switch between the official servers and us at any time!
   sign-up-for-free: Sign up for free
-  error: Uh oh! Be careful!
-  success: Hey! Listen!
-  notice: Notice
-  warning: Warning
diff --git a/.locales/home.zh_CN.yml b/.locales/home.zh_CN.yml
index 156ac5c1..ffe4d68a 100644
--- a/.locales/home.zh_CN.yml
+++ b/.locales/home.zh_CN.yml
@@ -1,8 +1,8 @@
 zh_CN:
   subtitle-big: >-
-    欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会
-    群内的兽耳机器人24小时为您提供成绩查询等服务.详情请加QQ群: 792778662. 
-    ppysb新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
+    欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜,
+    以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段,
+    如出现问题或有改进建议, 欢迎与我们联系与沟通.
   some-of-our-coolest-features: 我们觉得最酷的一些功能
   features-title-1: 对Relax 和 Autopilot mod的PP计算
   features-content-1: >-
@@ -22,7 +22,3 @@ zh_CN:
     赶紧加入到 %{appName} 当中吧! 没有风险!
     并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
   sign-up-for-free: 免 费 注 册！
-  error: Uh oh! Be careful!
-  success: Hey! Listen!
-  notice: Notice
-  warning: Warning
diff --git a/.locales/login.en_US.yml b/.locales/login.en_US.yml
index e542cc05..cd8457ea 100644
--- a/.locales/login.en_US.yml
+++ b/.locales/login.en_US.yml
@@ -4,3 +4,7 @@ en_US:
   forgot-login: Forgot login?
   username: Username
   email: Email
+  password-incorrect: Password is incorrect.
+  restricted-not-allowed-to-login: Your account is restricted. You are not allowed to log in.
+  account-does-not-exist: Account does not exist.
+  welcome-back: Hey, welcome back %{username}!
diff --git a/.locales/login.zh_CN.yml b/.locales/login.zh_CN.yml
index d0ad6235..8a5d6d2b 100644
--- a/.locales/login.zh_CN.yml
+++ b/.locales/login.zh_CN.yml
@@ -4,3 +4,7 @@ zh_CN:
   forgot-login: 忘记账号?
   username: 你的用户名
   email: 电子邮箱
+  password-incorrect: 密码错误
+  restricted-not-allowed-to-login: 你的账号被封禁了,因此我们不允许你登录
+  account-does-not-exist: 该账号并不存在
+  welcome-back: 欢迎回来 %{username}!
diff --git a/.locales/navbar.zh_CN.yml b/.locales/navbar.zh_CN.yml
index 23a84b0d..8a22834e 100644
--- a/.locales/navbar.zh_CN.yml
+++ b/.locales/navbar.zh_CN.yml
@@ -2,7 +2,7 @@ zh_CN:
   home: 主页
   leaderboards: 排行榜
   information: Information
-  admin: Admin
+  admin: 管理员
   profile: 玩家资料
   settings: 设置
   logout: 登出
diff --git a/.locales/register.en_US.yml b/.locales/register.en_US.yml
index e646f7ec..a08dabab 100644
--- a/.locales/register.en_US.yml
+++ b/.locales/register.en_US.yml
@@ -4,3 +4,15 @@ en_US:
   email: Email
   already-have-an-account: Already have an account?
   username: Username
+  captcha-failed: Captcha failed.
+  currently-disabled: Registrations are currently disabled.
+  email-already-taken: Email already taken by another user.
+  email-is-invalid: Invalid email syntax.
+  password:
+    must-have-more-than-3-unique-characters: Password must have more than 3 unique characters.
+    too-simple: That password was deemed too simple.
+    must-between-8-32-characters-in-length: Password must be 8-32 characters in length.
+  username-cannot-contains-both-dash-and-space: Username may contain "_" or " ", but not both.
+  username-already-taken-by-others: Username already taken by another user.
+  username-disallowed: Disallowed username; pick another.
+  username-syntax-is-invalid: Invalid username syntax.
diff --git a/.locales/register.zh_CN.yml b/.locales/register.zh_CN.yml
index b9576860..08fa5eef 100644
--- a/.locales/register.zh_CN.yml
+++ b/.locales/register.zh_CN.yml
@@ -4,3 +4,15 @@ zh_CN:
   email: 电子邮箱
   already-have-an-account: 已经拥有账号了?
   username: 你的用户名
+  captcha-failed: Captcha failed.
+  currently-disabled: 注册功能目前正在禁用中
+  email-already-taken: 该电子邮箱已经被其他用户注册过了
+  email-is-invalid: 无效的邮箱格式
+  password:
+    must-have-more-than-3-unique-characters: 密码必须包含三个以上的特殊字符
+    too-simple: 这个密码看上去太简单了
+    must-between-8-32-characters-in-length: 密码的长度只能是8到32个字符之内
+  username-cannot-contains-both-dash-and-space: 用户名不能同时存在"_"和" "(空格)符号
+  username-already-taken-by-others: 该用户名已经被其他用户使用了
+  username-disallowed: 该用户名不允许被使用,请选择别的
+  username-syntax-is-invalid: 无效的用户名格式
diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
index 382a205e..ab68b019 100644
--- a/.locales/settings.en_GB.yml
+++ b/.locales/settings.en_GB.yml
@@ -15,22 +15,14 @@ en_GB:
   old-password: Old Password
   new-password: New Password
   repeat-password: Repeat Password
-  profile:
-    no-changes-have-been-made: No changes have been made.
-    username-changes-supporter-only: Username changes are currently a supporter perk.
-    new-username-is-invalid: Your new username syntax is invalid.
-    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
-    new-username-disallowed: Your new username isn't allowed; pick another.
-    new-username-already-taken-by-others: Your new username already taken by another user.
-    new-email-is-invalid: Your new email syntax is invalid.
-    succeed-please-login-again: Your username/email have been changed! Please login again.
   user-information: User Infomation
   username: Username
   settings: Settings
   bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
   change-succeed: Your %{something} has been successfully changed!
   no-image-was-selected: No image was selected!
-  customization: customization
+  customization: Customization
+  background: background
   password:
     new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
     new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
@@ -38,3 +30,12 @@ en_GB:
     must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
     too-simple: Your new password was deemed too simple.
     old-password-incorrect: Your old password is incorrect.
+  profile:
+    no-changes-have-been-made: No changes have been made.
+    username-changes-supporter-only: Username changes are currently a supporter perk.
+    new-username-is-invalid: Your new username syntax is invalid.
+    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
+    new-username-disallowed: Your new username isn't allowed; pick another.
+    new-username-already-taken-by-others: Your new username already taken by another user.
+    new-email-is-invalid: Your new email syntax is invalid.
+    succeed-please-login-again: Your username/email have been changed! Please login again.
diff --git a/.locales/settings.en_US.yml b/.locales/settings.en_US.yml
index 24bc13d8..4b3598a2 100644
--- a/.locales/settings.en_US.yml
+++ b/.locales/settings.en_US.yml
@@ -11,12 +11,31 @@ en_US:
   banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
   profile-background: Profile Background
   profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password: null
   password-change: Password Change
   old-password: Old Password
   new-password: New Password
   repeat-password: Repeat Password
-  profile: null
   user-information: User Infomation
   username: Username
   settings: Settings
+  bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
+  change-succeed: Your %{something} has been successfully changed!
+  no-image-was-selected: No image was selected!
+  customization: Customization
+  background: background
+  password:
+    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
+    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
+    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
+    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
+    too-simple: Your new password was deemed too simple.
+    old-password-incorrect: Your old password is incorrect.
+  profile:
+    no-changes-have-been-made: No changes have been made.
+    username-changes-supporter-only: Username changes are currently a supporter perk.
+    new-username-is-invalid: Your new username syntax is invalid.
+    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
+    new-username-disallowed: Your new username isn't allowed; pick another.
+    new-username-already-taken-by-others: Your new username already taken by another user.
+    new-email-is-invalid: Your new email syntax is invalid.
+    succeed-please-login-again: Your username/email have been changed! Please login again.
diff --git a/.locales/settings.zh_CN.yml b/.locales/settings.zh_CN.yml
index c59f822a..47f44cdf 100644
--- a/.locales/settings.zh_CN.yml
+++ b/.locales/settings.zh_CN.yml
@@ -1,5 +1,20 @@
 zh_CN:
-  password: 密码
+  password:
+    new-passoword-mismatch-repeated-password: 你的新密码与确认密码不符
+    new-passoword-cannot-be-same-as-old-password: 你的新密码不能是旧密码
+    must-between-8-32-characters-in-length: 你的新密码只能在8到32个字符之间
+    must-have-more-than-3-unique-characters: 你的新密码必须包含三个以上的特殊字符
+    too-simple: 你的新密码看上去太简单了
+    old-password-incorrect: 你的旧密码有误
+  profile:
+    no-changes-have-been-made: 没有任何改变
+    username-changes-supporter-only: 用户名更改功能目前是支持者的福利
+    new-username-is-invalid: 你的新用户名格式有误
+    new-username-cannot-contains-both-dash-and-space: 你的新用户名不能同时存在"_"(下划线)和" "(空格)字符
+    new-username-disallowed: 你的新用户名不允许被使用,再想一个新名字吧
+    new-username-already-taken-by-others: 你的新用户名已经被其它用户使用
+    new-email-is-invalid: 你的新邮箱格式有误
+    succeed-please-login-again: 你的用户名或者邮箱地址被修改了!请重新登录
   avatar: 头像
   avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片.并且图片大小低于5MB
   choose-file: 选择一张图片
@@ -14,7 +29,11 @@ zh_CN:
   old-password: 旧密码
   new-password: 新密码
   repeat-password: 确认新密码
-  profile: 玩家资料
   user-information: 用户信息
   username: 你的用户名
   settings: 设置
+  bad-image-extension: 你选择的%{something}必须是 .jpg .jpeg .png 这三种文件之一
+  change-succeed: 你的 %{something}已经修改成功!
+  no-image-was-selected: 请选择一张图片
+  customization: 个性化
+  background: 背景图片
diff --git a/.locales/verify.zh_CN.yml b/.locales/verify.zh_CN.yml
index d1885ffd..6b92a375 100644
--- a/.locales/verify.zh_CN.yml
+++ b/.locales/verify.zh_CN.yml
@@ -5,7 +5,7 @@ zh_CN:
   follow-these-three-simple-steps: 跟随以下三个简单的步骤即可游玩 %{appName} 了!
   osu-shortcut: Osu! 快捷方式
   find-your-shortcut: 在桌面上寻找你的osu!快捷方式并复制一份 (如果没有，可以去osu!目录里创建一份)
-  edit-it: Edit it
+  edit-it: 修改属性
   right-click-properties: 右键快捷方式,在菜单中找到 "属性" 选项,(一般在最下边)
   find-target-element-box: 找到 "目标" 这一行
   add-domain: 在文本的末尾添加 -devserver %{domain}
diff --git a/blueprints/admin.py b/blueprints/admin.py
index e2d41a95..f9e5a80c 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -5,6 +5,9 @@
 import datetime
 
 import timeago
+
+from blueprints.i18npy import t
+
 from quart import Blueprint
 from quart import render_template
 from quart import session
diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index fa10548e..b4592fb8 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -27,15 +27,14 @@
 from objects.utils import flash
 from objects.utils import flash_with_customizations
 
-import i18n
-
-
+from blueprints.i18npy import t
 
 VALID_MODES = frozenset({'std', 'taiko', 'catch', 'mania'})
 VALID_MODS = frozenset({'vn', 'rx', 'ap'})
 
 frontend = Blueprint('frontend', __name__)
 
+
 def login_required(func):
     @wraps(func)
     async def wrapper(*args, **kwargs):
@@ -96,7 +95,7 @@ async def settings_profile_post():
             return await flash('error', t('settings.profile.new-username-cannot-contains-both-dash-and-space'), 'settings/profile')
 
         if new_name in glob.config.disallowed_names:
-            return await flash('error', t("settings.profile.new-username-disallowed"), 'settings/profile')
+            return await flash('error', t('settings.profile.new-username-disallowed'), 'settings/profile')
 
         if await glob.db.fetch('SELECT 1 FROM users WHERE name = %s', [new_name]):
             return await flash('error', t('settings.profile.new-username-already-taken-by-others'), 'settings/profile')
@@ -237,7 +236,7 @@ async def settings_password_post():
 
     # new password and repeat password don't match; deny post
     if new_password != repeat_password:
-        return await flash('error', t("settings.password.new-passoword-mismatch-repeated-password"), 'settings/password')
+        return await flash('error', t('settings.password.new-passoword-mismatch-repeated-password'), 'settings/password')
 
     # new password and old password match; deny post
     if old_password == new_password:
@@ -344,14 +343,14 @@ async def leaderboard(mode='std', sort='pp', mods='vn'):
 @frontend.route('/login')
 async def login():
     if 'authenticated' in session:
-        return await flash('error', t("global.you-are-already-logged-in"), 'home')
+        return await flash('error', t('global.you-are-already-logged-in'), 'home')
 
     return await render_template('login.html')
 
 @frontend.route('/login', methods=['POST'])
 async def login_post():
     if 'authenticated' in session:
-        return await flash('error', t("global.you-are-already-logged-in"), 'home')
+        return await flash('error', t('global.you-are-already-logged-in'), 'home')
 
     if glob.config.debug:
         login_time = time.time_ns()
@@ -436,7 +435,7 @@ async def login_post():
 @frontend.route('/register')
 async def register():
     if 'authenticated' in session:
-        return await flash('error', t("global.you-are-already-logged-in"), 'home')
+        return await flash('error', t('global.you-are-already-logged-in'), 'home')
 
     if not glob.config.registration:
         return await flash('error', t('register.currently-disabled'), 'home')
@@ -446,7 +445,7 @@ async def register():
 @frontend.route('/register', methods=['POST'])
 async def register_post():
     if 'authenticated' in session:
-        return await flash('error', t("global.you-are-already-logged-in"), 'home')
+        return await flash('error', t('global.you-are-already-logged-in'), 'home')
 
     if not glob.config.registration:
         return await flash('error', t('register.currently-disabled'), 'home')
@@ -480,7 +479,7 @@ async def register_post():
         return await flash('error', t('register.username-cannot-contains-both-dash-and-space'), 'register')
 
     if username in glob.config.disallowed_names:
-        return await flash('error', t("register.username-disallowed"), 'register')
+        return await flash('error', t('register.username-disallowed'), 'register')
 
     if await glob.db.fetch('SELECT 1 FROM users WHERE name = %s', username):
         return await flash('error', t('register.username-already-taken-by-others'), 'register')
@@ -562,7 +561,7 @@ async def register_post():
 @frontend.route('/logout')
 async def logout():
     if 'authenticated' not in session:
-        return await flash('error', t("logout.cannot-logout-if-not-logged-in"), 'login')
+        return await flash('error', t('logout.cannot-logout-if-not-logged-in'), 'login')
 
     if glob.config.debug:
         log(f'{session["user_data"]["name"]} logged out.', Ansi.LGREEN)
diff --git a/locales/global/en-GB.yml b/locales/global/en-GB.yml
index 54243eeb..2c50c3ec 100644
--- a/locales/global/en-GB.yml
+++ b/locales/global/en-GB.yml
@@ -39,6 +39,6 @@ rank:
   sh: S
   a: A
 # server literals
-you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
-invalid-parameters: Invalid parameters.
-you-are-already-logged-in: You're already logged in!
+  invalid-parameters: Invalid parameters.
+  you-are-already-logged-in: You're already logged in!
+  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
diff --git a/locales/global/en-US.yml b/locales/global/en-US.yml
index bcdbfc34..2c50c3ec 100644
--- a/locales/global/en-US.yml
+++ b/locales/global/en-US.yml
@@ -6,38 +6,39 @@ leaderboard: Leaderboard
 login: Login
 profile: Profile
 register: Register
-notice: Notice
+password: Password
 warning: Warning
+notice: Notice
 error: uh oh! Be careful!
 success: Hey! Listen!
 verify: Verify
-acc: Acc
+pp: pp
 accuracy: Accuracy
+score: Score
+acc: Acc
+playcount: Play Count
+playtime: Play Time
 max-combo: Max Combo
 mode:
-  AP: AP
-  RX: RX
-  VN: VN
+  vanilla: Vanilla
+  relax: Relax
   autopilot: Autopilot
+  taiko: osu!taiko
+  osu: osu!
   catch: osu!catch
   mania: osu!mania
-  osu: osu!
-  relax: Relax
-  taiko: osu!taiko
-  vanilla: Vanilla
-playcount: Play Count
-playtime: Play Time
-pp: pp
+  VN: VN
+  RX: RX
+  AP: AP
+ranked-score: Ranked score
+total-score: Total Score
 rank:
-  a: A
-  s: S
-  sh: S
   ss: SS
   ssh: SS
-ranked-score: Ranked score
-score: Score
-total-score: Total Score
-password: Password
-invalid-parameters: Invalid parameters.
-you-are-already-logged-in: You're already logged in!
-you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
+  s: S
+  sh: S
+  a: A
+# server literals
+  invalid-parameters: Invalid parameters.
+  you-are-already-logged-in: You're already logged in!
+  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
diff --git a/locales/global/zh-CN.yml b/locales/global/zh-CN.yml
index 8ea42dfe..dec53119 100644
--- a/locales/global/zh-CN.yml
+++ b/locales/global/zh-CN.yml
@@ -4,7 +4,7 @@ offline: 离线
 online: 在线
 leaderboard: 排行榜
 login: 登录
-profile: Profile
+profile: 用户信息
 register: 注册
 notice: Notice
 warning: 注意
@@ -38,6 +38,7 @@ score: 分数
 total-score: 总分
 ranked-score: 记分总分
 password: 密码
-invalid-parameters: 请输入用户名密码以及邮箱
-you-are-already-logged-in: 你已经登录啦!
-you-must-be-logged-in-to-access-this-page: 你必须登录了才能访问该页面
+# server literals
+  invalid-parameters: 请输入用户名密码以及邮箱
+  you-are-already-logged-in: 你已经登录啦!
+  you-must-be-logged-in-to-access-this-page: 你必须登录了才能访问该页面
diff --git a/locales/home/en-GB.yml b/locales/home/en-GB.yml
index f03cf7d6..f8183bfb 100644
--- a/locales/home/en-GB.yml
+++ b/locales/home/en-GB.yml
@@ -1,7 +1,3 @@
-warning: Warning
-notice: Notice
-error: Uh oh! Be careful!
-success: Hey! Listen!
 subtitle-big: |-
   We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
 some-of-our-coolest-features: Some of our coolest features
diff --git a/locales/home/en-US.yml b/locales/home/en-US.yml
index 185502a8..f8183bfb 100644
--- a/locales/home/en-US.yml
+++ b/locales/home/en-US.yml
@@ -14,7 +14,3 @@ what-are-you-waiting-for: What are you waiting for?
 subtitle: |-
   Join %{appName}! It's risk-free! You won't get your account banned on official servers if you play here with us! And don't worry, as you can always switch between the official servers and us at any time!
 sign-up-for-free: Sign up for free
-error: Uh oh! Be careful!
-success: Hey! Listen!
-notice: Notice
-warning: Warning
diff --git a/locales/home/zh-CN.yml b/locales/home/zh-CN.yml
index 2707a623..8ce4f329 100644
--- a/locales/home/zh-CN.yml
+++ b/locales/home/zh-CN.yml
@@ -14,7 +14,3 @@ what-are-you-waiting-for: 你 还 在 等 什 么?
 subtitle: |-
   赶紧加入到 %{appName} 当中吧! 没有风险! 并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
 sign-up-for-free: 免 费 注 册！
-error: Uh oh! Be careful!
-success: Hey! Listen!
-notice: Notice
-warning: Warning
diff --git a/main.py b/main.py
index f597bc84..55f30a29 100755
--- a/main.py
+++ b/main.py
@@ -9,7 +9,7 @@
 import aiohttp
 import i18n
 import orjson
-from quart import Quart, session
+from quart import Blueprint, Quart, session
 from quart import render_template
 
 from cmyui.logging import Ansi
@@ -59,7 +59,10 @@ def t(key, **kwargs) -> str:
     try:
         return i18n.t(key, **kwargs)
     except:
-        return key
+        try:
+            return i18n.t(key + '._string', **kwargs)
+        except:
+            return key
 
 @app.template_global()
 def appName() -> str:
@@ -90,4 +93,4 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    app.run(port=8000, debug=glob.config.debug)  # blocking call
+    app.run(port=10000, debug=glob.config.debug)  # blocking call
diff --git a/templates/home.html b/templates/home.html
index 61d1fefe..d90b2906 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -15,16 +15,16 @@
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-          {{ t('home.warning') }}
+          {{ t('global.warning') }}
           {% elif status=='success' %}
-          {{ t('home.notice') }}
+          {{ t('global.notice') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          {{ t('home.error') }}
+          {{ t('global.error') }}
           {% elif status=='success' %}
-          {{ t('home.success') }}
+          {{ t('global.success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/sidebar.html b/templates/settings/sidebar.html
index c26fe51e..29967afb 100644
--- a/templates/settings/sidebar.html
+++ b/templates/settings/sidebar.html
@@ -15,7 +15,7 @@
             <i class="fas fa-brush"></i><span class="single-menu--text"> {{ t('settings.avatar') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/password">
-            <i class="fas fa-lock"></i><span class="single-menu--text"> {{ t('settings.password') }} </span>
+            <i class="fas fa-lock"></i><span class="single-menu--text"> {{ t('global.password') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/custom">
             <i class="fas fa-air-freshener"></i><span class="single-menu--text"> {{ t('settings.customisation') }} </span>

From 1de3831a7d7bb3c761a858b5f56db8c0b59bdf81 Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Mon, 20 Jun 2022 16:52:56 +0800
Subject: [PATCH 108/278] solve confilct

---
 .locales/global.en_US.yml   | 41 +++++++++++++++++--------------------
 .locales/global.zh_CN.yml   |  2 +-
 .locales/settings.en_GB.yml | 21 +++++++++----------
 .locales/settings.en_US.yml | 23 ++-------------------
 .locales/settings.zh_CN.yml | 23 ++-------------------
 5 files changed, 34 insertions(+), 76 deletions(-)

diff --git a/.locales/global.en_US.yml b/.locales/global.en_US.yml
index 3b4aafe6..e7ee2db3 100644
--- a/.locales/global.en_US.yml
+++ b/.locales/global.en_US.yml
@@ -7,38 +7,35 @@ en_US:
   login: Login
   profile: Profile
   register: Register
-  password: Password
-  warning: Warning
   notice: Notice
+  warning: Warning
   error: uh oh! Be careful!
   success: Hey! Listen!
   verify: Verify
-  pp: pp
-  accuracy: Accuracy
-  score: Score
   acc: Acc
-  playcount: Play Count
-  playtime: Play Time
+  accuracy: Accuracy
   max-combo: Max Combo
   mode:
-    vanilla: Vanilla
-    relax: Relax
+    AP: AP
+    RX: RX
+    VN: VN
     autopilot: Autopilot
-    taiko: osu!taiko
-    osu: osu!
     catch: osu!catch
     mania: osu!mania
-    VN: VN
-    RX: RX
-    AP: AP
-  ranked-score: Ranked score
-  total-score: Total Score
+    osu: osu!
+    relax: Relax
+    taiko: osu!taiko
+    vanilla: Vanilla
+  playcount: Play Count
+  playtime: Play Time
+  pp: pp
   rank:
-    ss: SS
-    ssh: SS
+    a: A
     s: S
     sh: S
-    a: A
-  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
-  invalid-parameters: Invalid parameters.
-  you-are-already-logged-in: You're already logged in!
+    ss: SS
+    ssh: SS
+  ranked-score: Ranked score
+  score: Score
+  total-score: Total Score
+  password: Password
diff --git a/.locales/global.zh_CN.yml b/.locales/global.zh_CN.yml
index 785f4cf3..1df668c4 100644
--- a/.locales/global.zh_CN.yml
+++ b/.locales/global.zh_CN.yml
@@ -5,7 +5,7 @@ zh_CN:
   online: 在线
   leaderboard: 排行榜
   login: 登录
-  profile: 用户信息
+  profile: Profile
   register: 注册
   notice: Notice
   warning: 注意
diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
index ab68b019..382a205e 100644
--- a/.locales/settings.en_GB.yml
+++ b/.locales/settings.en_GB.yml
@@ -15,14 +15,22 @@ en_GB:
   old-password: Old Password
   new-password: New Password
   repeat-password: Repeat Password
+  profile:
+    no-changes-have-been-made: No changes have been made.
+    username-changes-supporter-only: Username changes are currently a supporter perk.
+    new-username-is-invalid: Your new username syntax is invalid.
+    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
+    new-username-disallowed: Your new username isn't allowed; pick another.
+    new-username-already-taken-by-others: Your new username already taken by another user.
+    new-email-is-invalid: Your new email syntax is invalid.
+    succeed-please-login-again: Your username/email have been changed! Please login again.
   user-information: User Infomation
   username: Username
   settings: Settings
   bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
   change-succeed: Your %{something} has been successfully changed!
   no-image-was-selected: No image was selected!
-  customization: Customization
-  background: background
+  customization: customization
   password:
     new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
     new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
@@ -30,12 +38,3 @@ en_GB:
     must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
     too-simple: Your new password was deemed too simple.
     old-password-incorrect: Your old password is incorrect.
-  profile:
-    no-changes-have-been-made: No changes have been made.
-    username-changes-supporter-only: Username changes are currently a supporter perk.
-    new-username-is-invalid: Your new username syntax is invalid.
-    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
-    new-username-disallowed: Your new username isn't allowed; pick another.
-    new-username-already-taken-by-others: Your new username already taken by another user.
-    new-email-is-invalid: Your new email syntax is invalid.
-    succeed-please-login-again: Your username/email have been changed! Please login again.
diff --git a/.locales/settings.en_US.yml b/.locales/settings.en_US.yml
index 4b3598a2..24bc13d8 100644
--- a/.locales/settings.en_US.yml
+++ b/.locales/settings.en_US.yml
@@ -11,31 +11,12 @@ en_US:
   banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
   profile-background: Profile Background
   profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+  password: null
   password-change: Password Change
   old-password: Old Password
   new-password: New Password
   repeat-password: Repeat Password
+  profile: null
   user-information: User Infomation
   username: Username
   settings: Settings
-  bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
-  change-succeed: Your %{something} has been successfully changed!
-  no-image-was-selected: No image was selected!
-  customization: Customization
-  background: background
-  password:
-    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
-    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
-    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
-    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
-    too-simple: Your new password was deemed too simple.
-    old-password-incorrect: Your old password is incorrect.
-  profile:
-    no-changes-have-been-made: No changes have been made.
-    username-changes-supporter-only: Username changes are currently a supporter perk.
-    new-username-is-invalid: Your new username syntax is invalid.
-    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
-    new-username-disallowed: Your new username isn't allowed; pick another.
-    new-username-already-taken-by-others: Your new username already taken by another user.
-    new-email-is-invalid: Your new email syntax is invalid.
-    succeed-please-login-again: Your username/email have been changed! Please login again.
diff --git a/.locales/settings.zh_CN.yml b/.locales/settings.zh_CN.yml
index 47f44cdf..c59f822a 100644
--- a/.locales/settings.zh_CN.yml
+++ b/.locales/settings.zh_CN.yml
@@ -1,20 +1,5 @@
 zh_CN:
-  password:
-    new-passoword-mismatch-repeated-password: 你的新密码与确认密码不符
-    new-passoword-cannot-be-same-as-old-password: 你的新密码不能是旧密码
-    must-between-8-32-characters-in-length: 你的新密码只能在8到32个字符之间
-    must-have-more-than-3-unique-characters: 你的新密码必须包含三个以上的特殊字符
-    too-simple: 你的新密码看上去太简单了
-    old-password-incorrect: 你的旧密码有误
-  profile:
-    no-changes-have-been-made: 没有任何改变
-    username-changes-supporter-only: 用户名更改功能目前是支持者的福利
-    new-username-is-invalid: 你的新用户名格式有误
-    new-username-cannot-contains-both-dash-and-space: 你的新用户名不能同时存在"_"(下划线)和" "(空格)字符
-    new-username-disallowed: 你的新用户名不允许被使用,再想一个新名字吧
-    new-username-already-taken-by-others: 你的新用户名已经被其它用户使用
-    new-email-is-invalid: 你的新邮箱格式有误
-    succeed-please-login-again: 你的用户名或者邮箱地址被修改了!请重新登录
+  password: 密码
   avatar: 头像
   avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片.并且图片大小低于5MB
   choose-file: 选择一张图片
@@ -29,11 +14,7 @@ zh_CN:
   old-password: 旧密码
   new-password: 新密码
   repeat-password: 确认新密码
+  profile: 玩家资料
   user-information: 用户信息
   username: 你的用户名
   settings: 设置
-  bad-image-extension: 你选择的%{something}必须是 .jpg .jpeg .png 这三种文件之一
-  change-succeed: 你的 %{something}已经修改成功!
-  no-image-was-selected: 请选择一张图片
-  customization: 个性化
-  background: 背景图片

From 2258d71edb2ebdfadf1e5fd97b782e5067835898 Mon Sep 17 00:00:00 2001
From: DAYGood_Time <35392263+DAYGoodTime@users.noreply.github.com>
Date: Mon, 20 Jun 2022 17:04:24 +0800
Subject: [PATCH 109/278] add for python translations

---
 blueprints/i18npy.py | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)
 create mode 100644 blueprints/i18npy.py

diff --git a/blueprints/i18npy.py b/blueprints/i18npy.py
new file mode 100644
index 00000000..581e8f87
--- /dev/null
+++ b/blueprints/i18npy.py
@@ -0,0 +1,18 @@
+
+#把locale传入i18n方法当中用于识别locale
+#不能放入main.py当中,会产生循环导入
+#(待翻译成en)
+
+from quart import Blueprint, Quart, session
+
+import i18n
+
+app = Quart(__name__)
+
+@app.template_global()
+def t(key, **kwargs) -> str:
+    kwargs['locale'] = session.get('lang', 'zh_CN')
+    try:
+        return i18n.t(key, **kwargs)
+    except:
+        return key
\ No newline at end of file

From f54bf1e52dcff3152e6fec6fc70b67102cdc1009 Mon Sep 17 00:00:00 2001
From: DAYGoodTime <ken570015@163.com>
Date: Mon, 20 Jun 2022 09:08:53 +0000
Subject: [PATCH 110/278] add python transaltion file

---
 blueprints/i18npy.py | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)
 create mode 100644 blueprints/i18npy.py

diff --git a/blueprints/i18npy.py b/blueprints/i18npy.py
new file mode 100644
index 00000000..581e8f87
--- /dev/null
+++ b/blueprints/i18npy.py
@@ -0,0 +1,18 @@
+
+#把locale传入i18n方法当中用于识别locale
+#不能放入main.py当中,会产生循环导入
+#(待翻译成en)
+
+from quart import Blueprint, Quart, session
+
+import i18n
+
+app = Quart(__name__)
+
+@app.template_global()
+def t(key, **kwargs) -> str:
+    kwargs['locale'] = session.get('lang', 'zh_CN')
+    try:
+        return i18n.t(key, **kwargs)
+    except:
+        return key
\ No newline at end of file

From 1c2a7736dcb2ecbc1e5c73bf97117f567ac8a6f5 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 20 Jun 2022 18:54:49 +0900
Subject: [PATCH 111/278] wrong indent

---
 .locales/global.en_GB.yml |  2 +-
 .locales/global.en_US.yml | 38 +++++++++++++++++++-------------------
 .locales/global.zh_CN.yml |  2 +-
 locales/global/en-GB.yml  |  7 ++++---
 locales/global/en-US.yml  |  7 ++++---
 locales/global/zh-CN.yml  |  6 +++---
 6 files changed, 32 insertions(+), 30 deletions(-)

diff --git a/.locales/global.en_GB.yml b/.locales/global.en_GB.yml
index f8a193cb..cdbad34b 100644
--- a/.locales/global.en_GB.yml
+++ b/.locales/global.en_GB.yml
@@ -41,4 +41,4 @@ en_GB:
     a: A
   invalid-parameters: Invalid parameters.
   you-are-already-logged-in: You're already logged in!
-  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
\ No newline at end of file
+  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
diff --git a/.locales/global.en_US.yml b/.locales/global.en_US.yml
index c3b6f83d..cebf4cc5 100644
--- a/.locales/global.en_US.yml
+++ b/.locales/global.en_US.yml
@@ -7,38 +7,38 @@ en_US:
   login: Login
   profile: Profile
   register: Register
-  notice: Notice
+  password: Password
   warning: Warning
+  notice: Notice
   error: uh oh! Be careful!
   success: Hey! Listen!
   verify: Verify
-  acc: Acc
+  pp: pp
   accuracy: Accuracy
+  score: Score
+  acc: Acc
+  playcount: Play Count
+  playtime: Play Time
   max-combo: Max Combo
   mode:
-    AP: AP
-    RX: RX
-    VN: VN
+    vanilla: Vanilla
+    relax: Relax
     autopilot: Autopilot
+    taiko: osu!taiko
+    osu: osu!
     catch: osu!catch
     mania: osu!mania
-    osu: osu!
-    relax: Relax
-    taiko: osu!taiko
-    vanilla: Vanilla
-  playcount: Play Count
-  playtime: Play Time
-  pp: pp
+    VN: VN
+    RX: RX
+    AP: AP
+  ranked-score: Ranked score
+  total-score: Total Score
   rank:
-    a: A
-    s: S
-    sh: S
     ss: SS
     ssh: SS
-  ranked-score: Ranked score
-  score: Score
-  total-score: Total Score
-  password: Password
+    s: S
+    sh: S
+    a: A
   invalid-parameters: Invalid parameters.
   you-are-already-logged-in: You're already logged in!
   you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
diff --git a/.locales/global.zh_CN.yml b/.locales/global.zh_CN.yml
index 1df668c4..785f4cf3 100644
--- a/.locales/global.zh_CN.yml
+++ b/.locales/global.zh_CN.yml
@@ -5,7 +5,7 @@ zh_CN:
   online: 在线
   leaderboard: 排行榜
   login: 登录
-  profile: Profile
+  profile: 用户信息
   register: 注册
   notice: Notice
   warning: 注意
diff --git a/locales/global/en-GB.yml b/locales/global/en-GB.yml
index 2c50c3ec..0c59dc2e 100644
--- a/locales/global/en-GB.yml
+++ b/locales/global/en-GB.yml
@@ -39,6 +39,7 @@ rank:
   sh: S
   a: A
 # server literals
-  invalid-parameters: Invalid parameters.
-  you-are-already-logged-in: You're already logged in!
-  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
+invalid-parameters: Invalid parameters.
+you-are-already-logged-in: You're already logged in!
+you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
+
diff --git a/locales/global/en-US.yml b/locales/global/en-US.yml
index 2c50c3ec..0c59dc2e 100644
--- a/locales/global/en-US.yml
+++ b/locales/global/en-US.yml
@@ -39,6 +39,7 @@ rank:
   sh: S
   a: A
 # server literals
-  invalid-parameters: Invalid parameters.
-  you-are-already-logged-in: You're already logged in!
-  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
+invalid-parameters: Invalid parameters.
+you-are-already-logged-in: You're already logged in!
+you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
+
diff --git a/locales/global/zh-CN.yml b/locales/global/zh-CN.yml
index dec53119..619b602d 100644
--- a/locales/global/zh-CN.yml
+++ b/locales/global/zh-CN.yml
@@ -39,6 +39,6 @@ total-score: 总分
 ranked-score: 记分总分
 password: 密码
 # server literals
-  invalid-parameters: 请输入用户名密码以及邮箱
-  you-are-already-logged-in: 你已经登录啦!
-  you-must-be-logged-in-to-access-this-page: 你必须登录了才能访问该页面
+invalid-parameters: 请输入用户名密码以及邮箱
+you-are-already-logged-in: 你已经登录啦!
+you-must-be-logged-in-to-access-this-page: 你必须登录了才能访问该页面

From 37fe1fedaac0d3e99a63ed29087605752461e9fb Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 20 Jun 2022 19:00:36 +0900
Subject: [PATCH 112/278] string with same key support

---
 blueprints/i18npy.py | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/blueprints/i18npy.py b/blueprints/i18npy.py
index 581e8f87..25624f5b 100644
--- a/blueprints/i18npy.py
+++ b/blueprints/i18npy.py
@@ -15,4 +15,7 @@ def t(key, **kwargs) -> str:
     try:
         return i18n.t(key, **kwargs)
     except:
-        return key
\ No newline at end of file
+        try:
+            return i18n.t(key + '._string', **kwargs)
+        except:
+            return key

From 0e93bc2e75716df3e2af262da22808da52b20292 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 20 Jun 2022 19:20:41 +0900
Subject: [PATCH 113/278] fix bugs

---
 .locales/settings.en_GB.yml | 30 ++++++++++++++++++++++++++++
 .locales/settings.en_US.yml | 40 +++++++++++++++++++++++++++++--------
 .locales/settings.zh_CN.yml | 29 +++++++++++++--------------
 locales/settings/zh-CN.yml  |  1 -
 utils/i18n/config.mjs       |  9 ++++++---
 5 files changed, 82 insertions(+), 27 deletions(-)

diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
index e5956ac4..13fd165a 100644
--- a/.locales/settings.en_GB.yml
+++ b/.locales/settings.en_GB.yml
@@ -9,3 +9,33 @@ en_GB:
     new-email-is-invalid: Your new email syntax is invalid.
     succeed-please-login-again: Your username/email have been changed! Please login again.
     _string: Profile
+  avatar: Avatar
+  avatar-description: >-
+    We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a
+    PNG, JPG under 5MB
+  choose-file: Choose file
+  save: Save
+  preview: Preview
+  customisation: Customisation
+  banner: Banner
+  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
+  profile-background: Profile Background
+  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+  password-change: Password Change
+  old-password: Old Password
+  new-password: New Password
+  repeat-password: Repeat Password
+  user-information: User Infomation
+  username: Username
+  settings: Settings
+  bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
+  change-succeed: Your %{something} has been successfully changed!
+  no-image-was-selected: No image was selected!
+  customization: Customization
+  password:
+    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
+    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
+    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
+    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
+    too-simple: Your new password was deemed too simple.
+    old-password-incorrect: Your old password is incorrect.
diff --git a/.locales/settings.en_US.yml b/.locales/settings.en_US.yml
index 810340a1..c56977fe 100644
--- a/.locales/settings.en_US.yml
+++ b/.locales/settings.en_US.yml
@@ -1,12 +1,4 @@
 en_US:
-  password:
-    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
-    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
-    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
-    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
-    too-simple: Your new password was deemed too simple.
-    old-password-incorrect: Your old password is incorrect.
-    _string: Password
   profile:
     no-changes-have-been-made: No changes have been made.
     username-changes-supporter-only: Username changes are currently a supporter perk.
@@ -16,3 +8,35 @@ en_US:
     new-username-already-taken-by-others: Your new username already taken by another user.
     new-email-is-invalid: Your new email syntax is invalid.
     succeed-please-login-again: Your username/email have been changed! Please login again.
+    _string: Profile
+  password:
+    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
+    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
+    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
+    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
+    too-simple: Your new password was deemed too simple.
+    old-password-incorrect: Your old password is incorrect.
+    _string: Password
+  avatar: Avatar
+  avatar-description: >-
+    We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a
+    PNG, JPG under 5MB
+  choose-file: Choose file
+  save: Save
+  preview: Preview
+  customisation: Customisation
+  banner: Banner
+  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
+  profile-background: Profile Background
+  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+  password-change: Password Change
+  old-password: Old Password
+  new-password: New Password
+  repeat-password: Repeat Password
+  user-information: User Infomation
+  username: Username
+  settings: Settings
+  bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
+  change-succeed: Your %{something} has been successfully changed!
+  no-image-was-selected: No image was selected!
+  customization: Customization
diff --git a/.locales/settings.zh_CN.yml b/.locales/settings.zh_CN.yml
index bd62901b..6d0695fd 100644
--- a/.locales/settings.zh_CN.yml
+++ b/.locales/settings.zh_CN.yml
@@ -1,4 +1,14 @@
 zh_CN:
+  avatar: 头像
+  avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片.并且图片大小低于5MB
+  choose-file: 选择一张图片
+  save: 保存
+  preview: 预览
+  customisation: 个性化
+  banner: 背景横幅
+  banner-description: 建议上传分辨率为 1440x262 的 GIF, PNG, JPG, JPEG 等四种格式的图片
+  profile-background: 资料背景
+  profile-background-description: 建议上传长宽比为 16:9  的 PNG, JPG, JPEG 格式的图片
   password:
     new-passoword-mismatch-repeated-password: 你的新密码与确认密码不符
     new-passoword-cannot-be-same-as-old-password: 你的新密码不能是旧密码
@@ -7,6 +17,10 @@ zh_CN:
     too-simple: 你的新密码看上去太简单了
     old-password-incorrect: 你的旧密码有误
     _string: 密码
+  password-change: 更改密码
+  old-password: 旧密码
+  new-password: 新密码
+  repeat-password: 确认新密码
   profile:
     no-changes-have-been-made: 没有任何改变
     username-changes-supporter-only: 用户名更改功能目前是支持者的福利
@@ -17,24 +31,9 @@ zh_CN:
     new-email-is-invalid: 你的新邮箱格式有误
     succeed-please-login-again: 你的用户名或者邮箱地址被修改了!请重新登录
     _string: 玩家资料
-  avatar: 头像
-  avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片.并且图片大小低于5MB
-  choose-file: 选择一张图片
-  save: 保存
-  preview: 预览
-  customisation: 个性化
-  banner: 背景横幅
-  banner-description: 建议上传分辨率为 1440x262 的 GIF, PNG, JPG, JPEG 等四种格式的图片
-  profile-background: 资料背景
-  profile-background-description: 建议上传长宽比为 16:9  的 PNG, JPG, JPEG 格式的图片
-  password-change: 更改密码
-  old-password: 旧密码
-  new-password: 新密码
-  repeat-password: 确认新密码
   user-information: 用户信息
   username: 你的用户名
   settings: 设置
   bad-image-extension: 你选择的%{something}必须是 .jpg .jpeg .png 这三种文件之一
   change-succeed: 你的 %{something}已经修改成功!
   no-image-was-selected: 请选择一张图片
-  customization: 个性化
diff --git a/locales/settings/zh-CN.yml b/locales/settings/zh-CN.yml
index 2cbee9bd..5a3cb038 100644
--- a/locales/settings/zh-CN.yml
+++ b/locales/settings/zh-CN.yml
@@ -20,4 +20,3 @@ settings: 设置
 bad-image-extension: 你选择的%{something}必须是 .jpg .jpeg .png 这三种文件之一
 change-succeed: 你的 %{something}已经修改成功!
 no-image-was-selected: 请选择一张图片
-customization: 个性化
diff --git a/utils/i18n/config.mjs b/utils/i18n/config.mjs
index c0a545ab..f75fce34 100644
--- a/utils/i18n/config.mjs
+++ b/utils/i18n/config.mjs
@@ -25,9 +25,10 @@ export function contextFromFileName(fileName) {
         extension
     }
 }
-export function onConflictingKey(oldVal, newVal, key) {
-    if (!typeof newVal[key] === 'object' || !typeof oldVal[key] === 'object') {
-        console.error('onConflictingKey: unable to merge text with text.')
+export function onConflictingKey(newVal, oldVal, key) {
+    if (typeof newVal[key] !== 'object' && typeof oldVal[key]  !== 'object') {
+        // console.log(typeof newVal[key], oldVal[key], newVal[key])
+        return newVal
     }
     if (typeof newVal[key] === 'object' && typeof oldVal[key] === 'object') {
         console.info('merged object', oldVal, newVal)
@@ -37,6 +38,7 @@ export function onConflictingKey(oldVal, newVal, key) {
         console.info(`[info] ${key} renamed into ${key}._string.`)
         return {
             ...oldVal,
+            ...newVal,
             [key]: {
                 ...oldVal[key],
                 _string: newVal[key]
@@ -46,6 +48,7 @@ export function onConflictingKey(oldVal, newVal, key) {
     else if (typeof oldVal[key] === 'string') {
         console.info(`[info] ${key} renamed into ${key}._string.`)
         return {
+            ...oldVal,
             ...newVal,
             [key]: {
                 ...newVal[key],

From 1194d19b31496bb2bff253efd249736530d0d544 Mon Sep 17 00:00:00 2001
From: DAYGoodTime <ken570015@163.com>
Date: Wed, 22 Jun 2022 13:49:46 +0000
Subject: [PATCH 114/278] fix avatars upload error

---
 blueprints/frontend.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index b4592fb8..932374b6 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -142,7 +142,7 @@ async def settings_avatar():
 @login_required
 async def settings_avatar_post():
     # constants
-    AVATARS_PATH = f'{glob.config.path_to_gulag}.data/avatars'
+    AVATARS_PATH = f'{glob.config.path_to_gulag}/.data/avatars'
     ALLOWED_EXTENSIONS = ['.jpeg', '.jpg', '.png']
 
     avatar = (await request.files).get('avatar')

From 485b347879f11e5ae4e98373bf547bc596c2435a Mon Sep 17 00:00:00 2001
From: TrueRou <chenbohan911@163.com>
Date: Sat, 30 Jul 2022 01:29:01 +0000
Subject: [PATCH 115/278] Add rank display

---
 main.py                |  2 +-
 templates/profile.html | 10 +++++-----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/main.py b/main.py
index 55f30a29..eca53767 100755
--- a/main.py
+++ b/main.py
@@ -93,4 +93,4 @@ async def page_not_found(e):
 
 if __name__ == '__main__':
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    app.run(port=10000, debug=glob.config.debug)  # blocking call
+    app.run(host='0.0.0.0', port=10000, debug=glob.config.debug)  # blocking call
diff --git a/templates/profile.html b/templates/profile.html
index da14a07d..82bf8719 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -205,19 +205,19 @@ <h1 class="title">
     <div class="second-block">
         <div class="columns is-marginless two-sides">
             <div class="column is-one-third" v-cloak>
-                <!--<div class="header" v-if='data.stats[`rank_global_${modegulag}`] != -1'>
+                <div class="header" v-if='data.stats.out[modegulag].rank != 0'>
                     <div class="title">
                         <i class="fas fa-user-friends"></i> Rank
                     </div>
                 </div>
-                <div class="stats-block rank-block" v-if='data.stats[`rank_global_${modegulag}`] != -1'>
+                <div class="stats-block rank-block" v-if='data.stats.out[modegulag].rank != 0'>
                     <table class="is-striped">
                         <tbody>
                             <tr>
                                 <td>{{ t('profile.global-rank') }}</td>
                                 <td class="right-aligned">
                                     <span id="global-rank">
-                                        <% '#' + data.stats[`rank_global_${modegulag}`] %>
+                                        <% '#' + data.stats.out[modegulag].rank %>
                                     </span>
                                 </td>
                             </tr>
@@ -225,13 +225,13 @@ <h1 class="title">
                                 <td>{{ t('profile.country-rank') }}</td>
                                 <td class="right-aligned">
                                     <span id="country-rank">
-                                        <% '#' + data.stats[`rank_country_${modegulag}`] %>
+                                        <% '#' + data.stats.out[modegulag].country_rank %>
                                     </span>
                                 </td>
                             </tr>
                         </tbody>
                     </table>
-                </div>-->
+                </div>
                 <div class="header">
                     <div class="title">
                         <i class="fas fa-chart-pie"></i> {{ t('profile.statistics') }}

From a086ddb0ca2619e3c147f827352d919032dff351 Mon Sep 17 00:00:00 2001
From: TrueRou <chenbohan911@163.com>
Date: Sat, 30 Jul 2022 05:27:22 +0000
Subject: [PATCH 116/278] Add search bar

---
 blueprints/api.py                | 26 ++++++++++++++++++++++++++
 main.py                          |  3 +++
 static/css/style.css             | 21 +++++++++++++++++++++
 static/js/main.js                | 32 ++++++++++++++++++++++++++++++++
 templates/base.html              |  4 +---
 templates/components/navbar.html | 10 ++++++++++
 6 files changed, 93 insertions(+), 3 deletions(-)
 create mode 100644 blueprints/api.py

diff --git a/blueprints/api.py b/blueprints/api.py
new file mode 100644
index 00000000..58f1e3a9
--- /dev/null
+++ b/blueprints/api.py
@@ -0,0 +1,26 @@
+from quart import Blueprint
+from quart import jsonify
+from quart import request
+
+from objects import glob
+
+api = Blueprint('apiv1', __name__)
+
+@api.route('/search')
+async def home():
+    q = request.args.get('q', type=str)
+    if not q:
+        return b'{}'
+
+    res = await glob.db.fetchall(
+        'SELECT id, name '
+        'FROM `users` '
+        'WHERE priv >= 3 AND `name` LIKE %s '
+        'LIMIT 5',
+        [q + '%%']
+    )
+
+    if (len(res) == 0):
+        return b'{}'
+    else:
+        return jsonify(res) 
\ No newline at end of file
diff --git a/main.py b/main.py
index eca53767..15074922 100755
--- a/main.py
+++ b/main.py
@@ -86,6 +86,9 @@ def domain() -> str:
 from blueprints.admin import admin
 app.register_blueprint(admin, url_prefix='/admin')
 
+from blueprints.api import api
+app.register_blueprint(api, url_prefix='/apiv1')
+
 @app.errorhandler(404)
 async def page_not_found(e):
     # NOTE: we set the 404 status explicitly
diff --git a/static/css/style.css b/static/css/style.css
index 02e676b3..7dae38b9 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -848,4 +848,25 @@ body::-webkit-scrollbar-thumb {
 
 [v-cloak] {
   display: none;
+}
+
+#u-search {
+  margin: 0;
+  max-width: 100%;
+  -webkit-box-flex: 1;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  outline: 0;
+  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
+  text-align: left;
+  line-height: 1.2142em;
+  font-family: var(--font);
+  padding: 0.67861429em 1em;
+  background: #00000060;
+  border: 1px solid rgba(34, 36, 38, 0.15);
+  color: rgba(255, 255, 255, 0.93);
+  border-radius: 0.28571429rem;
+  -webkit-transition: box-shadow 0.1s ease, border-color 0.1s ease;
+  transition: box-shadow 0.1s ease, border-color 0.1s ease;
+  box-shadow: none;
 }
\ No newline at end of file
diff --git a/static/js/main.js b/static/js/main.js
index c69fd847..9940bac3 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -14,4 +14,36 @@ $(window).scroll(() => {
 function togglenavbar() {
     document.getElementById('navbar').classList.toggle("is-active");
     document.getElementById('navbar-burger').classList.toggle("is-active");
+}
+
+function search() {
+    const value = document.getElementById('u-search').value
+    document.getElementById('u-search-content').innerHTML = "";
+    $.get('//osu.' + the_domain + '/apiv1/search?q=' + value, function(data, status) {
+        if (data != '{}') {
+            document.getElementById('u-search-content').style = ''
+            $.each(data, function(e, n){
+                var result = ({
+                    title: n.name,
+                    url: "/u/" + n.id,
+                    image: 'https://a.ppy.sb/' + n.id
+                })
+                var root = document.createElement('a')
+                root.href = result.url
+                root.className = 'navbar-item'
+                var image = document.createElement('img')
+                image.src = result.image
+                image.style = 'max-height: 3rem; width: 3rem; background-size: cover;'
+                root.appendChild(image)
+                var textSpan = document.createElement('span')
+                textSpan.style = 'margin-left:5px; font-weight: 700;font-size: 1.2em;color: rgba(255, 255, 255, 0.9);'
+                textSpan.innerText = result.title
+                root.appendChild(textSpan)
+                document.getElementById('u-search-content').appendChild(root)
+            })
+        } else {
+            document.getElementById('u-search-content').style = 'display: none;'
+        }
+    })
+    
 }
\ No newline at end of file
diff --git a/templates/base.html b/templates/base.html
index 448e774b..c31106bb 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -19,9 +19,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <!-- JQuery -->
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.min.js"
-    integrity="sha512-/DXTXr6nQodMUiq+IUJYCt2PPOUjrHJ9wFrqpJ3XkgPNOZVfMok7cRw6CSxyCQxXn6ozlESsSh1/sMCTF1rL/g=="
-    crossorigin="anonymous"></script>
+  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
 
   <!-- Bulma -->
   <link rel="stylesheet" href="/static/css/bulma.css?v={{ rand() }}" />
diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index 1d79d5f5..7aa0d6ea 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -1,3 +1,6 @@
+<script type="text/javascript">
+    var the_domain = '{{ domain() }}'
+</script>
 <nav id="navbar" class="navbar is-primary">
     <div class="navbar-brand">
         <a class="navbar-item navbar-logo" href="/home">
@@ -40,6 +43,13 @@
         </div>
 
         <div class="navbar-end">
+            <div class="navbar-item has-dropdown is-hoverable" style="align-items: center;">
+                <div class="navbar-search">
+                    <input autocomplete="off" type="text" placeholder="Looking for someone?" id="u-search" oninput="search()">
+                </div>
+                <div id="u-search-content" class="navbar-dropdown" style="display: none;">
+                </div>
+            </div>
             <div class="navbar-item has-dropdown is-hoverable">
                 <i style="display: flex;" class="fa fa-globe navbar-link"></i>
                 <div class="navbar-dropdown">

From d335f7c4c32b1dbc784abfbac727670b043d0baa Mon Sep 17 00:00:00 2001
From: TrueRou <chenbohan911@163.com>
Date: Sat, 30 Jul 2022 06:02:21 +0000
Subject: [PATCH 117/278] profile change

---
 .vscode/settings.json  |  2 +-
 templates/profile.html | 14 +++++++-------
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index c0f65c98..d1de336f 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -54,6 +54,6 @@
     ]
   },
   "files.associations": {
-    "*.html": "jinja-html"
+    "*.html": "html"
   }
 }
diff --git a/templates/profile.html b/templates/profile.html
index 82bf8719..2ca7e50f 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -348,22 +348,22 @@ <h1 class="title">
 
 {% block bottom %}
 <script src="/static/js/pages/profile.js"></script>
-{% if user['customisation']['banner'] == True or user['customisation']['background'] == True %}
-<style>
-    {% if user['customisation']['banner'] == True %}
+{% if user['customisation']['banner'] == True %}
+    <style>
         .profile-bg {
             min-height: 262px;
             background: linear-gradient(hsl(var(--main), 25%, 25%, 20%), hsl(var(--main), 25%, 25%, 60%)), url("/banners/{{ user['id'] }}");
             background-size: cover;
         }
-    {% endif %}
-    {% if user['customisation']['background'] == True %}
+    </style>
+{% endif %}
+{% if user['customisation']['background'] == True %}
+    <style>
         body {
             background: linear-gradient(hsl(var(--main), 25%, 25%, 20%), hsl(var(--main), 10%, 10%)), url("/backgrounds/{{ user['id'] }}");
             background-size: cover;
             background-clip: content-box;
         }
-    {% endif %}
-</style>
+    </style>
 {% endif %}
 {% endblock bottom %}

From 2951654589e49f6895394bed644afe6aac4e282b Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 30 Jul 2022 09:39:48 +0000
Subject: [PATCH 118/278] gitignore add locker file

---
 .gitignore | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/.gitignore b/.gitignore
index ab0344fd..7a4e71d9 100644
--- a/.gitignore
+++ b/.gitignore
@@ -145,4 +145,6 @@ config.py
 
 node_modules/
 package-lock.json
+yarn.lock
+
 .vscode/launch.json

From a05e7af7145449f462d01ea6f3064d6fe857e3d4 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 30 Jul 2022 09:52:14 +0000
Subject: [PATCH 119/278] update merger

---
 utils/i18n/reader.mjs | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/utils/i18n/reader.mjs b/utils/i18n/reader.mjs
index d3cbf2ee..7f711f64 100644
--- a/utils/i18n/reader.mjs
+++ b/utils/i18n/reader.mjs
@@ -70,8 +70,10 @@ export const readLocales = () => new Promise((resolve, reject) => {
                             return srcValue
                         }
                         for (const k in srcValue) {
-                            if (objValue[k]) {
-                                console.warn(`[Warning] Merging into initilazed value:\n  ${key}.${k}:\n    [${typeof srcValue[k]}${typeof srcValue[k] === 'string' && ' `' + srcValue[k] + '`' || ''}] merging into [${typeof objValue[k]}${typeof objValue[k] === 'string' && ' `' + objValue[k] + '`' || ''}].`)
+                            if (objValue[k] && objValue[k] !== srcValue[k]) {
+                                console.warn(`[Warning] Merging into initilazed value:
+  ${key}.${k} ${relative}:
+    [${typeof srcValue[k]}${typeof srcValue[k] === 'string' && ' `' + srcValue[k] + '`' || ''}] merging into [${typeof objValue[k]}${typeof objValue[k] === 'string' && ' `' + objValue[k] + '`' || ''}].`)
                                 objValue = onConflictingKey(objValue, srcValue, k)
                                 console.log('')
                             } else {

From 745b71a70732558b904e5b44a7b3368399e2c22d Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 30 Jul 2022 09:53:52 +0000
Subject: [PATCH 120/278] fixup update merger

---
 utils/i18n/reader.mjs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/utils/i18n/reader.mjs b/utils/i18n/reader.mjs
index 7f711f64..12b42a88 100644
--- a/utils/i18n/reader.mjs
+++ b/utils/i18n/reader.mjs
@@ -72,7 +72,7 @@ export const readLocales = () => new Promise((resolve, reject) => {
                         for (const k in srcValue) {
                             if (objValue[k] && objValue[k] !== srcValue[k]) {
                                 console.warn(`[Warning] Merging into initilazed value:
-  ${key}.${k} ${relative}:
+  ${key}.${k} (${relative}):
     [${typeof srcValue[k]}${typeof srcValue[k] === 'string' && ' `' + srcValue[k] + '`' || ''}] merging into [${typeof objValue[k]}${typeof objValue[k] === 'string' && ' `' + objValue[k] + '`' || ''}].`)
                                 objValue = onConflictingKey(objValue, srcValue, k)
                                 console.log('')

From 78880edc3b6025d68f457203cfcae9839c591655 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 30 Jul 2022 10:57:58 +0000
Subject: [PATCH 121/278] locale overwrite

---
 .locales/home.zh_CN.yml          |  2 +-
 .locales/settings.en_GB.yml      | 20 +++++++++---------
 .locales/settings.en_US.yml      | 36 ++++++++++++++++----------------
 .locales/settings.zh_CN.yml      | 27 ++++++++----------------
 locales/home/zh-CN.overwrite.yml |  0
 locales/home/zh-CN.yml           |  2 +-
 package.json                     |  8 +++----
 utils/i18n/config.mjs            | 16 ++++++++------
 utils/i18n/reader.mjs            | 36 ++++++++++++++++++++++----------
 utils/i18n/writer.mjs            |  1 +
 10 files changed, 79 insertions(+), 69 deletions(-)
 create mode 100644 locales/home/zh-CN.overwrite.yml

diff --git a/.locales/home.zh_CN.yml b/.locales/home.zh_CN.yml
index ffe4d68a..d5424e55 100644
--- a/.locales/home.zh_CN.yml
+++ b/.locales/home.zh_CN.yml
@@ -1,6 +1,6 @@
 zh_CN:
   subtitle-big: >-
-    欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜,
+    欢迎来到 %{appName}, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜,
     以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段,
     如出现问题或有改进建议, 欢迎与我们联系与沟通.
   some-of-our-coolest-features: 我们觉得最酷的一些功能
diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
index 13fd165a..8636221d 100644
--- a/.locales/settings.en_GB.yml
+++ b/.locales/settings.en_GB.yml
@@ -1,14 +1,4 @@
 en_GB:
-  profile:
-    no-changes-have-been-made: No changes have been made.
-    username-changes-supporter-only: Username changes are currently a supporter perk.
-    new-username-is-invalid: Your new username syntax is invalid.
-    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
-    new-username-disallowed: Your new username isn't allowed; pick another.
-    new-username-already-taken-by-others: Your new username already taken by another user.
-    new-email-is-invalid: Your new email syntax is invalid.
-    succeed-please-login-again: Your username/email have been changed! Please login again.
-    _string: Profile
   avatar: Avatar
   avatar-description: >-
     We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a
@@ -25,6 +15,16 @@ en_GB:
   old-password: Old Password
   new-password: New Password
   repeat-password: Repeat Password
+  profile:
+    no-changes-have-been-made: No changes have been made.
+    username-changes-supporter-only: Username changes are currently a supporter perk.
+    new-username-is-invalid: Your new username syntax is invalid.
+    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
+    new-username-disallowed: Your new username isn't allowed; pick another.
+    new-username-already-taken-by-others: Your new username already taken by another user.
+    new-email-is-invalid: Your new email syntax is invalid.
+    succeed-please-login-again: Your username/email have been changed! Please login again.
+    _string: Profile
   user-information: User Infomation
   username: Username
   settings: Settings
diff --git a/.locales/settings.en_US.yml b/.locales/settings.en_US.yml
index c56977fe..96b69653 100644
--- a/.locales/settings.en_US.yml
+++ b/.locales/settings.en_US.yml
@@ -1,22 +1,4 @@
 en_US:
-  profile:
-    no-changes-have-been-made: No changes have been made.
-    username-changes-supporter-only: Username changes are currently a supporter perk.
-    new-username-is-invalid: Your new username syntax is invalid.
-    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
-    new-username-disallowed: Your new username isn't allowed; pick another.
-    new-username-already-taken-by-others: Your new username already taken by another user.
-    new-email-is-invalid: Your new email syntax is invalid.
-    succeed-please-login-again: Your username/email have been changed! Please login again.
-    _string: Profile
-  password:
-    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
-    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
-    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
-    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
-    too-simple: Your new password was deemed too simple.
-    old-password-incorrect: Your old password is incorrect.
-    _string: Password
   avatar: Avatar
   avatar-description: >-
     We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a
@@ -29,10 +11,28 @@ en_US:
   banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
   profile-background: Profile Background
   profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
+  password:
+    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
+    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
+    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
+    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
+    too-simple: Your new password was deemed too simple.
+    old-password-incorrect: Your old password is incorrect.
+    _string: Password
   password-change: Password Change
   old-password: Old Password
   new-password: New Password
   repeat-password: Repeat Password
+  profile:
+    no-changes-have-been-made: No changes have been made.
+    username-changes-supporter-only: Username changes are currently a supporter perk.
+    new-username-is-invalid: Your new username syntax is invalid.
+    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
+    new-username-disallowed: Your new username isn't allowed; pick another.
+    new-username-already-taken-by-others: Your new username already taken by another user.
+    new-email-is-invalid: Your new email syntax is invalid.
+    succeed-please-login-again: Your username/email have been changed! Please login again.
+    _string: Profile
   user-information: User Infomation
   username: Username
   settings: Settings
diff --git a/.locales/settings.zh_CN.yml b/.locales/settings.zh_CN.yml
index 6d0695fd..abc9d429 100644
--- a/.locales/settings.zh_CN.yml
+++ b/.locales/settings.zh_CN.yml
@@ -1,4 +1,13 @@
 zh_CN:
+  password:
+    new-passoword-mismatch-repeated-password: 你的新密码与确认密码不符
+    new-passoword-cannot-be-same-as-old-password: 你的新密码不能是旧密码
+    must-between-8-32-characters-in-length: 你的新密码只能在8到32个字符之间
+    must-have-more-than-3-unique-characters: 你的新密码必须包含三个以上的特殊字符
+    too-simple: 你的新密码看上去太简单了
+    old-password-incorrect: 你的旧密码有误
+    _string: 密码
+  profile: 玩家资料
   avatar: 头像
   avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片.并且图片大小低于5MB
   choose-file: 选择一张图片
@@ -9,28 +18,10 @@ zh_CN:
   banner-description: 建议上传分辨率为 1440x262 的 GIF, PNG, JPG, JPEG 等四种格式的图片
   profile-background: 资料背景
   profile-background-description: 建议上传长宽比为 16:9  的 PNG, JPG, JPEG 格式的图片
-  password:
-    new-passoword-mismatch-repeated-password: 你的新密码与确认密码不符
-    new-passoword-cannot-be-same-as-old-password: 你的新密码不能是旧密码
-    must-between-8-32-characters-in-length: 你的新密码只能在8到32个字符之间
-    must-have-more-than-3-unique-characters: 你的新密码必须包含三个以上的特殊字符
-    too-simple: 你的新密码看上去太简单了
-    old-password-incorrect: 你的旧密码有误
-    _string: 密码
   password-change: 更改密码
   old-password: 旧密码
   new-password: 新密码
   repeat-password: 确认新密码
-  profile:
-    no-changes-have-been-made: 没有任何改变
-    username-changes-supporter-only: 用户名更改功能目前是支持者的福利
-    new-username-is-invalid: 你的新用户名格式有误
-    new-username-cannot-contains-both-dash-and-space: 你的新用户名不能同时存在"_"(下划线)和" "(空格)字符
-    new-username-disallowed: 你的新用户名不允许被使用,再想一个新名字吧
-    new-username-already-taken-by-others: 你的新用户名已经被其它用户使用
-    new-email-is-invalid: 你的新邮箱格式有误
-    succeed-please-login-again: 你的用户名或者邮箱地址被修改了!请重新登录
-    _string: 玩家资料
   user-information: 用户信息
   username: 你的用户名
   settings: 设置
diff --git a/locales/home/zh-CN.overwrite.yml b/locales/home/zh-CN.overwrite.yml
new file mode 100644
index 00000000..e69de29b
diff --git a/locales/home/zh-CN.yml b/locales/home/zh-CN.yml
index 8ce4f329..9f12e782 100644
--- a/locales/home/zh-CN.yml
+++ b/locales/home/zh-CN.yml
@@ -1,5 +1,5 @@
 subtitle-big: |-
-  欢迎来到ppysb, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
+  欢迎来到 %{appName}, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
 some-of-our-coolest-features: 我们觉得最酷的一些功能
 features-title-1: 对Relax 和 Autopilot mod的PP计算
 features-content-1: |-
diff --git a/package.json b/package.json
index dfb1a8d8..1e4731b5 100644
--- a/package.json
+++ b/package.json
@@ -27,13 +27,13 @@
   },
   "homepage": "https://github.com/ppy-sb/guweb#readme",
   "devDependencies": {
+    "@types/node": "^18.6.2",
     "clui": "^0.3.6",
     "glob": "^8.0.3",
     "js-yaml": "^4.1.0",
+    "lodash-es": "^4.17.21",
     "nodemon": "^2.0.16",
-    "yaml": "^2.1.1",
-    "lodash-es": "^4.17.21"
+    "yaml": "^2.1.1"
   },
-  "dependencies": {
-  }
+  "dependencies": {}
 }
diff --git a/utils/i18n/config.mjs b/utils/i18n/config.mjs
index f75fce34..72b53665 100644
--- a/utils/i18n/config.mjs
+++ b/utils/i18n/config.mjs
@@ -1,5 +1,6 @@
-import { join } from 'path'
-import { dirname } from 'path';
+// @ts-check
+// @ts-ignore
+import { join, dirname } from 'path';
 import { fileURLToPath } from 'url';
 import { merge } from 'lodash-es'
 
@@ -25,13 +26,16 @@ export function contextFromFileName(fileName) {
         extension
     }
 }
-export function onConflictingKey(newVal, oldVal, key) {
+export const createConfilitKeyHandler = (mergeMode) => function onConflictingKey(oldVal, newVal, key) {
     if (typeof newVal[key] !== 'object' && typeof oldVal[key]  !== 'object') {
-        // console.log(typeof newVal[key], oldVal[key], newVal[key])
-        return newVal
+        console.log(typeof newVal[key], oldVal[key], newVal[key])
+        return {
+            ...oldVal,
+            ...newVal
+        }
     }
     if (typeof newVal[key] === 'object' && typeof oldVal[key] === 'object') {
-        console.info('merged object', oldVal, newVal)
+        if (!mergeMode) console.info('merged object', oldVal, newVal)
         return merge(oldVal, newVal)
     }
     if (typeof newVal[key] === 'string') {
diff --git a/utils/i18n/reader.mjs b/utils/i18n/reader.mjs
index 12b42a88..6f2379d3 100644
--- a/utils/i18n/reader.mjs
+++ b/utils/i18n/reader.mjs
@@ -1,10 +1,11 @@
+// @ts-check
 import glob from 'glob'
 import path from 'path'
 import fs from 'fs'
 import yaml from 'js-yaml'
 import { mergeWith, merge } from 'lodash-es'
 
-import { compiledFileSchema, path as translationPath, contextFromFileName, onConflictingKey } from './config.mjs'
+import { compiledFileSchema, path as translationPath, contextFromFileName, createConfilitKeyHandler } from './config.mjs'
 
 
 const parseLocale = (file, context) => {
@@ -29,7 +30,7 @@ const parseLocale = (file, context) => {
         }
     }
     if (Array.isArray(locale)) {
-        const toMerge = locale.forEach(_parse)
+        const toMerge = locale.map(_parse)
         let rtn = {}
         for (const item of toMerge) {
             rtn = {
@@ -50,16 +51,27 @@ const parseLocale = (file, context) => {
       }
   }    
 }
+* allow customization if {lang}.overwrite.(yml|yaml) is provided.
 */
 export const readLocales = () => new Promise((resolve, reject) => {
     glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
         if (err) throw err
-        const locales = await matches.reduce(async (acc, match) => {
+        const { normal, custom } = matches.reduce((acc, cur) => {
+            if (!cur.includes('.overwrite')) {
+                acc.normal.push(cur)
+            }
+            else {
+                acc.custom.push(cur)
+            }
+            return acc
+        }, { normal: [], custom: [] })
+        const reducer = (customMerge) => async (acc, match) => {
+            console.log('parsing', match, '...\n')
             try {
                 acc = await acc
-
                 const relative = path.relative(translationPath, match)
-                const context = contextFromFileName(relative)
+                const removeOverwrite = relative.replace('.overwrite', '')
+                const context = contextFromFileName(removeOverwrite)
                 const data = await parseLocale(match, context)
                 if (!acc[context.locale]) acc[context.locale] = {}
                 acc[context.locale] = mergeWith(
@@ -71,11 +83,11 @@ export const readLocales = () => new Promise((resolve, reject) => {
                         }
                         for (const k in srcValue) {
                             if (objValue[k] && objValue[k] !== srcValue[k]) {
-                                console.warn(`[Warning] Merging into initilazed value:
-  ${key}.${k} (${relative}):
+                                if (!customMerge) console.warn(`[Warning] Merging into initilazed value:
+  ${key}.${k}:
     [${typeof srcValue[k]}${typeof srcValue[k] === 'string' && ' `' + srcValue[k] + '`' || ''}] merging into [${typeof objValue[k]}${typeof objValue[k] === 'string' && ' `' + objValue[k] + '`' || ''}].`)
-                                objValue = onConflictingKey(objValue, srcValue, k)
-                                console.log('')
+                                objValue = createConfilitKeyHandler(customMerge)(objValue, srcValue, k)
+                                if (!customMerge) console.log('')
                             } else {
                                 objValue[k] = srcValue[k]
                             }
@@ -88,8 +100,10 @@ export const readLocales = () => new Promise((resolve, reject) => {
             } catch (error) {
                 reject(error)
             }
-        }, {})
-
+        }
+        let locales = await normal.reduce(reducer(false), {})
+        locales = await custom.reduce(reducer(true), locales)
+        // console.log(locales)
         resolve(locales)
     })
 })
diff --git a/utils/i18n/writer.mjs b/utils/i18n/writer.mjs
index c3a478d4..0b6fdc75 100644
--- a/utils/i18n/writer.mjs
+++ b/utils/i18n/writer.mjs
@@ -1,3 +1,4 @@
+// @ts-check
 import {
     compiledFileNameSchema,
     compiledFileSchema,

From b808de8c78d17a4834d793f0459cd295da22c4e0 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 30 Jul 2022 11:07:15 +0000
Subject: [PATCH 122/278] change .overwrite to .custom

---
 .gitignore                       | 3 +++
 locales/home/zh-CN.overwrite.yml | 0
 utils/i18n/reader.mjs            | 6 +++---
 3 files changed, 6 insertions(+), 3 deletions(-)
 delete mode 100644 locales/home/zh-CN.overwrite.yml

diff --git a/.gitignore b/.gitignore
index 7a4e71d9..117b4732 100644
--- a/.gitignore
+++ b/.gitignore
@@ -148,3 +148,6 @@ package-lock.json
 yarn.lock
 
 .vscode/launch.json
+
+# custom language pack
+locales/**/*.custom.yml
\ No newline at end of file
diff --git a/locales/home/zh-CN.overwrite.yml b/locales/home/zh-CN.overwrite.yml
deleted file mode 100644
index e69de29b..00000000
diff --git a/utils/i18n/reader.mjs b/utils/i18n/reader.mjs
index 6f2379d3..0038967c 100644
--- a/utils/i18n/reader.mjs
+++ b/utils/i18n/reader.mjs
@@ -51,13 +51,13 @@ const parseLocale = (file, context) => {
       }
   }    
 }
-* allow customization if {lang}.overwrite.(yml|yaml) is provided.
+* allow customization if {lang}.custom.(yml|yaml) is provided.
 */
 export const readLocales = () => new Promise((resolve, reject) => {
     glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
         if (err) throw err
         const { normal, custom } = matches.reduce((acc, cur) => {
-            if (!cur.includes('.overwrite')) {
+            if (!cur.includes('.custom')) {
                 acc.normal.push(cur)
             }
             else {
@@ -70,7 +70,7 @@ export const readLocales = () => new Promise((resolve, reject) => {
             try {
                 acc = await acc
                 const relative = path.relative(translationPath, match)
-                const removeOverwrite = relative.replace('.overwrite', '')
+                const removeOverwrite = relative.replace('.custom', '')
                 const context = contextFromFileName(removeOverwrite)
                 const data = await parseLocale(match, context)
                 if (!acc[context.locale]) acc[context.locale] = {}

From d52df3281b300298c66fd3d9a3671e6ce9b67f65 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 30 Jul 2022 11:18:18 +0000
Subject: [PATCH 123/278] add build step readme

---
 .gitignore                                     |  4 +++-
 README.md                                      | 15 ++++++++++++++-
 package.json                                   |  5 +++--
 utils/i18n/commands/{compile.mjs => build.mjs} |  0
 4 files changed, 20 insertions(+), 4 deletions(-)
 rename utils/i18n/commands/{compile.mjs => build.mjs} (100%)

diff --git a/.gitignore b/.gitignore
index 117b4732..4ca1059b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -150,4 +150,6 @@ yarn.lock
 .vscode/launch.json
 
 # custom language pack
-locales/**/*.custom.yml
\ No newline at end of file
+locales/**/*.custom.yml
+# compiled locales
+.locales
\ No newline at end of file
diff --git a/README.md b/README.md
index a5b6adbd..6dd7fb71 100644
--- a/README.md
+++ b/README.md
@@ -45,8 +45,13 @@ wget https://bootstrap.pypa.io/get-pip.py
 python3.9 get-pip.py && rm get-pip.py
 
 # Install MySQL and NGINX.
+
 sudo apt install mysql-server nginx
 
+
+# Install Nodejs and npm or yarn
+# see https://nodejs.org/en/download/ .
+
 # Clone guweb from GitHub.
 git clone https://github.com/varkaria/guweb.git
 cd guweb
@@ -57,15 +62,23 @@ git submodule init && git submodule update
 # Install requirements from pip.
 python3.9 -m pip install -r ext/requirements.txt
 
+
 # Add and configure guweb's NGINX config to your nginx/sites-enabled.
 sudo ln -r -s ext/nginx.conf /etc/nginx/sites-enabled/guweb.conf
 sudo nano ext/nginx.conf
 sudo nginx -s reload
 
+
 # Configure guweb.
 cp ext/config.py config.py
 nano config.py
 
+
+# build locales
+npm run i18n:build 
+# or use yarn
+yarn i18n:c
+
 # Run guweb (on port 8000).
 python3.9 main.py # Run directly to access debug features for development!
 hypercorn main.py # Please run guweb with hypercorn when in production! It will improve performance drastically by disabling all of the debug features a developer would need!
@@ -85,7 +98,7 @@ Translation
 ### how to
 - open any html files with i18n-ally plugin enabled.
 - translate keys
-- run `npm run i18n:compile` to generate files for python-i18n
+- run `npm run i18n:build` to generate files for python-i18n
 
 
 Directory Structure
diff --git a/package.json b/package.json
index 1e4731b5..2477f3e4 100644
--- a/package.json
+++ b/package.json
@@ -8,12 +8,13 @@
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "i18n:compile": "node utils/i18n/commands/compile.mjs",
+    "i18n:build": "node utils/i18n/commands/build.mjs",
+    "i18n:compile": "node utils/i18n/commands/build.mjs echo 'use i18n:build from now on.'",
     "i18n:format:templates": "node utils/i18n/commands/format-html.mjs",
     "i18n:format:locales": "node utils/i18n/commands/format-yaml.mjs",
     "i18n:format": "npm run i18n:format:templates & npm run i18n:format:locales",
     "i18n:format:parallel": "PARALLEL=TRUE npm run i18n:format",
-    "i18n:dev": "nodemon --watch ./locales -e yml, yaml utils/i18n/commands/compile.mjs",
+    "i18n:dev": "nodemon --watch ./locales -e yml, yaml utils/i18n/commands/build.mjs",
     "i18n:make-sure-you-understand-what-you-are-doing:migrate": "node utils/i18n/commands/migrate.mjs"
   },
   "repository": {
diff --git a/utils/i18n/commands/compile.mjs b/utils/i18n/commands/build.mjs
similarity index 100%
rename from utils/i18n/commands/compile.mjs
rename to utils/i18n/commands/build.mjs

From b79a997b9991d0c79b582fdb3ab56ebbf959b678 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 30 Jul 2022 11:19:36 +0000
Subject: [PATCH 124/278] remove compiled locales

---
 .locales/404.en_GB.yml         |  6 -----
 .locales/404.en_US.yml         |  6 -----
 .locales/404.zh_CN.yml         |  6 -----
 .locales/admin.en_GB.yml       | 24 -------------------
 .locales/admin.en_US.yml       | 24 -------------------
 .locales/admin.zh_CN.yml       | 24 -------------------
 .locales/global.en_GB.yml      | 44 ----------------------------------
 .locales/global.en_US.yml      | 44 ----------------------------------
 .locales/global.zh_CN.yml      | 44 ----------------------------------
 .locales/home.en_GB.yml        | 28 ----------------------
 .locales/home.en_US.yml        | 28 ----------------------
 .locales/home.zh_CN.yml        | 24 -------------------
 .locales/leaderboard.en_GB.yml |  3 ---
 .locales/leaderboard.en_US.yml |  3 ---
 .locales/leaderboard.zh_CN.yml |  3 ---
 .locales/login.en_GB.yml       | 10 --------
 .locales/login.en_US.yml       | 10 --------
 .locales/login.zh_CN.yml       | 10 --------
 .locales/logout.en_GB.yml      |  3 ---
 .locales/logout.en_US.yml      |  3 ---
 .locales/logout.zh_CN.yml      |  3 ---
 .locales/navbar.en_GB.yml      |  9 -------
 .locales/navbar.en_US.yml      |  9 -------
 .locales/navbar.zh_CN.yml      |  9 -------
 .locales/profile.en_GB.yml     | 13 ----------
 .locales/profile.en_US.yml     | 13 ----------
 .locales/profile.zh_CN.yml     | 13 ----------
 .locales/register.en_GB.yml    | 18 --------------
 .locales/register.en_US.yml    | 18 --------------
 .locales/register.zh_CN.yml    | 18 --------------
 .locales/settings.en_GB.yml    | 41 -------------------------------
 .locales/settings.en_US.yml    | 42 --------------------------------
 .locales/settings.zh_CN.yml    | 30 -----------------------
 .locales/verify.en_GB.yml      | 20 ----------------
 .locales/verify.en_US.yml      | 20 ----------------
 .locales/verify.zh_CN.yml      | 20 ----------------
 36 files changed, 643 deletions(-)
 delete mode 100644 .locales/404.en_GB.yml
 delete mode 100644 .locales/404.en_US.yml
 delete mode 100644 .locales/404.zh_CN.yml
 delete mode 100644 .locales/admin.en_GB.yml
 delete mode 100644 .locales/admin.en_US.yml
 delete mode 100644 .locales/admin.zh_CN.yml
 delete mode 100644 .locales/global.en_GB.yml
 delete mode 100644 .locales/global.en_US.yml
 delete mode 100644 .locales/global.zh_CN.yml
 delete mode 100644 .locales/home.en_GB.yml
 delete mode 100644 .locales/home.en_US.yml
 delete mode 100644 .locales/home.zh_CN.yml
 delete mode 100644 .locales/leaderboard.en_GB.yml
 delete mode 100644 .locales/leaderboard.en_US.yml
 delete mode 100644 .locales/leaderboard.zh_CN.yml
 delete mode 100644 .locales/login.en_GB.yml
 delete mode 100644 .locales/login.en_US.yml
 delete mode 100644 .locales/login.zh_CN.yml
 delete mode 100644 .locales/logout.en_GB.yml
 delete mode 100644 .locales/logout.en_US.yml
 delete mode 100644 .locales/logout.zh_CN.yml
 delete mode 100644 .locales/navbar.en_GB.yml
 delete mode 100644 .locales/navbar.en_US.yml
 delete mode 100644 .locales/navbar.zh_CN.yml
 delete mode 100644 .locales/profile.en_GB.yml
 delete mode 100644 .locales/profile.en_US.yml
 delete mode 100644 .locales/profile.zh_CN.yml
 delete mode 100644 .locales/register.en_GB.yml
 delete mode 100644 .locales/register.en_US.yml
 delete mode 100644 .locales/register.zh_CN.yml
 delete mode 100644 .locales/settings.en_GB.yml
 delete mode 100644 .locales/settings.en_US.yml
 delete mode 100644 .locales/settings.zh_CN.yml
 delete mode 100644 .locales/verify.en_GB.yml
 delete mode 100644 .locales/verify.en_US.yml
 delete mode 100644 .locales/verify.zh_CN.yml

diff --git a/.locales/404.en_GB.yml b/.locales/404.en_GB.yml
deleted file mode 100644
index c1948c75..00000000
--- a/.locales/404.en_GB.yml
+++ /dev/null
@@ -1,6 +0,0 @@
-en_GB:
-  '404': '404'
-  page-not-found: Page not found
-  where-am-i: Where am I?
-  check-url: Check that the URL you entered is correct.
-  make-sure-visit: Make sure that the place you are visiting isn't under maintenance!
diff --git a/.locales/404.en_US.yml b/.locales/404.en_US.yml
deleted file mode 100644
index 9f78cce2..00000000
--- a/.locales/404.en_US.yml
+++ /dev/null
@@ -1,6 +0,0 @@
-en_US:
-  '404': '404'
-  page-not-found: Page not found
-  where-am-i: Where am I?
-  check-url: Check that the URL you entered is correct.
-  make-sure-visit: Make sure that the place you are visiting isn't under maintenance!
diff --git a/.locales/404.zh_CN.yml b/.locales/404.zh_CN.yml
deleted file mode 100644
index 7f0bb9ed..00000000
--- a/.locales/404.zh_CN.yml
+++ /dev/null
@@ -1,6 +0,0 @@
-zh_CN:
-  '404': '404'
-  page-not-found: 找不到页面
-  where-am-i: 我是谁 我在哪 我在干什么?
-  check-url: 请检查下你输入的链接是否正确。
-  make-sure-visit: 或者确保你想访问的地方没有在维护中!
diff --git a/.locales/admin.en_GB.yml b/.locales/admin.en_GB.yml
deleted file mode 100644
index 1ae6520e..00000000
--- a/.locales/admin.en_GB.yml
+++ /dev/null
@@ -1,24 +0,0 @@
-en_GB:
-  base:
-    dashboard: Dashboard
-    admin: Admin
-    admin-panel: '%{appName} Admin Panel'
-    welcome-to-admin-panel: Welcome to %{appName} admin panel!
-    github: GitHub
-    discord: Discord
-    youtube: YouTube
-    twitter: Twitter
-    instagram: Instagram
-  please-login-in-first: Please login first.
-  you-have-sufficient-privileges: You have insufficient privileges
-  home:
-    total-users: total users
-    that-s-a-lot-of-people: that's a lot of people!
-    total-online: total online
-    rising-in-popularity-aren-t-we: rising in popularity are we?
-    latest-and-greatest-welcome: latest and greatest! welcome!
-    latest-user: latest user
-    total-banned: total banned
-    naughty-sad-face: naughty naughty :(
-    recent-users: Recent Users
-    recent-score: Recent Score
diff --git a/.locales/admin.en_US.yml b/.locales/admin.en_US.yml
deleted file mode 100644
index 5a37a75c..00000000
--- a/.locales/admin.en_US.yml
+++ /dev/null
@@ -1,24 +0,0 @@
-en_US:
-  base:
-    admin: Admin
-    dashboard: Dashboard
-    welcome-to-admin-panel: Welcome to %{appName} admin panel!
-    discord: Discord
-    admin-panel: '%{appName} Admin Panel'
-    instagram: Instagram
-    github: GitHub
-    twitter: Twitter
-    youtube: YouTube
-  please-login-in-first: Please login first.
-  you-have-sufficient-privileges: You have insufficient privileges
-  home:
-    that-s-a-lot-of-people: that's a lot of people!
-    total-users: total users
-    total-online: total online
-    latest-and-greatest-welcome: latest and greatest! welcome!
-    latest-user: latest user
-    naughty-sad-face: naughty naughty :(
-    recent-score: Recent Score
-    recent-users: Recent Users
-    rising-in-popularity-aren-t-we: rising in popularity are we?
-    total-banned: total banned
diff --git a/.locales/admin.zh_CN.yml b/.locales/admin.zh_CN.yml
deleted file mode 100644
index 68d2a9e6..00000000
--- a/.locales/admin.zh_CN.yml
+++ /dev/null
@@ -1,24 +0,0 @@
-zh_CN:
-  base:
-    admin: 管理员
-    dashboard: 控制面板
-    welcome-to-admin-panel: 欢迎来到 %{appName} 管理面板!
-    discord: Discord
-    admin-panel: '%{appName} 管理员面板'
-    instagram: Instagram
-    github: GitHub
-    twitter: 推特
-    youtube: YouTube
-  home:
-    that-s-a-lot-of-people: 好多人！
-    total-users: 总用户
-    total-online: 总在线
-    latest-and-greatest-welcome: 最新最热！欢迎！
-    latest-user: 最新用户
-    naughty-sad-face: 坏坏 :(
-    recent-score: 最近成绩
-    recent-users: 最新用户
-    rising-in-popularity-aren-t-we: 要火了咱们？
-    total-banned: 总被ban
-  please-login-in-first: 请先登录。
-  you-have-sufficient-privileges: 您的权限不足
diff --git a/.locales/global.en_GB.yml b/.locales/global.en_GB.yml
deleted file mode 100644
index cdbad34b..00000000
--- a/.locales/global.en_GB.yml
+++ /dev/null
@@ -1,44 +0,0 @@
-en_GB:
-  sign-up: Sign up
-  log-in: Log in
-  offline: Offline
-  online: Online
-  leaderboard: Leaderboard
-  login: Login
-  profile: Profile
-  register: Register
-  password: Password
-  warning: Warning
-  notice: Notice
-  error: uh oh! Be careful!
-  success: Hey! Listen!
-  verify: Verify
-  pp: pp
-  accuracy: Accuracy
-  score: Score
-  acc: Acc
-  playcount: Play Count
-  playtime: Play Time
-  max-combo: Max Combo
-  mode:
-    vanilla: Vanilla
-    relax: Relax
-    autopilot: Autopilot
-    taiko: osu!taiko
-    osu: osu!
-    catch: osu!catch
-    mania: osu!mania
-    VN: VN
-    RX: RX
-    AP: AP
-  ranked-score: Ranked score
-  total-score: Total Score
-  rank:
-    ss: SS
-    ssh: SS
-    s: S
-    sh: S
-    a: A
-  invalid-parameters: Invalid parameters.
-  you-are-already-logged-in: You're already logged in!
-  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
diff --git a/.locales/global.en_US.yml b/.locales/global.en_US.yml
deleted file mode 100644
index cebf4cc5..00000000
--- a/.locales/global.en_US.yml
+++ /dev/null
@@ -1,44 +0,0 @@
-en_US:
-  sign-up: Sign up
-  log-in: Log in
-  offline: Offline
-  online: Online
-  leaderboard: Leaderboard
-  login: Login
-  profile: Profile
-  register: Register
-  password: Password
-  warning: Warning
-  notice: Notice
-  error: uh oh! Be careful!
-  success: Hey! Listen!
-  verify: Verify
-  pp: pp
-  accuracy: Accuracy
-  score: Score
-  acc: Acc
-  playcount: Play Count
-  playtime: Play Time
-  max-combo: Max Combo
-  mode:
-    vanilla: Vanilla
-    relax: Relax
-    autopilot: Autopilot
-    taiko: osu!taiko
-    osu: osu!
-    catch: osu!catch
-    mania: osu!mania
-    VN: VN
-    RX: RX
-    AP: AP
-  ranked-score: Ranked score
-  total-score: Total Score
-  rank:
-    ss: SS
-    ssh: SS
-    s: S
-    sh: S
-    a: A
-  invalid-parameters: Invalid parameters.
-  you-are-already-logged-in: You're already logged in!
-  you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
diff --git a/.locales/global.zh_CN.yml b/.locales/global.zh_CN.yml
deleted file mode 100644
index 785f4cf3..00000000
--- a/.locales/global.zh_CN.yml
+++ /dev/null
@@ -1,44 +0,0 @@
-zh_CN:
-  sign-up: 注册
-  log-in: 登录
-  offline: 离线
-  online: 在线
-  leaderboard: 排行榜
-  login: 登录
-  profile: 用户信息
-  register: 注册
-  notice: Notice
-  warning: 注意
-  error: uh oh! Be careful!
-  success: Hey! Listen!
-  verify: 验证
-  acc: Acc
-  accuracy: 准确度
-  max-combo: 最大连击
-  mode:
-    AP: AP
-    RX: RX
-    VN: VN
-    autopilot: Autopilot
-    catch: osu!接水果
-    mania: osu!面条
-    osu: osu!
-    relax: Relax
-    taiko: osu!太鼓
-    vanilla: Vanilla
-  playcount: 游玩次数
-  playtime: 游玩时间
-  pp: pp
-  rank:
-    a: A
-    s: S
-    sh: S
-    ss: SS
-    ssh: SS
-  score: 分数
-  total-score: 总分
-  ranked-score: 记分总分
-  password: 密码
-  invalid-parameters: 请输入用户名密码以及邮箱
-  you-are-already-logged-in: 你已经登录啦!
-  you-must-be-logged-in-to-access-this-page: 你必须登录了才能访问该页面
diff --git a/.locales/home.en_GB.yml b/.locales/home.en_GB.yml
deleted file mode 100644
index 3a1bcbc7..00000000
--- a/.locales/home.en_GB.yml
+++ /dev/null
@@ -1,28 +0,0 @@
-en_GB:
-  subtitle-big: >-
-    We are an osu! private server built from the ground up with many unique
-    features not seen elsewhere - for more information, check out gulag and
-    guweb on GitHub - we're fully open source!
-  some-of-our-coolest-features: Some of our coolest features
-  features-title-1: PP for Relax and Autopilot
-  features-content-1: >-
-    Our server has unique pp formula for relax and autopilot.Good at waving your
-    cursor or just smashing your keyboard? Join %{appName} and get a fair reward
-    foryour skills!
-  features-title-2: Free osu!direct
-  features-content-2: >-
-    You won't have to pay for osu!supporter to have a convenient gameplay
-    experience in the client - osu!direct is available for everyone! Keep in
-    mind supporting us still grants a huge set of cool perks but absense of it
-    doesn't affect your game sessions!
-  features-title-3: Flexible library
-  features-content-3: >-
-    We're written on top of cmyui's multipurpose library allowing for a fully
-    asynchronous environment, both improving performance and the user's
-    experience in the long term!
-  what-are-you-waiting-for: What are you waiting for?
-  subtitle: >-
-    Join %{appName}! It's risk-free! You won't get your account banned on
-    official servers if you play here with us! And don't worry, as you can
-    always switch between the official servers and us at any time!
-  sign-up-for-free: Sign up for free
diff --git a/.locales/home.en_US.yml b/.locales/home.en_US.yml
deleted file mode 100644
index 6ecef70a..00000000
--- a/.locales/home.en_US.yml
+++ /dev/null
@@ -1,28 +0,0 @@
-en_US:
-  subtitle-big: >-
-    We are an osu! private server built from the ground up with many unique
-    features not seen elsewhere - for more information, check out gulag and
-    guweb on GitHub - we're fully open source!
-  some-of-our-coolest-features: Some of our coolest features
-  features-title-1: PP for Relax and Autopilot
-  features-content-1: >-
-    Our server has unique pp formula for relax and autopilot.Good at waving your
-    cursor or just smashing your keyboard? Join %{appName} and get a fair reward
-    foryour skills!
-  features-title-2: Free osu!direct
-  features-content-2: >-
-    You won't have to pay for osu!supporter to have a convenient gameplay
-    experience in the client - osu!direct is available for everyone! Keep in
-    mind supporting us still grants a huge set of cool perks but absense of it
-    doesn't affect your game sessions!
-  features-title-3: Flexible library
-  features-content-3: >-
-    We're written on top of cmyui's multipurpose library allowing for a fully
-    asynchronous environment, both improving performance and the user's
-    experience in the long term!
-  what-are-you-waiting-for: What are you waiting for?
-  subtitle: >-
-    Join %{appName}! It's risk-free! You won't get your account banned on
-    official servers if you play here with us! And don't worry, as you can
-    always switch between the official servers and us at any time!
-  sign-up-for-free: Sign up for free
diff --git a/.locales/home.zh_CN.yml b/.locales/home.zh_CN.yml
deleted file mode 100644
index d5424e55..00000000
--- a/.locales/home.zh_CN.yml
+++ /dev/null
@@ -1,24 +0,0 @@
-zh_CN:
-  subtitle-big: >-
-    欢迎来到 %{appName}, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜,
-    以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段,
-    如出现问题或有改进建议, 欢迎与我们联系与沟通.
-  some-of-our-coolest-features: 我们觉得最酷的一些功能
-  features-title-1: 对Relax 和 Autopilot mod的PP计算
-  features-content-1: >-
-    我们的服务器针对RX和AP有专门的PP计算算法。有超高的AIM移动能力但是左手无力？又或者左手超强的手速speed却不会移动AIM? 在
-    %{appName} 当中都可以完美发挥你的强项。
-  features-title-2: 免费的 osu!direct 服务
-  features-content-2: >-
-    你不用特意成为 osu!supporter 以此来提高你在客户端下图方面的体验。osu!direct 对所有人开放(并且使用的是国内的sayo镜像站)!
-    虽然如此,如果你愿意支持我们,你仍然可以获得一些超酷的特权。只不过这些特权并不会影响到你的game sessions!
-  features-title-3: Flexible library
-  features-content-3: >-
-    We're written on top of cmyui's multipurpose library allowing for a fully
-    asynchronous environment, both improving performance and the user's
-    experience in the long term!
-  what-are-you-waiting-for: 你 还 在 等 什 么?
-  subtitle: >-
-    赶紧加入到 %{appName} 当中吧! 没有风险!
-    并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
-  sign-up-for-free: 免 费 注 册！
diff --git a/.locales/leaderboard.en_GB.yml b/.locales/leaderboard.en_GB.yml
deleted file mode 100644
index 6e2e15aa..00000000
--- a/.locales/leaderboard.en_GB.yml
+++ /dev/null
@@ -1,3 +0,0 @@
-en_GB:
-  leaderboard: Leaderboard
-  there-are-no-players-to-display: there are no players to display!
diff --git a/.locales/leaderboard.en_US.yml b/.locales/leaderboard.en_US.yml
deleted file mode 100644
index 358619ab..00000000
--- a/.locales/leaderboard.en_US.yml
+++ /dev/null
@@ -1,3 +0,0 @@
-en_US:
-  leaderboard: Leaderboard
-  there-are-no-players-to-display: there are no players to display!
diff --git a/.locales/leaderboard.zh_CN.yml b/.locales/leaderboard.zh_CN.yml
deleted file mode 100644
index ee68e000..00000000
--- a/.locales/leaderboard.zh_CN.yml
+++ /dev/null
@@ -1,3 +0,0 @@
-zh_CN:
-  leaderboard: 排行榜
-  there-are-no-players-to-display: 这里没有符合条件的玩家可供显示!
diff --git a/.locales/login.en_GB.yml b/.locales/login.en_GB.yml
deleted file mode 100644
index 728d49eb..00000000
--- a/.locales/login.en_GB.yml
+++ /dev/null
@@ -1,10 +0,0 @@
-en_GB:
-  dont-have-an-account: Don't have an account?
-  register: Register
-  forgot-login: Forgot login?
-  username: Username
-  email: Email
-  password-incorrect: Password is incorrect.
-  restricted-not-allowed-to-login: Your account is restricted. You are not allowed to log in.
-  welcome-back: Hey, welcome back %{username}!
-  account-does-not-exist: Account does not exist.
diff --git a/.locales/login.en_US.yml b/.locales/login.en_US.yml
deleted file mode 100644
index cd8457ea..00000000
--- a/.locales/login.en_US.yml
+++ /dev/null
@@ -1,10 +0,0 @@
-en_US:
-  dont-have-an-account: Don't have an account?
-  register: Register
-  forgot-login: Forgot login?
-  username: Username
-  email: Email
-  password-incorrect: Password is incorrect.
-  restricted-not-allowed-to-login: Your account is restricted. You are not allowed to log in.
-  account-does-not-exist: Account does not exist.
-  welcome-back: Hey, welcome back %{username}!
diff --git a/.locales/login.zh_CN.yml b/.locales/login.zh_CN.yml
deleted file mode 100644
index 8a5d6d2b..00000000
--- a/.locales/login.zh_CN.yml
+++ /dev/null
@@ -1,10 +0,0 @@
-zh_CN:
-  dont-have-an-account: 还未拥有一个账号？
-  register: 注册
-  forgot-login: 忘记账号?
-  username: 你的用户名
-  email: 电子邮箱
-  password-incorrect: 密码错误
-  restricted-not-allowed-to-login: 你的账号被封禁了,因此我们不允许你登录
-  account-does-not-exist: 该账号并不存在
-  welcome-back: 欢迎回来 %{username}!
diff --git a/.locales/logout.en_GB.yml b/.locales/logout.en_GB.yml
deleted file mode 100644
index 89596321..00000000
--- a/.locales/logout.en_GB.yml
+++ /dev/null
@@ -1,3 +0,0 @@
-en_GB:
-  cannot-logout-if-not-logged-in: You can't logout if you aren't logged in!
-  succeed: Successfully logged out!
diff --git a/.locales/logout.en_US.yml b/.locales/logout.en_US.yml
deleted file mode 100644
index 90b413c1..00000000
--- a/.locales/logout.en_US.yml
+++ /dev/null
@@ -1,3 +0,0 @@
-en_US:
-  cannot-logout-if-not-logged-in: You can't logout if you aren't logged in!
-  succeed: Successfully logged out!
diff --git a/.locales/logout.zh_CN.yml b/.locales/logout.zh_CN.yml
deleted file mode 100644
index 8f15def2..00000000
--- a/.locales/logout.zh_CN.yml
+++ /dev/null
@@ -1,3 +0,0 @@
-zh_CN:
-  cannot-logout-if-not-logged-in: 你得先登录了才能够进行登出
-  succeed: 成功登出!
diff --git a/.locales/navbar.en_GB.yml b/.locales/navbar.en_GB.yml
deleted file mode 100644
index 6071c65e..00000000
--- a/.locales/navbar.en_GB.yml
+++ /dev/null
@@ -1,9 +0,0 @@
-en_GB:
-  home: Home
-  leaderboards: Leaderboards
-  information: Information
-  admin: Admin
-  profile: Profile
-  settings: Settings
-  logout: Logout
-  todo: Todo..
diff --git a/.locales/navbar.en_US.yml b/.locales/navbar.en_US.yml
deleted file mode 100644
index d2b503bd..00000000
--- a/.locales/navbar.en_US.yml
+++ /dev/null
@@ -1,9 +0,0 @@
-en_US:
-  home: Home
-  leaderboards: Leaderboards
-  information: Information
-  admin: Admin
-  profile: Profile
-  settings: Settings
-  logout: Logout
-  todo: Todo..
diff --git a/.locales/navbar.zh_CN.yml b/.locales/navbar.zh_CN.yml
deleted file mode 100644
index 8a22834e..00000000
--- a/.locales/navbar.zh_CN.yml
+++ /dev/null
@@ -1,9 +0,0 @@
-zh_CN:
-  home: 主页
-  leaderboards: 排行榜
-  information: Information
-  admin: 管理员
-  profile: 玩家资料
-  settings: 设置
-  logout: 登出
-  todo: 敬请期待
diff --git a/.locales/profile.en_GB.yml b/.locales/profile.en_GB.yml
deleted file mode 100644
index e0370f4e..00000000
--- a/.locales/profile.en_GB.yml
+++ /dev/null
@@ -1,13 +0,0 @@
-en_GB:
-  best-scores: Best Scores
-  no-scores-available: No scores available
-  try-playing-something: Try playing something
-  show-more: Show more
-  most-played-beatmaps: Most Played Beatmaps
-  no-beatmaps-available: No beatmaps available
-  statistics: Statistics
-  recent-scores: Recent Scores
-  by: by
-  global-rank: Global Rank
-  country-rank: Country Rank
-  name-aka: name aka
diff --git a/.locales/profile.en_US.yml b/.locales/profile.en_US.yml
deleted file mode 100644
index ed967bd7..00000000
--- a/.locales/profile.en_US.yml
+++ /dev/null
@@ -1,13 +0,0 @@
-en_US:
-  best-scores: Best Scores
-  no-scores-available: No scores available
-  try-playing-something: Try playing something
-  show-more: Show more
-  most-played-beatmaps: Most Played Beatmaps
-  no-beatmaps-available: No beatmaps available
-  statistics: Statistics
-  recent-scores: Recent Scores
-  by: by
-  country-rank: Country Rank
-  global-rank: Global Rank
-  name-aka: name aka
diff --git a/.locales/profile.zh_CN.yml b/.locales/profile.zh_CN.yml
deleted file mode 100644
index a83db250..00000000
--- a/.locales/profile.zh_CN.yml
+++ /dev/null
@@ -1,13 +0,0 @@
-zh_CN:
-  best-scores: 最好成绩
-  no-scores-available: 暂无有效成绩
-  try-playing-something: 尝试去游玩一会吧！
-  show-more: 展示更多
-  most-played-beatmaps: 游玩最多的铺面
-  no-beatmaps-available: 暂无有效铺面
-  statistics: 数据统计
-  recent-scores: 最近的成绩
-  by: 作者
-  country-rank: 国内排名
-  global-rank: 全球排名
-  name-aka: 别名
diff --git a/.locales/register.en_GB.yml b/.locales/register.en_GB.yml
deleted file mode 100644
index 95cae89f..00000000
--- a/.locales/register.en_GB.yml
+++ /dev/null
@@ -1,18 +0,0 @@
-en_GB:
-  registration: Registration
-  register: register
-  email: Email
-  already-have-an-account: Already have an account?
-  username: Username
-  currently-disabled: Registrations are currently disabled.
-  captcha-failed: Captcha failed.
-  username-syntax-is-invalid: Invalid username syntax.
-  username-cannot-contains-both-dash-and-space: Username may contain "_" or " ", but not both.
-  username-disallowed: Disallowed username; pick another.
-  username-already-taken-by-others: Username already taken by another user.
-  email-is-invalid: Invalid email syntax.
-  email-already-taken: Email already taken by another user.
-  password:
-    must-between-8-32-characters-in-length: Password must be 8-32 characters in length.
-    must-have-more-than-3-unique-characters: Password must have more than 3 unique characters.
-    too-simple: That password was deemed too simple.
diff --git a/.locales/register.en_US.yml b/.locales/register.en_US.yml
deleted file mode 100644
index a08dabab..00000000
--- a/.locales/register.en_US.yml
+++ /dev/null
@@ -1,18 +0,0 @@
-en_US:
-  registration: Registration
-  register: register
-  email: Email
-  already-have-an-account: Already have an account?
-  username: Username
-  captcha-failed: Captcha failed.
-  currently-disabled: Registrations are currently disabled.
-  email-already-taken: Email already taken by another user.
-  email-is-invalid: Invalid email syntax.
-  password:
-    must-have-more-than-3-unique-characters: Password must have more than 3 unique characters.
-    too-simple: That password was deemed too simple.
-    must-between-8-32-characters-in-length: Password must be 8-32 characters in length.
-  username-cannot-contains-both-dash-and-space: Username may contain "_" or " ", but not both.
-  username-already-taken-by-others: Username already taken by another user.
-  username-disallowed: Disallowed username; pick another.
-  username-syntax-is-invalid: Invalid username syntax.
diff --git a/.locales/register.zh_CN.yml b/.locales/register.zh_CN.yml
deleted file mode 100644
index 08fa5eef..00000000
--- a/.locales/register.zh_CN.yml
+++ /dev/null
@@ -1,18 +0,0 @@
-zh_CN:
-  registration: 注册
-  register: 注册账号
-  email: 电子邮箱
-  already-have-an-account: 已经拥有账号了?
-  username: 你的用户名
-  captcha-failed: Captcha failed.
-  currently-disabled: 注册功能目前正在禁用中
-  email-already-taken: 该电子邮箱已经被其他用户注册过了
-  email-is-invalid: 无效的邮箱格式
-  password:
-    must-have-more-than-3-unique-characters: 密码必须包含三个以上的特殊字符
-    too-simple: 这个密码看上去太简单了
-    must-between-8-32-characters-in-length: 密码的长度只能是8到32个字符之内
-  username-cannot-contains-both-dash-and-space: 用户名不能同时存在"_"和" "(空格)符号
-  username-already-taken-by-others: 该用户名已经被其他用户使用了
-  username-disallowed: 该用户名不允许被使用,请选择别的
-  username-syntax-is-invalid: 无效的用户名格式
diff --git a/.locales/settings.en_GB.yml b/.locales/settings.en_GB.yml
deleted file mode 100644
index 8636221d..00000000
--- a/.locales/settings.en_GB.yml
+++ /dev/null
@@ -1,41 +0,0 @@
-en_GB:
-  avatar: Avatar
-  avatar-description: >-
-    We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a
-    PNG, JPG under 5MB
-  choose-file: Choose file
-  save: Save
-  preview: Preview
-  customisation: Customisation
-  banner: Banner
-  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
-  profile-background: Profile Background
-  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password-change: Password Change
-  old-password: Old Password
-  new-password: New Password
-  repeat-password: Repeat Password
-  profile:
-    no-changes-have-been-made: No changes have been made.
-    username-changes-supporter-only: Username changes are currently a supporter perk.
-    new-username-is-invalid: Your new username syntax is invalid.
-    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
-    new-username-disallowed: Your new username isn't allowed; pick another.
-    new-username-already-taken-by-others: Your new username already taken by another user.
-    new-email-is-invalid: Your new email syntax is invalid.
-    succeed-please-login-again: Your username/email have been changed! Please login again.
-    _string: Profile
-  user-information: User Infomation
-  username: Username
-  settings: Settings
-  bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
-  change-succeed: Your %{something} has been successfully changed!
-  no-image-was-selected: No image was selected!
-  customization: Customization
-  password:
-    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
-    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
-    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
-    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
-    too-simple: Your new password was deemed too simple.
-    old-password-incorrect: Your old password is incorrect.
diff --git a/.locales/settings.en_US.yml b/.locales/settings.en_US.yml
deleted file mode 100644
index 96b69653..00000000
--- a/.locales/settings.en_US.yml
+++ /dev/null
@@ -1,42 +0,0 @@
-en_US:
-  avatar: Avatar
-  avatar-description: >-
-    We recommend an image of at least 512x512 (or 1:1 ratio).You can upload a
-    PNG, JPG under 5MB
-  choose-file: Choose file
-  save: Save
-  preview: Preview
-  customisation: Customisation
-  banner: Banner
-  banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
-  profile-background: Profile Background
-  profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-  password:
-    new-passoword-mismatch-repeated-password: Your new password doesn't match your repeated password!
-    new-passoword-cannot-be-same-as-old-password: Your new password cannot be the same as your old password!
-    must-between-8-32-characters-in-length: Your new password must be 8-32 characters in length.
-    must-have-more-than-3-unique-characters: Your new password must have more than 3 unique characters.
-    too-simple: Your new password was deemed too simple.
-    old-password-incorrect: Your old password is incorrect.
-    _string: Password
-  password-change: Password Change
-  old-password: Old Password
-  new-password: New Password
-  repeat-password: Repeat Password
-  profile:
-    no-changes-have-been-made: No changes have been made.
-    username-changes-supporter-only: Username changes are currently a supporter perk.
-    new-username-is-invalid: Your new username syntax is invalid.
-    new-username-cannot-contains-both-dash-and-space: Your new username may contain "_" or " ", but not both.
-    new-username-disallowed: Your new username isn't allowed; pick another.
-    new-username-already-taken-by-others: Your new username already taken by another user.
-    new-email-is-invalid: Your new email syntax is invalid.
-    succeed-please-login-again: Your username/email have been changed! Please login again.
-    _string: Profile
-  user-information: User Infomation
-  username: Username
-  settings: Settings
-  bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
-  change-succeed: Your %{something} has been successfully changed!
-  no-image-was-selected: No image was selected!
-  customization: Customization
diff --git a/.locales/settings.zh_CN.yml b/.locales/settings.zh_CN.yml
deleted file mode 100644
index abc9d429..00000000
--- a/.locales/settings.zh_CN.yml
+++ /dev/null
@@ -1,30 +0,0 @@
-zh_CN:
-  password:
-    new-passoword-mismatch-repeated-password: 你的新密码与确认密码不符
-    new-passoword-cannot-be-same-as-old-password: 你的新密码不能是旧密码
-    must-between-8-32-characters-in-length: 你的新密码只能在8到32个字符之间
-    must-have-more-than-3-unique-characters: 你的新密码必须包含三个以上的特殊字符
-    too-simple: 你的新密码看上去太简单了
-    old-password-incorrect: 你的旧密码有误
-    _string: 密码
-  profile: 玩家资料
-  avatar: 头像
-  avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片.并且图片大小低于5MB
-  choose-file: 选择一张图片
-  save: 保存
-  preview: 预览
-  customisation: 个性化
-  banner: 背景横幅
-  banner-description: 建议上传分辨率为 1440x262 的 GIF, PNG, JPG, JPEG 等四种格式的图片
-  profile-background: 资料背景
-  profile-background-description: 建议上传长宽比为 16:9  的 PNG, JPG, JPEG 格式的图片
-  password-change: 更改密码
-  old-password: 旧密码
-  new-password: 新密码
-  repeat-password: 确认新密码
-  user-information: 用户信息
-  username: 你的用户名
-  settings: 设置
-  bad-image-extension: 你选择的%{something}必须是 .jpg .jpeg .png 这三种文件之一
-  change-succeed: 你的 %{something}已经修改成功!
-  no-image-was-selected: 请选择一张图片
diff --git a/.locales/verify.en_GB.yml b/.locales/verify.en_GB.yml
deleted file mode 100644
index 4acf10b9..00000000
--- a/.locales/verify.en_GB.yml
+++ /dev/null
@@ -1,20 +0,0 @@
-en_GB:
-  verification: Verification
-  how-to-verify-your-account: How to verify your account
-  what-do-you-mean-this-must-be-easy-right: What do you mean? This must be easy right?
-  follow-these-three-simple-steps: Follow these three simple steps to get started playing %{appName} !
-  osu-shortcut: Osu shortcut
-  find-your-shortcut: Find your shortcut to osu on desktop and copy it!
-  edit-it: Edit it
-  right-click-properties: Right click -> Properties
-  find-target-element-box: Find "Target element" Box
-  add-domain: Add -devserver %{domain} at the end of it
-  login-to-your-account: Login to your account
-  login-to-your-app-name-account: Login to your %{appName} account and you should be done!
-  oh-crap-i-am-stuck: Oh crap! I'm stuck please help me!
-  need-help-join-discord-server: >-
-    Need help? We've got you covered - join the Discord so our community can
-    help you out!
-  click-here-to-join-our-discord: Click here to join our Discord!
-  waiting-for-verification: Waiting for verification!
-  follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
diff --git a/.locales/verify.en_US.yml b/.locales/verify.en_US.yml
deleted file mode 100644
index aff970e1..00000000
--- a/.locales/verify.en_US.yml
+++ /dev/null
@@ -1,20 +0,0 @@
-en_US:
-  verification: Verification
-  how-to-verify-your-account: How to verify your account
-  what-do-you-mean-this-must-be-easy-right: What do you mean? This must be easy right?
-  follow-these-three-simple-steps: Follow these three simple steps to get started playing %{appName} !
-  osu-shortcut: Osu shortcut
-  find-your-shortcut: Find your shortcut to osu on desktop and copy it!
-  edit-it: Edit it
-  right-click-properties: Right click -> Properties
-  find-target-element-box: Find "Target element" Box
-  add-domain: Add -devserver %{domain} at the end of it
-  login-to-your-account: Login to your account
-  login-to-your-app-name-account: Login to your %{appName} account and you should be done!
-  oh-crap-i-am-stuck: Oh crap! I'm stuck please help me!
-  need-help-join-discord-server: >-
-    Need help? We've got you covered - join the Discord so our community can
-    help you out!
-  click-here-to-join-our-discord: Click here to join our Discord!
-  waiting-for-verification: Waiting for verification!
-  follow-the-simple-instructions: Follow the simple instructions above and once you're done reload this page!
diff --git a/.locales/verify.zh_CN.yml b/.locales/verify.zh_CN.yml
deleted file mode 100644
index 6b92a375..00000000
--- a/.locales/verify.zh_CN.yml
+++ /dev/null
@@ -1,20 +0,0 @@
-zh_CN:
-  verification: 认证账号
-  how-to-verify-your-account: 如何来认证你的账号
-  what-do-you-mean-this-must-be-easy-right: 别想太复杂, 肯定很简单拉~。
-  follow-these-three-simple-steps: 跟随以下三个简单的步骤即可游玩 %{appName} 了!
-  osu-shortcut: Osu! 快捷方式
-  find-your-shortcut: 在桌面上寻找你的osu!快捷方式并复制一份 (如果没有，可以去osu!目录里创建一份)
-  edit-it: 修改属性
-  right-click-properties: 右键快捷方式,在菜单中找到 "属性" 选项,(一般在最下边)
-  find-target-element-box: 找到 "目标" 这一行
-  add-domain: 在文本的末尾添加 -devserver %{domain}
-  login-to-your-account: 登入你的账号
-  login-to-your-app-name-account: 登录你的 %{appName} 账号,然后就应该万事大吉了!
-  oh-crap-i-am-stuck: 妈的，我卡在这个步骤了,赶紧过来帮我一下
-  need-help-join-discord-server: >-
-    Need help? We've got you covered - join the Discord so our community can
-    help you out!
-  click-here-to-join-our-discord: Click here to join our Discord!
-  waiting-for-verification: 正在等待验证结果~
-  follow-the-simple-instructions: 只需按照上面的简单说明进行操作，完成后重新加载此页面！

From 5b4e2b0e287b2806b7bf3c572bd3f0573b0b5672 Mon Sep 17 00:00:00 2001
From: TrueRou <chenbohan911@163.com>
Date: Sat, 30 Jul 2022 13:22:04 +0000
Subject: [PATCH 125/278] totally remake admin panel

---
 blueprints/admin.py               | 260 ++++++++++-----
 blueprints/api.py                 |  26 --
 blueprints/frontend.py            |  19 ++
 constants/privileges.py           |  36 +++
 main.py                           |  51 ++-
 objects/varka.py                  |  11 +-
 static/css/bulma.css              |   2 +-
 static/css/pages/admin/style.css  | 520 +++++++++++++++++++++++++++++-
 static/js/main.js                 |  18 +-
 templates/admin/badges.html       |   7 -
 templates/admin/base.html         |  77 ++---
 templates/admin/beatmaps.html     | 326 +++++++++----------
 templates/admin/home.html         | 261 ++++++++-------
 templates/admin/log.html          | 108 -------
 templates/admin/privilege.html    |   7 -
 templates/admin/recentplay.html   |   7 -
 templates/admin/reports.html      |   7 -
 templates/admin/restrictions.html | 130 +-------
 templates/admin/search.html       | 105 ------
 templates/admin/users.html        | 283 ++++------------
 templates/admin/users_edit.html   | 178 +++-------
 21 files changed, 1240 insertions(+), 1199 deletions(-)
 delete mode 100644 blueprints/api.py
 create mode 100644 constants/privileges.py
 delete mode 100644 templates/admin/badges.html
 delete mode 100644 templates/admin/log.html
 delete mode 100644 templates/admin/privilege.html
 delete mode 100644 templates/admin/recentplay.html
 delete mode 100644 templates/admin/reports.html
 delete mode 100644 templates/admin/search.html

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 11418ba1..df19c22b 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -13,6 +13,10 @@
 from objects.utils import flash
 from objects import varka
 
+import datetime
+import timeago
+from blueprints.i18npy import t
+
 admin = Blueprint('admin', __name__)
 
 def dict_cmp(a: dict, b: dict):
@@ -35,45 +39,109 @@ async def home():
         return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
 
     # fetch data from database
-    counts = await glob.db.fetch(
+    dash_data = await glob.db.fetch(
         'SELECT COUNT(id) count, '
-        '(SELECT name FROM users ORDER BY id DESC LIMIT 1) AS `lastest_user`, '
-        '(SELECT COUNT(id) FROM users WHERE NOT priv & 1) AS `banned` '
+        '(SELECT name FROM users ORDER BY id DESC LIMIT 1) lastest_user, '
+        '(SELECT COUNT(id) FROM users WHERE NOT priv & 1) banned '
         'FROM users'
     )
 
-    data = {
-        "counts" : counts,
-        "recent_users": await varka.get_users(),
-        "recent_scores": await varka.get_scores()
-    }
+    recent_users = await glob.db.fetchall('SELECT * FROM users ORDER BY id DESC LIMIT 5')
+    recent_scores = await glob.db.fetchall(
+        'SELECT scores.*, maps.artist, maps.title, '
+        'maps.set_id, maps.creator, maps.version '
+        'FROM scores JOIN maps ON scores.map_md5 = maps.md5 '
+        'ORDER BY scores.id DESC LIMIT 5'
+    )
 
-    return await render_template('admin/home.html', data=data)
+    return await render_template(
+        'admin/home.html', dashdata=dash_data,
+        recentusers=recent_users, recentscores=recent_scores,
+        datetime=datetime, timeago=timeago
+    )
 
-@admin.route('/users', methods=['GET','POST'])
+@admin.route('/users', methods=['GET'])
 async def users():
-    if request.method == 'POST':
-        try:
-            try:
-                username = (await request.form)['username']
-                id = (await varka.get_user_username(username))['id']
-                return redirect(f'/admin/users/edit/{id}')
-            except:
-                email = (await request.form)['email']
-                id = (await varka.get_user_email(email))['id']
-                return redirect(f'/admin/users/edit/{id}')
-        except:
-            error = 'User not found!'
-            return await render_template('admin/users.html', query_data=await varka.get_users(), error=error)
-    return await render_template('admin/users.html', query_data=await varka.get_users())
+    """Render the homepage of guweb's admin panel."""
+    if not 'authenticated' in session:
+        return await flash('error', t('admin.please-login-in-first'), 'login')
+
+    if not session['user_data']['is_staff']:
+        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
+    result = request.args.get('search', type=str)
+    if result is None:
+        query_data = await varka.get_users()
+        result = ''
+    else:
+        query_data = await varka.get_users(search=result)
+    return await render_template('admin/users.html', query_data=query_data, search_value=result)
 
 @admin.route('/users/edit/<id>')
 async def users_edit(id:int):
+    """Render the homepage of guweb's admin panel."""
+    if not 'authenticated' in session:
+        return await flash('error', t('admin.please-login-in-first'), 'login')
+
+    if not session['user_data']['is_staff']:
+        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
+    
     query = await varka.get_user(id)
     return await render_template('admin/users_edit.html', search_data=query)
 
+@admin.route('/beatmaps/edit/<bid>')
+async def beatmaps_edit(bid:int):
+    if not 'authenticated' in session:
+        return await flash('error', t('admin.please-login-in-first'), 'login')
+
+    if not session['user_data']['is_staff']:
+        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
+    
+    status = request.args.get('status', type=int)
+    is_set = request.args.get('set', type=int) == 1
+    if is_set:
+        await glob.db.execute("UPDATE maps SET status=%s WHERE set_id=%s", [str(status), str(bid)])
+    else:
+        await glob.db.execute("UPDATE maps SET status=%s WHERE id=%s", [str(status), str(bid)])
+
+    query = await glob.db.fetch(
+        'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
+        '(SELECT COUNT(id) as `l` FROM maps WHERE `status`= 5) AS `l`, '
+        '(SELECT COUNT(id) as `p` FROM maps WHERE `status`= 0) AS `p`, '
+        '(SELECT COUNT(id) as `t` FROM maps) `t`'
+    )
+    counts = {
+        "ranked": query['r'], 
+        "loved": query['l'], 
+        "pending": query['p'], 
+        "total": query['t']
+    }
+    if is_set:
+        beatmaps = await glob.db.fetchall(
+        'SELECT set_id, id AS `map_id`, status, '
+        'artist, title, version AS `diff_name`, '
+        'total_length AS length, creator, mode, '
+        'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
+        'FROM maps WHERE set_id=%s ORDER BY id DESC '
+        'LIMIT 50 OFFSET 0', [str(bid)])
+    else:
+        beatmaps = await glob.db.fetchall(
+        'SELECT set_id, id AS `map_id`, status, '
+        'artist, title, version AS `diff_name`, '
+        'total_length AS length, creator, mode, '
+        'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
+        'FROM maps WHERE id=%s ORDER BY id DESC '
+        'LIMIT 50 OFFSET 0', [str(bid)])
+    return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps, search_word=str(bid))
+
 @admin.route('/users/update/<id>', methods=['POST']) # POST
 async def users_update(id:int):
+    """Render the homepage of guweb's admin panel."""
+    if not 'authenticated' in session:
+        return await flash('error', t('admin.please-login-in-first'), 'login')
+
+    if not session['user_data']['is_staff']:
+        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
+
     try:
         form = await request.form
         datadef: dict = await get('users', id)
@@ -81,29 +149,25 @@ async def users_update(id:int):
             name = form['edit-username'],
             safe_name = form['edit-username'].lower().replace(' ', '_'),
             email = form['edit-email'],
+            country = form['edit-country']
         )
-        try:
-            if form['edit-restrict']:
-                data['priv'] = 2
-                data['reason'] = form['res-reason']
-        except:
-            data['priv'] = 1
-            data['reason'] = None
+        if form['legality'] == 'restricted':
+            data['priv'] = 2
+        elif datadef['priv'] == 2 and form['legality'] == 'unrestricted':
+            data['priv'] = 3 
         await varka.update('users', ('id', id), **dict_cmp(data, datadef))
         return redirect('/admin/users')
     except: 
         return redirect('/admin/users')
 
-@admin.route('/reports')
-async def reports():
-    return await render_template('admin/reports.html')
-
-@admin.route('/recentplay')
-async def recentplay():
-    return await render_template('admin/recentplay.html')
-
 @admin.route('/restrictions', methods=['GET', 'POST'])
 async def restrictions():
+    if not 'authenticated' in session:
+        return await flash('error', t('admin.please-login-in-first'), 'login')
+
+    if not session['user_data']['is_staff']:
+        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
+
     error = ''
     if request.method == 'POST':
         try:
@@ -119,12 +183,21 @@ async def restrictions():
             error = 'User not found!'
     return await render_template('admin/restrictions.html', query_data=await varka.get_res_users(), error=error)
 
-@admin.route('/privilege')
-async def privilege():
-    return await render_template('admin/privilege.html')
+@admin.route('/beatmaps/<mode>')
+async def beatmaps(mode: str):
+    if not 'authenticated' in session:
+        return await flash('error', t('admin.please-login-in-first'), 'login')
 
-@admin.route('/beatmaps')
-async def beatmaps():
+    if not session['user_data']['is_staff']:
+        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
+
+    mode_vn = 0
+    if mode == 'taiko':
+        mode_vn = 1
+    if mode == 'catch':
+        mode_vn = 2
+    if mode == 'mania':
+        mode_vn = 3
     query = await glob.db.fetch(
         'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
         '(SELECT COUNT(id) as `l` FROM maps WHERE `status`= 5) AS `l`, '
@@ -143,41 +216,70 @@ async def beatmaps():
         'artist, title, version AS `diff_name`, '
         'total_length AS length, creator, mode, '
         'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
-        'FROM maps ORDER BY id DESC '
-        'LIMIT 10 OFFSET 0'
+        'FROM maps WHERE mode=%s ORDER BY id DESC '
+        'LIMIT 50 OFFSET 0', [mode_vn]
     )
     return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps)
 
-@admin.route('/badges')
-async def badges():
-    return await render_template('admin/badges.html')
-
-@admin.route('/logs')
-async def logs():
-    query_data = await glob.db.fetchall('SELECT * FROM logs ORDER BY id DESC LIMIT 25 OFFSET 0') #Preset offset for 'show more' button
-    lc = await glob.db.fetchall('SELECT COUNT(id) AS `n` FROM logs')
-    #Reassign stuff to make it look clean
-    userdata = []
-    for i in query_data:
-        mod = await glob.db.fetch('SELECT name, country FROM users WHERE id=%s', (i['from']))
-        user = await glob.db.fetch('SELECT name, country FROM users WHERE id=%s', (i['to']))
-        fdata = {
-            'logcount': str(lc[0]['n']), 'action_id': i['id'],
-            'u1_name': mod['name'], 'u1_id': i['from'],
-            'u1_country': mod['country'], 'u2_name': user['name'],
-            'u2_id': i['to'], 'u2_country': user['country'],
-            'time': i['time'], 'msg': i['msg'],
-        }
-        userdata.append(fdata)
-    print("\n", userdata, "\n")
-    return await render_template('admin/log.html', query_data=userdata)
-
-@admin.route('/api/search')
-async def search_api():
-    s = request.args.get('search', type=str)
-    res = await varka.get_users(search=s)
-    return jsonify(res)
-
-@admin.route('/search')
-async def search():
-    return await render_template('admin/search.html')
\ No newline at end of file
+@admin.route('/beatmaps/search')
+async def beatmaps_search():
+    if not 'authenticated' in session:
+        return await flash('error', t('admin.please-login-in-first'), 'login')
+
+    if not session['user_data']['is_staff']:
+        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
+
+    query = await glob.db.fetch(
+        'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
+        '(SELECT COUNT(id) as `l` FROM maps WHERE `status`= 5) AS `l`, '
+        '(SELECT COUNT(id) as `p` FROM maps WHERE `status`= 0) AS `p`, '
+        '(SELECT COUNT(id) as `t` FROM maps) `t`'
+    )
+    counts = {
+        "ranked": query['r'], 
+        "loved": query['l'], 
+        "pending": query['p'], 
+        "total": query['t']
+    }
+    bid = request.args.get('bid', type=str)
+    sid = request.args.get('sid', type=str)
+    name = request.args.get('name', type=str)
+    word = ''
+    if bid != None:
+        word = str(bid)
+        beatmaps = await glob.db.fetchall(
+        'SELECT set_id, id AS `map_id`, status, '
+        'artist, title, version AS `diff_name`, '
+        'total_length AS length, creator, mode, '
+        'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
+        'FROM maps WHERE id=%s ORDER BY id DESC '
+        'LIMIT 50 OFFSET 0', [bid]
+    )
+
+    if sid != None:
+        word = str(sid)
+        beatmaps = await glob.db.fetchall(
+        'SELECT set_id, id AS `map_id`, status, '
+        'artist, title, version AS `diff_name`, '
+        'total_length AS length, creator, mode, '
+        'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
+        'FROM maps WHERE set_id=%s ORDER BY id DESC '
+        'LIMIT 50 OFFSET 0', [sid]
+    )
+
+    if name != None:
+        word = str(name)
+        beatmaps = await glob.db.fetchall(
+        'SELECT set_id, id AS `map_id`, status, '
+        'artist, title, version AS `diff_name`, '
+        'total_length AS length, creator, mode, '
+        'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
+        'FROM maps WHERE title like %s ORDER BY id DESC '
+        'LIMIT 50 OFFSET 0', [name + '%']
+    )
+    return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps, search_word=word)
+
+
+@admin.route('/beatmaps')
+async def beatmaps_noargs():
+    return await beatmaps('osu')
\ No newline at end of file
diff --git a/blueprints/api.py b/blueprints/api.py
deleted file mode 100644
index 58f1e3a9..00000000
--- a/blueprints/api.py
+++ /dev/null
@@ -1,26 +0,0 @@
-from quart import Blueprint
-from quart import jsonify
-from quart import request
-
-from objects import glob
-
-api = Blueprint('apiv1', __name__)
-
-@api.route('/search')
-async def home():
-    q = request.args.get('q', type=str)
-    if not q:
-        return b'{}'
-
-    res = await glob.db.fetchall(
-        'SELECT id, name '
-        'FROM `users` '
-        'WHERE priv >= 3 AND `name` LIKE %s '
-        'LIMIT 5',
-        [q + '%%']
-    )
-
-    if (len(res) == 0):
-        return b'{}'
-    else:
-        return jsonify(res) 
\ No newline at end of file
diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 932374b6..c5ead5a8 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -573,6 +573,25 @@ async def logout():
     # render login
     return await flash('success', t('logout.succeed'), 'login')
 
+@frontend.route('/search')
+async def search_user():
+    q = request.args.get('q', type=str)
+    if not q:
+        return b'{}'
+
+    res = await glob.db.fetchall(
+        'SELECT id, name '
+        'FROM `users` '
+        'WHERE priv >= 3 AND `name` LIKE %s '
+        'LIMIT 5',
+        [q + '%%']
+    )
+
+    if (len(res) == 0):
+        return b'{}'
+    else:
+        return jsonify(res) 
+
 # social media redirections
 
 @frontend.route('/github')
diff --git a/constants/privileges.py b/constants/privileges.py
new file mode 100644
index 00000000..add174b9
--- /dev/null
+++ b/constants/privileges.py
@@ -0,0 +1,36 @@
+from __future__ import annotations
+
+from enum import IntEnum
+from enum import IntFlag
+from enum import unique
+
+__all__ = ("Privileges")
+
+
+@unique
+class Privileges(IntFlag):
+    """Server side user privileges."""
+
+    # privileges intended for all normal players.
+    legit = 1 << 0  # is an unbanned player.
+    active = 1 << 1  # has logged in to the server in-game.
+
+    # has bypass to low-ceiling anticheat measures (trusted).
+    whitelisted = 1 << 2
+
+    # donation tiers, receives some extra benefits.
+    supporter = 1 << 4
+    premium = 1 << 5
+
+    # notable users, receives some extra benefits.
+    alumni = 1 << 7
+
+    # staff permissions, able to manage server app.state.
+    tourment_manager = 1 << 10  # able to manage match state without host.
+    BN = 1 << 11  # able to manage maps ranked status.
+    manager = 1 << 12  # able to manage users (level 1).
+    administrator = 1 << 13  # able to manage users (level 2).
+    developer = 1 << 14  # able to manage full server app.state.
+
+    DONATOR = supporter | premium
+    STAFF = manager | administrator | developer
diff --git a/main.py b/main.py
index 15074922..4226ef27 100755
--- a/main.py
+++ b/main.py
@@ -5,6 +5,9 @@
 
 import os
 import random
+import time
+from datetime import datetime
+from constants.privileges import Privileges
 
 import aiohttp
 import i18n
@@ -68,6 +71,47 @@ def t(key, **kwargs) -> str:
 def appName() -> str:
     return glob.config.app_name
 
+@app.template_global()
+def decode_priv(target_priv: int) -> str:
+    priv_list = [
+                    priv.name for priv in Privileges if target_priv & priv and bin(priv).count("1") == 1
+                ][::-1]
+    if 'legit' in priv_list:
+        priv_list.remove('legit')
+    else:
+        priv_list.append('banned')
+    if 'active' not in priv_list:
+        priv_list.append('inactive')
+    return ', '.join(priv_list)
+
+@app.template_global()
+def decode_map_status(status: int) -> str:
+    if status == -1:
+        return 'NotSubmitted'
+    if status == 0:
+        return 'Pending'
+    if status == 1:
+        return 'UpdateAvailable'
+    if status == 2:
+        return 'Ranked'
+    if status == 3:
+        return 'Approved'
+    if status == 4:
+        return 'Qualified'
+    if status == 5:
+        return 'Loved'
+
+    priv_list = [
+                    priv.name for priv in Privileges if target_priv & priv and bin(priv).count("1") == 1
+                ][::-1]
+    if 'legit' in priv_list:
+        priv_list.remove('legit')
+    else:
+        priv_list.append('banned')
+    if 'active' not in priv_list:
+        priv_list.append('inactive')
+    return ', '.join(priv_list)
+
 @app.template_global()
 def rand() -> str:
     return str(random.randint(0,100000))
@@ -76,6 +120,10 @@ def rand() -> str:
 def captchaKey() -> str:
     return glob.config.hCaptcha_sitekey
 
+@app.template_global()
+def handle_timestamp(timestamp):
+    return time.strftime("%Y-%m-%d %H:%M", time.localtime(int(timestamp)))
+
 @app.template_global()
 def domain() -> str:
     return glob.config.domain
@@ -86,9 +134,6 @@ def domain() -> str:
 from blueprints.admin import admin
 app.register_blueprint(admin, url_prefix='/admin')
 
-from blueprints.api import api
-app.register_blueprint(api, url_prefix='/apiv1')
-
 @app.errorhandler(404)
 async def page_not_found(e):
     # NOTE: we set the 404 status explicitly
diff --git a/objects/varka.py b/objects/varka.py
index e6fb0aa5..4b323fda 100644
--- a/objects/varka.py
+++ b/objects/varka.py
@@ -2,10 +2,11 @@
 from quart import jsonify
 import json
 
-async def get_users(limit:int=25, search:str=None):
+async def get_users(limit:int=100, search:str=None):
     """Returns the all of a users."""
-    query = ['SELECT * FROM users']
+    query = ['SELECT * FROM users u']
     args = []
+    query.append('left join (select userid, ANY_VALUE(ip) as ip, ANY_VALUE(osu_stream) as osu_stream, max(datetime) as last_login from ingame_logins group by userid) as l on u.id = l.userid')
 
     if search:
         query.append("WHERE `name` LIKE %s")
@@ -13,10 +14,12 @@ async def get_users(limit:int=25, search:str=None):
         query.append("OR `email` LIKE %s")
         args.append(f'{search}%')
 
-    query.append(f'ORDER BY id DESC LIMIT %s')
+    query.append(f'ORDER BY u.id DESC LIMIT %s')
     args.append(limit)
     
+    
     query = ' '.join(query)
+    print (query)
     res = await glob.db.fetchall(query, args)
     return res
 
@@ -37,7 +40,7 @@ async def get_user_email(email:str):
     return res
 
 async def get_res_users():
-    query = ('SELECT * FROM users WHERE NOT priv & 1')
+    query = ('select ru.id, ru.country, ru.name,`logs`.msg, `logs`.time  from (SELECT * FROM `users` where NOT users.priv & 1) ru left join `logs` on ru.id=`logs`.to')
     res = await glob.db.fetchall(query)
     return res
 
diff --git a/static/css/bulma.css b/static/css/bulma.css
index a9a7be14..c859a7c8 100644
--- a/static/css/bulma.css
+++ b/static/css/bulma.css
@@ -5830,7 +5830,7 @@ button.dropdown-item {
 a.dropdown-item:hover,
 button.dropdown-item:hover {
     background-color: hsl(var(--main), 10%, 15%);
-    color: #0a0a0a
+    color: #fff
 }
 
 a.dropdown-item.is-active,
diff --git a/static/css/pages/admin/style.css b/static/css/pages/admin/style.css
index 824a2bcd..23ce492b 100644
--- a/static/css/pages/admin/style.css
+++ b/static/css/pages/admin/style.css
@@ -1,22 +1,518 @@
-.no-padding {
-    padding: 0px !important;
+.admin-con {
+    margin-top: 53px!important
 }
 
-.song-banner {
-    border-radius: 0px !important;
+.sidebar {
+    background: hsl(var(--main), 10%, 15%);
+    width: 230px;
+    top: 0;
+    left: 0;
+    z-index: 1;
+    background-size: cover;
+    background-position: 50%;
+    display: block;
+    transition: .5s cubic-bezier(.685, .0473, .346, 1);
 }
 
-.banner-bg {
+.sidebar .sidebar-wrapper {
     width: 100%;
-    height: 132px;
-    object-fit: cover;
+    min-height: 100%;
+    max-height: calc(100vh - 705px);
+    z-index: 4;
+    position: relative;
+    overflow: auto;
 }
 
-.col-9 {
-    transition: 0.2s ease;
+.sidebar .sidebar-wrapper>.nav [data-toggle=collapse]~div>ul>li>a .sidebar-normal {
+    margin: 0;
+    position: relative;
+    -webkit-transform: translateX(0);
+    transform: translateX(0);
+    opacity: 1;
+    white-space: nowrap;
+    display: block;
+    line-height: 23px;
+    z-index: 1;
+    color: hsla(0, 0%, 100%, .8)
 }
 
-.load {
-    filter: blur(2px) !important;
-    opacity: 0.5 !important;
+.sidebar .sidebar-wrapper>.nav [data-toggle=collapse]~div>ul>li>a i {
+    font-size: 17px;
+    line-height: 20px;
+    width: 26px
+}
+
+.sidebar .sidebar-wrapper [data-toggle=collapse]~div>ul>li:hover>a .sidebar-normal {
+    color: #fff
+}
+
+.sidebar .nav {
+    margin-top: 20px;
+    display: block;
+    margin-left: 0
+}
+
+.sidebar .nav li>a+div .nav {
+    margin-top: 5px
+}
+
+.sidebar .nav li>a+div .nav li>a {
+    margin-top: 0;
+    padding: 8px 8px
+}
+
+.sidebar .nav li>a {
+    margin: 10px 15px 0;
+    border-radius: 10px;
+    color: #fff;
+    display: block;
+    position: relative;
+    cursor: pointer;
+    padding: 10px 15px;
+    line-height: 1.625rem;
+    text-align: left
+}
+
+.sidebar .nav li:first-child>a {
+    margin: 0 15px
+}
+
+.sidebar .nav li:focus:not(.active)>a i, .sidebar .nav li:focus:not(.active)>a p, .sidebar .nav li:hover:not(.active)>a i, .sidebar .nav li:hover:not(.active)>a p {
+    color: #fff
+}
+
+.sidebar .nav li>a:hover {
+    background: #ff939314;
+    transform: translateY(-2px)
+}
+
+.sidebar .nav p {
+    margin: 0;
+    font-weight: 600;
+    color: hsla(0, 0%, 100%, .8);
+    line-height: 30px;
+    position: relative;
+    display: block;
+    height: auto;
+    white-space: nowrap
+}
+
+.sidebar .nav i {
+    font-size: 20px;
+    float: left;
+    margin-right: 12px;
+    line-height: 30px;
+    width: 34px;
+    text-align: center;
+    color: hsla(0, 0%, 100%, .8);
+    position: relative
+}
+
+.sidebar .logo {
+    position: relative;
+    padding: .5rem .7rem;
+    z-index: 4;
+    background: hsl(var(--main),37%,50%);
+}
+
+.sidebar .logo a.logo-normal {
+    display: block;
+    opacity: 1;
+    -webkit-transform: translateZ(0);
+    transform: translateZ(0)
+}
+
+.sidebar .logo p {
+    float: left;
+    font-size: 20px;
+    margin: 10px 10px;
+    color: #fff;
+    line-height: 20px;
+    font-family: Helvetica Neue, Helvetica, Arial, sans-serif
+}
+
+.sidebar .logo .simple-text {
+    text-transform: uppercase;
+    padding: .5rem 0;
+    display: block;
+    white-space: nowrap;
+    color: #fff;
+    text-decoration: none;
+    font-weight: 500;
+    line-height: 30px;
+    overflow: hidden;
+    text-align: center
+}
+
+.sidebar .user {
+    padding-bottom: 20px;
+    margin: 20px auto 0;
+    position: relative
+}
+
+.sidebar .user:after {
+    content: "";
+    position: absolute;
+    bottom: 0;
+    right: 15px;
+    height: 1px;
+    width: calc(100% - 30px);
+    background: hsla(0, 0%, 100%, .5)
+}
+
+.sidebar .user a {
+    color: #fff;
+    text-decoration: none;
+    padding: .5rem 15px;
+    white-space: nowrap
+}
+
+.footer {
+    margin-top: 0
+}
+
+.content:not(:last-child) {
+    margin: 0
+}
+
+.admin-con {
+    flex-grow: 1
+}
+
+li {
+    list-style-type: none;
+    margin: 0;
+    padding: 0
+}
+
+.nav-link .icon {
+    font-size: 16px;
+    padding-right: 18px
+}
+
+.nav-link .name {
+    font-size: 14px;
+    font-weight: 500
+}
+
+.column {
+    padding: 24px 26px
+}
+
+.content h2 {
+    margin-bottom: .2em
+}
+
+.section-lead {
+    color: #b5b5b5
+}
+
+.section {
+    padding: 1rem 0
+}
+
+.is-avatar {
+    width: 5%;
+    flex: inherit;
+    margin-right: 20px;
+    border-radius: 12px
+}
+
+.header-avatar {
+    border-radius: 12px
+}
+
+.card {
+    border-radius: 8px;
+    color: #fff;
+    padding: 10px;
+    position: relative;
+    border: 0;
+    background: hsl(var(--main),15%,25%);
+}
+
+.card .stat {
+    border-top: 1px solid rgba(255, 255, 255, .3);
+    font-size: 8px;
+    margin-top: 6px;
+    padding: 10px 10px 0;
+    text-transform: uppercase
+}
+
+.card .title {
+    display: inline-block;
+    font-size: 8px;
+    padding: 10px 10px 0;
+    text-transform: uppercase
+}
+
+.card .value {
+    font-size: 28px;
+    padding: 0 10px
+}
+
+.recent-beat {
+    margin-top: 20px
+}
+
+.recent-beat .section-title {
+    font-size: 20px
+}
+
+.title:not(:last-child) {
+    margin-bottom: 0
+}
+
+.user-block {
+    transition: .2s ease
+}
+
+.user-block {
+    display: flex;
+    border-radius: 8px;
+    padding: 12px;
+    font-weight: 700;
+    line-height: 1.3;
+    align-items: center;
+    overflow: hidden;
+    height: 76px;
+    margin-top: 8px
+}
+
+.user-block {
+    background-color: #413030;
+    color: #fff
+}
+
+.user-block:hover {
+    box-shadow: 0 0 1px rgba(0, 0, 0, .04), 0 4px 8px rgba(0, 0, 0, .04), 0 16px 24px rgba(0, 0, 0, .04), 0 24px 32px rgba(0, 0, 0, .04);
+    color: #fff;
+    transform: translateY(-5px)
+}
+
+.avatar-picture {
+    width: 58px;
+    border-radius: 6px;
+    margin-right: 8px
+}
+
+.profile-flag {
+    width: 18px
+}
+
+.unverified {
+    background: #3c3c3c
+}
+
+.unverified .target-button {
+    background: #4c4a4a!important
+}
+
+.user-artist, .user-mapper, .user-title {
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    font-size: 12
+}
+
+.user-artist {
+    font-size: 11px;
+    font-weight: 500
+}
+
+.user-footer {
+    display: flex;
+    justify-content: space-between;
+    align-items: baseline;
+    margin-top: 8px;
+    font-size: 16px;
+    font-weight: 600;
+    color: #fff;
+    white-space: nowrap
+}
+
+.user-footer .target-button {
+    background-color: #5d4343;
+    border-radius: 6px;
+    padding: 4.5px 7px;
+    font-size: 12px;
+    margin-left: 10px;
+    transition: .2s background-color;
+    color: #ff679b
+}
+
+.user-stats {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    min-width: 0
+}
+
+.user-link {
+    width: 400px;
+    overflow: hidden
+}
+
+span.user-mapper {
+    padding-right: 8px
+}
+
+.d-flex.align-items-baseline {
+    display: flex
+}
+
+.extra-block {
+    width: 100%;
+    display: flex;
+    justify-content: center
+}
+
+.map-single {
+    height: 76px;
+    min-width: 0;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding-right: 0;
+    margin: 8px 0 0 0;
+    padding: 8px;
+    border-radius: 8px;
+    overflow: hidden;
+    background: #413030;
+    transition: .2s ease;
+    cursor: pointer
+}
+
+.map-single:hover {
+    border-radius: 8px;
+    transform: translateY(-5px);
+    box-shadow: 0 0 1px rgba(0, 0, 0, .04), 0 4px 8px rgba(0, 0, 0, .04), 0 16px 24px rgba(0, 0, 0, .04), 0 24px 32px rgba(0, 0, 0, .04)
+}
+
+.map-content1 {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    height: 100%;
+    min-width: 0;
+    flex: 1
+}
+
+.map-title {
+    font-size: 14px;
+    display: flex;
+    font-weight: 500;
+    align-items: center;
+    white-space: nowrap
+}
+
+.map-title-block {
+    display: flex;
+    flex-direction: column;
+    line-height: 1;
+    margin-left: 6px;
+    min-width: 0;
+    padding-right: 12px;
+    flex: 2
+}
+
+.map-date {
+    font-size: 10px;
+    font-weight: 500;
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-start
+}
+
+.map-date>time {
+    margin-top: 2px
+}
+
+.map-content2 {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    line-height: 1.2;
+    align-items: flex-end;
+    justify-content: center
+}
+
+.map-pp {
+    font-weight: 700;
+    color: #cc5288;
+    font-size: 20px
+}
+
+.map-acc {
+    font-size: 12px;
+    display: flex;
+    justify-content: flex-end
+}
+
+.main-stats {
+    display: flex;
+    flex-direction: column;
+    color: #fff;
+    height: 100%;
+    justify-content: space-between
+}
+
+.rank-single {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    line-height: 1
+}
+
+.rank-block {
+    margin: auto 0
+}
+
+.score-details_right-block {
+    display: flex;
+    flex-direction: row;
+    align-items: flex-end;
+    height: 100%;
+    min-width: 140px;
+    justify-content: center;
+    padding-right: 14px;
+    padding-left: 20px;
+    position: relative;
+    border-radius: 0 10px 10px 0;
+    z-index: 0;
+    margin-left: 6px;
+    align-items: center
+}
+
+.score-details_pp-block {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-end;
+    height: 100%;
+    justify-content: center;
+    position: relative;
+    border-radius: 0 10px 10px 0;
+    z-index: 0;
+    margin-left: 6px;
+    margin-right: 12px
+}
+
+.score-details {
+    height: 100%;
+    align-items: flex-end
+}
+
+.score-details_grade-block .rank-single {
+    margin: 0
+}
+
+.score-details_grade-block .map-rank {
+    font-size: 32px
+}
+
+.map-image-picture {
+    width: 64px;
+    height: 45px;
+    border-radius: 6px;
+    object-fit: cover
 }
\ No newline at end of file
diff --git a/static/js/main.js b/static/js/main.js
index 9940bac3..fbbc805a 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -19,14 +19,14 @@ function togglenavbar() {
 function search() {
     const value = document.getElementById('u-search').value
     document.getElementById('u-search-content').innerHTML = "";
-    $.get('//osu.' + the_domain + '/apiv1/search?q=' + value, function(data, status) {
+    $.get('//osu.' + the_domain + '/search?q=' + value, function(data, status) {
         if (data != '{}') {
             document.getElementById('u-search-content').style = ''
             $.each(data, function(e, n){
                 var result = ({
                     title: n.name,
                     url: "/u/" + n.id,
-                    image: 'https://a.ppy.sb/' + n.id
+                    image: '//a.' + the_domain + '/' + n.id
                 })
                 var root = document.createElement('a')
                 root.href = result.url
@@ -45,5 +45,15 @@ function search() {
             document.getElementById('u-search-content').style = 'display: none;'
         }
     })
-    
-}
\ No newline at end of file
+}
+
+function admin_search() {
+    var search = document.getElementById('search-bar').value
+    window.location.href='//osu.' + the_domain + '/admin/users?search=' + search
+}
+
+function map_admin_search(name) {
+    var search = document.getElementById('search-bar').value
+    window.location.href='//osu.' + the_domain + '/admin/beatmaps/search?' + name + '=' + search
+}
+
diff --git a/templates/admin/badges.html b/templates/admin/badges.html
deleted file mode 100644
index 6ca7310d..00000000
--- a/templates/admin/badges.html
+++ /dev/null
@@ -1,7 +0,0 @@
-<!-- For handling out badges? I think? -->
-{% extends 'admin/base.html' %}
-{% block title %} Badges {% endblock %}
-
-{% block content %}
-
-{% endblock %}
\ No newline at end of file
diff --git a/templates/admin/base.html b/templates/admin/base.html
index 1169d376..d07cedf6 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -19,13 +19,13 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <!-- jquery -->
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.min.js"
+    integrity="sha512-/DXTXr6nQodMUiq+IUJYCt2PPOUjrHJ9wFrqpJ3XkgPNOZVfMok7cRw6CSxyCQxXn6ozlESsSh1/sMCTF1rL/g=="
+    crossorigin="anonymous"></script>
 
   <!-- bulma -->
   <link rel="stylesheet" href="/static/css/bulma.css?v={{ rand() }}" />
 
-  <link rel="stylesheet" href="https://unpkg.com/@tabler/core@latest/dist/css/tabler.min.css">
-
   <!-- font awesome -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
 
@@ -49,61 +49,36 @@
           <div id="style-3" class="sidebar-wrapper">
             <div class="logo"><a class="simple-text logo-normal">{{ t('admin.base.admin-panel', appName = appName()) }}</a></div>
             <ul class="nav">
-              <li class="nav-item"><a class="nav-link"><span class="icon"><i class="fa fa-home"></i></span> <span
+              <li class="nav-item"><a class="nav-link" href="/admin/dashboard"><span class="icon"><i class="fa fa-home"></i></span> <span
                     class="name">{{ t('admin.base.dashboard') }}</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/users"><span class="icon"><i class="fa fa-user"></i></span> <span
+                class="name">Users</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/restrictions"><span class="icon"><i class="fa fa-user"></i></span> <span
+                class="name">Restrictions</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/beatmaps"><span class="icon"><i class="fa fa-user"></i></span> <span
+                class="name">Beatmaps</span></a></li>
             </ul>
           </div>
         </div>
       </div>
-      <div class="page-wrapper">
-        <div class="container-xl">
-          <!-- Page title -->
-          <div class="page-header d-print-none">
-            <div class="row align-items-center">
-              <div class="col">
-                <!-- Page pre-title -->
-                <div class="page-pretitle">
-                  {% block stitle %}
-                  {% endblock %}
-                </div>
-                <h2 class="page-title">
-                  {% block htitle %}
-                  {% endblock %}
-                </h2>
-              </div>
-            </div>
-          </div>
-        </div>
-        <div class="page-body">
-          <div class="container-xl">
-            {% block content %}
-            {% endblock %}
-          </div>
-        </div>
-        <footer class="footer footer-transparent d-print-none">
-          <div class="container">
-            <div class="flex-row-reverse text-center row align-items-center">
-              <div class="col-lg-auto ms-lg-auto">
-                <ul class="mb-0 list-inline list-inline-dots">
-                </ul>
-              </div>
-              <div class="mt-3 col-12 col-lg-auto mt-lg-0">
-                <ul class="mb-0 list-inline list-inline-dots">
-                  <li class="list-inline-item">
-                    Copyright © 2021
-                    <a href="." class="link-secondary">{{ appName() }}</a>.
-                    All rights reserved.
-                  </li>
-                </ul>
-              </div>
-            </div>
-          </div>
-        </footer>
+      <div class="column content" style="min-height: 1000px;">
+        <section class="section">
+          {% block content %}
+          {% endblock %}
+        </section>
       </div>
     </div>
-    <script src="https://preview.tabler.io/dist/libs/apexcharts/dist/apexcharts.min.js"></script>
-    <script src="https://unpkg.com/@tabler/core@latest/dist/js/tabler.min.js"></script>
-    {% block scriptb %}{% endblock scriptb %}
+  </div>
+
+  <!-- footer -->
+  <footer class="footer">
+    <div class="content">
+      <span>{{ appName() }} <strong>v{{ appVersion() }}</strong></span>
+    </div>
+  </footer>
+
+  <!-- main js script -->
+  <script src="/static/js/main.js" crossorigin="anonymous"></script>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 40c41970..c27d0ef0 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -1,191 +1,157 @@
 {% extends 'admin/base.html' %}
 {% block title %} Beatmaps {% endblock %}\
 
-{% macro card(title='base', haschart=true, chartname='base', data=0) %}
-<div class="card">
-    <div class="card-body">
-        <div class="d-flex align-items-center">
-            <div class="subheader">{{ title }}</div>
-        </div>
-        <div class="d-flex align-items-baseline">
-            <div class="h1 mb-0 me-2">{{ data }}</div>
-        </div>
-    </div>
-    {% if haschart %}
-    <div id="chart-{{ chartname }}" class="chart-sm"></div>
-    {% endif %}
-</div>
-{% endmacro %}
-
-
 {% block content %}
-<!-- Beatmap Number -->
 <div class="row row-deck row-cards">
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total beatmaps in database', data=counts['total'], chartname='total-beatmaps') }}
-    </div>
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total ranked beatmaps', data=counts['ranked'], chartname='ranked-beatmaps') }}
-    </div>
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total loved beatmaps', data=counts['loved'], chartname='loved-beatmaps') }}
-    </div>
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Total Pending beatmaps', data=counts['pending'], chartname='pending-beatmaps') }}
-    </div>
-    <div class="col-12">
-        <div class="card">
-            <div class="card-body border-bottom py-3">
-                <div class="d-flex">
-                    <div class="text-muted">
-                        Show
-                        <div class="mx-2 d-inline-block">
-                            <input type="text" class="form-control form-control-sm" value="10" size="3"
-                                aria-label="Users count">
-                        </div>
-                        entries
-                    </div>
-                    <div class="ms-auto text-muted">
-                        Search:
-                        <div class="ms-2 d-inline-block">
-                            <input type="text" class="form-control form-control-sm" aria-label="Search invoice">
-                        </div>
-                    </div>
-                </div>
+    <div class="columns is-marginless is-paddingless">
+        <div class="column is-paddingless p-3">
+            <a href="/admin/beatmaps/osu" class="button" style="width: 100%; margin-bottom: 10px">osu!</a>
+            <div class="card">
+                <div class="title">Total beatmaps</div>
+                <i class="fa fa-plus"></i>
+                <div class="value">{{ counts['total'] }}</div>
+                <div class="stat">That's a lot of maps</div>
             </div>
-            <div class="table-responsive">
-                <table class="table card-table table-vcenter text-nowrap datatable">
-                    <thead style="text-align: center;">
-                        <tr>
-                            <th>
-                                Beatmap
-                            </th>
-                            <th>
-                                Mode
-                            </th>
-                            <th>
-                                CS / Keys
-                            </th>
-                            <th>
-                                AR
-                            </th>
-                            <th>
-                                HP
-                            </th>
-                            <th>
-                                OD
-                            </th>
-                            <th>
-                                BPM
-                            </th>
-                            <th>
-                                Length
-                            </th>
-                            <th>
-                                Stars
-                            </th>
-                            <th>
-                                Manage Status
-                            </th>
-                        </tr>
-                    </thead>
-                    <tbody style="text-align: center;">
-                        {% for i in bmap_query %}
-                        <tr>
-                            <td class="no-padding">
-                                <div class="card song-banner"
-                                    style="background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size:cover">
-                                    <div class="card-body" style="background-color: rgba(0, 0, 0, 0.45);">
-                                        <a href="https://osu.ppy.sh/beatmapsets/{{ i.set_id }}" target="_blank"
-                                            class="text-white">{{ i.artist }} + {{ i.creator }} -
-                                            <br />{{ i.title }}. [{{ i.diff_name }}]</a>
-                                    </div>
-                                </div>
-                            </td>
-                            <td>
-                                {{ i.mode }}
-                            </td>
-                            <td>
-                                {{ i.cs }}
-                            </td>
-                            <td>
-                                {{ i.ar }}
-                            </td>
-                            <td>
-                                {{ i.hp }}
-                            </td>
-                            <td>
-                                {{ i.od }}
-                            </td>
-                            <td>
-                                {{ i.bpm }}
-                            </td>
-                            <td>
-                                {{ i.length }}
-                            </td>
-                            <td>
-                                {{ i.stars }}
-                            </td>
-                            <td> <!-- TODO: Add js script to display correct status here -->
-                                <button type="button" class="btn dropdown-toggle" data-bs-toggle="dropdown">⠀
-                                    Status Here
-                                </button>
-                                <div class="dropdown-menu">
-                                    <a class="btn1a dropdown-item" href="#">
-                                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
-                                            class="bi bi-chevron-double-up" viewBox="0 0 16 16" style="color: #00cf97;">
-                                            <path fill-rule="evenodd"
-                                                d="M7.646 2.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 3.707 2.354 9.354a.5.5 0 1 1-.708-.708l6-6z" />
-                                            <path fill-rule="evenodd"
-                                                d="M7.646 6.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 7.707l-5.646 5.647a.5.5 0 0 1-.708-.708l6-6z" />
-                                        </svg>⠀
-                                        Ranked
-                                    </a>
-                                    <a class="btn2a dropdown-item" href="#">
-                                        <i class="fas fa-heart" style="color: rgb(255, 172, 237);"></i>⠀
-                                        Loved
-                                    </a>
-                                    <a class="btn3a dropdown-item" href="#">
-                                        <i class="fas fa-question"></i>⠀
-                                        Unranked
-                                    </a>
-                                </div>
-                            </td>
-                        </tr>
-                        {% endfor %}
-                    </tbody>        
-                </table>
+        </div>
+        <div class="column is-paddingless p-3">
+            <a href="/admin/beatmaps/taiko" class="button" style="width: 100%; margin-bottom: 10px">osu!taiko</a>
+            <div class="card">
+                <div class="title">Ranked</div>
+                <i class="fa fa-bolt"></i>
+                <div class="value">{{ counts['ranked'] }}</div>
+                <div class="stat">These maps can gain many pp</div>
             </div>
-            <div class="card-footer d-flex align-items-center">
-                <ul class="pagination m-0 m-auto">
-                    <li class="page-item">
-                        <a class="page-link" href="#" tabindex="-1">
-                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
-                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
-                                stroke-linecap="round" stroke-linejoin="round">
-                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
-                                <polyline points="15 6 9 12 15 18"></polyline>
-                            </svg>
-                        </a>
-                    </li>
-                    <li class="page-item active"><a class="page-link" href="#">1</a></li>
-                    <li class="page-item"><a class="page-link" href="#">2</a></li>
-                    <li class="page-item"><a class="page-link" href="#">3</a></li>
-                    <li class="page-item"><a class="page-link" href="#">4</a></li>
-                    <li class="page-item"><a class="page-link" href="#">5</a></li>
-                    <li class="page-item">
-                        <a class="page-link" href="#">
-                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
-                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
-                                stroke-linecap="round" stroke-linejoin="round">
-                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
-                                <polyline points="9 6 15 12 9 18"></polyline>
-                            </svg>
-                        </a>
-                    </li>
-                </ul>
+        </div>
+        <div class="column is-paddingless p-3">
+            <a href="/admin/beatmaps/catch" class="button" style="width: 100%; margin-bottom: 10px">osu!catch</a>
+            <div class="card">
+                <div class="title">Loved</div>
+                <i class="fa fa-heart"></i>
+                <div class="value">{{ counts['loved'] }}</div>
+                <div class="stat">We loved them so much</div>
+            </div>
+        </div>
+        <div class="column is-paddingless p-3">
+            <a href="/admin/beatmaps/mania" class="button" style="width: 100%; margin-bottom: 10px">osu!mania</a>
+            <div class="card">
+                <div class="title">Pending</div>
+                <i class="fa fa-arrows-rotate"></i>
+                <div class="value">{{ counts['pending'] }}</div>
+                <div class="stat">They are also good maps</div>
             </div>
         </div>
     </div>
+    <div class="column is-paddingless" style="margin: 20px">
+        <div class="columns is-marginless">
+            <div class="column is-paddingless">
+                <input id="search-bar" class="input" value="{{ search_word }}">
+            </div>
+            <div style="margin-left: 20px" class="column is-paddingless">
+                <button onclick="map_admin_search('bid')" class="button" style="width: 200px">Search by BID</button>
+                <button onclick="map_admin_search('sid')" class="button" style="width: 200px">Search by SID</button>
+                <button onclick="map_admin_search('name')" class="button" style="width: 200px">Search by Name</button>
+            </div>
+        </div>
+    </div>
+    <div class="table-responsive">
+        <table class="table card-table table-vcenter text-nowrap datatable">
+            <thead style="text-align: center;">
+                <tr>
+                    <th>Beatmap</th>
+                    <th>CS / Keys</th>
+                    <th>AR</th>
+                    <th>HP</th>
+                    <th>OD</th>
+                    <th>BPM</th>
+                    <th>Stars</th>
+                    <th>Status</th>
+                    <th>Actions</th>
+                </tr>
+            </thead>
+            <tbody style="text-align: center;">
+                {% for i in bmap_query %}
+                <tr>
+                    <td class="no-padding">
+                        <div onclick="window.open('https://osu.ppy.sh/beatmapsets/{{ i.set_id }}')"
+                            class="card song-banner"
+                            style="cursor:pointer; background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size:cover; height: 140px; width: 450px;">
+                            <div class="card-body" style="background-color: rgba(0, 0, 0, 0.8);">
+                                <a class="play-detail__title">{{ i.title }}
+                                    <small style="display: inline;">by {{ i.creator }}</small>
+                                </a>
+                                <span style="color: #ea0; font-size: 14px">Skystar's Tragic Love Extra</span>
+                            </div>
+                        </div>
+                    </td>
+                    <td class="bigger_td">
+                        {{ i.cs }}
+                    </td>
+                    <td class="bigger_td">
+                        {{ i.ar }}
+                    </td>
+                    <td class="bigger_td">
+                        {{ i.hp }}
+                    </td>
+                    <td class="bigger_td">
+                        {{ i.od }}
+                    </td>
+                    <td class="bigger_td">
+                        {{ i.bpm }}
+                    </td>
+                    <td class="bigger_td">
+                        {{ i.stars }}
+                    </td>
+                    <td class="bigger_td">
+                        {{ decode_map_status(i.status) }}
+                    </td>
+                    <td>
+                        <div>
+                            <a class="button" href="/admin/beatmaps/edit/{{ i.map_id }}?status=2&set=0">Ranked</a>
+                            <a class="button" href="/admin/beatmaps/edit/{{ i.map_id }}?status=5&set=0">Loved</a>
+                            <a class="button" href="/admin/beatmaps/edit/{{ i.map_id }}?status=3&set=0">Approved</a>
+                            <a class="button" href="/admin/beatmaps/edit/{{ i.map_id }}?status=0&set=0">Pending</a>
+                        </div>
+                        <div style="margin-top: 10px">
+                            <a class="button" href="/admin/beatmaps/edit/{{ i.set_id }}?status=2&set=1">Ranked Set</a>
+                            <a class="button" href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">Loved Set</a>
+                            <a class="button" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">Approved Set</a>
+                            <a class="button" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">Pending Set</a>
+                        </div>
+                        <div style="margin-top: 10px">
+                            <a class="button" href="/admin/beatmaps/sync/{{ i.set_id }}">
+                                Sync Beatmapsets with Bancho
+                            </a>
+                        </div>
+                    </td>
+                </tr>
+                {% endfor %}
+            </tbody>
+        </table>
+    </div>
 </div>
-{% endblock %}
+<style>
+    .bigger_td {
+        line-height: 7;
+        font-size: 20;
+    }
+
+    .play-detail__title {
+        color: #fff;
+        font-size: 20px;
+        display: block;
+        align-self: flex-start;
+        max-width: 100%;
+    }
+</style>
+<script>$(document).ready(function () {
+        $(".dropdown .buttond").click(function () {
+            var dropdown = $(this).parents('.dropdown');
+            dropdown.toggleClass('is-active');
+            dropdown.focusout(function () {
+                $(this).removeClass('is-active');
+            });
+        });
+
+    });
+</script>
+{% endblock %}
\ No newline at end of file
diff --git a/templates/admin/home.html b/templates/admin/home.html
index 455c0f20..800ec622 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -9,154 +9,149 @@
 </script>
 {% endblock%}
 
-{% macro card(title='base', haschart=true, chartname='base', data=0) %}
-<div class="card">
-    <div class="card-body">
-        <div class="d-flex align-items-center">
-            <div class="subheader">{{ title }}</div>
-        </div>
-        <div class="d-flex align-items-baseline">
-            <div class="mb-0 h1 me-2">{{ data }}</div>
-        </div>
+{% block content %}
+
+<div class="columns is-marginless">
+    <div class="column is-paddingless is-avatar">
+      <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
+        onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
+    </div>
+    <div class="column is-paddingless flex-vcenter">
+      <h2 class="section-title">{{ t('admin.base.dashboard') }}</h2>
+      <p class="section-lead">{{ t('admin.base.welcome-to-admin-panel', appName = appName()) }}</p>
     </div>
-    {% if haschart %}
-    <div id="chart-{{ chartname }}" class="chart-sm"></div>
-    {% endif %}
 </div>
-{% endmacro %}
-
-{% macro log() %}
-<div>
-    <div class="row">
-        <div class="col-auto">
-            <span class="avatar">VK</span>
+<div class="dashboard" id="dashboard">
+    <div class="columns is-marginless is-paddingless">
+        <div class="column is-paddingless p-3">
+            <div class="card">
+                <div class="title">{{ t('admin.home.total-users') }}</div>
+                <i class="fa fa-users"></i>
+                <div class="value">{{ dashdata['count'] }}</div>
+                <div class="stat">{{ t('admin.home.that-s-a-lot-of-people') }}</div>
+            </div>
         </div>
-        <div class="col">
-            <div class="text-truncate">
-                <strong>Varkaria</strong> was banned username <strong>"Among us"</strong>
+        <div class="column is-paddingless p-3">
+            <div class="card">
+                <div class="title">{{ t('admin.home.total-online') }}</div>
+                <i class="fa fa-circle"></i>
+                <div class="value">
+                    <% online_users %>
+                </div>
+                <div class="stat">{{ t('admin.home.rising-in-popularity-aren-t-we') }}</div>
             </div>
-            <div class="text-muted">yesterday</div>
         </div>
-        <div class="col-auto align-self-center">
-            <div class="badge bg-primary"></div>
+        <div class="column is-paddingless p-3">
+            <div class="card">
+                <div class="title">{{ t('admin.home.latest-user') }}</div>
+                <i class="fa fa-book"></i>
+                <div class="value">{{ dashdata['lastest_user'] }}</div>
+                <div class="stat">{{ t('admin.home.latest-and-greatest-welcome') }}</div>
+            </div>
+        </div>
+        <div class="column is-paddingless p-3">
+            <div class="card">
+                <div class="title">{{ t('admin.home.total-banned') }}</div>
+                <i class="fa fa-calendar"></i>
+                <div class="value">{{ dashdata['banned'] }}</div>
+                <div class="stat">{{ t('admin.home.naughty-sad-face') }}</div>
+            </div>
         </div>
     </div>
-</div>
-{% endmacro %}
-
-{% block content %}
-<div class="row row-deck row-cards">
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Online Users', data=3, chartname='online-users') }}
-    </div>
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Registered Users',data=0) }}
-    </div>
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Banned Users',data=0) }}
-    </div>
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Supporter Users',data=0) }}
-    </div>
-    <div class="col-lg-6">
-        <div class="card">
-            <div class="border-0 card-header">
-                <div class="card-title">Registered users list</div>
+<div class="columns is-marginless is-paddingless">
+    {% if recentusers %}
+    <div class="column is-paddingless m-2 is-3">
+        <div class="recent-beat">
+            <div class="columns is-marginless">
+                <div class="column is-paddingless flex-vcenter">
+                    <h2 class="section-title">{{ t('admin.home.recent-users') }}</h2>
+                </div>
             </div>
-            <div class="card-table table-responsive">
-                <table class="table table-vcenter">
-                    <thead>
-                        <tr>
-                            <th>Avatar</th>
-                            <th>Username</th>
-                            <th>Date</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        <tr>
-                            <td class="w-1">
-                                <span class="avatar avatar-sm">VK</span>
-                            </td>
-                            <td class="td-truncate">
-                                <div class="text-truncate">
-                                    Varkaria
+            <div class="blockdata">
+                {% for user in recentusers %}
+                <a href="/u/{{ user.id }}" class="user-block{% if user.priv == 1 %} unverified{% endif %}">
+                    <img src="https://a.{{ domain() }}/{{ user.id }}" class="avatar-picture">
+                    <div class="user-stats"><span class="user-title">
+                        <img src="/static/images/flags/{{ user.country|upper }}.png" class="profile-flag"> {{ user.name }}
+                        </span><span class="user-artist">
+                            {{ user.email }}
+                        </span>
+                        <div class="user-footer">
+                            <span class="user-mapper">
+                            {{ timeago.format((datetime.datetime.fromtimestamp(user.creation_time)),
+                                (datetime.datetime.now() + datetime.timedelta(seconds = 60 * 3.4))) }}
+                            </span>
+                            <div class="d-flex align-items-baseline">
+                                <span>
+                                {{ timeago.format((datetime.datetime.fromtimestamp(user.latest_activity)),
+                                    (datetime.datetime.now() + datetime.timedelta(seconds = 60 * 3.4))) }}
+                                </span>
+                                <div class="target-button newmaps-color">
+                                    <i class="fa fa-arrow-right"></i>
                                 </div>
-                            </td>
-                            <td class="text-nowrap text-muted">28 Nov 2019</td>
-                        </tr>
-                    </tbody>
-                </table>
+                            </div>
+                        </div>
+                    </div>
+                </a>
+                {% endfor %}
             </div>
         </div>
     </div>
-    <div class="col-lg-6">
-        <div class="card">
-            <div class="card-body card-body-scrollable card-body-scrollable-shadow">
-                <div class="divide-y">
-                    {{ log() }}
+    {% endif %}
+    {% if recentscores %}
+    <div class="column is-paddingless m-2">
+        <div class="recent-beat">
+            <div class="columns is-marginless">
+                <div class="column is-paddingless flex-vcenter">
+                    <h2 class="section-title">{{ t('admin.home.recent-score') }}</h2>
+                </div>
+            </div>
+            <div class="blockdata">
+                {% for maps in recentscores %}
+                <div class="map-single">
+                    <div class="map-content1">
+                        <div class="map-image"><img src="https://assets.ppy.sh/beatmaps/{{ maps.set_id }}/covers/cover.jpg"
+                                class="map-image-picture"></div>
+                        <div class="map-title-block">
+                            <div class="map-title"><a class="user-link">
+                                    [{{ maps.mode }}] {{ maps.title }} [{{ maps.version }}]
+                                </a></div>
+                            <div class="play-stats">
+                                {{ maps.score }} / {{ maps.max_combo }}x
+                            </div>
+                            <div class="map-date"><time>
+                                {{ timeago.format((maps.play_time), (datetime.datetime.now() + datetime.timedelta(seconds = 60 * 3.4))) }}
+                                </time></div>
+                        </div>
+                    </div>
+                    <div class="map-content2">
+                        <div class="score-details d-flex">
+                            <div class="score-details_right-block">
+                                <div class="score-details_pp-block">
+                                    <div class="map-pp">
+                                        {{ maps.pp }}<span class="map-pp-unit">{{ t('global.pp').upper() }}</span></div>
+                                    <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
+                                        {{ maps.acc }}%
+                                        </b></div>
+                                </div>
+                                <div class="score-details_grade-block">
+                                    <div class="rank-single">
+                                        <div class="map-rank rank-{{ maps.grade|upper }}">
+                                            {{ maps.grade.replace("X", "SS").replace("H", "") }}
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
                 </div>
+                {% endfor %}
             </div>
         </div>
     </div>
+    {% endif %}
 </div>
-{% endblock %}
 
-{% block scriptb %}
-<script>
-    document.addEventListener("DOMContentLoaded", function () {
-        window.ApexCharts && (new ApexCharts(document.getElementById('chart-online-users'), {
-            chart: {
-                type: "area",
-                fontFamily: 'inherit',
-                height: 40.0,
-                sparkline: {
-                    enabled: true
-                },
-                animations: {
-                    enabled: false
-                },
-            },
-            dataLabels: {
-                enabled: false,
-            },
-            fill: {
-                opacity: .16,
-                type: 'solid'
-            },
-            stroke: {
-                width: 2,
-                lineCap: "round",
-                curve: "smooth",
-            },
-            series: [{
-                name: "Online Users",
-                data: [0, 2, 3]
-            }],
-            grid: {
-                strokeDashArray: 4,
-            },
-            xaxis: {
-                labels: {
-                    padding: 0,
-                },
-                tooltip: {
-                    enabled: false
-                },
-                axisBorder: {
-                    show: false,
-                }
-            },
-            yaxis: {
-                labels: {
-                    padding: 4
-                },
-            },
-            labels: ['soon', 'soon', 'soon'],
-            colors: ["#206bc4"],
-            legend: {
-                show: false,
-            },
-        })).render();
-    });
-</script>
-{% endblock scriptb %}
\ No newline at end of file
+<script src="/static/js/pages/admin/dashboard.js"></script>
+
+{% endblock %}
\ No newline at end of file
diff --git a/templates/admin/log.html b/templates/admin/log.html
deleted file mode 100644
index a61bd8ee..00000000
--- a/templates/admin/log.html
+++ /dev/null
@@ -1,108 +0,0 @@
-<!-- All admin logs will appered here -->
-{% extends 'admin/base.html' %}
-{% block title %} Logs {% endblock %}
-
-{% macro card(title='base', haschart=true, chartname='base', data=0) %}
-<div class="card">
-    <div class="card-body">
-        <div class="d-flex align-items-center">
-            <div class="subheader">{{ title }}</div>
-        </div>
-        <div class="d-flex align-items-baseline">
-            <div class="h1 mb-0 me-2">{{ data }}</div>
-        </div>
-    </div>
-    {% if haschart %}
-    <div id="chart-{{ chartname }}" class="chart-sm"></div>
-    {% endif %}
-</div>
-{% endmacro %}
-
-{% block content %}
-{% if error %}
-<div class="alert alert-danger col-lg-3" role="alert" style="display: block; position: relative; margin-top: -3.5rem;">
-    <h4 class="alert-title">{{ error }}</h4>
-</div>
-{% endif %}
-<div class="row row-deck row-cards">
-    <div class="col-sm-6 col-lg-6">
-        {{ card(title='Total logs', data=query_data[0]['logcount'], chartname='logs-total') }}
-    </div>
-    <div class="col-sm-6 col-lg-6">
-        {{ card(title='Logs this month',data=727, chartname='logs-month') }}
-    </div>
-    <div class="col-12">
-        <div class="card">
-            <div class="card-body border-bottom py-3">
-                <div class="d-flex">
-                    <div class="text-muted">
-                        Show
-                        <div class="mx-2 d-inline-block">
-                            <input type="text" class="form-control form-control-sm" value="25" size="3" aria-label="Users count">
-                        </div>
-                        entries
-                    </div>
-                    <div class="ms-auto text-muted">
-                        Search:
-                        <div class="ms-2 d-inline-block">
-                            <input type="text" class="form-control form-control-sm" aria-label="Search invoice">
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div class="table-responsive">
-                <table class="table card-table table-vcenter text-nowrap datatable">
-                    <thead>
-                        <tr>
-                            <th>Action ID</th>
-                            <th>Date</th>
-                            <th>Moderator</th>
-                            <th>User Affected</th>
-                            <th>Log message</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        {% for i in query_data %}
-                        <tr>
-                            <td>#{{ i.action_id }} </td>
-                            <td>{{ i.time }}</td>
-                            <td>
-                                <img src="/static/images/flags/{{ i.u1_country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
-                                <a href="/u/{{ i.u1_id }}">{{ i.u1_name }}</a>
-                            </td>
-                            <td>
-                                <img src="/static/images/flags/{{ i.u2_country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
-                                <a href="/u/{{ i.u2_id }}">{{ i.u2_name }}</a>
-                            </td>
-                            <td>{{ i.msg }}</td>
-                        </tr>
-                        {% endfor %}
-                    </tbody>
-                </table>
-            </div>
-            <div class="card-footer d-flex align-items-center">
-                <ul class="pagination m-0 m-auto">
-                    <li class="page-item">
-                        <a class="page-link" href="#" tabindex="-1">
-                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="15 6 9 12 15 18"></polyline></svg>
-                            prev
-                        </a>
-                    </li>
-                    <li class="page-item active"><a class="page-link" href="#">1</a></li>
-                    <li class="page-item"><a class="page-link" href="#">2</a></li>
-                    <li class="page-item"><a class="page-link" href="#">3</a></li>
-                    <li class="page-item"><a class="page-link" href="#">4</a></li>
-                    <li class="page-item"><a class="page-link" href="#">...</a></li>
-                    <li class="page-item"><a class="page-link" href="#">5</a></li> 
-                    <li class="page-item">
-                        <a class="page-link" href="#">
-                            next
-                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><polyline points="9 6 15 12 9 18"></polyline></svg>
-                        </a>
-                    </li>
-                </ul>
-            </div>
-        </div>
-    </div>
-</div>
-{% endblock %}
diff --git a/templates/admin/privilege.html b/templates/admin/privilege.html
deleted file mode 100644
index c4e2479d..00000000
--- a/templates/admin/privilege.html
+++ /dev/null
@@ -1,7 +0,0 @@
-<!-- For giving privilege -->
-{% extends 'admin/base.html' %}
-{% block title %} Privileges {% endblock %}
-
-{% block content %}
-
-{% endblock %}
\ No newline at end of file
diff --git a/templates/admin/recentplay.html b/templates/admin/recentplay.html
deleted file mode 100644
index e7cba7ae..00000000
--- a/templates/admin/recentplay.html
+++ /dev/null
@@ -1,7 +0,0 @@
-<!-- All recent play will be shown in a list here -->
-{% extends 'admin/base.html' %}
-{% block title %} Recent {% endblock %}
-
-{% block content %}
-
-{% endblock %}
\ No newline at end of file
diff --git a/templates/admin/reports.html b/templates/admin/reports.html
deleted file mode 100644
index 27416cca..00000000
--- a/templates/admin/reports.html
+++ /dev/null
@@ -1,7 +0,0 @@
-<!-- For report submission -->
-{% extends 'admin/base.html' %}
-{% block title %} Reports {% endblock %}
-
-{% block content %}
-
-{% endblock %}
\ No newline at end of file
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index f53f6d47..ab8bb4de 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -1,101 +1,28 @@
 {% extends 'admin/base.html' %}
 {% block title %} Restrictions {% endblock %}
 
-{% macro modal(title='base', id='base', name='base') %}
-<div class="modal modal-blur fade" id="{{ id }}" tabindex="-1" aria-hidden="true">
-    <div class="modal-dialog modal-sm" role="document">
-        <div class="modal-content">
-            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-            <div class="modal-body text-start pt-4">
-                <form id="{{ name }}" method="POST">
-                    <div class="mb-3">
-                        <label class="form-label">{{ title }}</label>
-                        <input type="text" class="form-control" name="{{ name }}">
-                    </div>
-                </form>
-            </div>
-            <div class="modal-footer">
-                <div class="w-100">
-                    <div class="row">
-                        <div class="col">
-                            <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">Cancel</button>
-                        </div>
-                        <div class="col">
-                            <button type="submit" id="del-submit" form="{{ name }}"
-                                class="btn btn-primary w-100">Edit</button>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-{% endmacro %}
-
-{% macro card(title='base', haschart=true, chartname='base', data=0) %}
-<div class="card">
-    <div class="card-body">
-        <div class="d-flex align-items-center">
-            <div class="subheader">{{ title }}</div>
-        </div>
-        <div class="d-flex align-items-baseline">
-            <div class="h1 mb-0 me-2">{{ data }}</div>
-        </div>
-    </div>
-    {% if haschart %}
-    <div id="chart-{{ chartname }}" class="chart-sm"></div>
-    {% endif %}
-</div>
-{% endmacro %}
-
 {% block content %}
-{% if error %}
-<div class="alert alert-danger col-lg-3" role="alert" style="display: block; position: relative; margin-top: -3.5rem;">
-    <h4 class="alert-title">{{ error }}</h4>
-</div>
-{% endif %}
-<div class="row row-deck row-cards">
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Banned Users', data=727, chartname='online-users') }}
+<div class="columns is-marginless">
+    <div class="column is-paddingless is-avatar">
+      <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
+        onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
     </div>
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Silenced Users',data=727) }}
+    <div class="column is-paddingless flex-vcenter">
+      <h2 class="section-title">Restrictions</h2>
+      <p class="section-lead">Welcome to restrictions panel</p>
     </div>
+</div>
+<div class="row row-deck row-cards" style="margin-top: 20px">
     <div class="col-12">
         <div class="card">
-            <div class="card-header">
-                <div class="d-flex m-auto">
-                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-usr">Edit user (username)</button>
-                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-ema">Edit user (email)</button>
-                    <button type="button" class="btn m-2 disabled">Unban user</button>
-                    <button type="button" class="btn m-2 disabled">Unsilence user</button>
-                </div>
-            </div>
-            <div class="card-body border-bottom py-3">
-                <div class="d-flex">
-                    <div class="text-muted">
-                        Show
-                        <div class="mx-2 d-inline-block">
-                            <input type="text" class="form-control form-control-sm" value="8" size="3"
-                                aria-label="Users count">
-                        </div>
-                        entries
-                    </div>
-                    <div class="ms-auto text-muted">
-                        Search:
-                        <div class="ms-2 d-inline-block">
-                            <input type="text" class="form-control form-control-sm" aria-label="Search invoice">
-                        </div>
-                    </div>
-                </div>
-            </div>
             <div class="table-responsive">
                 <table class="table card-table table-vcenter text-nowrap datatable">
                     <thead>
                         <tr>
                             <th>ID</th>
                             <th>Username</th>
-                            <th>Reason of restriction</th>
+                            <th>Details</th>
+                            <th>Date</th>
                             <th>Action</th>
                         </tr>
                     </thead>
@@ -107,7 +34,8 @@ <h4 class="alert-title">{{ error }}</h4>
                                 <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
                                 <a href="/u/{{ i.id }}">{{ i.name }}</a>
                             </td>
-                            <td>{{ i.reason }}</td>
+                            <td>{{ i.msg }}</td>
+                            <td>{{ i.time }}</td>
                             <td>
                                 <a class="btn" href="/admin/users/edit/{{ i.id }}">
                                     <i class="far fa-edit" aria-hidden="true"></i>⠀Edit
@@ -118,40 +46,8 @@ <h4 class="alert-title">{{ error }}</h4>
                     </tbody>
                 </table>
             </div>
-            <div class="card-footer d-flex align-items-center">
-                <ul class="pagination m-0 m-auto">
-                    <li class="page-item">
-                        <a class="page-link" href="#" tabindex="-1">
-                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
-                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
-                                stroke-linecap="round" stroke-linejoin="round">
-                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
-                                <polyline points="15 6 9 12 15 18"></polyline>
-                            </svg>
-                        </a>
-                    </li>
-                    <li class="page-item active"><a class="page-link" href="#">1</a></li>
-                    <li class="page-item"><a class="page-link" href="#">2</a></li>
-                    <li class="page-item"><a class="page-link" href="#">3</a></li>
-                    <li class="page-item"><a class="page-link" href="#">4</a></li>
-                    <li class="page-item"><a class="page-link" href="#">5</a></li>
-                    <li class="page-item">
-                        <a class="page-link" href="#">
-                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
-                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
-                                stroke-linecap="round" stroke-linejoin="round">
-                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
-                                <polyline points="9 6 15 12 9 18"></polyline>
-                            </svg>
-                        </a>
-                    </li>
-                </ul>
-            </div>
         </div>
     </div>
 </div>
 
-{{ modal(title='Username', id="edi-usr-usr", name='username') }}
-{{ modal(title='Email', id="edi-usr-ema", name='email') }}
-
 {% endblock %}
\ No newline at end of file
diff --git a/templates/admin/search.html b/templates/admin/search.html
deleted file mode 100644
index 05cc86ab..00000000
--- a/templates/admin/search.html
+++ /dev/null
@@ -1,105 +0,0 @@
-{% extends 'admin/base.html' %}
-{% block title %}
-Search Result
-{% endblock title %}
-
-{% block header %}
-<script src="/static/js/asserts/vue.js"></script>
-<script src="/static/js/asserts/vue-axios.js"></script>
-{% endblock %}
-
-
-{% block content %}
-
-<div id="app">
-    <div class="container-xl">
-        <div class="row g-3">
-            <div class="col-3">
-                <form action="" method="get">
-                    <div class="subheader mb-2">Search</div>
-                    <div class="input-icon mb-4">
-                        <input type="text" class="form-control" v-model.trim="search" placeholder="Search players..."
-                            @keyup="getSearchData">
-                        <span class="input-icon-addon">
-                            <!-- Download SVG icon from http://tabler-icons.io/i/search -->
-                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
-                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
-                                stroke-linecap="round" stroke-linejoin="round">
-                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
-                                <circle cx="10" cy="10" r="7"></circle>
-                                <line x1="21" y1="21" x2="15" y2="15"></line>
-                            </svg>
-                        </span>
-                    </div>
-                    <div class="subheader mb-2">Category</div>
-                    <div class="list-group list-group-transparent mb-3">
-                        <a class="list-group-item list-group-item-action d-flex align-items-center active" href="#">
-                            Users
-                        </a>
-                        <a class="list-group-item list-group-item-action d-flex align-items-center disabled" href="#">
-                            Beatmaps
-                        </a>
-                    </div>
-                </form>
-            </div>
-            <div :class="'col-9' + (load ? ' load' : '')" >
-                <div class="row">
-                    <div class="col-sm-6 col-lg-4 mb-2" v-for="d in result">
-                        <div class="card card-sm">
-                            <a href="#" class="d-block">
-                                <img :src="`https://a.{{ domain() }}/${d.id}`"
-                                    class="card-img-top banner-bg">
-                            </a>
-                            <div class="card-body">
-                                <div class="d-flex align-items-center">
-                                    <span class="avatar me-3 rounded"
-                                        :style="`background-image: url(https://a.{{ domain() }}/${d.id})`"></span>
-                                    <div>
-                                        <div><% d.name %></div>
-                                        <div class="text-muted"><% d.email %></div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-
-<script>
-    new Vue({
-        el: "#app",
-        delimiters: ["<%", "%>"],
-        data() {
-            return {
-                search: '',
-                result: [],
-                load: false
-            }
-        },
-        created() {
-            this.getSearchData()
-        },
-        methods: {
-            getSearchData() {
-                this.load = true
-                this.$axios.get(`/admin/api/search`, {
-                    params: {
-                        search: this.search,
-                    }
-                })
-                    .then(res => {
-                        this.load = false;
-                        this.result = res.data;
-                    });
-            },
-        },
-        computed: {
-        }
-    });
-
-</script>
-
-{% endblock content %}
\ No newline at end of file
diff --git a/templates/admin/users.html b/templates/admin/users.html
index eb70c106..2e88f230 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -1,232 +1,79 @@
 {% extends 'admin/base.html' %}
 {% block title %} Users {% endblock %}
 
-{% macro card(title='base', haschart=true, chartname='base', data=0) %}
-<div class="card">
-    <div class="card-body">
-        <div class="d-flex align-items-center">
-            <div class="subheader">{{ title }}</div>
-        </div>
-        <div class="d-flex align-items-baseline">
-            <div class="h1 mb-0 me-2">{{ data }}</div>
-        </div>
-    </div>
-    {% if haschart %}
-    <div id="chart-{{ chartname }}" class="chart-sm"></div>
-    {% endif %}
-</div>
-{% endmacro %}
-
-{% macro modal(title='base', id='base', name='base') %}
-<div class="modal modal-blur fade" id="{{ id }}" tabindex="-1" aria-hidden="true">
-    <div class="modal-dialog modal-sm" role="document">
-        <div class="modal-content">
-            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-            <div class="modal-body text-start pt-4">
-                <form id="{{ name }}" method="POST">
-                    <div class="mb-3">
-                        <label class="form-label">{{ title }}</label>
-                        <input type="text" class="form-control" name="{{ name }}">
-                    </div>
-                </form>
-            </div>
-            <div class="modal-footer">
-                <div class="w-100">
-                    <div class="row">
-                        <div class="col">
-                            <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">Cancel</button>
-                        </div>
-                        <div class="col">
-                            <button type="submit" id="del-submit" form="{{ name }}"
-                                class="btn btn-primary w-100">Edit</button>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-{% endmacro %}
-
 {% block content %}
-{% if error %}
-<div class="alert alert-danger col-lg-3" role="alert" style="display: block; position: relative; margin-top: -3.5rem;">
-    <h4 class="alert-title">{{ error }}</h4>
-</div>
-{% endif %}
-<div class="row row-deck row-cards">
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Online Users', data=727, chartname='online-users') }}
-    </div>
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Banned Users',data=727) }}
+<div class="columns is-marginless">
+    <div class="column is-paddingless is-avatar">
+      <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
+        onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
     </div>
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Supporter users',data=727) }}
+    <div class="column is-paddingless flex-vcenter">
+      <h2 class="section-title">Users</h2>
+      <p class="section-lead">Welcome to users panel</p>
     </div>
-    <div class="col-sm-6 col-lg-3">
-        {{ card(title='Premium users',data=727) }}
+</div>
+<div class="card" style="margin-top: 20px">
+    <div class="columns">
+        <div class="column is-11">
+            <input id="search-bar" class="input" v-model.trim="search" placeholder="Search by username or email" value="{{ search_value }}" >
+        </div>
+        <div class="column">
+            <a class="button is-primary" onclick="admin_search()">Search</a>
+        </div>
     </div>
-    <div class="col-12">
-        <div class="card">
-            <div class="card-header">
-                <div class="d-flex m-auto">
-                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-usr">Edit user
-                        (username)</button>
-                    <button type="button" class="btn m-2" data-bs-toggle="modal" data-bs-target="#edi-usr-ema">Edit user
-                        (email)</button>
-                    <button type="button" class="btn m-2 disabled" data-bs-toggle="modal"
-                        data-bs-target="#sch-ip">Search user by IP</button>
-                    <button type="button" class="btn m-2 disabled">Silence user</button>
-                    <button type="button" class="btn m-2 disabled">Kick user from bancho</button>
-                </div>
-            </div>
-            <div class="card-body border-bottom py-3">
-                <div class="d-flex">
-                    <div class="text-muted">
-                        Show
-                        <div class="mx-2 d-inline-block">
-                            <input type="text" class="form-control form-control-sm" value="8" size="3"
-                                aria-label="Users count">
-                        </div>
-                        entries
-                    </div>
-                    <div class="ms-auto text-muted">
-                        Search:
-                        <div class="ms-2 d-inline-block">
-                            <input type="text" class="form-control form-control-sm" aria-label="Search invoice">
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div class="table-responsive">
-                <table class="table card-table table-vcenter text-nowrap datatable">
-                    <thead>
-                        <tr>
-                            <th>ID</th>
-                            <th>Username</th>
-                            <th>Privilege groups</th>
-                            <th>Action</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        {% for i in query_data %}
-                        <tr>
-                            <td>{{ i.id }}</td>
-                            <td class="td-truncate">
-                                <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
-                                <a href="/u/{{ i.id }}">{{ i.name }}</a>
-                            </td>
-                            {% if i.priv == 2 %}
-                            <td>Banned</td>
-                            {% else %}
-                            <td>Allowed</td>
-                            {% endif %}
-                            <td>
-                                <a class="btn" href="/admin/users/edit/{{ i.id }}">
-                                    <i class="far fa-edit" aria-hidden="true"></i>⠀Edit
-                                </a>
-                            </td>
-                        </tr>
-                        {% endfor %}
-                    </tbody>
-                </table>
-            </div>
-            <div class="card-footer d-flex align-items-center">
-                <ul class="pagination m-0 m-auto">
-                    <li class="page-item">
-                        <a class="page-link" href="#" tabindex="-1">
-                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
-                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
-                                stroke-linecap="round" stroke-linejoin="round">
-                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
-                                <polyline points="15 6 9 12 15 18"></polyline>
-                            </svg>
+    <div class="table-responsive">
+        <table class="table card-table table-vcenter text-nowrap datatable">
+            <thead>
+                <tr>
+                    <th>ID</th>
+                    <th>Username</th>
+                    <th>Email</th>
+                    <th>Privilege</th>
+                    <th>Country</th>
+                    <th>Creation Time</th>
+                    <th>Last Login</th>
+                    <th>IP</th>
+                    <th>Client Channel</th>
+                    <th>Action</th>
+                </tr>
+            </thead>
+            <tbody>
+                {% for i in query_data %}
+                <tr>
+                    <td>{{ i.id }}</td>
+                    <td class="td-truncate">
+                        <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
+                        <a href="/u/{{ i.id }}">{{ i.name }}</a>
+                    </td>
+                    <td>{{ i.email }}</td>
+                    <td>{{ decode_priv(i.priv) }}</td>
+                    <td>{{ i.country }}</td>
+                    <td>{{ handle_timestamp(i.creation_time) }}</td>
+                    <td>{{ i.last_login }}</td>
+                    <td>
+                        <a target="_blank" href="https://whatismyipaddress.com/ip/{{ i.ip }}">
+                            {{ i.ip }}
                         </a>
-                    </li>
-                    <li class="page-item active"><a class="page-link" href="#">1</a></li>
-                    <li class="page-item"><a class="page-link" href="#">2</a></li>
-                    <li class="page-item"><a class="page-link" href="#">3</a></li>
-                    <li class="page-item"><a class="page-link" href="#">4</a></li>
-                    <li class="page-item"><a class="page-link" href="#">5</a></li>
-                    <li class="page-item">
-                        <a class="page-link" href="#">
-                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
-                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
-                                stroke-linecap="round" stroke-linejoin="round">
-                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
-                                <polyline points="9 6 15 12 9 18"></polyline>
-                            </svg>
+                    </td>
+                    <td>{{ i.osu_stream }}</td>
+                    <td>
+                        <a class="btn" href="/admin/users/edit/{{ i.id }}">
+                            <i class="far fa-edit" aria-hidden="true"></i>⠀Edit
                         </a>
-                    </li>
-                </ul>
-            </div>
-        </div>
+                    </td>
+                </tr>
+                {% endfor %}
+            </tbody>
+        </table>
     </div>
 </div>
 
-{{ modal(title='Username', id="edi-usr-usr", name='username') }}
-{{ modal(title='Email', id="edi-usr-ema", name='email') }}
-{{ modal(title='IP', id="sch-ip", name='ip') }}
-
-{% endblock %}
-
-{% block scriptb %}
 <script>
-    document.addEventListener("DOMContentLoaded", function () {
-        window.ApexCharts && (new ApexCharts(document.getElementById('chart-online-users'), {
-            chart: {
-                type: "area",
-                fontFamily: 'inherit',
-                height: 40.0,
-                sparkline: {
-                    enabled: true
-                },
-                animations: {
-                    enabled: false
-                },
-            },
-            dataLabels: {
-                enabled: false,
-            },
-            fill: {
-                opacity: .16,
-                type: 'solid'
-            },
-            stroke: {
-                width: 2,
-                lineCap: "round",
-                curve: "smooth",
-            },
-            series: [{
-                name: "Online Users",
-                data: [0, 2, 3]
-            }],
-            grid: {
-                strokeDashArray: 4,
-            },
-            xaxis: {
-                labels: {
-                    padding: 0,
-                },
-                tooltip: {
-                    enabled: false
-                },
-                axisBorder: {
-                    show: false,
-                }
-            },
-            yaxis: {
-                labels: {
-                    padding: 4
-                },
-            },
-            labels: ['soon', 'soon', 'soon'],
-            colors: ["#206bc4"],
-            legend: {
-                show: false,
-            },
-        })).render();
-    });
+    $("#search-bar").keydown(function(e) {  
+        if (e.keyCode == 13) {
+            admin_search()
+        }  
+   });  
 </script>
-{% endblock scriptb %}
+
+{% endblock content %}
diff --git a/templates/admin/users_edit.html b/templates/admin/users_edit.html
index 8cb5aea7..ea7a65ca 100644
--- a/templates/admin/users_edit.html
+++ b/templates/admin/users_edit.html
@@ -3,144 +3,62 @@
 
 {% block content %} 
 
-{% if error %}
-<div class="alert alert-danger col-lg-3" role="alert" style="display: block; position: relative; margin-top: -3.5rem">
-    <h4 class="alert-title">{{ error }}</h4>
-</div>
-{% endif %}
-<div class="row row-deck row-cards">
-    <div class="col-12">
-        <div class="card">
-            <div class="card-header">Edit info of {{ search_data['name'] }}</div>
-            <div class="card-body">
-                <form action="/admin/users/update/{{ search_data['id'] }}" method="POST" id="edit-usr">
-                    <label class="form-label">Username</label>
-                    <div>
-                        <div class="input-icon mb-3">
-                            <span class="input-icon-addon">
-                                <svg
-                                xmlns="http://www.w3.org/2000/svg"
-                                class="icon"
-                                width="24"
-                                height="24"
-                                viewBox="0 0 24 24"
-                                stroke-width="2"
-                                stroke="currentColor"
-                                fill="none"
-                                stroke-linecap="round"
-                                stroke-linejoin="round"
-                                >
-                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
-                                <circle cx="12" cy="7" r="4"></circle>
-                                <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>
-                            </svg>
-                        </span>
-                        <input type="text" name="edit-username" class="form-control" value="{{ search_data.name }}">
-                    </div>
-                    <label class="form-label">Email</label>
-                    <div class="input-icon mb-3">
-                        <span class="input-icon-addon">
-                            <svg
-                            xmlns="http://www.w3.org/2000/svg"
-                            class="icon icon-tabler icon-tabler-mail"
-                            width="24"
-                            height="24"
-                            viewBox="0 0 24 24"
-                            stroke-width="2"
-                            stroke="#2c3e50"
-                            fill="none"
-                            stroke-linecap="round"
-                            stroke-linejoin="round"
-                            >
-                            <path stroke="none" d="M0 0h24v24H0z" fill="noneW" />
-                            <rect x="3" y="5" width="18" height="14" rx="2" />
-                            <polyline points="3 7 12 13 21 7" />
-                        </svg>
-                    </span>
-                    <input type="text" name="edit-email" class="form-control" value="{{ search_data.email }}">
+<form action="/admin/users/update/{{ search_data['id'] }}" method="POST" id="edit-user">
+    <div style="display: flex; align-items: center; flex-direction: column;">
+        <article style="width: 40%;" class="panel is-primary">
+            <p class="panel-heading">
+            Edit Info of {{ search_data['name'] }}
+            </p>
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter">
+                    <i class="fas fa-user" aria-hidden="true"></i>
+                    Username
                 </div>
-                <div class="form-label">Restricted?</div>
-                <label class="form-check form-switch">
-                    {% if search_data.priv == 2 %}
-                    <input id="edit-res" class="form-check-input" name="edit-restrict" type="checkbox" value="ban" checked> <!--  data-bs-toggle="collapse" data-bs-target="#edit-res-reason" -->
-                    {% else %}
-                    <input id="edit-res" class="form-check-input" name="edit-restrict" type="checkbox" data-bs-toggle="collapse" data-bs-target="#edit-res-reason">
-                    {% endif %}
-                </label>
-                <div id="edit-res-reason" class="collapse">
-                    <label class="form-label">Reason of restriction?</label>
-                    <input type="text" name="res-reason" class="form-control" value="{{ search_data.reason }}">
+                <div class="column">
+                    <input name="edit-username" type="text" class="input" value="{{ search_data.name }}">
                 </div>
             </div>
-        </form>
-    </div>
-    <div class="card-footer">
-        <div class="w-100">
-            <div class="row">
-                <div class="col">
-                    <a href="/admin/users"><button type="button" class="btn btn-white w-100"> Cancel </button></a>
-                </div>
-                <div class="col">
-                    <form action="/admin/users/forgot/{{ search_data.id }}" method="post">
-                        <button type="submit" class="btn w-100 disabled">
-                            User forgot password?
-                        </button>
-                    </form>
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter">
+                    <i class="fas fa-user" aria-hidden="true"></i>
+                    Email
                 </div>
-                <div class="col">
-                    <button type="submit" class="btn btn-primary w-100" data-bs-toggle="modal" data-bs-target="#edit-confirmed"> Save </button>
+                <div class="column">
+                    <input name="edit-email" type="text" class="input" value="{{ search_data.email }}">
                 </div>
             </div>
-        </div>
-    </div>
-</div>
-</div>
-</div>
-
-<div class="modal modal-blur fade" id="edit-confirmed" tabindex="-1" aria-hidden="true">
-    <div class="modal-dialog modal-sm" role="document">
-        <div class="modal-content">
-            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-            <div class="modal-header text-center">
-                Are you sure to modify this user?
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter">
+                    <i class="fas fa-user" aria-hidden="true"></i>
+                    Country
+                </div>
+                <div class="column">
+                    <input name="edit-country" type="text" class="input" value="{{ search_data.country }}">
+                </div>
             </div>
-            <div class="modal-body text-start pt-4">
-                <div class="w-100">
-                    <div class="row">
-                        <div class="col">
-                            <button type="button" class="btn btn-white w-100" data-bs-dismiss="modal">
-                                No
-                            </button>
-                        </div>
-                        <div class="col">
-                            <button type="submit" form="edit-usr" class="btn btn-danger w-100">
-                                Yes
-                            </button>
-                        </div>
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter">
+                    <i class="fas fa-user" aria-hidden="true"></i>
+                    Legality
+                </div>
+                <div class="column">
+                    <div class="select">
+                        <select name="legality">
+                            <option value="unrestricted">Unrestricted</option>
+                            {% if search_data.priv == 2 %}
+                            <option value="restricted" selected>Restricted</option>
+                            {% endif %}
+                            {% if search_data.priv != 2 %}
+                            <option value="restricted">Restricted</option>
+                            {% endif %}
+                        </select>
                     </div>
                 </div>
             </div>
-        </div>
+            <div class="panel-block">
+                <button type="submit" form="edit-user" style="margin: auto; width: 100px;" class="button is-primary">Update</button>
+            </div>
+        </article>
     </div>
-</div>
-{% endblock %}
-
-{% block scriptb %}
-{% if search_data.priv == 2 %}
-<script>
-    document.addEventListener("DOMContentLoaded", function () {
-        $('#edit-res-reason').collapse('show');
-        $('#edit-res').on('click', function () {
-            var $this = $(this);
-            if ($(this).val() === 'ban') {
-                $('#edit-res-reason').collapse('hide');
-                $this.val('unban');
-            } else {
-                $('#edit-res-reason').collapse('show');
-                $this.val('ban');
-            }
-        });
-    });
-</script>
-{% endif %}
-{% endblock scriptb %}
\ No newline at end of file
+</form>
+{% endblock content %}
\ No newline at end of file

From bc4ead8af68a987bdedf7e67e500691fe125baa7 Mon Sep 17 00:00:00 2001
From: TrueRou <chenbohan911@163.com>
Date: Sat, 30 Jul 2022 15:19:33 +0000
Subject: [PATCH 126/278] add permissions to BN

---
 blueprints/admin.py    | 6 +++---
 blueprints/frontend.py | 2 ++
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index df19c22b..0b8b2f65 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -93,7 +93,7 @@ async def beatmaps_edit(bid:int):
     if not 'authenticated' in session:
         return await flash('error', t('admin.please-login-in-first'), 'login')
 
-    if not session['user_data']['is_staff']:
+    if not session['user_data']['is_staff'] and not session['user_data']['is_bn']:
         return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
     
     status = request.args.get('status', type=int)
@@ -188,7 +188,7 @@ async def beatmaps(mode: str):
     if not 'authenticated' in session:
         return await flash('error', t('admin.please-login-in-first'), 'login')
 
-    if not session['user_data']['is_staff']:
+    if not session['user_data']['is_staff'] and not session['user_data']['is_bn']:
         return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
 
     mode_vn = 0
@@ -226,7 +226,7 @@ async def beatmaps_search():
     if not 'authenticated' in session:
         return await flash('error', t('admin.please-login-in-first'), 'login')
 
-    if not session['user_data']['is_staff']:
+    if not session['user_data']['is_staff'] and not session['user_data']['is_bn']:
         return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
 
     query = await glob.db.fetch(
diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index c5ead5a8..f1d2113d 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -19,6 +19,7 @@
 from quart import request
 from quart import session
 from quart import send_file
+from quart import jsonify
 
 from constants import regexes
 from objects import glob
@@ -423,6 +424,7 @@ async def login_post():
         'priv': user_info['priv'],
         'silence_end': user_info['silence_end'],
         'is_staff': user_info['priv'] & Privileges.Staff != 0,
+        'is_bn': user_info['priv'] & Privileges.Nominator != 0,
         'is_donator': user_info['priv'] & Privileges.Donator != 0
     }
 

From 0ea9824d5827c5f7de3e7207facfc6b349a74dd2 Mon Sep 17 00:00:00 2001
From: TrueRou <chenbohan911@163.com>
Date: Sat, 30 Jul 2022 15:33:30 +0000
Subject: [PATCH 127/278] fix js not refresh

---
 templates/admin/base.html     |  6 +++---
 templates/admin/beatmaps.html | 12 +++++++++++-
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/templates/admin/base.html b/templates/admin/base.html
index d07cedf6..d284bb02 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -53,9 +53,9 @@
                     class="name">{{ t('admin.base.dashboard') }}</span></a></li>
               <li class="nav-item"><a class="nav-link" href="/admin/users"><span class="icon"><i class="fa fa-user"></i></span> <span
                 class="name">Users</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/restrictions"><span class="icon"><i class="fa fa-user"></i></span> <span
+              <li class="nav-item"><a class="nav-link" href="/admin/restrictions"><span class="icon"><i class="fa fa-ban"></i></span> <span
                 class="name">Restrictions</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/beatmaps"><span class="icon"><i class="fa fa-user"></i></span> <span
+              <li class="nav-item"><a class="nav-link" href="/admin/beatmaps"><span class="icon"><i class="fa fa-map"></i></span> <span
                 class="name">Beatmaps</span></a></li>
             </ul>
           </div>
@@ -78,7 +78,7 @@
   </footer>
 
   <!-- main js script -->
-  <script src="/static/js/main.js" crossorigin="anonymous"></script>
+  <script src="/static/js/main.js?v={{ rand() }}" crossorigin="anonymous"></script>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index c27d0ef0..d6cc5c5d 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -2,7 +2,17 @@
 {% block title %} Beatmaps {% endblock %}\
 
 {% block content %}
-<div class="row row-deck row-cards">
+<div class="columns is-marginless">
+    <div class="column is-paddingless is-avatar">
+      <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
+        onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
+    </div>
+    <div class="column is-paddingless flex-vcenter">
+      <h2 class="section-title">Beatmaps</h2>
+      <p class="section-lead">Welcome to beatmaps panel</p>
+    </div>
+</div>
+<div class="row row-deck row-cards" style="margin-top: 20px">
     <div class="columns is-marginless is-paddingless">
         <div class="column is-paddingless p-3">
             <a href="/admin/beatmaps/osu" class="button" style="width: 100%; margin-bottom: 10px">osu!</a>

From a9441b39c6f0a8804bee23cc7aa5b483e31967a3 Mon Sep 17 00:00:00 2001
From: TrueRou <chenbohan911@163.com>
Date: Sat, 30 Jul 2022 15:34:50 +0000
Subject: [PATCH 128/278] useless print

---
 objects/varka.py | 1 -
 1 file changed, 1 deletion(-)

diff --git a/objects/varka.py b/objects/varka.py
index 4b323fda..e28fb01d 100644
--- a/objects/varka.py
+++ b/objects/varka.py
@@ -19,7 +19,6 @@ async def get_users(limit:int=100, search:str=None):
     
     
     query = ' '.join(query)
-    print (query)
     res = await glob.db.fetchall(query, args)
     return res
 

From 90ded2da6894410b9b9be6faa1bf9436a1fef706 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 30 Jul 2022 16:05:50 +0000
Subject: [PATCH 129/278] fix cn locale

---
 templates/home.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/home.html b/templates/home.html
index d90b2906..2502cc0c 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -42,7 +42,7 @@
       <div class="column flex-vcenter flex-lcenter is-size-2-desktop is-size-1-fullhd" id="title">
         <h1 class="title is-spaced is-size-2-desktop is-size-1-fullhd">{{ appName() }}</h1>
         <h2 class="subtitle">
-          {{ t('home.subtitle-big') }}
+          {{ t('home.subtitle-big', appName = appName()) }}
 
         </h2>
         {% if not session.authenticated %}

From 32cf279a971af4dc5650cf3cc64d2747df414ab0 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 30 Jul 2022 16:15:10 +0000
Subject: [PATCH 130/278] add space after comma

---
 locales/home/zh-CN.yml             | 8 ++++----
 locales/login/zh-CN.yml            | 2 +-
 locales/register/zh-CN.yml         | 2 +-
 locales/settings/profile/zh-CN.yml | 2 +-
 locales/settings/zh-CN.yml         | 2 +-
 locales/verify/zh-CN.yml           | 6 +++---
 6 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/locales/home/zh-CN.yml b/locales/home/zh-CN.yml
index 9f12e782..ba81081c 100644
--- a/locales/home/zh-CN.yml
+++ b/locales/home/zh-CN.yml
@@ -1,16 +1,16 @@
 subtitle-big: |-
-  欢迎来到 %{appName}, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. ppysb新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
+  欢迎来到 %{appName}, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. %{appName} 新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
 some-of-our-coolest-features: 我们觉得最酷的一些功能
 features-title-1: 对Relax 和 Autopilot mod的PP计算
 features-content-1: |-
   我们的服务器针对RX和AP有专门的PP计算算法。有超高的AIM移动能力但是左手无力？又或者左手超强的手速speed却不会移动AIM? 在 %{appName} 当中都可以完美发挥你的强项。
 features-title-2: 免费的 osu!direct 服务
 features-content-2: |-
-  你不用特意成为 osu!supporter 以此来提高你在客户端下图方面的体验。osu!direct 对所有人开放(并且使用的是国内的sayo镜像站)! 虽然如此,如果你愿意支持我们,你仍然可以获得一些超酷的特权。只不过这些特权并不会影响到你的game sessions!
+  你不用特意成为 osu!supporter 以此来提高你在客户端下图方面的体验。osu!direct 对所有人开放(并且使用的是国内的sayo镜像站)! 虽然如此, 如果你愿意支持我们, 你仍然可以获得一些超酷的特权。只不过这些特权并不会影响到你的game sessions!
 features-title-3: Flexible library
 features-content-3: |-
-  We're written on top of cmyui's multipurpose library allowing for a fully asynchronous environment, both improving performance and the user's experience in the long term!
+  我们基于 cmyui 的多目的性库实现完全异步的环境, 同时长期提升性能和用户体验!
 what-are-you-waiting-for: 你 还 在 等 什 么?
 subtitle: |-
-  赶紧加入到 %{appName} 当中吧! 没有风险! 并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心,你可以随时在官方服务器与我们的服务器之间随意切换。
+  赶紧加入到 %{appName} 当中吧! 没有风险! 并且游玩我们的服务器不会导致你的官服账号被封禁。而且不用担心, 你可以随时在官方服务器与我们的服务器之间随意切换。
 sign-up-for-free: 免 费 注 册！
diff --git a/locales/login/zh-CN.yml b/locales/login/zh-CN.yml
index 3e2021fc..5055668b 100644
--- a/locales/login/zh-CN.yml
+++ b/locales/login/zh-CN.yml
@@ -4,6 +4,6 @@ forgot-login: 忘记账号?
 username: 你的用户名
 email: 电子邮箱
 password-incorrect: 密码错误
-restricted-not-allowed-to-login: 你的账号被封禁了,因此我们不允许你登录
+restricted-not-allowed-to-login: 你的账号被封禁了, 因此我们不允许你登录
 account-does-not-exist: 该账号并不存在
 welcome-back: 欢迎回来 %{username}!
diff --git a/locales/register/zh-CN.yml b/locales/register/zh-CN.yml
index 20384e0c..5ed89c08 100644
--- a/locales/register/zh-CN.yml
+++ b/locales/register/zh-CN.yml
@@ -13,5 +13,5 @@ password:
   must-between-8-32-characters-in-length: 密码的长度只能是8到32个字符之内
 username-cannot-contains-both-dash-and-space: 用户名不能同时存在"_"和" "(空格)符号
 username-already-taken-by-others: 该用户名已经被其他用户使用了
-username-disallowed: 该用户名不允许被使用,请选择别的
+username-disallowed: 该用户名不允许被使用, 请选择别的
 username-syntax-is-invalid: 无效的用户名格式
diff --git a/locales/settings/profile/zh-CN.yml b/locales/settings/profile/zh-CN.yml
index bde2fe14..08aba488 100644
--- a/locales/settings/profile/zh-CN.yml
+++ b/locales/settings/profile/zh-CN.yml
@@ -2,7 +2,7 @@ no-changes-have-been-made: 没有任何改变
 username-changes-supporter-only: 用户名更改功能目前是支持者的福利
 new-username-is-invalid: 你的新用户名格式有误
 new-username-cannot-contains-both-dash-and-space: 你的新用户名不能同时存在"_"(下划线)和" "(空格)字符
-new-username-disallowed: 你的新用户名不允许被使用,再想一个新名字吧
+new-username-disallowed: 你的新用户名不允许被使用, 再想一个新名字吧
 new-username-already-taken-by-others: 你的新用户名已经被其它用户使用
 new-email-is-invalid: 你的新邮箱格式有误
 succeed-please-login-again: 你的用户名或者邮箱地址被修改了!请重新登录
diff --git a/locales/settings/zh-CN.yml b/locales/settings/zh-CN.yml
index 5a3cb038..f78a2a9f 100644
--- a/locales/settings/zh-CN.yml
+++ b/locales/settings/zh-CN.yml
@@ -1,5 +1,5 @@
 avatar: 头像
-avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片.并且图片大小低于5MB
+avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽比为 1:1)的PNG或JPG图片. 并且图片大小低于5MB
 choose-file: 选择一张图片
 save: 保存
 preview: 预览
diff --git a/locales/verify/zh-CN.yml b/locales/verify/zh-CN.yml
index 229085a2..7b077f11 100644
--- a/locales/verify/zh-CN.yml
+++ b/locales/verify/zh-CN.yml
@@ -5,12 +5,12 @@ follow-these-three-simple-steps: 跟随以下三个简单的步骤即可游玩 %
 osu-shortcut: Osu! 快捷方式
 find-your-shortcut: 在桌面上寻找你的osu!快捷方式并复制一份 (如果没有，可以去osu!目录里创建一份)
 edit-it: 修改属性
-right-click-properties: 右键快捷方式,在菜单中找到 "属性" 选项,(一般在最下边)
+right-click-properties: 右键快捷方式, 在菜单中找到 "属性" 选项, (一般在最下边)
 find-target-element-box: 找到 "目标" 这一行
 add-domain: 在文本的末尾添加 -devserver %{domain}
 login-to-your-account: 登入你的账号
-login-to-your-app-name-account: 登录你的 %{appName} 账号,然后就应该万事大吉了!
-oh-crap-i-am-stuck: 妈的，我卡在这个步骤了,赶紧过来帮我一下
+login-to-your-app-name-account: 登录你的 %{appName} 账号, 然后就应该万事大吉了!
+oh-crap-i-am-stuck: 妈的，我卡在这个步骤了, 赶紧过来帮我一下
 need-help-join-discord-server: >-
   Need help? We've got you covered - join the Discord so our community can help
   you out!

From 7c00dd3b6ccd09b3c909d7e13f1e817f8b491183 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 30 Jul 2022 17:35:01 +0000
Subject: [PATCH 131/278] style

---
 static/js/main.js                 |   4 +-
 templates/admin/beatmaps.html     | 102 ++++++++++++++++++++++--------
 templates/admin/home.html         |   8 +--
 templates/admin/restrictions.html |  20 +++++-
 templates/admin/users.html        |  42 ++++++++----
 templates/admin/users_edit.html   |  25 +++++---
 6 files changed, 142 insertions(+), 59 deletions(-)

diff --git a/static/js/main.js b/static/js/main.js
index fbbc805a..84d041fe 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -49,11 +49,11 @@ function search() {
 
 function admin_search() {
     var search = document.getElementById('search-bar').value
-    window.location.href='//osu.' + the_domain + '/admin/users?search=' + search
+    window.location.href='/admin/users?search=' + search
 }
 
 function map_admin_search(name) {
     var search = document.getElementById('search-bar').value
-    window.location.href='//osu.' + the_domain + '/admin/beatmaps/search?' + name + '=' + search
+    window.location.href='/admin/beatmaps/search?' + name + '=' + search
 }
 
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index d6cc5c5d..c11e27c9 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -2,19 +2,44 @@
 {% block title %} Beatmaps {% endblock %}\
 
 {% block content %}
+<style>
+    .rounded-sm {
+        border-radius: 8px !important;
+    }
+
+    .rounded {
+        border-radius: 0.5em
+    }
+
+    .h-100 {
+        height: 100%
+    }
+
+    .d-flex {
+        display: flex;
+    }
+
+    .gap-2 {
+        grid-gap: 1em 1em;
+    }
+
+    .i-text-no-wrap * {
+        white-space: nowrap;
+    }
+</style>
 <div class="columns is-marginless">
     <div class="column is-paddingless is-avatar">
-      <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
-        onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
+        <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
+            onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
     </div>
     <div class="column is-paddingless flex-vcenter">
-      <h2 class="section-title">Beatmaps</h2>
-      <p class="section-lead">Welcome to beatmaps panel</p>
+        <h2 class="section-title">Beatmaps</h2>
+        <p class="section-lead">Welcome to beatmaps panel</p>
     </div>
 </div>
 <div class="row row-deck row-cards" style="margin-top: 20px">
     <div class="columns is-marginless is-paddingless">
-        <div class="column is-paddingless p-3">
+        <div class="column is-paddingless pr-3 py-3">
             <a href="/admin/beatmaps/osu" class="button" style="width: 100%; margin-bottom: 10px">osu!</a>
             <div class="card">
                 <div class="title">Total beatmaps</div>
@@ -41,7 +66,7 @@ <h2 class="section-title">Beatmaps</h2>
                 <div class="stat">We loved them so much</div>
             </div>
         </div>
-        <div class="column is-paddingless p-3">
+        <div class="column is-paddingless pl-3 py-3">
             <a href="/admin/beatmaps/mania" class="button" style="width: 100%; margin-bottom: 10px">osu!mania</a>
             <div class="card">
                 <div class="title">Pending</div>
@@ -51,22 +76,16 @@ <h2 class="section-title">Beatmaps</h2>
             </div>
         </div>
     </div>
-    <div class="column is-paddingless" style="margin: 20px">
-        <div class="columns is-marginless">
-            <div class="column is-paddingless">
-                <input id="search-bar" class="input" value="{{ search_word }}">
-            </div>
-            <div style="margin-left: 20px" class="column is-paddingless">
-                <button onclick="map_admin_search('bid')" class="button" style="width: 200px">Search by BID</button>
-                <button onclick="map_admin_search('sid')" class="button" style="width: 200px">Search by SID</button>
-                <button onclick="map_admin_search('name')" class="button" style="width: 200px">Search by Name</button>
-            </div>
-        </div>
+    <div class="p-0 d-flex gap-2 py-3">
+        <input id="search-bar" class="input" value="{{ search_word }}">
+        <button onclick="map_admin_search('bid')" class="button" style="width: 200px">Search by BID</button>
+        <button onclick="map_admin_search('sid')" class="button" style="width: 200px">Search by SID</button>
+        <button onclick="map_admin_search('name')" class="button" style="width: 200px">Search by Name</button>
     </div>
-    <div class="table-responsive">
-        <table class="table card-table table-vcenter text-nowrap datatable">
+    <div class="table-responsive py-3">
+        <table class="table card-table table-vcenter text-nowrap datatable rounded">
             <thead style="text-align: center;">
-                <tr>
+                <tr class="i-text-no-wrap">
                     <th>Beatmap</th>
                     <th>CS / Keys</th>
                     <th>AR</th>
@@ -81,11 +100,10 @@ <h2 class="section-title">Beatmaps</h2>
             <tbody style="text-align: center;">
                 {% for i in bmap_query %}
                 <tr>
-                    <td class="no-padding">
-                        <div onclick="window.open('https://osu.ppy.sh/beatmapsets/{{ i.set_id }}')"
-                            class="card song-banner"
-                            style="cursor:pointer; background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size:cover; height: 140px; width: 450px;">
-                            <div class="card-body" style="background-color: rgba(0, 0, 0, 0.8);">
+                    <td>
+                        <div onclick="window.open('https://osu.ppy.sh/beatmapsets/{{ i.set_id }}')" class="card p-0"
+                            style="cursor:pointer; background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size: cover; height: 100px; width: 400px;">
+                            <div class="card-body rounded-sm h-100 p-4" style="background-color: rgba(0, 0, 0, 0.8);">
                                 <a class="play-detail__title">{{ i.title }}
                                     <small style="display: inline;">by {{ i.creator }}</small>
                                 </a>
@@ -115,7 +133,37 @@ <h2 class="section-title">Beatmaps</h2>
                         {{ decode_map_status(i.status) }}
                     </td>
                     <td>
-                        <div>
+                        <div class="dropdown">
+                            <div class="dropdown-trigger">
+                                <button class="button" aria-haspopup="true" aria-controls="dropdown-menu">
+                                    <span>Dropdown button</span>
+                                    <span class="icon is-small">
+                                        <i class="fas fa-angle-down" aria-hidden="true"></i>
+                                    </span>
+                                </button>
+                            </div>
+                            <div class="dropdown-menu" id="dropdown-menu" role="menu">
+                                <div class="dropdown-content">
+                                    <a href="#" class="dropdown-item">
+                                        Dropdown item
+                                    </a>
+                                    <a class="dropdown-item">
+                                        Other dropdown item
+                                    </a>
+                                    <a href="#" class="dropdown-item is-active">
+                                        Active dropdown item
+                                    </a>
+                                    <a href="#" class="dropdown-item">
+                                        Other dropdown item
+                                    </a>
+                                    <hr class="dropdown-divider">
+                                    <a href="#" class="dropdown-item">
+                                        With a divider
+                                    </a>
+                                </div>
+                            </div>
+                        </div>
+                        {# <div>
                             <a class="button" href="/admin/beatmaps/edit/{{ i.map_id }}?status=2&set=0">Ranked</a>
                             <a class="button" href="/admin/beatmaps/edit/{{ i.map_id }}?status=5&set=0">Loved</a>
                             <a class="button" href="/admin/beatmaps/edit/{{ i.map_id }}?status=3&set=0">Approved</a>
@@ -131,7 +179,7 @@ <h2 class="section-title">Beatmaps</h2>
                             <a class="button" href="/admin/beatmaps/sync/{{ i.set_id }}">
                                 Sync Beatmapsets with Bancho
                             </a>
-                        </div>
+                        </div> #}
                     </td>
                 </tr>
                 {% endfor %}
diff --git a/templates/admin/home.html b/templates/admin/home.html
index 800ec622..f458b70e 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -23,7 +23,7 @@ <h2 class="section-title">{{ t('admin.base.dashboard') }}</h2>
 </div>
 <div class="dashboard" id="dashboard">
     <div class="columns is-marginless is-paddingless">
-        <div class="column is-paddingless p-3">
+        <div class="column is-paddingless pr-3 py-3">
             <div class="card">
                 <div class="title">{{ t('admin.home.total-users') }}</div>
                 <i class="fa fa-users"></i>
@@ -49,7 +49,7 @@ <h2 class="section-title">{{ t('admin.base.dashboard') }}</h2>
                 <div class="stat">{{ t('admin.home.latest-and-greatest-welcome') }}</div>
             </div>
         </div>
-        <div class="column is-paddingless p-3">
+        <div class="column is-paddingless pl-3 py-3">
             <div class="card">
                 <div class="title">{{ t('admin.home.total-banned') }}</div>
                 <i class="fa fa-calendar"></i>
@@ -60,7 +60,7 @@ <h2 class="section-title">{{ t('admin.base.dashboard') }}</h2>
     </div>
 <div class="columns is-marginless is-paddingless">
     {% if recentusers %}
-    <div class="column is-paddingless m-2 is-3">
+    <div class="column is-paddingless mr-1 is-3">
         <div class="recent-beat">
             <div class="columns is-marginless">
                 <div class="column is-paddingless flex-vcenter">
@@ -99,7 +99,7 @@ <h2 class="section-title">{{ t('admin.home.recent-users') }}</h2>
     </div>
     {% endif %}
     {% if recentscores %}
-    <div class="column is-paddingless m-2">
+    <div class="column is-paddingless ml-1">
         <div class="recent-beat">
             <div class="columns is-marginless">
                 <div class="column is-paddingless flex-vcenter">
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index ab8bb4de..b7685db7 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -2,6 +2,20 @@
 {% block title %} Restrictions {% endblock %}
 
 {% block content %}
+<style>
+    .text-nowrap {
+        white-space: nowrap;
+    }
+    .rounded {
+        border-radius: 0.5rem;
+    }
+    .d-flex {
+        display: flex;
+    }
+    .gap-2 {
+        grid-gap: 1em 1em;
+    }
+</style>
 <div class="columns is-marginless">
     <div class="column is-paddingless is-avatar">
       <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
@@ -16,7 +30,7 @@ <h2 class="section-title">Restrictions</h2>
     <div class="col-12">
         <div class="card">
             <div class="table-responsive">
-                <table class="table card-table table-vcenter text-nowrap datatable">
+                <table class="table card-table table-vcenter text-nowrap datatable rounded">
                     <thead>
                         <tr>
                             <th>ID</th>
@@ -30,14 +44,14 @@ <h2 class="section-title">Restrictions</h2>
                         {% for i in query_data %}
                         <tr>
                             <td>{{ i.id }}</td>
-                            <td class="td-truncate">
+                            <td class="td-truncate text-nowrap">
                                 <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
                                 <a href="/u/{{ i.id }}">{{ i.name }}</a>
                             </td>
                             <td>{{ i.msg }}</td>
                             <td>{{ i.time }}</td>
                             <td>
-                                <a class="btn" href="/admin/users/edit/{{ i.id }}">
+                                <a class="btn text-nowrap" href="/admin/users/edit/{{ i.id }}">
                                     <i class="far fa-edit" aria-hidden="true"></i>⠀Edit
                                 </a>
                             </td>
diff --git a/templates/admin/users.html b/templates/admin/users.html
index 2e88f230..dc275db1 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -2,6 +2,20 @@
 {% block title %} Users {% endblock %}
 
 {% block content %}
+<style>
+    .text-nowrap {
+        white-space: nowrap;
+    }
+    .rounded {
+        border-radius: 0.5rem;
+    }
+    .d-flex {
+        display: flex;
+    }
+    .gap-2 {
+        grid-gap: 1em 1em;
+    }
+</style>
 <div class="columns is-marginless">
     <div class="column is-paddingless is-avatar">
       <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
@@ -14,50 +28,50 @@ <h2 class="section-title">Users</h2>
 </div>
 <div class="card" style="margin-top: 20px">
     <div class="columns">
-        <div class="column is-11">
+        <div class="column px-3 pb-2 pt-4 d-flex gap-2">
             <input id="search-bar" class="input" v-model.trim="search" placeholder="Search by username or email" value="{{ search_value }}" >
-        </div>
-        <div class="column">
             <a class="button is-primary" onclick="admin_search()">Search</a>
         </div>
     </div>
     <div class="table-responsive">
-        <table class="table card-table table-vcenter text-nowrap datatable">
+        <table class="table card-table table-vcenter text-nowrap datatable rounded">
             <thead>
                 <tr>
                     <th>ID</th>
-                    <th>Username</th>
+                    <th>Flag | Username</th>
                     <th>Email</th>
                     <th>Privilege</th>
-                    <th>Country</th>
-                    <th>Creation Time</th>
-                    <th>Last Login</th>
+                    <th>Joined at</th>
+                    <th>Last login</th>
                     <th>IP</th>
-                    <th>Client Channel</th>
-                    <th>Action</th>
+                    <th>Client channel</th>
+                    <th></th>
                 </tr>
             </thead>
             <tbody>
                 {% for i in query_data %}
                 <tr>
                     <td>{{ i.id }}</td>
-                    <td class="td-truncate">
+                    <td class="td-truncate text-nowrap">
                         <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
                         <a href="/u/{{ i.id }}">{{ i.name }}</a>
                     </td>
-                    <td>{{ i.email }}</td>
+                    <td><a href="mailto:{{ i.email }}">{{ i.email }}</a></td>
                     <td>{{ decode_priv(i.priv) }}</td>
-                    <td>{{ i.country }}</td>
                     <td>{{ handle_timestamp(i.creation_time) }}</td>
                     <td>{{ i.last_login }}</td>
                     <td>
+                        {% if i.ip != None %}
                         <a target="_blank" href="https://whatismyipaddress.com/ip/{{ i.ip }}">
                             {{ i.ip }}
                         </a>
+                        {% else %}
+                        {{ i.ip }}
+                        {% endif %}
                     </td>
                     <td>{{ i.osu_stream }}</td>
                     <td>
-                        <a class="btn" href="/admin/users/edit/{{ i.id }}">
+                        <a class="btn text-nowrap" href="/admin/users/edit/{{ i.id }}">
                             <i class="far fa-edit" aria-hidden="true"></i>⠀Edit
                         </a>
                     </td>
diff --git a/templates/admin/users_edit.html b/templates/admin/users_edit.html
index ea7a65ca..3ad34c7d 100644
--- a/templates/admin/users_edit.html
+++ b/templates/admin/users_edit.html
@@ -2,7 +2,14 @@
 {% block title %} Users {% endblock %} 
 
 {% block content %} 
-
+<style>
+    .text-nowrap {
+        white-space: nowrap;
+    }
+    .w-100 {
+        width: 100%;
+    }
+</style>
 <form action="/admin/users/update/{{ search_data['id'] }}" method="POST" id="edit-user">
     <div style="display: flex; align-items: center; flex-direction: column;">
         <article style="width: 40%;" class="panel is-primary">
@@ -10,7 +17,7 @@
             Edit Info of {{ search_data['name'] }}
             </p>
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter">
+                <div class="column is-one-quarter text-nowrap">
                     <i class="fas fa-user" aria-hidden="true"></i>
                     Username
                 </div>
@@ -19,7 +26,7 @@
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter">
+                <div class="column is-one-quarter text-nowrap">
                     <i class="fas fa-user" aria-hidden="true"></i>
                     Email
                 </div>
@@ -28,7 +35,7 @@
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter">
+                <div class="column is-one-quarter text-nowrap">
                     <i class="fas fa-user" aria-hidden="true"></i>
                     Country
                 </div>
@@ -37,13 +44,13 @@
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter">
+                <div class="column is-one-quarter text-nowrap">
                     <i class="fas fa-user" aria-hidden="true"></i>
                     Legality
                 </div>
                 <div class="column">
-                    <div class="select">
-                        <select name="legality">
+                    <div class="select w-100">
+                        <select name="legality" class="w-100">
                             <option value="unrestricted">Unrestricted</option>
                             {% if search_data.priv == 2 %}
                             <option value="restricted" selected>Restricted</option>
@@ -55,8 +62,8 @@
                     </div>
                 </div>
             </div>
-            <div class="panel-block">
-                <button type="submit" form="edit-user" style="margin: auto; width: 100px;" class="button is-primary">Update</button>
+            <div class="panel-block pb-4">
+                <button type="submit" form="edit-user" style="margin-left: auto; margin-right: 1em; width: 100px;" class="button is-primary">Update</button>
             </div>
         </article>
     </div>

From 6bf5281ba4643209ca62edd1b039d27c685f3c6b Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 30 Jul 2022 18:18:30 +0000
Subject: [PATCH 132/278] overall styling & quality upgrade?

---
 static/js/{asserts => assets}/vue-axios.js |  0
 static/js/{asserts => assets}/vue-flags.js |  0
 static/js/{asserts => assets}/vue.js       |  0
 static/js/pages/admin/dashboard.js         |  2 +-
 static/js/pages/leaderboard.js             |  2 +-
 static/js/pages/profile.js                 |  8 +-
 templates/admin/beatmaps.html              | 89 +++++++++-------------
 templates/admin/home.html                  |  4 +-
 templates/leaderboard.html                 |  6 +-
 templates/profile.html                     |  4 +-
 10 files changed, 49 insertions(+), 66 deletions(-)
 rename static/js/{asserts => assets}/vue-axios.js (100%)
 rename static/js/{asserts => assets}/vue-flags.js (100%)
 rename static/js/{asserts => assets}/vue.js (100%)

diff --git a/static/js/asserts/vue-axios.js b/static/js/assets/vue-axios.js
similarity index 100%
rename from static/js/asserts/vue-axios.js
rename to static/js/assets/vue-axios.js
diff --git a/static/js/asserts/vue-flags.js b/static/js/assets/vue-flags.js
similarity index 100%
rename from static/js/asserts/vue-flags.js
rename to static/js/assets/vue-flags.js
diff --git a/static/js/asserts/vue.js b/static/js/assets/vue.js
similarity index 100%
rename from static/js/asserts/vue.js
rename to static/js/assets/vue.js
diff --git a/static/js/pages/admin/dashboard.js b/static/js/pages/admin/dashboard.js
index e967da14..1a23e3dd 100644
--- a/static/js/pages/admin/dashboard.js
+++ b/static/js/pages/admin/dashboard.js
@@ -13,7 +13,7 @@ new Vue({
     methods: {
         GetOnlineUsers() {
             var vm = this;
-            vm.$axios.get(`${window.location.protocol}//api.${domain}/get_player_count`)
+            vm.$axios.get(`//api.${domain}/get_player_count`)
                 .then(function (response) {
                     vm.online_users = response.data.counts.online;
                 });
diff --git a/static/js/pages/leaderboard.js b/static/js/pages/leaderboard.js
index 7522c996..ebc5dcfe 100644
--- a/static/js/pages/leaderboard.js
+++ b/static/js/pages/leaderboard.js
@@ -38,7 +38,7 @@ new Vue({
             this.$set(this, 'mods', mods);
             this.$set(this, 'sort', sort);
             this.$set(this, 'load', true);
-            this.$axios.get(`${window.location.protocol}//api.${domain}/get_leaderboard`, { params: {
+            this.$axios.get(`//api.${domain}/get_leaderboard`, { params: {
                 mode: this.StrtoGulagInt(),
                 sort: this.sort
             }}).then(res => {
diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 78acca27..12fd945f 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -60,7 +60,7 @@ new Vue({
         },
         LoadProfileData() {
             this.$set(this.data.stats, 'load', true);
-            this.$axios.get(`${window.location.protocol}//api.${domain}/get_player_info`, {
+            this.$axios.get(`//api.${domain}/get_player_info`, {
                     params: {
                         id: this.userid,
                         scope: 'all'
@@ -73,7 +73,7 @@ new Vue({
         },
         LoadScores(sort) {
             this.$set(this.data.scores[`${sort}`], 'load', true);
-            this.$axios.get(`${window.location.protocol}//api.${domain}/get_player_scores`, {
+            this.$axios.get(`//api.${domain}/get_player_scores`, {
                     params: {
                         id: this.userid,
                         mode: this.StrtoGulagInt(),
@@ -89,7 +89,7 @@ new Vue({
         },
         LoadMostBeatmaps() {
             this.$set(this.data.maps.most, 'load', true);
-            this.$axios.get(`${window.location.protocol}//api.${domain}/get_player_most_played`, {
+            this.$axios.get(`//api.${domain}/get_player_most_played`, {
                     params: {
                         id: this.userid,
                         mode: this.StrtoGulagInt(),
@@ -103,7 +103,7 @@ new Vue({
                 });
         },
         LoadUserStatus() {
-            this.$axios.get(`${window.location.protocol}//api.${domain}/get_player_status`, {
+            this.$axios.get(`//api.${domain}/get_player_status`, {
                     params: {
                         id: this.userid
                     }
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index c11e27c9..3f5fd158 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -26,6 +26,9 @@
     .i-text-no-wrap * {
         white-space: nowrap;
     }
+    .my-auto {
+        vertical-align: middle !important;
+    }
 </style>
 <div class="columns is-marginless">
     <div class="column is-paddingless is-avatar">
@@ -83,10 +86,10 @@ <h2 class="section-title">Beatmaps</h2>
         <button onclick="map_admin_search('name')" class="button" style="width: 200px">Search by Name</button>
     </div>
     <div class="table-responsive py-3">
-        <table class="table card-table table-vcenter text-nowrap datatable rounded">
-            <thead style="text-align: center;">
+        <table class="table rounded">
+            <thead>
                 <tr class="i-text-no-wrap">
-                    <th>Beatmap</th>
+                    <th style="width: 400px">Beatmap</th>
                     <th>CS / Keys</th>
                     <th>AR</th>
                     <th>HP</th>
@@ -97,13 +100,13 @@ <h2 class="section-title">Beatmaps</h2>
                     <th>Actions</th>
                 </tr>
             </thead>
-            <tbody style="text-align: center;">
+            <tbody>
                 {% for i in bmap_query %}
                 <tr>
-                    <td>
-                        <div onclick="window.open('https://osu.ppy.sh/beatmapsets/{{ i.set_id }}')" class="card p-0"
-                            style="cursor:pointer; background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size: cover; height: 100px; width: 400px;">
-                            <div class="card-body rounded-sm h-100 p-4" style="background-color: rgba(0, 0, 0, 0.8);">
+                    <td style="width: 400px">
+                        <div class="card p-0 m-0"
+                            style="background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size: cover; height: 100px; width: 400px;">
+                            <div class="card-body rounded-sm h-100 p-4" style="background-color: rgba(0, 0, 0, 0.8);cursor:pointer; " onclick="window.open('https://osu.ppy.sh/beatmapsets/{{ i.set_id }}')">
                                 <a class="play-detail__title">{{ i.title }}
                                     <small style="display: inline;">by {{ i.creator }}</small>
                                 </a>
@@ -111,75 +114,55 @@ <h2 class="section-title">Beatmaps</h2>
                             </div>
                         </div>
                     </td>
-                    <td class="bigger_td">
+                    <td class="!bigger_td my-auto">
                         {{ i.cs }}
                     </td>
-                    <td class="bigger_td">
+                    <td class="!bigger_td my-auto">
                         {{ i.ar }}
                     </td>
-                    <td class="bigger_td">
+                    <td class="!bigger_td my-auto">
                         {{ i.hp }}
                     </td>
-                    <td class="bigger_td">
+                    <td class="!bigger_td my-auto">
                         {{ i.od }}
                     </td>
-                    <td class="bigger_td">
+                    <td class="!bigger_td my-auto">
                         {{ i.bpm }}
                     </td>
-                    <td class="bigger_td">
+                    <td class="!bigger_td my-auto">
                         {{ i.stars }}
                     </td>
-                    <td class="bigger_td">
-                        {{ decode_map_status(i.status) }}
+                    <td class="!bigger_td my-auto">
+                        {{ decode_map_status(i.status) }} {{i.status}}
                     </td>
-                    <td>
-                        <div class="dropdown">
+                    <td class="!bigger_td my-auto">
+                        <div class="dropdown is-right" id="i-dropdown-{{ i.map_id }}">
                             <div class="dropdown-trigger">
-                                <button class="button" aria-haspopup="true" aria-controls="dropdown-menu">
-                                    <span>Dropdown button</span>
+                                <button class="button" aria-haspopup="true" aria-controls="dropdown-menu" onclick="document.getElementById('i-dropdown-{{ i.map_id }}').classList.toggle('is-active')">
+                                    <span>Edit status</span>
                                     <span class="icon is-small">
                                         <i class="fas fa-angle-down" aria-hidden="true"></i>
                                     </span>
                                 </button>
                             </div>
-                            <div class="dropdown-menu" id="dropdown-menu" role="menu">
-                                <div class="dropdown-content">
-                                    <a href="#" class="dropdown-item">
-                                        Dropdown item
-                                    </a>
-                                    <a class="dropdown-item">
-                                        Other dropdown item
-                                    </a>
-                                    <a href="#" class="dropdown-item is-active">
-                                        Active dropdown item
-                                    </a>
-                                    <a href="#" class="dropdown-item">
-                                        Other dropdown item
-                                    </a>
+                            <div class="dropdown-menu" id="dropdown-menu-{{ i.map_id }}" role="menu">
+                                <div class="dropdown-content has-background-primary">
+                                    <a class="dropdown-item {% if i.status == 2 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=2&set=0">To Ranked</a>
+                                    <a class="dropdown-item {#{% if i.status == 5 %} is-disabled {% endif %}#}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=5&set=0">To Loved</a>
+                                    <a class="dropdown-item {% if i.status == 3 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=3&set=0">To Approved</a>
+                                    <a class="dropdown-item {% if i.status == 1 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=0&set=0">To Pending</a>
+                                    <hr class="dropdown-divider">
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=2&set=1">Rank BeatmapSet</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">Love BeatmapSet</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">Approve BeatmapSet</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">Pending BeatmapSet</a>
                                     <hr class="dropdown-divider">
-                                    <a href="#" class="dropdown-item">
-                                        With a divider
+                                    <a class="dropdown-item" href="/admin/beatmaps/sync/{{ i.set_id }}">
+                                        Sync Beatmapsets with Bancho
                                     </a>
                                 </div>
                             </div>
                         </div>
-                        {# <div>
-                            <a class="button" href="/admin/beatmaps/edit/{{ i.map_id }}?status=2&set=0">Ranked</a>
-                            <a class="button" href="/admin/beatmaps/edit/{{ i.map_id }}?status=5&set=0">Loved</a>
-                            <a class="button" href="/admin/beatmaps/edit/{{ i.map_id }}?status=3&set=0">Approved</a>
-                            <a class="button" href="/admin/beatmaps/edit/{{ i.map_id }}?status=0&set=0">Pending</a>
-                        </div>
-                        <div style="margin-top: 10px">
-                            <a class="button" href="/admin/beatmaps/edit/{{ i.set_id }}?status=2&set=1">Ranked Set</a>
-                            <a class="button" href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">Loved Set</a>
-                            <a class="button" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">Approved Set</a>
-                            <a class="button" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">Pending Set</a>
-                        </div>
-                        <div style="margin-top: 10px">
-                            <a class="button" href="/admin/beatmaps/sync/{{ i.set_id }}">
-                                Sync Beatmapsets with Bancho
-                            </a>
-                        </div> #}
                     </td>
                 </tr>
                 {% endfor %}
diff --git a/templates/admin/home.html b/templates/admin/home.html
index f458b70e..c2ad4241 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -1,8 +1,8 @@
 {% extends 'admin/base.html' %}
 {% block title %} Dashboard {% endblock %}
 {% block header %}
-<script src="/static/js/asserts/vue.js"></script>
-<script src="/static/js/asserts/vue-axios.js"></script>
+<script src="/static/js/assets/vue.js"></script>
+<script src="/static/js/assets/vue-axios.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
 <script>
     var domain = "{{ domain() }}";
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index 3cf306a1..75f9ccb1 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -2,8 +2,8 @@
 {% block title %} {{ t('global.leaderboard') }} {% endblock %}
 
 {% block header %}
-<script src="/static/js/asserts/vue.js"></script>
-<script src="/static/js/asserts/vue-axios.js"></script>
+<script src="/static/js/assets/vue.js"></script>
+<script src="/static/js/assets/vue-axios.js"></script>
 
 <script>
     var mode = "{{ mode }}";
@@ -123,6 +123,6 @@
     </div>
 </div>
 
-<script src="/static/js/asserts/vue-flags.js"></script>
+<script src="/static/js/assets/vue-flags.js"></script>
 <script src="/static/js/pages/leaderboard.js?v=1.0"></script>
 {% endblock %}
diff --git a/templates/profile.html b/templates/profile.html
index 2ca7e50f..dbe77cbe 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -123,8 +123,8 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
 {% endmacro %}
 
 {% block header %}
-<script src="/static/js/asserts/vue.js"></script>
-<script src="/static/js/asserts/vue-axios.js"></script>
+<script src="/static/js/assets/vue.js"></script>
+<script src="/static/js/assets/vue-axios.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
 <link rel="stylesheet" href="/static/css/pages/profile.css?v=1.0">
 

From c1e6322b7d8f0c57eb65a5cc2ec712819403be9e Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Sun, 31 Jul 2022 02:56:38 +0000
Subject: [PATCH 133/278] create api_key automatically

---
 blueprints/frontend.py          | 16 ++++++++++++----
 ext/requirements.txt            |  1 +
 templates/settings/profile.html |  8 +++-----
 3 files changed, 16 insertions(+), 9 deletions(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index f1d2113d..7a878107 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -6,6 +6,7 @@
 import hashlib
 import os
 import time
+import uuid
 
 
 from cmyui.logging import Ansi
@@ -81,9 +82,6 @@ async def settings_profile_post():
         return await flash('error', t('settings.profile.no-changes-have-been-made'), 'settings/profile')
 
     if new_name != old_name:
-        if not session['user_data']['is_donator']:
-            return await flash('error', t('settings.profile.username-changes-supporter-only'), 'settings/profile')
-
         # Usernames must:
         # - be within 2-15 characters in length
         # - not contain both ' ' and '_', one is fine
@@ -366,7 +364,7 @@ async def login_post():
     # check if account exists
     user_info = await glob.db.fetch(
         'SELECT id, name, email, priv, '
-        'pw_bcrypt, silence_end '
+        'pw_bcrypt, silence_end, api_key '
         'FROM users '
         'WHERE safe_name = %s',
         [utils.get_safe_name(username)]
@@ -412,6 +410,15 @@ async def login_post():
             log(f"{username}'s login failed - banned.", Ansi.RED)
         return await flash('error', t('login.restricted-not-allowed-to-login'), 'login')
 
+    api_key = user_info['api_key']
+
+    if api_key is None:
+        api_key = str(uuid.uuid4())
+        await glob.db.execute(
+        "UPDATE users SET api_key = %s WHERE id = %s",
+        [api_key, user_info['id']]
+    )
+
     # login successful; store session data
     if glob.config.debug:
         log(f"{username}'s login succeeded.", Ansi.LGREEN)
@@ -422,6 +429,7 @@ async def login_post():
         'name': user_info['name'],
         'email': user_info['email'],
         'priv': user_info['priv'],
+        'api_key': api_key,
         'silence_end': user_info['silence_end'],
         'is_staff': user_info['priv'] & Privileges.Staff != 0,
         'is_bn': user_info['priv'] & Privileges.Nominator != 0,
diff --git a/ext/requirements.txt b/ext/requirements.txt
index 98989317..c6c94b00 100644
--- a/ext/requirements.txt
+++ b/ext/requirements.txt
@@ -11,3 +11,4 @@ Pillow
 
 python-i18n[YAML]
 requires
+uuid
diff --git a/templates/settings/profile.html b/templates/settings/profile.html
index 08ef461d..f865fc6a 100644
--- a/templates/settings/profile.html
+++ b/templates/settings/profile.html
@@ -23,7 +23,7 @@
               <div class="field">
                 <p class="control">
                   <input class="input" type="text" name="username"
-                  value="{{ session.user_data['name'] }}" {% if not session.user_data['is_donator'] %}readonly{% endif %}>
+                  value="{{ session.user_data['name'] }}">
                 </p>
               </div>
             </div>
@@ -45,24 +45,22 @@
             </div>
           </div>
         </div>
-        <!-- Disabled - Username AKA doesn't exist in gulag? (for now?)
         <div class="single-block-content">
           <div class="block-content--left">
             <div class="field-label is-normal">
-              <label class="label">{{ t('profile.name-aka') }}</label>
+              <label class="label">API Key</label>
             </div>
           </div>
           <div class="block-content--right">
             <div class="field-body">
               <div class="field">
                 <p class="control">
-                  <input class="input" type="aka" value="">
+                  <input class="input" readonly type="text" name="api_key" value="{{ session.user_data['api_key'] }}">
                 </p>
               </div>
             </div>
           </div>
         </div>
-        -->
         <button class='button is-primary' type='submit'><span>{{ t('settings.save') }}</span><span class='icon is-small'><i class='fas fa-check'></i></span></button>
       </form>
     </div>

From 74124ab6849204aa9155d2919d491ae3aa68b204 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 31 Jul 2022 03:13:25 +0000
Subject: [PATCH 134/278] remove debug stuff

---
 templates/admin/beatmaps.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 3f5fd158..287bcd40 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -133,7 +133,7 @@ <h2 class="section-title">Beatmaps</h2>
                         {{ i.stars }}
                     </td>
                     <td class="!bigger_td my-auto">
-                        {{ decode_map_status(i.status) }} {{i.status}}
+                        {{ decode_map_status(i.status) }}
                     </td>
                     <td class="!bigger_td my-auto">
                         <div class="dropdown is-right" id="i-dropdown-{{ i.map_id }}">

From ae1f8cb2085b3eeb4e2eb76ab179229aadd69f2f Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 31 Jul 2022 04:21:24 +0000
Subject: [PATCH 135/278] update visual

---
 templates/admin/beatmaps.html | 74 ++++++++++++++++++++---------------
 1 file changed, 42 insertions(+), 32 deletions(-)

diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 287bcd40..83ba94d8 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -4,7 +4,7 @@
 {% block content %}
 <style>
     .rounded-sm {
-        border-radius: 8px !important;
+        border-radius: 7px !important;
     }
 
     .rounded {
@@ -29,6 +29,12 @@
     .my-auto {
         vertical-align: middle !important;
     }
+    .shadow {
+        filter: drop-shadow(0 0 0.5rem rgba(0,0,0,0.2));
+    }
+    .card .title, .card .stat {
+        font-size: 12px
+    }
 </style>
 <div class="columns is-marginless">
     <div class="column is-paddingless is-avatar">
@@ -44,38 +50,38 @@ <h2 class="section-title">Beatmaps</h2>
     <div class="columns is-marginless is-paddingless">
         <div class="column is-paddingless pr-3 py-3">
             <a href="/admin/beatmaps/osu" class="button" style="width: 100%; margin-bottom: 10px">osu!</a>
-            <div class="card">
-                <div class="title">Total beatmaps</div>
+            <div class="card has-text-right">
                 <i class="fa fa-plus"></i>
+                <div class="title">Total beatmaps</div>
                 <div class="value">{{ counts['total'] }}</div>
-                <div class="stat">That's a lot of maps</div>
+                <div class="stat has-text-left">That's a lot of maps</div>
             </div>
         </div>
         <div class="column is-paddingless p-3">
             <a href="/admin/beatmaps/taiko" class="button" style="width: 100%; margin-bottom: 10px">osu!taiko</a>
-            <div class="card">
-                <div class="title">Ranked</div>
+            <div class="card has-text-right">
                 <i class="fa fa-bolt"></i>
+                <div class="title">Ranked</div>
                 <div class="value">{{ counts['ranked'] }}</div>
-                <div class="stat">These maps can gain many pp</div>
+                <div class="stat has-text-left">These maps can gain many pp</div>
             </div>
         </div>
         <div class="column is-paddingless p-3">
             <a href="/admin/beatmaps/catch" class="button" style="width: 100%; margin-bottom: 10px">osu!catch</a>
-            <div class="card">
-                <div class="title">Loved</div>
+            <div class="card has-text-right">
                 <i class="fa fa-heart"></i>
+                <div class="title">Loved</div>
                 <div class="value">{{ counts['loved'] }}</div>
-                <div class="stat">We loved them so much</div>
+                <div class="stat has-text-left">We loved them so much</div>
             </div>
         </div>
         <div class="column is-paddingless pl-3 py-3">
             <a href="/admin/beatmaps/mania" class="button" style="width: 100%; margin-bottom: 10px">osu!mania</a>
-            <div class="card">
-                <div class="title">Pending</div>
+            <div class="card has-text-right">
                 <i class="fa fa-arrows-rotate"></i>
+                <div class="title">Pending</div>
                 <div class="value">{{ counts['pending'] }}</div>
-                <div class="stat">They are also good maps</div>
+                <div class="stat has-text-left">They are also good maps</div>
             </div>
         </div>
     </div>
@@ -89,22 +95,22 @@ <h2 class="section-title">Beatmaps</h2>
         <table class="table rounded">
             <thead>
                 <tr class="i-text-no-wrap">
-                    <th style="width: 400px">Beatmap</th>
-                    <th>CS / Keys</th>
-                    <th>AR</th>
-                    <th>HP</th>
-                    <th>OD</th>
-                    <th>BPM</th>
-                    <th>Stars</th>
-                    <th>Status</th>
-                    <th>Actions</th>
+                    <th class="has-text-centered" style="width: 400px">Beatmap</th>
+                    <th class="has-text-right">CS / Keys</th>
+                    <th class="has-text-right">AR</th>
+                    <th class="has-text-right">HP</th>
+                    <th class="has-text-right">OD</th>
+                    <th class="has-text-right">BPM</th>
+                    <th class="has-text-right">Stars</th>
+                    <th class="has-text-centered">Status</th>
+                    <th class="has-text-centered">Actions</th>
                 </tr>
             </thead>
             <tbody>
                 {% for i in bmap_query %}
                 <tr>
                     <td style="width: 400px">
-                        <div class="card p-0 m-0"
+                        <div class="card p-0 m-0 shadow"
                             style="background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size: cover; height: 100px; width: 400px;">
                             <div class="card-body rounded-sm h-100 p-4" style="background-color: rgba(0, 0, 0, 0.8);cursor:pointer; " onclick="window.open('https://osu.ppy.sh/beatmapsets/{{ i.set_id }}')">
                                 <a class="play-detail__title">{{ i.title }}
@@ -114,28 +120,32 @@ <h2 class="section-title">Beatmaps</h2>
                             </div>
                         </div>
                     </td>
-                    <td class="!bigger_td my-auto">
+                    <td class="!bigger_td my-auto has-text-right">
                         {{ i.cs }}
                     </td>
-                    <td class="!bigger_td my-auto">
+                    <td class="!bigger_td my-auto has-text-right">
                         {{ i.ar }}
                     </td>
-                    <td class="!bigger_td my-auto">
+                    <td class="!bigger_td my-auto has-text-right">
                         {{ i.hp }}
                     </td>
-                    <td class="!bigger_td my-auto">
+                    <td class="!bigger_td my-auto has-text-right">
                         {{ i.od }}
                     </td>
-                    <td class="!bigger_td my-auto">
+                    <td class="!bigger_td my-auto has-text-right">
                         {{ i.bpm }}
                     </td>
-                    <td class="!bigger_td my-auto">
+                    <td class="!bigger_td my-auto has-text-right">
                         {{ i.stars }}
                     </td>
-                    <td class="!bigger_td my-auto">
-                        {{ decode_map_status(i.status) }}
+                    <td class="!bigger_td my-auto has-text-centered">
+                        <div class="tag
+                        {% if i.status == 2 %} is-primary
+                        {% elif i.status == 3 %} is-info
+                        {% elif i.status == 4 %} is-success {% endif %}
+                        ">{{ decode_map_status(i.status) }}</div>
                     </td>
-                    <td class="!bigger_td my-auto">
+                    <td class="!bigger_td my-auto has-text-centered">
                         <div class="dropdown is-right" id="i-dropdown-{{ i.map_id }}">
                             <div class="dropdown-trigger">
                                 <button class="button" aria-haspopup="true" aria-controls="dropdown-menu" onclick="document.getElementById('i-dropdown-{{ i.map_id }}').classList.toggle('is-active')">

From 54b20383d1361d4f521093718c045ef58101dc3a Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Sun, 31 Jul 2022 04:36:25 +0000
Subject: [PATCH 136/278] add sync beatmaps

---
 static/js/main.js             |  8 ++++++++
 templates/admin/base.html     |  4 +---
 templates/admin/beatmaps.html | 15 ++++++++++++---
 3 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/static/js/main.js b/static/js/main.js
index 84d041fe..3ba7025e 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -57,3 +57,11 @@ function map_admin_search(name) {
     window.location.href='/admin/beatmaps/search?' + name + '=' + search
 }
 
+function map_admin_force_update(sid) {
+    var bar = document.getElementById('progress_bar')
+    bar.style=""
+    $.get('//api.' + the_domain + '/update_beatmapsets?api_key=' + api_key + '&sid=' + sid, function(data, status) {
+        bar.style="display: none;"
+        alert('finished')
+    })
+}
\ No newline at end of file
diff --git a/templates/admin/base.html b/templates/admin/base.html
index d284bb02..bb6fff3e 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -19,9 +19,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <!-- jquery -->
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.min.js"
-    integrity="sha512-/DXTXr6nQodMUiq+IUJYCt2PPOUjrHJ9wFrqpJ3XkgPNOZVfMok7cRw6CSxyCQxXn6ozlESsSh1/sMCTF1rL/g=="
-    crossorigin="anonymous"></script>
+  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
 
   <!-- bulma -->
   <link rel="stylesheet" href="/static/css/bulma.css?v={{ rand() }}" />
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 3f5fd158..5d0ad5aa 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -1,5 +1,5 @@
 {% extends 'admin/base.html' %}
-{% block title %} Beatmaps {% endblock %}\
+{% block title %} Beatmaps {% endblock %}
 
 {% block content %}
 <style>
@@ -29,7 +29,17 @@
     .my-auto {
         vertical-align: middle !important;
     }
+    .progress {
+        position: fixed;
+        margin-top: -30px;
+        width: 85%;
+        z-index: 1;
+    }
 </style>
+<script>
+    var api_key = '{{ session.user_data['api_key'] }}'
+</script>
+<progress id="progress_bar" class="progress is-small is-primary" max="100" style="display: none;"></progress>
 <div class="columns is-marginless">
     <div class="column is-paddingless is-avatar">
         <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
@@ -157,7 +167,7 @@ <h2 class="section-title">Beatmaps</h2>
                                     <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">Approve BeatmapSet</a>
                                     <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">Pending BeatmapSet</a>
                                     <hr class="dropdown-divider">
-                                    <a class="dropdown-item" href="/admin/beatmaps/sync/{{ i.set_id }}">
+                                    <a class="dropdown-item" href="javascript:void(0);" onclick="map_admin_force_update({{ i.set_id }})">
                                         Sync Beatmapsets with Bancho
                                     </a>
                                 </div>
@@ -192,7 +202,6 @@ <h2 class="section-title">Beatmaps</h2>
                 $(this).removeClass('is-active');
             });
         });
-
     });
 </script>
 {% endblock %}
\ No newline at end of file

From 4ff0ff6ac30b3da2ac27186f27b513b114800250 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 31 Jul 2022 04:38:53 +0000
Subject: [PATCH 137/278] table

---
 templates/admin/users.html | 79 ++++++++++++++++++++++++--------------
 1 file changed, 51 insertions(+), 28 deletions(-)

diff --git a/templates/admin/users.html b/templates/admin/users.html
index dc275db1..fcd2c8d5 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -6,30 +6,34 @@
     .text-nowrap {
         white-space: nowrap;
     }
+
     .rounded {
         border-radius: 0.5rem;
     }
+
     .d-flex {
         display: flex;
     }
+
     .gap-2 {
         grid-gap: 1em 1em;
     }
 </style>
 <div class="columns is-marginless">
     <div class="column is-paddingless is-avatar">
-      <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
-        onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
+        <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
+            onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
     </div>
     <div class="column is-paddingless flex-vcenter">
-      <h2 class="section-title">Users</h2>
-      <p class="section-lead">Welcome to users panel</p>
+        <h2 class="section-title">Users</h2>
+        <p class="section-lead">Welcome to users panel</p>
     </div>
 </div>
 <div class="card" style="margin-top: 20px">
     <div class="columns">
         <div class="column px-3 pb-2 pt-4 d-flex gap-2">
-            <input id="search-bar" class="input" v-model.trim="search" placeholder="Search by username or email" value="{{ search_value }}" >
+            <input id="search-bar" class="input" v-model.trim="search" placeholder="Search by username or email"
+                value="{{ search_value }}">
             <a class="button is-primary" onclick="admin_search()">Search</a>
         </div>
     </div>
@@ -37,42 +41,61 @@ <h2 class="section-title">Users</h2>
         <table class="table card-table table-vcenter text-nowrap datatable rounded">
             <thead>
                 <tr>
-                    <th>ID</th>
+                    <th class="has-text-right">ID</th>
                     <th>Flag | Username</th>
-                    <th>Email</th>
-                    <th>Privilege</th>
-                    <th>Joined at</th>
-                    <th>Last login</th>
-                    <th>IP</th>
-                    <th>Client channel</th>
-                    <th></th>
+                    <th class="has-text-centered">Privilege</th>
+                    <th class="has-text-centered">Last login</th>
+                    <th class="has-text-centered">Joined at</th>
+                    <th class="has-text-centered">Client channel</th>
+                    <th class="has-text-centered">Email</th>
+                    <th class="has-text-centered">IP</th>
+                    <th class="has-text-centered"></th>
                 </tr>
             </thead>
             <tbody>
                 {% for i in query_data %}
                 <tr>
-                    <td>{{ i.id }}</td>
+                    <td class="has-text-right">{{ i.id }}</td>
                     <td class="td-truncate text-nowrap">
-                        <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
+                        <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag"
+                            style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
                         <a href="/u/{{ i.id }}">{{ i.name }}</a>
                     </td>
-                    <td><a href="mailto:{{ i.email }}">{{ i.email }}</a></td>
-                    <td>{{ decode_priv(i.priv) }}</td>
-                    <td>{{ handle_timestamp(i.creation_time) }}</td>
-                    <td>{{ i.last_login }}</td>
-                    <td>
+                    <td class="has-text-centered">{{ decode_priv(i.priv) }}</td>
+                    <td class="has-text-centered">
+                    {% if i.last_login %}{{ i.last_login }}
+                    {% else %} -
+                    {% endif %}
+                    </td>
+                    <td class="has-text-centered">{{ handle_timestamp(i.creation_time) }}</td>
+                    <td class="has-text-centered">
+                    {% if i.osu_stream %}
+                        <div class="tag
+                        {% if i.osu_stream == 'stable' %} is-primary
+                        {% elif i.osu_stream == 'beta' %} is-info
+                        {% elif i.osu_stream == 'cuttingedge' %} is-light
+                        {% elif i.osu_stream == 'tourney' %} is-dark
+                        {% elif i.osu_stream == 'fallback' %} is-warning
+                        {% else %} is-danger
+                        {% endif %}
+                        ">{{ i.osu_stream }}
+                        </div>
+                    {% else %} -
+                    {% endif %}
+                    </td>
+                    <td class="has-text-centered"><a href="mailto:{{ i.email }}">{{ i.email }}</a></td>
+                    <td class="has-text-centered">
                         {% if i.ip != None %}
                         <a target="_blank" href="https://whatismyipaddress.com/ip/{{ i.ip }}">
                             {{ i.ip }}
                         </a>
                         {% else %}
-                        {{ i.ip }}
+                        -
                         {% endif %}
                     </td>
-                    <td>{{ i.osu_stream }}</td>
-                    <td>
+                    <td class="has-text-centered">
                         <a class="btn text-nowrap" href="/admin/users/edit/{{ i.id }}">
-                            <i class="far fa-edit" aria-hidden="true"></i>⠀Edit
+                            <i class="far fa-edit" aria-hidden="true"></i> Edit
                         </a>
                     </td>
                 </tr>
@@ -83,11 +106,11 @@ <h2 class="section-title">Users</h2>
 </div>
 
 <script>
-    $("#search-bar").keydown(function(e) {  
+    $("#search-bar").keydown(function (e) {
         if (e.keyCode == 13) {
             admin_search()
-        }  
-   });  
+        }
+    });  
 </script>
 
-{% endblock content %}
+{% endblock content %}
\ No newline at end of file

From 1da31a55dd878027fbbe2c75a49608d3e0fe7532 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 31 Jul 2022 04:48:37 +0000
Subject: [PATCH 138/278] add bid

---
 templates/admin/beatmaps.html | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index fe71a319..47e085e9 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -126,7 +126,10 @@ <h2 class="section-title">Beatmaps</h2>
                                 <a class="play-detail__title">{{ i.title }}
                                     <small style="display: inline;">by {{ i.creator }}</small>
                                 </a>
-                                <span style="color: #ea0; font-size: 14px">Skystar's Tragic Love Extra</span>
+                                <span style="color: #ea0; font-size: 14px; display: block;">Skystar's Tragic Love Extra</span>
+                                <div style="font-size: 14px; position: absolute;bottom: 1em; right: 1em; opacity: 0.7;">
+                                    bid: <span style="color: #ea0;">{{ i.map_id }}</span>
+                                </div>
                             </div>
                         </div>
                     </td>

From f46e8e713248a4bfcf5471228991a3a9ec5e415a Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 31 Jul 2022 04:57:39 +0000
Subject: [PATCH 139/278] move styles to where it should be

---
 templates/admin/beatmaps.html     | 8 +++++---
 templates/admin/home.html         | 5 +++++
 templates/admin/restrictions.html | 8 +++++---
 templates/admin/users.html        | 8 +++++---
 templates/admin/users_edit.html   | 8 +++++---
 5 files changed, 25 insertions(+), 12 deletions(-)

diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 47e085e9..0a89e558 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -1,7 +1,5 @@
 {% extends 'admin/base.html' %}
-{% block title %} Beatmaps {% endblock %}
-
-{% block content %}
+{% block header %}
 <style>
     .rounded-sm {
         border-radius: 7px !important;
@@ -42,6 +40,10 @@
         font-size: 12px
     }
 </style>
+{% endblock %}
+{% block title %} Beatmaps {% endblock %}
+
+{% block content %}
 <script>
     var api_key = '{{ session.user_data['api_key'] }}'
 </script>
diff --git a/templates/admin/home.html b/templates/admin/home.html
index c2ad4241..59185e5d 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -7,6 +7,11 @@
 <script>
     var domain = "{{ domain() }}";
 </script>
+<style>
+    .card .title, .card .stat {
+        font-size: 12px
+    }
+</style>
 {% endblock%}
 
 {% block content %}
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index b7685db7..ce8a064a 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -1,7 +1,5 @@
 {% extends 'admin/base.html' %}
-{% block title %} Restrictions {% endblock %}
-
-{% block content %}
+{% block header %}
 <style>
     .text-nowrap {
         white-space: nowrap;
@@ -16,6 +14,10 @@
         grid-gap: 1em 1em;
     }
 </style>
+{% endblock %}
+{% block title %} Restrictions {% endblock %}
+
+{% block content %}
 <div class="columns is-marginless">
     <div class="column is-paddingless is-avatar">
       <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
diff --git a/templates/admin/users.html b/templates/admin/users.html
index fcd2c8d5..58a3e167 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -1,7 +1,5 @@
 {% extends 'admin/base.html' %}
-{% block title %} Users {% endblock %}
-
-{% block content %}
+{% block header %}
 <style>
     .text-nowrap {
         white-space: nowrap;
@@ -19,6 +17,10 @@
         grid-gap: 1em 1em;
     }
 </style>
+{% endblock %}
+{% block title %} Users {% endblock %}
+
+{% block content %}
 <div class="columns is-marginless">
     <div class="column is-paddingless is-avatar">
         <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
diff --git a/templates/admin/users_edit.html b/templates/admin/users_edit.html
index 3ad34c7d..3077525f 100644
--- a/templates/admin/users_edit.html
+++ b/templates/admin/users_edit.html
@@ -1,7 +1,5 @@
 {% extends 'admin/base.html' %} 
-{% block title %} Users {% endblock %} 
-
-{% block content %} 
+{% block header %}
 <style>
     .text-nowrap {
         white-space: nowrap;
@@ -10,6 +8,10 @@
         width: 100%;
     }
 </style>
+{% endblock %} 
+{% block title %} Users {% endblock %} 
+
+{% block content %} 
 <form action="/admin/users/update/{{ search_data['id'] }}" method="POST" id="edit-user">
     <div style="display: flex; align-items: center; flex-direction: column;">
         <article style="width: 40%;" class="panel is-primary">

From 49655eb5609ebb1fffd45b33d4d661bd94039b82 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 31 Jul 2022 05:23:01 +0000
Subject: [PATCH 140/278] update icon

---
 templates/admin/users_edit.html | 22 ++++++++++++++--------
 1 file changed, 14 insertions(+), 8 deletions(-)

diff --git a/templates/admin/users_edit.html b/templates/admin/users_edit.html
index 3077525f..726b69db 100644
--- a/templates/admin/users_edit.html
+++ b/templates/admin/users_edit.html
@@ -7,6 +7,12 @@
     .w-100 {
         width: 100%;
     }
+    .ml-auto {
+        margin-left: auto;
+    }
+    .gap-2 {
+        gap: 0.5em;
+    }
 </style>
 {% endblock %} 
 {% block title %} Users {% endblock %} 
@@ -19,8 +25,8 @@
             Edit Info of {{ search_data['name'] }}
             </p>
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">
-                    <i class="fas fa-user" aria-hidden="true"></i>
+                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+                    <i class="fas fa-id-card" aria-hidden="true"></i>
                     Username
                 </div>
                 <div class="column">
@@ -28,8 +34,8 @@
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">
-                    <i class="fas fa-user" aria-hidden="true"></i>
+                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+                    <i class="fas fa-envelope" aria-hidden="true"></i>
                     Email
                 </div>
                 <div class="column">
@@ -37,8 +43,8 @@
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">
-                    <i class="fas fa-user" aria-hidden="true"></i>
+                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+                    <i class="fas fa-globe-americas" aria-hidden="true"></i>
                     Country
                 </div>
                 <div class="column">
@@ -46,8 +52,8 @@
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">
-                    <i class="fas fa-user" aria-hidden="true"></i>
+                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+                    <i class="fas fa-ban"  aria-hidden="true"></i>
                     Legality
                 </div>
                 <div class="column">

From 80b03b67d12ef470b64f1981acef6abebe53b961 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Sun, 31 Jul 2022 05:25:53 +0000
Subject: [PATCH 141/278] fix status frozen and color

---
 blueprints/admin.py           | 4 ++--
 templates/admin/beatmaps.html | 8 +++++---
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 0b8b2f65..83489a7b 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -99,9 +99,9 @@ async def beatmaps_edit(bid:int):
     status = request.args.get('status', type=int)
     is_set = request.args.get('set', type=int) == 1
     if is_set:
-        await glob.db.execute("UPDATE maps SET status=%s WHERE set_id=%s", [str(status), str(bid)])
+        await glob.db.execute("UPDATE maps SET frozen=1, status=%s WHERE set_id=%s", [str(status), str(bid)])
     else:
-        await glob.db.execute("UPDATE maps SET status=%s WHERE id=%s", [str(status), str(bid)])
+        await glob.db.execute("UPDATE maps SET frozen=1, status=%s WHERE id=%s", [str(status), str(bid)])
 
     query = await glob.db.fetch(
         'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index fe71a319..18641215 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -146,13 +146,15 @@ <h2 class="section-title">Beatmaps</h2>
                         {{ i.bpm }}
                     </td>
                     <td class="!bigger_td my-auto has-text-right">
-                        {{ i.stars }}
+                        {{ i.stars }} {{ i.status }}
                     </td>
                     <td class="!bigger_td my-auto has-text-centered">
                         <div class="tag
                         {% if i.status == 2 %} is-primary
-                        {% elif i.status == 3 %} is-info
-                        {% elif i.status == 4 %} is-success {% endif %}
+                        {% elif i.status == 3 %} is-warning
+                        {% elif i.status == 4 %} is-success 
+                        {% elif i.status == 5 %} is-danger 
+                        {% endif %}
                         ">{{ decode_map_status(i.status) }}</div>
                     </td>
                     <td class="!bigger_td my-auto has-text-centered">

From 21e29e8532ca33254e4534e18b0b4d7b58e98c93 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Sun, 31 Jul 2022 05:26:29 +0000
Subject: [PATCH 142/278] remove debug

---
 templates/admin/beatmaps.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index cb40127b..39c948a1 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -151,7 +151,7 @@ <h2 class="section-title">Beatmaps</h2>
                         {{ i.bpm }}
                     </td>
                     <td class="!bigger_td my-auto has-text-right">
-                        {{ i.stars }} {{ i.status }}
+                        {{ i.stars }}
                     </td>
                     <td class="!bigger_td my-auto has-text-centered">
                         <div class="tag

From d9dd4fbbd3adce8479c79793a8f0daf17ddbb223 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 31 Jul 2022 05:28:00 +0000
Subject: [PATCH 143/278] table

---
 templates/admin/restrictions.html | 24 ++++++++++++++++--------
 1 file changed, 16 insertions(+), 8 deletions(-)

diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index ce8a064a..df0a8ce3 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -35,23 +35,31 @@ <h2 class="section-title">Restrictions</h2>
                 <table class="table card-table table-vcenter text-nowrap datatable rounded">
                     <thead>
                         <tr>
-                            <th>ID</th>
-                            <th>Username</th>
-                            <th>Details</th>
-                            <th>Date</th>
-                            <th>Action</th>
+                            <th class="has-text-right">ID</th>
+                            <th>Flag | Username</th>
+                            <th class="has-text-centered">Details</th>
+                            <th class="has-text-centered">Date</th>
+                            <th class="has-text-centered">Action</th>
                         </tr>
                     </thead>
                     <tbody>
                         {% for i in query_data %}
                         <tr>
-                            <td>{{ i.id }}</td>
+                            <td class="has-text-right">{{ i.id }}</td>
                             <td class="td-truncate text-nowrap">
                                 <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
                                 <a href="/u/{{ i.id }}">{{ i.name }}</a>
                             </td>
-                            <td>{{ i.msg }}</td>
-                            <td>{{ i.time }}</td>
+                            <td>
+                                {% if i.msg %}{{ i.msg }}
+                                {% else %} -
+                                {% endif %}
+                            </td>
+                            <td class="has-text-centered">
+                                {% if i.time %}{{ i.time }}
+                                {% else %} -
+                                {% endif %}
+                            </td>
                             <td>
                                 <a class="btn text-nowrap" href="/admin/users/edit/{{ i.id }}">
                                     <i class="far fa-edit" aria-hidden="true"></i>⠀Edit

From b16eb1519678d0ed986bf7f889aa04d6f848c1ed Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Sun, 31 Jul 2022 05:40:14 +0000
Subject: [PATCH 144/278] forget diffname

---
 templates/admin/beatmaps.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 39c948a1..f264036c 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -128,7 +128,7 @@ <h2 class="section-title">Beatmaps</h2>
                                 <a class="play-detail__title">{{ i.title }}
                                     <small style="display: inline;">by {{ i.creator }}</small>
                                 </a>
-                                <span style="color: #ea0; font-size: 14px; display: block;">Skystar's Tragic Love Extra</span>
+                                <span style="color: #ea0; font-size: 14px; display: block;">{{ i.diff_name }}</span>
                                 <div style="font-size: 14px; position: absolute;bottom: 1em; right: 1em; opacity: 0.7;">
                                     bid: <span style="color: #ea0;">{{ i.map_id }}</span>
                                 </div>

From 3425a17dfb2b78d5f716c22f5625176abeb22ea0 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 31 Jul 2022 06:25:08 +0000
Subject: [PATCH 145/278] lots of style and i18n

---
 static/css/pages/leaderboard.css  | 37 +++++++++++++++++++++++++------
 static/css/pages/profile.css      | 13 ++++++-----
 templates/admin/restrictions.html |  6 ++---
 templates/leaderboard.html        | 18 +++++++--------
 templates/profile.html            | 15 ++++++++-----
 5 files changed, 60 insertions(+), 29 deletions(-)

diff --git a/static/css/pages/leaderboard.css b/static/css/pages/leaderboard.css
index 9f94ad27..0bd015d8 100644
--- a/static/css/pages/leaderboard.css
+++ b/static/css/pages/leaderboard.css
@@ -85,7 +85,7 @@ tr td {
   width: 100%;
 }
 
-.t-column:first-child {
+/* .t-column:first-child {
   border-top-left-radius: 6px;
   border-bottom-left-radius: 6px;
 }
@@ -93,8 +93,22 @@ tr td {
 .t-column:last-child {
   border-top-right-radius: 6px;
   border-bottom-right-radius: 6px;
+} */
+/* what left beyond this line are clearly not working */
+.leaderboard-column:first-of-type .column-player-rank {
+  border-top-left-radius: 6px;
+}
+.leaderboard-column:first-of-type td:last-of-type {
+  border-top-right-radius: 6px;
+}
+.leaderboard-column:last-of-type .column-player-rank {
+  border-bottom-left-radius: 6px;
+}
+.leaderboard-column:last-of-type td:last-of-type {
+  border-bottom-right-radius: 6px;
 }
 
+
 tr.leaderboard-column td {
   font-weight: 600;
   border-bottom: hsl(var(--main), 20%, 30%);
@@ -126,7 +140,7 @@ table th {
   height: 232px;
 }
 
-.main-banner > * {
+.main-banner>* {
   z-index: 2;
 }
 
@@ -225,7 +239,7 @@ table th {
   border-top-left-radius: 8px;
 }
 
-.leaderboard-table > tbody {
+.leaderboard-table>tbody {
   transition: 0.2s opacity;
 }
 
@@ -239,9 +253,11 @@ table th {
   .mode-icon {
     display: none;
   }
+
   .main-banner {
     padding: 0px 12px;
   }
+
   .banner-text {
     font-size: 36px;
   }
@@ -262,10 +278,15 @@ table th {
   margin-top: -41px;
   margin-left: -41px;
 }
-.popover-body, .tooltip-inner, .flag-dropdown {
+
+.popover-body,
+.tooltip-inner,
+.flag-dropdown {
   font-size: 12px;
 }
-.flag-dropdown, .noUi-tooltip {
+
+.flag-dropdown,
+.noUi-tooltip {
   background-color: hsl(var(--main), 15%, 5%) !important;
   filter: opacity(0.95);
   border-radius: 4px;
@@ -285,7 +306,9 @@ table th {
   font-weight: 600;
   font-style: normal;
 }
-.user-flag:hover>.flag-dropdown, .player-flag:hover>.flag-dropdown {
+
+.user-flag:hover>.flag-dropdown,
+.player-flag:hover>.flag-dropdown {
   visibility: visible;
   opacity: 1;
-}
+}
\ No newline at end of file
diff --git a/static/css/pages/profile.css b/static/css/pages/profile.css
index 417c0b7a..39b0be65 100644
--- a/static/css/pages/profile.css
+++ b/static/css/pages/profile.css
@@ -282,7 +282,6 @@ html {
   transition: 0.2s ease;
   cursor: pointer;
 }
-
 .map-data {
   height: 72px;
   min-width: 100%;
@@ -298,6 +297,14 @@ html {
   cursor: pointer;
 }
 
+.map-single:first-child {
+  margin-top: 0;
+  border-radius: 8px 8px 0 0;
+}
+.map-single:last-child {
+  margin-top: 0;
+  border-radius: 0 0 8px 8px;
+}
 .map-single:hover {
   border-radius: 8px;
   transform: translateY(-1px);
@@ -306,10 +313,6 @@ html {
   background: hsl(var(--main), 30%, 30%);
 }
 
-.map-single:first-child {
-  margin-top: 0;
-}
-
 .map-content1 {
   display: flex;
   flex-direction: row;
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index df0a8ce3..93b4f02d 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -30,9 +30,9 @@ <h2 class="section-title">Restrictions</h2>
 </div>
 <div class="row row-deck row-cards" style="margin-top: 20px">
     <div class="col-12">
-        <div class="card">
+        <!-- <div class="card"> -->
             <div class="table-responsive">
-                <table class="table card-table table-vcenter text-nowrap datatable rounded">
+                <table class="table table-vcenter text-nowrap datatable rounded">
                     <thead>
                         <tr>
                             <th class="has-text-right">ID</th>
@@ -70,7 +70,7 @@ <h2 class="section-title">Restrictions</h2>
                     </tbody>
                 </table>
             </div>
-        </div>
+        <!-- </div> -->
     </div>
 </div>
 
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index 75f9ccb1..2855ee99 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -69,8 +69,8 @@
                             <th class="t-heading"> </th>
                             <th class="t-heading t-heading--main"></th>
                             <th v-if="sort == 'pp' || sort == 'rscore'" class="t-heading table--selected">
-                                <% (sort=='pp' ? "PP" : "" ) %>
-                                    <% (sort=='rscore' ? "Score" : "" ) %>
+                                <% (sort=='pp' ? "{{ t('global.pp').upper() }}" : "" ) %>
+                                    <% (sort=='rscore' ? "{{ t('global.score') }}" : "" ) %>
                             </th>
                             <th class="t-heading"> {{ t('global.accuracy') }} </th>
                             <th class="t-heading"> {{ t('global.playcount') }} </th>
@@ -82,7 +82,7 @@
                         <tr v-for="(user, index) in boards" class="leaderboard-column">
                             <td class="column-player-rank">#<% index + 1 %>
                             </td>
-                            <td class="column-player-name text-left">
+                            <td class="column-player-name has-text-left">
                                 <a :title="flags[user.country.toUpperCase()]"
                                     :style="'background-image: url(/static/images/flags/' + user.country.toUpperCase() + '.png)'"
                                     class="player-flag">
@@ -94,20 +94,20 @@
                                     <% user.name %>
                                 </a>
                             </td>
-                            <td v-if="sort == 'pp' || sort == 'rscore'">
-                                <% (sort=='pp' ? user.pp+'pp' : "" ) %>
+                            <td v-if="sort == 'pp' || sort == 'rscore'" class="has-text-right pr-3">
+                                <% (sort=='pp' ? addCommas(user.pp) : "" ) %>
                                     <% (sort=='rscore' ? scoreFormat(user.rscore) : "" ) %>
                             </td>
-                            <td>
+                            <td class="has-text-right pr-3">
                                 <% user.acc.toFixed(2) %>%
                             </td>
-                            <td>
+                            <td class="has-text-right pr-3">
                                 <% addCommas(user.plays) %>
                             </td>
-                            <td>
+                            <td class="has-text-right pr-3">
                                 <% addCommas(user.max_combo) %>
                             </td>
-                            <td>
+                            <td class="has-text-right pr-3">
                                 <% secondsToDhm(user.playtime) %>
                             </td>
                         </tr>
diff --git a/templates/profile.html b/templates/profile.html
index dbe77cbe..fdc99e90 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -38,7 +38,7 @@
                         <div class="score-details_right-block">
                             <div class="score-details_pp-block">
                                 <div class="map-pp">
-                                    <% map.pp.toFixed() %><span class="map-pp-unit">{{ t('global.pp').upper() }}</span>
+                                    <% map.pp.toFixed() %> <span class="map-pp-unit">{{ t('global.pp') }}</span>
                                 </div>
                                 <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
                                         <% map.acc.toFixed(2) %>%
@@ -47,7 +47,7 @@
                             <div class="score-details_grade-block">
                                 <div class="rank-single">
                                     <div v-bind:class="'map-rank rank-'+map.grade">
-                                        <% map.grade.replace("X", "SS" ).replace("H", "" ) %>
+                                        <% map.grade.replace("X", "SS").replace("H", "") %>
                                     </div>
                                 </div>
                             </div>
@@ -69,7 +69,7 @@ <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
         </div>
     </div>
     <div v-if="data.scores.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button" @click="AddLimit('{{ id }}score')">{{ t('profile.show-more') }}</a>
+        <a class="show-button rounded-sm" @click="AddLimit('{{ id }}score')">{{ t('profile.show-more') }}</a>
     </div>
 </div>
 {% endmacro %}
@@ -82,7 +82,7 @@ <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
         </div>
     </div>
     <div v-if="data.maps.{{ id }}.out.length != 0" class="beatmaps">
-        <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block">
+        <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block rounded-sm">
             <div class="beatmap-preview"
                 v-bind:style='{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }'>
             </div>
@@ -117,7 +117,7 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
         </div>
     </div>
     <div v-if="data.maps.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button" @click="AddLimit('mostplay')">{{ t('profile.show-more') }}</a>
+        <a class="show-button rounded-sm" @click="AddLimit('mostplay')">{{ t('profile.show-more') }}</a>
     </div>
 </div>
 {% endmacro %}
@@ -134,6 +134,11 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
     var mods = '{{ mods }}';
     var domain = "{{ domain() }}";
 </script>
+<style>
+    .rounded-sm {
+        border-radius: 8px;
+    }
+</style>
 {% endblock %}
 
 {% block content %}

From 14f6112270eeee5586d71c2ea97e7ec2865e2de6 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Sun, 31 Jul 2022 09:29:02 +0000
Subject: [PATCH 146/278] add style to loading status

---
 static/js/main.js             | 11 ++++++++++-
 templates/admin/beatmaps.html |  2 +-
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/static/js/main.js b/static/js/main.js
index 3ba7025e..05af04e8 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -59,9 +59,18 @@ function map_admin_search(name) {
 
 function map_admin_force_update(sid) {
     var bar = document.getElementById('progress_bar')
+    var elements = document.getElementsByClassName('operate-button');
     bar.style=""
+    Array.prototype.forEach.call(elements, function (element) {
+        element.classList.add('is-disabled')
+    });
     $.get('//api.' + the_domain + '/update_beatmapsets?api_key=' + api_key + '&sid=' + sid, function(data, status) {
         bar.style="display: none;"
-        alert('finished')
+        Array.prototype.forEach.call(elements, function (element) {
+            element.classList.remove('is-disabled')
+        });
+        if (status == 'success') {
+            window.location.href='/admin/beatmaps/search?sid=' + data['sid']
+        }
     })
 }
\ No newline at end of file
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index f264036c..2c513ea6 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -184,7 +184,7 @@ <h2 class="section-title">Beatmaps</h2>
                                     <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">Approve BeatmapSet</a>
                                     <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">Pending BeatmapSet</a>
                                     <hr class="dropdown-divider">
-                                    <a class="dropdown-item" href="javascript:void(0);" onclick="map_admin_force_update({{ i.set_id }})">
+                                    <a class="dropdown-item operate-button" href="javascript:void(0);" onclick="map_admin_force_update({{ i.set_id }})">
                                         Sync Beatmapsets with Bancho
                                     </a>
                                 </div>

From 1584df7a07ebf9416c73f9d981a99b4b2c56a5eb Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Mon, 1 Aug 2022 02:27:52 +0000
Subject: [PATCH 147/278] add about me

---
 blueprints/frontend.py          | 37 +++++++++++++++++++++---
 templates/profile.html          | 42 ++++++++++++++++++++-------
 templates/settings/aboutme.html | 50 +++++++++++++++++++++++++++++++++
 templates/settings/sidebar.html |  3 ++
 4 files changed, 118 insertions(+), 14 deletions(-)
 create mode 100644 templates/settings/aboutme.html

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 7a878107..45723b39 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -14,6 +14,7 @@
 from functools import wraps
 from PIL import Image
 from pathlib import Path
+import markdown
 from quart import Blueprint
 from quart import redirect
 from quart import render_template
@@ -219,6 +220,33 @@ async def settings_custom_post():
 
     return await flash_with_customizations('success', t('settings.change-succeed', something = t('settings.customization').lower()), 'settings/custom')
 
+@frontend.route('/settings/aboutme')
+@login_required
+async def settings_aboutme():
+    user = await glob.db.fetch(
+        'SELECT userpage_content FROM users WHERE id = %s',
+        [session['user_data']['id']]
+    )
+    return await render_template('settings/aboutme.html', userpage_content=user['userpage_content'])
+
+@frontend.route('/settings/aboutme', methods=['POST'])
+@login_required
+async def settings_aboutme_post():
+    form = await request.form
+    userpage_content = form.get('userpage_content', type=str)
+    old_content = (await glob.db.fetch('SELECT userpage_content FROM users WHERE id = %s', [session['user_data']['id']]))['userpage_content']
+    if '<iframe' in userpage_content or '<script' in userpage_content:
+        return await render_template('settings/aboutme.html', flash='Not allowed method', status='error', userpage_content=old_content)
+    if (len(userpage_content) > 2048):
+        return await render_template('settings/aboutme.html', flash='Too long text', status='error', userpage_content=old_content)
+    await glob.db.execute(
+            'UPDATE users '
+            'SET userpage_content = %s '
+            'WHERE id = %s',
+            [userpage_content, session['user_data']['id']]
+        )
+    session['user_data']['userpage_content'] = userpage_content
+    return await render_template('settings/aboutme.html', userpage_content=userpage_content)
 
 @frontend.route('/settings/password')
 @login_required
@@ -307,14 +335,14 @@ async def profile_select(id):
     mode = request.args.get('mode', 'std', type=str) # 1. key 2. default value
     mods = request.args.get('mods', 'vn', type=str)
     user_data = await glob.db.fetch(
-        'SELECT name, safe_name, id, priv, country '
+        'SELECT name, safe_name, id, priv, country, userpage_content '
         'FROM users '
         'WHERE safe_name = %s OR id = %s LIMIT 1',
         [utils.get_safe_name(id), id]
     )
 
-    # no user
-    if not user_data:
+    # no user and no bot page
+    if not user_data or user_data["id"] == 1:
         return (await render_template('404.html'), 404)
 
     # make sure mode & mods are valid args
@@ -364,7 +392,7 @@ async def login_post():
     # check if account exists
     user_info = await glob.db.fetch(
         'SELECT id, name, email, priv, '
-        'pw_bcrypt, silence_end, api_key '
+        'pw_bcrypt, silence_end, api_key, userpage_content '
         'FROM users '
         'WHERE safe_name = %s',
         [utils.get_safe_name(username)]
@@ -431,6 +459,7 @@ async def login_post():
         'priv': user_info['priv'],
         'api_key': api_key,
         'silence_end': user_info['silence_end'],
+        'userpage_content': user_info['userpage_content'],
         'is_staff': user_info['priv'] & Privileges.Staff != 0,
         'is_bn': user_info['priv'] & Privileges.Nominator != 0,
         'is_donator': user_info['priv'] & Privileges.Donator != 0
diff --git a/templates/profile.html b/templates/profile.html
index fdc99e90..3708c5a2 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -1,6 +1,23 @@
 {% extends 'base.html' %}
 {% block title %} {{ t('global.profile') }} {% endblock %}
 
+{% macro userpage(user) %}
+    {% if user['userpage_content'] != None and user['userpage_content'] != "" %}
+        <div class="log-block">
+            <div class="header">
+                <div class="title">
+                    <i class="fas fa-address-book"></i> About me
+                </div>
+            </div>
+            <div class="stats-block rank-block" style="padding: 12.5px;">
+                <article>
+                    {{ user['userpage_content']|safe }}
+                </article>
+            </div>
+        </div>
+    {% endif %}
+{% endmacro %}
+
 {% macro scores(title, id) %}
 <div class="log-block" v-bind:class="{ 'load' : data.scores.{{ id }}.load }">
     <div class="header">
@@ -210,6 +227,20 @@ <h1 class="title">
     <div class="second-block">
         <div class="columns is-marginless two-sides">
             <div class="column is-one-third" v-cloak>
+                <div class="header">
+                    <div class="title">
+                        <i class="fas fa-user-friends"></i> Badge
+                    </div>
+                </div>
+                <div class="stats-block rank-block">
+                    <table class="is-striped">
+                        <tbody>
+                            <tr>
+                                <td>Not yet implement</td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
                 <div class="header" v-if='data.stats.out[modegulag].rank != 0'>
                     <div class="title">
                         <i class="fas fa-user-friends"></i> Rank
@@ -330,18 +361,9 @@ <h1 class="title">
                         </article>
                     </div>
                 </div>
-                <!--<div class="level-block">
-                    <div class="columns is-marginless is-2">
-                        <div class="column level-bar is-paddingless">
-                            <div class="progress-level"></div>
-                        </div>
-                        <div class="column level-num is-one-fifth is-textcen">
-                            <% data.stats[`level_${modegulag}`] %>
-                        </div>
-                    </div>
-                </div>-->
             </div>
             <div class="column">
+                {{ userpage(user) }}
                 {{ scores(t('profile.best-scores')  , 'best')}}
                 {{ scores(t('profile.recent-scores'), 'recent')}}
                 {{ maps(t('profile.most-played-beatmaps'), 'most')}}
diff --git a/templates/settings/aboutme.html b/templates/settings/aboutme.html
new file mode 100644
index 00000000..402b9427
--- /dev/null
+++ b/templates/settings/aboutme.html
@@ -0,0 +1,50 @@
+{% extends 'base.html' %}
+{% block title %} {{ t('global.password') }} {% endblock %}
+
+{% block content %}
+<link rel="stylesheet" href="/static/css/pages/settings/style.css">
+
+<div class="main-block">
+  {% include "settings/sidebar.html" %}
+  <div class="block-content right" id="settings-content">
+    <div id="general" class="single-right-block">
+      <div class="right-block-header">
+          About Me
+      </div>
+      <form style=" margin-left: 20px; margin-right: 20px;" action="/settings/aboutme" method="post" class="right-block-content">
+        <textarea name="userpage_content" class="input" style="max-width: 800px; min-height: 300px;">{{ userpage_content }}</textarea>
+        <button style="margin-top: 10px" class='button is-primary' type='submit'><span>{{ t('settings.save') }}</span><span class='icon is-small'><i class='fas fa-check'></i></span></button>
+      </form>
+    </div>
+  </div>
+</div>
+{% if flash %}
+<div class='noti-banner noti-banner-warning'>
+  <div class="container">
+    <div class="noti-column">
+      <div class='noti-col noti-col-icon'></div>
+      <div class='noti-col noti-col-label'>
+        <div class='noti-bannertype'>
+          {% if status=='error' %}
+            {{ t('global.warning') }}
+          {% elif status=='success' %}
+            {{ t('global.notice') }}
+          {% endif %}
+        </div>
+        <div class='noti-bannertext'>
+          {% if status=='error' %}
+            {{ t('global.error') }}
+          {% elif status=='success' %}
+            {{ t('global.success') }}
+          {% endif %}
+        </div>
+      </div>
+      <div class='noti-banner-text'>
+        {{ flash }}
+      </div>
+    </div>
+  </div>
+</div>
+{% endif %}
+
+{% endblock %}
\ No newline at end of file
diff --git a/templates/settings/sidebar.html b/templates/settings/sidebar.html
index 29967afb..9ba41262 100644
--- a/templates/settings/sidebar.html
+++ b/templates/settings/sidebar.html
@@ -20,5 +20,8 @@
         <a class="single-menu single-menu--active router-link" href="/settings/custom">
             <i class="fas fa-air-freshener"></i><span class="single-menu--text"> {{ t('settings.customisation') }} </span>
         </a>
+        <a class="single-menu single-menu--active router-link" href="/settings/aboutme">
+            <i class="fas fa-air-freshener"></i><span class="single-menu--text">About Me</span>
+        </a>
     </div>
 </div>

From 8952d31fc2fd4039d55aaa57ce5509ce7927ffc0 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Mon, 1 Aug 2022 02:29:01 +0000
Subject: [PATCH 148/278] markdown is not needed

---
 blueprints/frontend.py | 1 -
 1 file changed, 1 deletion(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 45723b39..b593deff 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -14,7 +14,6 @@
 from functools import wraps
 from PIL import Image
 from pathlib import Path
-import markdown
 from quart import Blueprint
 from quart import redirect
 from quart import render_template

From 09a464c2a1598155490a462187789d231d5a35aa Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 1 Aug 2022 05:30:36 +0000
Subject: [PATCH 149/278] animations

---
 static/css/bulma.css                | 36 +++++------
 static/css/pages/admin/style.css    | 30 ++++-----
 static/css/pages/auth.css           |  2 +-
 static/css/pages/leaderboard.css    | 18 +++---
 static/css/pages/profile.css        | 99 +++++++++++++++++------------
 static/css/pages/settings/style.css | 38 +++++------
 static/css/pages/verify.css         |  2 +-
 static/css/style.css                | 20 ++----
 static/js/pages/profile.js          | 69 ++++++++++++--------
 templates/profile.html              | 14 ++--
 10 files changed, 175 insertions(+), 153 deletions(-)

diff --git a/static/css/bulma.css b/static/css/bulma.css
index c859a7c8..1dbe6c6e 100644
--- a/static/css/bulma.css
+++ b/static/css/bulma.css
@@ -1742,7 +1742,7 @@ print {
 
 .box {
     background-color: hsl(var(--main), 10%, 15%);
-    border-radius: 8px;
+    border-radius: 0.5em;
     box-shadow: none;
     color: #fff;
     display: block;
@@ -6373,8 +6373,8 @@ print {
 
 .modal-card-head {
     border-bottom: 1px solid #5e6d6f;
-    border-top-left-radius: 8px;
-    border-top-right-radius: 8px
+    border-top-left-radius: 0.5em;
+    border-top-right-radius: 0.5em
 }
 
 .modal-card-title {
@@ -6386,8 +6386,8 @@ print {
 }
 
 .modal-card-foot {
-    border-bottom-left-radius: 8px;
-    border-bottom-right-radius: 8px;
+    border-bottom-left-radius: 0.5em;
+    border-bottom-right-radius: 0.5em;
     border-top: 1px solid #5e6d6f
 }
 
@@ -6485,7 +6485,7 @@ html.has-navbar-fixed-bottom {
     background-color: currentColor;
     display: block;
     height: 1px;
-    left: calc(50% - 8px);
+    left: calc(50% - 0.5em);
     position: absolute;
     transform-origin: center;
     transition-duration: 86ms;
@@ -6644,7 +6644,7 @@ a.navbar-item:hover {
 
     .navbar-menu {
         background-color: hsl(var(--main), 45%, 45%);
-        box-shadow: 0 8px 16px rgba(10, 10, 10, .1);
+        box-shadow: 0 0.5em 16px rgba(10, 10, 10, .1);
         padding: .5rem 0
     }
 
@@ -6775,10 +6775,10 @@ a.navbar-item:hover {
 
     .navbar-item.has-dropdown-up .navbar-dropdown {
         border-bottom: 1px solid rgba(0, 0, 0, .2);
-        border-radius: 8px 8px 0 0;
+        border-radius: 0.5em 0.5em 0 0;
         border-top: none;
         bottom: 100%;
-        box-shadow: 0 -8px 8px rgba(10, 10, 10, .1);
+        box-shadow: 0 -0.5em 0.5em rgba(10, 10, 10, .1);
         top: auto
     }
 
@@ -6819,10 +6819,10 @@ a.navbar-item:hover {
 
     .navbar-dropdown {
         background-color: hsl(var(--main), 45%, 45%);
-        border-bottom-left-radius: 8px;
-        border-bottom-right-radius: 8px;
+        border-bottom-left-radius: 0.5em;
+        border-bottom-right-radius: 0.5em;
         border-top: 1px solid rgba(0, 0, 0, .2);
-        box-shadow: 0 8px 8px rgba(10, 10, 10, .1);
+        box-shadow: 0 0.5em 0.5em rgba(10, 10, 10, .1);
         display: none;
         font-size: .875rem;
         left: 0;
@@ -6843,9 +6843,9 @@ a.navbar-item:hover {
 
     .navbar-dropdown.is-boxed,
     .navbar.is-spaced .navbar-dropdown {
-        border-radius: 8px;
+        border-radius: 0.5em;
         border-top: none;
-        box-shadow: 0 8px 8px rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .1);
+        box-shadow: 0 0.5em 0.5em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .1);
         display: block;
         opacity: 0;
         pointer-events: none;
@@ -7109,7 +7109,7 @@ print {
 }
 
 .panel {
-    border-radius: 8px;
+    border-radius: 0.5em;
     box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .02);
     font-size: 15px;
     background: hsl(var(--main), 15%, 12%)
@@ -7251,7 +7251,7 @@ print {
 
 .panel-heading {
     background-color: hsl(var(--main), 10%, 15%);
-    border-radius: 8px 8px 0 0;
+    border-radius: 0.5em 0.5em 0 0;
     color: #f2f2f2;
     font-size: 1.25em;
     line-height: 1.25;
@@ -7310,8 +7310,8 @@ print {
 }
 
 .panel-block:last-child {
-    border-bottom-left-radius: 8px;
-    border-bottom-right-radius: 8px
+    border-bottom-left-radius: 0.5em;
+    border-bottom-right-radius: 0.5em
 }
 
 a.panel-block,
diff --git a/static/css/pages/admin/style.css b/static/css/pages/admin/style.css
index 23ce492b..4725366d 100644
--- a/static/css/pages/admin/style.css
+++ b/static/css/pages/admin/style.css
@@ -58,7 +58,7 @@
 
 .sidebar .nav li>a+div .nav li>a {
     margin-top: 0;
-    padding: 8px 8px
+    padding: 0.5em 0.5em
 }
 
 .sidebar .nav li>a {
@@ -223,7 +223,7 @@ li {
 }
 
 .card {
-    border-radius: 8px;
+    border-radius: 0.5em;
     color: #fff;
     padding: 10px;
     position: relative;
@@ -233,7 +233,7 @@ li {
 
 .card .stat {
     border-top: 1px solid rgba(255, 255, 255, .3);
-    font-size: 8px;
+    font-size: 0.5em;
     margin-top: 6px;
     padding: 10px 10px 0;
     text-transform: uppercase
@@ -241,7 +241,7 @@ li {
 
 .card .title {
     display: inline-block;
-    font-size: 8px;
+    font-size: 0.5em;
     padding: 10px 10px 0;
     text-transform: uppercase
 }
@@ -269,14 +269,14 @@ li {
 
 .user-block {
     display: flex;
-    border-radius: 8px;
+    border-radius: 0.5em;
     padding: 12px;
     font-weight: 700;
     line-height: 1.3;
     align-items: center;
     overflow: hidden;
     height: 76px;
-    margin-top: 8px
+    margin-top: 0.5em
 }
 
 .user-block {
@@ -285,7 +285,7 @@ li {
 }
 
 .user-block:hover {
-    box-shadow: 0 0 1px rgba(0, 0, 0, .04), 0 4px 8px rgba(0, 0, 0, .04), 0 16px 24px rgba(0, 0, 0, .04), 0 24px 32px rgba(0, 0, 0, .04);
+    box-shadow: 0 0 1px rgba(0, 0, 0, .04), 0 4px 0.5em rgba(0, 0, 0, .04), 0 16px 24px rgba(0, 0, 0, .04), 0 24px 32px rgba(0, 0, 0, .04);
     color: #fff;
     transform: translateY(-5px)
 }
@@ -293,7 +293,7 @@ li {
 .avatar-picture {
     width: 58px;
     border-radius: 6px;
-    margin-right: 8px
+    margin-right: 0.5em
 }
 
 .profile-flag {
@@ -324,7 +324,7 @@ li {
     display: flex;
     justify-content: space-between;
     align-items: baseline;
-    margin-top: 8px;
+    margin-top: 0.5em;
     font-size: 16px;
     font-weight: 600;
     color: #fff;
@@ -354,7 +354,7 @@ li {
 }
 
 span.user-mapper {
-    padding-right: 8px
+    padding-right: 0.5em
 }
 
 .d-flex.align-items-baseline {
@@ -374,9 +374,9 @@ span.user-mapper {
     flex-direction: row;
     align-items: center;
     padding-right: 0;
-    margin: 8px 0 0 0;
-    padding: 8px;
-    border-radius: 8px;
+    margin: 0.5em 0 0 0;
+    padding: 0.5em;
+    border-radius: 0.5em;
     overflow: hidden;
     background: #413030;
     transition: .2s ease;
@@ -384,9 +384,9 @@ span.user-mapper {
 }
 
 .map-single:hover {
-    border-radius: 8px;
+    border-radius: 0.5em;
     transform: translateY(-5px);
-    box-shadow: 0 0 1px rgba(0, 0, 0, .04), 0 4px 8px rgba(0, 0, 0, .04), 0 16px 24px rgba(0, 0, 0, .04), 0 24px 32px rgba(0, 0, 0, .04)
+    box-shadow: 0 0 1px rgba(0, 0, 0, .04), 0 4px 0.5em rgba(0, 0, 0, .04), 0 16px 24px rgba(0, 0, 0, .04), 0 24px 32px rgba(0, 0, 0, .04)
 }
 
 .map-content1 {
diff --git a/static/css/pages/auth.css b/static/css/pages/auth.css
index 96bfeefd..e58f3ffa 100644
--- a/static/css/pages/auth.css
+++ b/static/css/pages/auth.css
@@ -8,7 +8,7 @@
     flex-direction: column;
     padding: 21px 22px;
     position: relative;
-    border-radius: 8px;
+    border-radius: 0.5em;
 }
 
 .title-block{
diff --git a/static/css/pages/leaderboard.css b/static/css/pages/leaderboard.css
index 0bd015d8..f8e8cd58 100644
--- a/static/css/pages/leaderboard.css
+++ b/static/css/pages/leaderboard.css
@@ -19,8 +19,8 @@ a:hover {
   background-color: hsl(var(--main), 30%, 50%);
   height: 194px;
   border-radius: 0;
-  border-top-right-radius: 8px;
-  border-top-left-radius: 8px;
+  border-top-right-radius: 0.5em;
+  border-top-left-radius: 0.5em;
 }
 
 .leaderboard-column {
@@ -32,8 +32,8 @@ a:hover {
 }
 
 .leaderboard-main-bg {
-  border-bottom-right-radius: 8px;
-  border-bottom-left-radius: 8px;
+  border-bottom-right-radius: 0.5em;
+  border-bottom-left-radius: 0.5em;
   padding: 24px 24px;
 }
 
@@ -156,8 +156,8 @@ table th {
   height: 100%;
   position: absolute;
   left: 0;
-  border-top-right-radius: 8px;
-  border-top-left-radius: 8px;
+  border-top-right-radius: 0.5em;
+  border-top-left-radius: 0.5em;
   z-index: 1;
 }
 
@@ -220,7 +220,7 @@ table th {
   cursor: pointer;
   transition: 0.3s ease;
   font-size: 14px;
-  margin: 10px 8px;
+  margin: 10px 0.5em;
 }
 
 .simple-banner-switch:hover {
@@ -235,8 +235,8 @@ table th {
 }
 
 .main-selector {
-  border-top-right-radius: 8px;
-  border-top-left-radius: 8px;
+  border-top-right-radius: 0.5em;
+  border-top-left-radius: 0.5em;
 }
 
 .leaderboard-table>tbody {
diff --git a/static/css/pages/profile.css b/static/css/pages/profile.css
index 39b0be65..148be64d 100644
--- a/static/css/pages/profile.css
+++ b/static/css/pages/profile.css
@@ -1,6 +1,6 @@
 .main-block {
-  border-top-right-radius: 20px;
-  border-top-left-radius: 20px;
+  border-top-right-radius: 3em;
+  border-top-left-radius: 3em;
 }
 
 .second-block {
@@ -10,10 +10,27 @@
 .stats-block {
   width: 100%;
   background: hsl(var(--main), 25%, 25%);
-  padding: 9.5px;
-  margin-bottom: 9.5px !important;
+  padding: 1em;
+  margin-bottom: 1em !important;
 }
 
+.log-block {
+  transition: 0.2s ease;
+  margin-bottom: 12px;
+}
+.extra-block {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  background: hsl(var(--main), 20%, 20%);
+}
+
+.stats-block, .extra-block
+{
+  border-radius: 0 0 0.5em 0.5em;
+}
+
+
 .profile-flex {
   width: 100%;
   display: flex;
@@ -22,7 +39,7 @@
 }
 
 .profile-bg {
-  min-height: 262px;
+  min-height: 11em;
   width: 100%;
   background-size: cover;
   background-position: center;
@@ -137,7 +154,7 @@ tbody {
 
 tr {
   display: flex;
-  padding: 8px;
+  padding: 0.5em;
 }
 
 td {
@@ -158,7 +175,7 @@ td {
 .grade-block {
   padding: 10px;
   display: block;
-  margin-top: 8px;
+  margin-top: 0.5em;
 }
 .grade-block .media-content { overflow-x: unset !important; }
 .map-rank {
@@ -182,7 +199,7 @@ td {
   flex-direction: column;
   align-items: center;
   line-height: 1;
-  margin: -2px 8px;
+  margin: -2px 0.5em;
 }
 
 .rank-block {
@@ -253,8 +270,8 @@ html {
 .header {
   padding: 10px 10px;
   background: hsl(var(--main), 30%, 50%);
-  border-top-left-radius: 8px;
-  border-top-right-radius: 8px;
+  border-top-left-radius: 0.5em;
+  border-top-right-radius: 0.5em;
 }
 
 .header .title {
@@ -269,19 +286,30 @@ html {
 }
 
 .map-single {
-  height: 72px;
+  /* traisition */
+  max-height: 0;
+  margin: 0;
+  opacity: 0;
+  /* transition */
+
   min-width: 0;
   display: flex;
   flex-direction: row;
   align-items: center;
   padding-right: 0;
-  margin: 8px 0;
   justify-content: space-between;
   overflow: hidden;
   background: hsl(var(--main), 25%, 25%);
-  transition: 0.2s ease;
+  transition: 0.2 ease-in-out;
   cursor: pointer;
 }
+.map-single.show {
+  opacity: 1;
+  margin: 0.5em 0;
+  max-height: 72px;
+
+  transition: 0.2s ease-in-out;
+}
 .map-data {
   height: 72px;
   min-width: 100%;
@@ -289,7 +317,7 @@ html {
   flex-direction: row;
   align-items: center;
   padding-right: 0;
-  margin: 8px 0;
+  margin: 0.5em 0;
   justify-content: space-between;
   border-radius: 10px;
   overflow: hidden;
@@ -299,16 +327,16 @@ html {
 
 .map-single:first-child {
   margin-top: 0;
-  border-radius: 8px 8px 0 0;
+  border-radius: 0.5em 0.5em 0 0;
 }
 .map-single:last-child {
   margin-top: 0;
-  border-radius: 0 0 8px 8px;
+  border-radius: 0 0 0.5em 0.5em;
 }
 .map-single:hover {
-  border-radius: 8px;
+  border-radius: 0.5em;
   transform: translateY(-1px);
-  box-shadow: 0 0 1px rgba(0, 0, 0, 0.04), 0 4px 8px rgba(0, 0, 0, 0.04),
+  box-shadow: 0 0 1px rgba(0, 0, 0, 0.04), 0 4px 0.5em rgba(0, 0, 0, 0.04),
     0 16px 24px rgba(0, 0, 0, 0.04), 0 24px 32px rgba(0, 0, 0, 0.04);
   background: hsl(var(--main), 30%, 30%);
 }
@@ -477,18 +505,20 @@ html {
 }
 
 .beatmap-block {
-  transition: 0.2s ease;
-}
-
-.beatmap-block {
+  max-height: 0;
+  padding: 0;
   display: flex;
-  padding: 8px;
   font-weight: 700;
   line-height: 1.3;
   align-items: center;
   overflow: hidden;
-  height: 72px;
   width: 100%;
+  transition: 0.2s ease-in-out;
+}
+.beatmap-block.show {
+  max-height: 72px;
+  padding: 0.5em;
+  transition: 0.2s ease-in-out;
 }
 
 .beatmap-block {
@@ -499,7 +529,7 @@ html {
 .beatmap-block:hover {
   background-color: hsl(var(--main), 25%, 30%);
   transform: scale(1.01);
-  box-shadow: 0 0 1px rgba(0, 0, 0, 0.04), 0 4px 8px rgba(0, 0, 0, 0.04),
+  box-shadow: 0 0 1px rgba(0, 0, 0, 0.04), 0 4px 0.5em rgba(0, 0, 0, 0.04),
     0 16px 24px rgba(0, 0, 0, 0.04), 0 24px 32px rgba(0, 0, 0, 0.04);
   color: #fff;
 }
@@ -522,7 +552,7 @@ html {
   display: flex;
   justify-content: space-between;
   align-items: baseline;
-  margin-top: 8px;
+  margin-top: 0.5em;
   font-size: 16px;
   font-weight: 600;
   color: #fff;
@@ -561,24 +591,17 @@ html {
 }
 
 span.beatmap-mapper {
-  padding-right: 8px;
+  padding-right: 0.5em;
 }
 
 .d-flex.align-items-baseline {
   display: flex;
 }
 
-.extra-block {
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  background: hsl(var(--main), 20%, 20%);
-}
-
 .show-button {
   padding: 3px 42px;
   background: hsl(var(--main), 25%, 25%);
-  margin: 0px 8px 8px 8px;
+  margin: 0px 0.5em 0.5em 0.5em;
   text-align: center;
 }
 
@@ -702,7 +725,7 @@ span.beatmap-mapper {
   position: absolute;
   top: 18px;
   left: 42px;
-  padding: 8px 15px;
+  padding: 0.5em 15px;
   background: #00000040;
   border-radius: 6px;
 }
@@ -729,7 +752,3 @@ span.beatmap-mapper {
 .pop-enter, .pop-leave-to {
   transform: scale(0.8);
 }
-.log-block {
-  transition: 0.2s ease;
-  margin-bottom: 12px;
-}
diff --git a/static/css/pages/settings/style.css b/static/css/pages/settings/style.css
index 70ff91b5..8c339bfc 100644
--- a/static/css/pages/settings/style.css
+++ b/static/css/pages/settings/style.css
@@ -8,7 +8,7 @@
   flex-direction: column;
   padding: 21px 22px;
   position: relative;
-  border-radius: 8px;
+  border-radius: 0.5em;
 }
 
 .title-block {
@@ -139,7 +139,7 @@ button:focus {
 }
 
 .main-block {
-  border-radius: 8px;
+  border-radius: 0.5em;
   display: flex;
   min-height: 688px;
 }
@@ -172,7 +172,7 @@ button:focus {
   display: flex;
   padding-left: 24px;
   align-items: center;
-  border-radius: 8px;
+  border-radius: 0.5em;
 }
 
 .left-selector {
@@ -204,8 +204,8 @@ button:focus {
   padding-left: 38px;
   color: #222;
   font-weight: 700;
-  border-top-right-radius: 8px;
-  border-top-left-radius: 8px;
+  border-top-right-radius: 0.5em;
+  border-top-left-radius: 0.5em;
   background-color: #f7f7f7;
 }
 
@@ -293,7 +293,7 @@ label.user-avatar:hover:before {
   display: flex;
   align-items: center;
   justify-content: flex-end;
-  padding-bottom: 8px;
+  padding-bottom: 0.5em;
   flex-direction: column;
   opacity: 0.7;
   font-weight: 400;
@@ -390,7 +390,7 @@ input::placeholder {
 .welcome-text {
   display: flex;
   flex-direction: column;
-  padding-left: 8px;
+  padding-left: 0.5em;
 }
 
 .welcome {
@@ -428,7 +428,7 @@ input::placeholder {
   width: 100%;
   box-shadow: none;
   border: solid 2px transparent;
-  border-radius: 8px;
+  border-radius: 0.5em;
 }
 
 .bootstrap-select.btn-group .dropdown-menu {
@@ -462,7 +462,7 @@ input::placeholder {
   padding: 0;
   border: 2px solid #fff;
   border-radius: 4px;
-  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.22);
+  box-shadow: 0 0.5em 15px rgba(0, 0, 0, 0.22);
 }
 
 .bootstrap-select.btn-group .dropdown-menu li {
@@ -503,8 +503,8 @@ input::placeholder {
 
 .settings-btn {
   color: #f6a;
-  border-radius: 8px;
-  padding: 8px;
+  border-radius: 0.5em;
+  padding: 0.5em;
   font-size: 14px;
   font-weight: 500;
   background-color: #fff;
@@ -589,7 +589,7 @@ input::placeholder {
   width: 100px;
   color: #fff;
   border: none;
-  padding: 8px;
+  padding: 0.5em;
 }
 
 .menu-icon {
@@ -756,7 +756,7 @@ input:checked+label.checkbox:hover {
 }
 
 label.user-avatar:hover {
-  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
+  box-shadow: 0 0.5em 15px rgba(0, 0, 0, 0.3);
 }
 
 label.user-avatar.loading:after {
@@ -838,7 +838,7 @@ i.loadspin {
   position: absolute;
   background-color: #0000008b;
   border-radius: 120px;
-  padding: 4px 8px;
+  padding: 4px 0.5em;
   margin-top: -6px;
   opacity: 0.8;
   transition: 150ms opacity;
@@ -855,7 +855,7 @@ i.loadspin {
 
 .single-right-block .right-block-content>span {
   font-size: 13px;
-  padding-bottom: 8px;
+  padding-bottom: 0.5em;
 }
 
 .btn.dropdown-toggle,
@@ -1017,13 +1017,13 @@ input:checked+label.checkbox:hover {
   width: 80px;
   height: 80px;
   margin-top: -50px;
-  border-radius: 8px;
+  border-radius: 0.5em;
   object-fit: cover;
   transition: 0.2s ease;
 }
 
 .buttons .button {
-  margin-top: 8px;
+  margin-top: 0.5em;
   border-radius: 0.4em;
   margin-left: 0px;
   width: 100%;
@@ -1038,8 +1038,8 @@ input:checked+label.checkbox:hover {
   display: flex;
   flex-direction: column;
   padding: 18px 48px;
-  border-bottom-right-radius: 8px;
-  border-bottom-left-radius: 8px;
+  border-bottom-right-radius: 0.5em;
+  border-bottom-left-radius: 0.5em;
   align-items: center;
 }
 
diff --git a/static/css/pages/verify.css b/static/css/pages/verify.css
index ed3bd3a1..2f034090 100644
--- a/static/css/pages/verify.css
+++ b/static/css/pages/verify.css
@@ -8,7 +8,7 @@
     flex-direction: column;
     padding: 21px 22px;
     position: relative;
-    border-radius: 8px;
+    border-radius: 0.5em;
 }
 
 .title-block {
diff --git a/static/css/style.css b/static/css/style.css
index 7dae38b9..a0da46aa 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -199,7 +199,7 @@ html {
 }
 
 a.foot-link {
-  margin: 8px;
+  margin: 0.5em;
 }
 
 .container {
@@ -379,16 +379,6 @@ a.foot-link {
   width: 152px;
 }
 
-.scores + .extra-block
-{
-  border-radius: 0 0 1em 1em;
-}
-
-.stats-block
-{
-  border-radius: 0 0 1em 1em;
-}
-
 .input,
 .select select,
 .textarea {
@@ -429,7 +419,7 @@ a.foot-link {
 
 .noti-banner {
   display: flex;
-  padding: 8px;
+  padding: 0.5em;
   font-size: 12px;
   color: #fff;
   background-color: hsl(var(--main), 25%, 20%);
@@ -735,7 +725,7 @@ a.foot-link {
 .score-stats-group {
   margin: 5px;
   display: grid;
-  grid-gap: 8px;
+  grid-gap: 0.5em;
   width: 100%;
 }
 
@@ -758,7 +748,7 @@ a.foot-link {
   text-align: center;
   background: hsl(var(--main), 25%, 20%);
   padding: 10px;
-  border-radius: 8px;
+  border-radius: 0.5em;
 }
 
 .score-stats-stat-row {
@@ -838,7 +828,7 @@ a.foot-link {
 body::-webkit-scrollbar {
   width: 12px;
   background-color: hsl(var(--main), 10%, 25%);
-  border-bottom-right-radius: 8px;
+  border-bottom-right-radius: 0.5em;
 }
 
 body::-webkit-scrollbar-thumb {
diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 12fd945f..e80b9d5e 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -61,53 +61,66 @@ new Vue({
         LoadProfileData() {
             this.$set(this.data.stats, 'load', true);
             this.$axios.get(`//api.${domain}/get_player_info`, {
-                    params: {
-                        id: this.userid,
-                        scope: 'all'
-                    }
-                })
+                params: {
+                    id: this.userid,
+                    scope: 'all'
+                }
+            })
                 .then(res => {
                     this.$set(this.data.stats, 'out', res.data.player.stats);
                     this.data.stats.load = false;
                 });
         },
-        LoadScores(sort) {
+        async LoadScores(sort) {
             this.$set(this.data.scores[`${sort}`], 'load', true);
-            this.$axios.get(`//api.${domain}/get_player_scores`, {
-                    params: {
-                        id: this.userid,
-                        mode: this.StrtoGulagInt(),
-                        scope: sort,
-                        limit: this.data.scores[`${sort}`].more.limit
-                    }
-                })
+            await this.$axios.get(`//api.${domain}/get_player_scores`, {
+                params: {
+                    id: this.userid,
+                    mode: this.StrtoGulagInt(),
+                    scope: sort,
+                    limit: this.data.scores[`${sort}`].more.limit
+                }
+            })
                 .then(res => {
                     this.data.scores[`${sort}`].out = res.data.scores;
                     this.data.scores[`${sort}`].load = false
                     this.data.scores[`${sort}`].more.full = this.data.scores[`${sort}`].out.length != this.data.scores[`${sort}`].more.limit;
                 });
+            // animation
+            this.$refs.scores && this.$refs.scores.filter(el => !el.classList.contains('show')).forEach((el, index) => {
+                index += 1
+                setTimeout(() => {
+                    el.classList.add('show')
+                }, index * 30)
+            })
         },
-        LoadMostBeatmaps() {
+        async LoadMostBeatmaps() {
             this.$set(this.data.maps.most, 'load', true);
-            this.$axios.get(`//api.${domain}/get_player_most_played`, {
-                    params: {
-                        id: this.userid,
-                        mode: this.StrtoGulagInt(),
-                        limit: this.data.maps.most.more.limit
-                    }
-                })
+            await this.$axios.get(`//api.${domain}/get_player_most_played`, {
+                params: {
+                    id: this.userid,
+                    mode: this.StrtoGulagInt(),
+                    limit: this.data.maps.most.more.limit
+                }
+            })
                 .then(res => {
                     this.data.maps.most.out = res.data.maps;
                     this.data.maps.most.load = false;
                     this.data.maps.most.more.full = this.data.maps.most.out.length != this.data.maps.most.more.limit;
                 });
+            // animation
+            this.$refs.mostPlayed && this.$refs.mostPlayed.filter(el => !el.classList.contains('show')).forEach((el, index) => {
+                setTimeout(() => {
+                    el.classList.add('show')
+                }, index * 20)
+            })
         },
         LoadUserStatus() {
             this.$axios.get(`//api.${domain}/get_player_status`, {
-                    params: {
-                        id: this.userid
-                    }
-                })
+                params: {
+                    id: this.userid
+                }
+            })
                 .then(res => {
                     this.$set(this.data, 'status', res.data.player_status)
                 })
@@ -161,12 +174,12 @@ new Vue({
                     return 'In Multiplayer: Song Select';
                 case 6:
                     return `Watching: 👓 ${d.info_text}`;
-                    // 7 not used
+                // 7 not used
                 case 8:
                     return `Testing: 🎾 ${d.info_text}`;
                 case 9:
                     return `Submitting: 🧼 ${d.info_text}`;
-                    // 10 paused, never used
+                // 10 paused, never used
                 case 11:
                     return 'Idle: 🏢 In multiplayer lobby';
                 case 12:
diff --git a/templates/profile.html b/templates/profile.html
index 3708c5a2..760cec46 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -25,13 +25,13 @@
             <i class="fas fa-trophy"></i> {{ title }}
         </div>
     </div>
-    <div v-if="data.scores.{{ id }}.out.length != 0" class="scores">
-        <div v-for="(map, index) in data.scores.{{ id }}.out" class="map-single"
+    <div v-if="data.scores.{{ id }}.out.length" class="scores">
+        <div v-for="(map, index) in data.scores.{{ id }}.out" class="map-single" ref="scores" :key="map.beatmap.map_id" 
             :style="`background: linear-gradient(hsl(var(--main), 25%, 25%, 90%), hsl(var(--main), 25%, 25%, 90%)), url(https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/cover.jpg)`">
-            <div class="map-data" @click="window.open('https://osu.ppy.sh/beatmaps/' + map.beatmap.id) ">
+            <div class="map-data" @click="window.open(`https://osu.ppy.sh/beatmaps/${map.beatmap.id}`) ">
                 <div class="map-content1">
                     <div class="map-image">
-                        <img v-bind:src="'https://assets.ppy.sh/beatmaps/' + map.beatmap.set_id + '/covers/card.jpg'"
+                        <img v-bind:src="`https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/card.jpg`"
                             class="map-image-picture">
                     </div>
                     <div class="map-title-block">
@@ -98,8 +98,8 @@ <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
             <i class="fas fa-address-book"></i> {{ title }}
         </div>
     </div>
-    <div v-if="data.maps.{{ id }}.out.length != 0" class="beatmaps">
-        <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block rounded-sm">
+    <div v-if="data.maps.{{ id }}.out.length" class="beatmaps">
+        <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block rounded-sm" ref="mostPlayed" :key="map.id">
             <div class="beatmap-preview"
                 v-bind:style='{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }'>
             </div>
@@ -153,7 +153,7 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
 </script>
 <style>
     .rounded-sm {
-        border-radius: 8px;
+        border-radius: 0.5em;
     }
 </style>
 {% endblock %}

From 7f8adb8f8939caab8336ddabe89ff9dcdb3c4111 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 1 Aug 2022 05:48:53 +0000
Subject: [PATCH 150/278] update

---
 static/js/pages/profile.js | 47 +++++++++++++++++++++++---------------
 1 file changed, 28 insertions(+), 19 deletions(-)

diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index e80b9d5e..1ee72969 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -49,14 +49,14 @@ new Vue({
         // starting a page
         this.modegulag = this.StrtoGulagInt();
         this.LoadProfileData();
-        this.LoadAllofdata();
-        this.LoadUserStatus();
+        this.LoadAllofdata({ animation: false });
+        this.LoadUserStatus({ animation: false });
     },
     methods: {
-        LoadAllofdata() {
-            this.LoadMostBeatmaps();
-            this.LoadScores('best');
-            this.LoadScores('recent');
+        LoadAllofdata(opt) {
+            this.LoadMostBeatmaps(opt);
+            this.LoadScores('best', opt);
+            this.LoadScores('recent', opt);
         },
         LoadProfileData() {
             this.$set(this.data.stats, 'load', true);
@@ -71,7 +71,7 @@ new Vue({
                     this.data.stats.load = false;
                 });
         },
-        async LoadScores(sort) {
+        async LoadScores(sort, { animation = true } = {}) {
             this.$set(this.data.scores[`${sort}`], 'load', true);
             await this.$axios.get(`//api.${domain}/get_player_scores`, {
                 params: {
@@ -86,15 +86,19 @@ new Vue({
                     this.data.scores[`${sort}`].load = false
                     this.data.scores[`${sort}`].more.full = this.data.scores[`${sort}`].out.length != this.data.scores[`${sort}`].more.limit;
                 });
+            const toShow = this.$refs.scores && this.$refs.scores.filter(el => !el.classList.contains('show')) || [];
             // animation
-            this.$refs.scores && this.$refs.scores.filter(el => !el.classList.contains('show')).forEach((el, index) => {
-                index += 1
-                setTimeout(() => {
-                    el.classList.add('show')
-                }, index * 30)
-            })
+            if (!animation) {
+                toShow.forEach(el => el.classList.add('show'))
+            } else {
+                toShow.forEach((el, index) => {
+                    setTimeout(() => {
+                        el.classList.add('show')
+                    }, index * 30)
+                })
+            }
         },
-        async LoadMostBeatmaps() {
+        async LoadMostBeatmaps({ animation = true } = {}) {
             this.$set(this.data.maps.most, 'load', true);
             await this.$axios.get(`//api.${domain}/get_player_most_played`, {
                 params: {
@@ -108,12 +112,17 @@ new Vue({
                     this.data.maps.most.load = false;
                     this.data.maps.most.more.full = this.data.maps.most.out.length != this.data.maps.most.more.limit;
                 });
+            const toShow = this.$refs.mostPlayed && this.$refs.mostPlayed.filter(el => !el.classList.contains('show')) || [];
             // animation
-            this.$refs.mostPlayed && this.$refs.mostPlayed.filter(el => !el.classList.contains('show')).forEach((el, index) => {
-                setTimeout(() => {
-                    el.classList.add('show')
-                }, index * 20)
-            })
+            if (!animation) {
+                toShow.forEach(el => el.classList.add('show'))
+            } else {
+                toShow.forEach((el, index) => {
+                    setTimeout(() => {
+                        el.classList.add('show')
+                    }, index * 20)
+                })
+            }
         },
         LoadUserStatus() {
             this.$axios.get(`//api.${domain}/get_player_status`, {

From 3c34c8888a8161bc6b181338403f4507a0f603b2 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 1 Aug 2022 05:50:33 +0000
Subject: [PATCH 151/278] update rand

---
 main.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/main.py b/main.py
index 4226ef27..2754329a 100755
--- a/main.py
+++ b/main.py
@@ -114,7 +114,7 @@ def decode_map_status(status: int) -> str:
 
 @app.template_global()
 def rand() -> str:
-    return str(random.randint(0,100000))
+    return "20220801"
 
 @app.template_global()
 def captchaKey() -> str:

From b99d44c15d4b2e95821ba0f76e18da9fa6cc652f Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 1 Aug 2022 05:50:55 +0000
Subject: [PATCH 152/278] rename it

---
 main.py                   | 2 +-
 templates/admin/base.html | 4 ++--
 templates/base.html       | 6 +++---
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/main.py b/main.py
index 2754329a..babce09b 100755
--- a/main.py
+++ b/main.py
@@ -113,7 +113,7 @@ def decode_map_status(status: int) -> str:
     return ', '.join(priv_list)
 
 @app.template_global()
-def rand() -> str:
+def version() -> str:
     return "20220801"
 
 @app.template_global()
diff --git a/templates/admin/base.html b/templates/admin/base.html
index bb6fff3e..3cd9cf3a 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -22,7 +22,7 @@
   <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
 
   <!-- bulma -->
-  <link rel="stylesheet" href="/static/css/bulma.css?v={{ rand() }}" />
+  <link rel="stylesheet" href="/static/css/bulma.css?v={{ version() }}" />
 
   <!-- font awesome -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
@@ -76,7 +76,7 @@
   </footer>
 
   <!-- main js script -->
-  <script src="/static/js/main.js?v={{ rand() }}" crossorigin="anonymous"></script>
+  <script src="/static/js/main.js?v={{ version() }}" crossorigin="anonymous"></script>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/templates/base.html b/templates/base.html
index c31106bb..a8a61e7b 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -22,14 +22,14 @@
   <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
 
   <!-- Bulma -->
-  <link rel="stylesheet" href="/static/css/bulma.css?v={{ rand() }}" />
+  <link rel="stylesheet" href="/static/css/bulma.css?v={{ version() }}" />
 
 
   <!-- Font awesome -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
 
   <!-- Custom style -->
-  <link rel="stylesheet" href="/static/css/style.css?v={{ rand() }}">
+  <link rel="stylesheet" href="/static/css/style.css?v={{ version() }}">
 
   {% block header %}
   {% endblock %}
@@ -49,7 +49,7 @@
   {% include 'components/footer.html' %}
 
   <!-- Main JS script -->
-  <script src="/static/js/main.js?v={{ rand() }}" crossorigin="anonymous"></script>
+  <script src="/static/js/main.js?v={{ version() }}" crossorigin="anonymous"></script>
 
   <!-- Customisation -->
   {% block bottom %}{% endblock %}

From 05f5acef451eb70013e0afd444caab2561d51ad7 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 1 Aug 2022 06:00:34 +0000
Subject: [PATCH 153/278] version control on all self-hosted assets

---
 templates/404.html               | 2 +-
 templates/admin/base.html        | 4 ++--
 templates/admin/home.html        | 6 +++---
 templates/home.html              | 2 +-
 templates/leaderboard.html       | 8 ++++----
 templates/login.html             | 2 +-
 templates/profile.html           | 8 ++++----
 templates/register.html          | 2 +-
 templates/settings/aboutme.html  | 2 +-
 templates/settings/avatar.html   | 2 +-
 templates/settings/custom.html   | 2 +-
 templates/settings/password.html | 2 +-
 templates/settings/profile.html  | 2 +-
 templates/verify.html            | 2 +-
 14 files changed, 23 insertions(+), 23 deletions(-)

diff --git a/templates/404.html b/templates/404.html
index 168146a2..ff918f9a 100644
--- a/templates/404.html
+++ b/templates/404.html
@@ -2,7 +2,7 @@
 {% block title %} 404 {% endblock %}
 
 {% block header %}
-<link rel="stylesheet" href="/static/css/pages/404.css">
+<link rel="stylesheet" href="/static/css/pages/404.css?v={{ version() }}">
 <style>html {--main: 355;}</style>
 {% endblock %}
 
diff --git a/templates/admin/base.html b/templates/admin/base.html
index 3cd9cf3a..bc76d9cc 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -28,8 +28,8 @@
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
 
   <!-- custom style -->
-  <link rel="stylesheet" href="/static/css/style.css">
-  <link rel="stylesheet" href="/static/css/pages/admin/style.css">
+  <link rel="stylesheet" href="/static/css/style.css?v={{ version() }}">
+  <link rel="stylesheet" href="/static/css/pages/admin/style.css?v={{ version() }}">
 
   {% block header %}
   {% endblock %}
diff --git a/templates/admin/home.html b/templates/admin/home.html
index 59185e5d..40d53829 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -1,8 +1,8 @@
 {% extends 'admin/base.html' %}
 {% block title %} Dashboard {% endblock %}
 {% block header %}
-<script src="/static/js/assets/vue.js"></script>
-<script src="/static/js/assets/vue-axios.js"></script>
+<script src="/static/js/assets/vue.js?v={{ version() }}"></script>
+<script src="/static/js/assets/vue-axios.js?v={{ version() }}"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
 <script>
     var domain = "{{ domain() }}";
@@ -157,6 +157,6 @@ <h2 class="section-title">{{ t('admin.home.recent-score') }}</h2>
     {% endif %}
 </div>
 
-<script src="/static/js/pages/admin/dashboard.js"></script>
+<script src="/static/js/pages/admin/dashboard.js?v={{ version() }}"></script>
 
 {% endblock %}
\ No newline at end of file
diff --git a/templates/home.html b/templates/home.html
index 2502cc0c..3cce79e5 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -2,7 +2,7 @@
 {% block title %} Home {% endblock %}
 
 {% block header %}
-<link rel="stylesheet" href="/static/css/pages/home.css">
+<link rel="stylesheet" href="/static/css/pages/home.css?v={{ version() }}">
 {% endblock %}
 
 {% block content %}
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index 2855ee99..64ab28f4 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -2,8 +2,8 @@
 {% block title %} {{ t('global.leaderboard') }} {% endblock %}
 
 {% block header %}
-<script src="/static/js/assets/vue.js"></script>
-<script src="/static/js/assets/vue-axios.js"></script>
+<script src="/static/js/assets/vue.js?v={{ version() }}"></script>
+<script src="/static/js/assets/vue-axios.js?v={{ version() }}"></script>
 
 <script>
     var mode = "{{ mode }}";
@@ -12,7 +12,7 @@
     var domain = "{{ domain() }}";
 </script>
 
-<link rel="stylesheet" href="/static/css/pages/leaderboard.css">
+<link rel="stylesheet" href="/static/css/pages/leaderboard.css?v={{ version() }}">
 {% endblock %}
 
 {% block content %}
@@ -123,6 +123,6 @@
     </div>
 </div>
 
-<script src="/static/js/assets/vue-flags.js"></script>
+<script src="/static/js/assets/vue-flags.js?v={{ version() }}"></script>
 <script src="/static/js/pages/leaderboard.js?v=1.0"></script>
 {% endblock %}
diff --git a/templates/login.html b/templates/login.html
index 2ad02533..6a71b7aa 100644
--- a/templates/login.html
+++ b/templates/login.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('global.login') }} {% endblock %}
 
 {% block header %}
-<link rel="stylesheet" href="/static/css/pages/auth.css">
+<link rel="stylesheet" href="/static/css/pages/auth.css?v={{ version() }}">
 {% endblock %}
 
 {% block content %}
diff --git a/templates/profile.html b/templates/profile.html
index 760cec46..b6146ff2 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -140,10 +140,10 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
 {% endmacro %}
 
 {% block header %}
-<script src="/static/js/assets/vue.js"></script>
-<script src="/static/js/assets/vue-axios.js"></script>
+<script src="/static/js/assets/vue.js?v={{ version() }}"></script>
+<script src="/static/js/assets/vue-axios.js?v={{ version() }}"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
-<link rel="stylesheet" href="/static/css/pages/profile.css?v=1.0">
+<link rel="stylesheet" href="/static/css/pages/profile.css?v={{ version() }}">
 
 <script>
     var userid = Number("{{ user['id'] }}"); //For text editor doesn't dizzy lmao
@@ -374,7 +374,7 @@ <h1 class="title">
 {% endblock %}
 
 {% block bottom %}
-<script src="/static/js/pages/profile.js"></script>
+<script src="/static/js/pages/profile.js?v={{ version() }}"></script>
 {% if user['customisation']['banner'] == True %}
     <style>
         .profile-bg {
diff --git a/templates/register.html b/templates/register.html
index 9a49eefe..fd68a889 100644
--- a/templates/register.html
+++ b/templates/register.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('global.register') }} {% endblock %}
 
 {% block header %}
-<link rel="stylesheet" href="/static/css/pages/auth.css">
+<link rel="stylesheet" href="/static/css/pages/auth.css?v={{ version() }}">
 {% endblock %}
 
 {% block content %}
diff --git a/templates/settings/aboutme.html b/templates/settings/aboutme.html
index 402b9427..808cf37f 100644
--- a/templates/settings/aboutme.html
+++ b/templates/settings/aboutme.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('global.password') }} {% endblock %}
 
 {% block content %}
-<link rel="stylesheet" href="/static/css/pages/settings/style.css">
+<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ version() }}">
 
 <div class="main-block">
   {% include "settings/sidebar.html" %}
diff --git a/templates/settings/avatar.html b/templates/settings/avatar.html
index b3e37aff..200e9505 100644
--- a/templates/settings/avatar.html
+++ b/templates/settings/avatar.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('settings.avatar') }} {% endblock %}
 
 {% block content %}
-<link rel="stylesheet" href="/static/css/pages/settings/style.css">
+<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ version() }}">
 
 <div class="main-block">
   {% include "settings/sidebar.html" %}
diff --git a/templates/settings/custom.html b/templates/settings/custom.html
index 3a0fe21c..c8e10283 100644
--- a/templates/settings/custom.html
+++ b/templates/settings/custom.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('settings.avatar') }} {% endblock %}
 
 {% block content %}
-<link rel="stylesheet" href="/static/css/pages/settings/style.css">
+<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ version() }}">
 
 <div class="main-block">
   {% include "settings/sidebar.html" %}
diff --git a/templates/settings/password.html b/templates/settings/password.html
index 6188bb4c..cad75ce8 100644
--- a/templates/settings/password.html
+++ b/templates/settings/password.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('global.password') }} {% endblock %}
 
 {% block content %}
-<link rel="stylesheet" href="/static/css/pages/settings/style.css">
+<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ version() }}">
 
 <div class="main-block">
   {% include "settings/sidebar.html" %}
diff --git a/templates/settings/profile.html b/templates/settings/profile.html
index f865fc6a..ee44fbc9 100644
--- a/templates/settings/profile.html
+++ b/templates/settings/profile.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('global.profile') }} {% endblock %}
 
 {% block content %}
-<link rel="stylesheet" href="/static/css/pages/settings/style.css">
+<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ version() }}">
 
 <div class="main-block">
   {% include "settings/sidebar.html" %}
diff --git a/templates/verify.html b/templates/verify.html
index ae8994cb..337a8c22 100644
--- a/templates/verify.html
+++ b/templates/verify.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('global.verify') }} {% endblock %}
 
 {% block header %}
-<link rel="stylesheet" href="/static/css/pages/verify.css">
+<link rel="stylesheet" href="/static/css/pages/verify.css?v={{ version() }}">
 {% endblock %}
 
 {% block content %}

From a277395bf8a948be83959cf04b3744df301921e8 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 1 Aug 2022 06:05:17 +0000
Subject: [PATCH 154/278] properly show version

---
 main.py                          | 4 ----
 templates/404.html               | 2 +-
 templates/admin/base.html        | 8 ++++----
 templates/admin/home.html        | 6 +++---
 templates/base.html              | 6 +++---
 templates/home.html              | 2 +-
 templates/leaderboard.html       | 8 ++++----
 templates/login.html             | 2 +-
 templates/profile.html           | 8 ++++----
 templates/register.html          | 2 +-
 templates/settings/aboutme.html  | 2 +-
 templates/settings/avatar.html   | 2 +-
 templates/settings/custom.html   | 2 +-
 templates/settings/password.html | 2 +-
 templates/settings/profile.html  | 2 +-
 templates/verify.html            | 2 +-
 16 files changed, 28 insertions(+), 32 deletions(-)

diff --git a/main.py b/main.py
index babce09b..4fe3a90b 100755
--- a/main.py
+++ b/main.py
@@ -112,10 +112,6 @@ def decode_map_status(status: int) -> str:
         priv_list.append('inactive')
     return ', '.join(priv_list)
 
-@app.template_global()
-def version() -> str:
-    return "20220801"
-
 @app.template_global()
 def captchaKey() -> str:
     return glob.config.hCaptcha_sitekey
diff --git a/templates/404.html b/templates/404.html
index ff918f9a..e051c8c3 100644
--- a/templates/404.html
+++ b/templates/404.html
@@ -2,7 +2,7 @@
 {% block title %} 404 {% endblock %}
 
 {% block header %}
-<link rel="stylesheet" href="/static/css/pages/404.css?v={{ version() }}">
+<link rel="stylesheet" href="/static/css/pages/404.css?v={{ appVersion() }} ">
 <style>html {--main: 355;}</style>
 {% endblock %}
 
diff --git a/templates/admin/base.html b/templates/admin/base.html
index bc76d9cc..b5162b4f 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -22,14 +22,14 @@
   <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
 
   <!-- bulma -->
-  <link rel="stylesheet" href="/static/css/bulma.css?v={{ version() }}" />
+  <link rel="stylesheet" href="/static/css/bulma.css?v={{ appVersion() }} " />
 
   <!-- font awesome -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
 
   <!-- custom style -->
-  <link rel="stylesheet" href="/static/css/style.css?v={{ version() }}">
-  <link rel="stylesheet" href="/static/css/pages/admin/style.css?v={{ version() }}">
+  <link rel="stylesheet" href="/static/css/style.css?v={{ appVersion() }} ">
+  <link rel="stylesheet" href="/static/css/pages/admin/style.css?v={{ appVersion() }} ">
 
   {% block header %}
   {% endblock %}
@@ -76,7 +76,7 @@
   </footer>
 
   <!-- main js script -->
-  <script src="/static/js/main.js?v={{ version() }}" crossorigin="anonymous"></script>
+  <script src="/static/js/main.js?v={{ appVersion() }} " crossorigin="anonymous"></script>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/templates/admin/home.html b/templates/admin/home.html
index 40d53829..ded7fd02 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -1,8 +1,8 @@
 {% extends 'admin/base.html' %}
 {% block title %} Dashboard {% endblock %}
 {% block header %}
-<script src="/static/js/assets/vue.js?v={{ version() }}"></script>
-<script src="/static/js/assets/vue-axios.js?v={{ version() }}"></script>
+<script src="/static/js/assets/vue.js?v={{ appVersion() }} "></script>
+<script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
 <script>
     var domain = "{{ domain() }}";
@@ -157,6 +157,6 @@ <h2 class="section-title">{{ t('admin.home.recent-score') }}</h2>
     {% endif %}
 </div>
 
-<script src="/static/js/pages/admin/dashboard.js?v={{ version() }}"></script>
+<script src="/static/js/pages/admin/dashboard.js?v={{ appVersion() }} "></script>
 
 {% endblock %}
\ No newline at end of file
diff --git a/templates/base.html b/templates/base.html
index a8a61e7b..723acd35 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -22,14 +22,14 @@
   <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
 
   <!-- Bulma -->
-  <link rel="stylesheet" href="/static/css/bulma.css?v={{ version() }}" />
+  <link rel="stylesheet" href="/static/css/bulma.css?v={{ appVersion() }} " />
 
 
   <!-- Font awesome -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
 
   <!-- Custom style -->
-  <link rel="stylesheet" href="/static/css/style.css?v={{ version() }}">
+  <link rel="stylesheet" href="/static/css/style.css?v={{ appVersion() }} ">
 
   {% block header %}
   {% endblock %}
@@ -49,7 +49,7 @@
   {% include 'components/footer.html' %}
 
   <!-- Main JS script -->
-  <script src="/static/js/main.js?v={{ version() }}" crossorigin="anonymous"></script>
+  <script src="/static/js/main.js?v={{ appVersion() }} " crossorigin="anonymous"></script>
 
   <!-- Customisation -->
   {% block bottom %}{% endblock %}
diff --git a/templates/home.html b/templates/home.html
index 3cce79e5..b3f57553 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -2,7 +2,7 @@
 {% block title %} Home {% endblock %}
 
 {% block header %}
-<link rel="stylesheet" href="/static/css/pages/home.css?v={{ version() }}">
+<link rel="stylesheet" href="/static/css/pages/home.css?v={{ appVersion() }} ">
 {% endblock %}
 
 {% block content %}
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index 64ab28f4..0d3fa17c 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -2,8 +2,8 @@
 {% block title %} {{ t('global.leaderboard') }} {% endblock %}
 
 {% block header %}
-<script src="/static/js/assets/vue.js?v={{ version() }}"></script>
-<script src="/static/js/assets/vue-axios.js?v={{ version() }}"></script>
+<script src="/static/js/assets/vue.js?v={{ appVersion() }} "></script>
+<script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
 
 <script>
     var mode = "{{ mode }}";
@@ -12,7 +12,7 @@
     var domain = "{{ domain() }}";
 </script>
 
-<link rel="stylesheet" href="/static/css/pages/leaderboard.css?v={{ version() }}">
+<link rel="stylesheet" href="/static/css/pages/leaderboard.css?v={{ appVersion() }} ">
 {% endblock %}
 
 {% block content %}
@@ -123,6 +123,6 @@
     </div>
 </div>
 
-<script src="/static/js/assets/vue-flags.js?v={{ version() }}"></script>
+<script src="/static/js/assets/vue-flags.js?v={{ appVersion() }} "></script>
 <script src="/static/js/pages/leaderboard.js?v=1.0"></script>
 {% endblock %}
diff --git a/templates/login.html b/templates/login.html
index 6a71b7aa..ab127c0c 100644
--- a/templates/login.html
+++ b/templates/login.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('global.login') }} {% endblock %}
 
 {% block header %}
-<link rel="stylesheet" href="/static/css/pages/auth.css?v={{ version() }}">
+<link rel="stylesheet" href="/static/css/pages/auth.css?v={{ appVersion() }} ">
 {% endblock %}
 
 {% block content %}
diff --git a/templates/profile.html b/templates/profile.html
index b6146ff2..af07c4fd 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -140,10 +140,10 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
 {% endmacro %}
 
 {% block header %}
-<script src="/static/js/assets/vue.js?v={{ version() }}"></script>
-<script src="/static/js/assets/vue-axios.js?v={{ version() }}"></script>
+<script src="/static/js/assets/vue.js?v={{ appVersion() }} "></script>
+<script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
-<link rel="stylesheet" href="/static/css/pages/profile.css?v={{ version() }}">
+<link rel="stylesheet" href="/static/css/pages/profile.css?v={{ appVersion() }} ">
 
 <script>
     var userid = Number("{{ user['id'] }}"); //For text editor doesn't dizzy lmao
@@ -374,7 +374,7 @@ <h1 class="title">
 {% endblock %}
 
 {% block bottom %}
-<script src="/static/js/pages/profile.js?v={{ version() }}"></script>
+<script src="/static/js/pages/profile.js?v={{ appVersion() }} "></script>
 {% if user['customisation']['banner'] == True %}
     <style>
         .profile-bg {
diff --git a/templates/register.html b/templates/register.html
index fd68a889..71aedf69 100644
--- a/templates/register.html
+++ b/templates/register.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('global.register') }} {% endblock %}
 
 {% block header %}
-<link rel="stylesheet" href="/static/css/pages/auth.css?v={{ version() }}">
+<link rel="stylesheet" href="/static/css/pages/auth.css?v={{ appVersion() }} ">
 {% endblock %}
 
 {% block content %}
diff --git a/templates/settings/aboutme.html b/templates/settings/aboutme.html
index 808cf37f..77c8b84e 100644
--- a/templates/settings/aboutme.html
+++ b/templates/settings/aboutme.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('global.password') }} {% endblock %}
 
 {% block content %}
-<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ version() }}">
+<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ appVersion() }} ">
 
 <div class="main-block">
   {% include "settings/sidebar.html" %}
diff --git a/templates/settings/avatar.html b/templates/settings/avatar.html
index 200e9505..f07b45c9 100644
--- a/templates/settings/avatar.html
+++ b/templates/settings/avatar.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('settings.avatar') }} {% endblock %}
 
 {% block content %}
-<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ version() }}">
+<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ appVersion() }} ">
 
 <div class="main-block">
   {% include "settings/sidebar.html" %}
diff --git a/templates/settings/custom.html b/templates/settings/custom.html
index c8e10283..f88f9063 100644
--- a/templates/settings/custom.html
+++ b/templates/settings/custom.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('settings.avatar') }} {% endblock %}
 
 {% block content %}
-<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ version() }}">
+<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ appVersion() }} ">
 
 <div class="main-block">
   {% include "settings/sidebar.html" %}
diff --git a/templates/settings/password.html b/templates/settings/password.html
index cad75ce8..adf7ab35 100644
--- a/templates/settings/password.html
+++ b/templates/settings/password.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('global.password') }} {% endblock %}
 
 {% block content %}
-<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ version() }}">
+<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ appVersion() }} ">
 
 <div class="main-block">
   {% include "settings/sidebar.html" %}
diff --git a/templates/settings/profile.html b/templates/settings/profile.html
index ee44fbc9..4cb38797 100644
--- a/templates/settings/profile.html
+++ b/templates/settings/profile.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('global.profile') }} {% endblock %}
 
 {% block content %}
-<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ version() }}">
+<link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ appVersion() }} ">
 
 <div class="main-block">
   {% include "settings/sidebar.html" %}
diff --git a/templates/verify.html b/templates/verify.html
index 337a8c22..ef907cc2 100644
--- a/templates/verify.html
+++ b/templates/verify.html
@@ -2,7 +2,7 @@
 {% block title %} {{ t('global.verify') }} {% endblock %}
 
 {% block header %}
-<link rel="stylesheet" href="/static/css/pages/verify.css?v={{ version() }}">
+<link rel="stylesheet" href="/static/css/pages/verify.css?v={{ appVersion() }} ">
 {% endblock %}
 
 {% block content %}

From de4a9ff10a1b2b09c25de3acdb554346509c642a Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 1 Aug 2022 06:21:53 +0000
Subject: [PATCH 155/278] upgrade

---
 main.py                    |  2 +-
 static/js/pages/profile.js |  6 ++++--
 templates/leaderboard.html | 24 ++++++++++++------------
 templates/profile.html     | 28 ++++++++++++++--------------
 4 files changed, 31 insertions(+), 29 deletions(-)

diff --git a/main.py b/main.py
index 4fe3a90b..4cf95326 100755
--- a/main.py
+++ b/main.py
@@ -25,7 +25,7 @@
 
 app = Quart(__name__)
 
-version = Version(1, 3, 0)
+version = Version(1, 3, 1)
 
 # used to secure session data.
 # we recommend using a long randomly generated ascii string.
diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 1ee72969..e3fc5f4e 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -83,15 +83,16 @@ new Vue({
             })
                 .then(res => {
                     this.data.scores[`${sort}`].out = res.data.scores;
-                    this.data.scores[`${sort}`].load = false
                     this.data.scores[`${sort}`].more.full = this.data.scores[`${sort}`].out.length != this.data.scores[`${sort}`].more.limit;
                 });
             const toShow = this.$refs.scores && this.$refs.scores.filter(el => !el.classList.contains('show')) || [];
             // animation
             if (!animation) {
                 toShow.forEach(el => el.classList.add('show'))
+                this.data.scores[`${sort}`].load = false
             } else {
                 toShow.forEach((el, index) => {
+                    this.data.scores[`${sort}`].load = false
                     setTimeout(() => {
                         el.classList.add('show')
                     }, index * 30)
@@ -109,14 +110,15 @@ new Vue({
             })
                 .then(res => {
                     this.data.maps.most.out = res.data.maps;
-                    this.data.maps.most.load = false;
                     this.data.maps.most.more.full = this.data.maps.most.out.length != this.data.maps.most.more.limit;
                 });
             const toShow = this.$refs.mostPlayed && this.$refs.mostPlayed.filter(el => !el.classList.contains('show')) || [];
             // animation
             if (!animation) {
                 toShow.forEach(el => el.classList.add('show'))
+                this.data.maps.most.load = false;
             } else {
+                this.data.maps.most.load = false;
                 toShow.forEach((el, index) => {
                     setTimeout(() => {
                         el.classList.add('show')
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index 0d3fa17c..a0a223b3 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -19,19 +19,19 @@
 <div id="app" :class="(load ? 'load' : '')">
     <div class="leaderboard-banner main-banner">
         <div class="main-selector">
-            <a class="mode-select" v-bind:class="{ 'active': mode === 'std' }"
+            <a class="mode-select" :class="{ 'active': mode === 'std' }"
             @click="LoadLeaderboard(sort, 'std', mods)">
                 <i class="mode-icon mode-osu"></i><span class="modetext"> {{ t('global.mode.osu') }}</span>
             </a>
-            <a class="mode-select" v-bind:class="{ 'active': mode === 'taiko', 'disabled': mods === 'ap' }"
+            <a class="mode-select" :class="{ 'active': mode === 'taiko', 'disabled': mods === 'ap' }"
             @click="LoadLeaderboard(sort, 'taiko', mods)">
                 <i class="mode-icon mode-taiko"></i><span class="modetext"> {{ t('global.mode.taiko') }}</span>
             </a>
-            <a class="mode-select" v-bind:class="{ 'active': mode === 'catch', 'disabled': mods === 'ap' }"
+            <a class="mode-select" :class="{ 'active': mode === 'catch', 'disabled': mods === 'ap' }"
             @click="LoadLeaderboard(sort, 'catch', mods)">
                 <i class="mode-icon mode-catch"></i><span class="modetext"> {{ t('global.mode.catch') }}</span>
             </a>
-            <a class="mode-select" v-bind:class="{ 'active': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
+            <a class="mode-select" :class="{ 'active': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
             @click="LoadLeaderboard(sort, 'mania', mods)">
                 <i class="mode-icon mode-mania"></i><span class="modetext"> {{ t('global.mode.mania') }}</span>
             </a>
@@ -39,23 +39,23 @@
         <div class="banner-text">{{ t('leaderboard.leaderboard') }}</div>
         <div class="selector">
             <div class="left">
-                <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'pp' }"
+                <a class="simple-banner-switch" :class="{ 'active': sort === 'pp' }"
                 @click="LoadLeaderboard('pp', mode, mods, '')">{{ t('global.pp').upper() }}</a>
-                <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'rscore' }"
+                <a class="simple-banner-switch" :class="{ 'active': sort === 'rscore' }"
                 @click="LoadLeaderboard('rscore', mode, mods, '')">{{ t('global.score') }}</a>
-                <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'acc' }"
+                <a class="simple-banner-switch" :class="{ 'active': sort === 'acc' }"
                 @click="LoadLeaderboard('acc', mode, mods, '')">{{ t('global.acc') }}</a>
-                <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'plays' }"
+                <a class="simple-banner-switch" :class="{ 'active': sort === 'plays' }"
                 @click="LoadLeaderboard('plays', mode, mods, '')">{{ t('global.playcount') }}</a>
-                <a class="simple-banner-switch" v-bind:class="{ 'active': sort === 'playtime' }"
+                <a class="simple-banner-switch" :class="{ 'active': sort === 'playtime' }"
                 @click="LoadLeaderboard('playtime', mode, mods, '')">{{ t('global.playtime') }}</a>
             </div>
             <div class="right">
-                <a class="simple-banner-switch" v-bind:class=" { 'active': mods === 'vn' }"
+                <a class="simple-banner-switch" :class=" { 'active': mods === 'vn' }"
                 @click="LoadLeaderboard(sort, mode, 'vn')">{{ t('global.mode.vanilla') }}</a>
-                <a class="simple-banner-switch" v-bind:class=" { 'active': mods === 'rx', 'disabled': mode === 'mania' }"
+                <a class="simple-banner-switch" :class=" { 'active': mods === 'rx', 'disabled': mode === 'mania' }"
                 @click="LoadLeaderboard(sort, mode, 'rx')">{{ t('global.mode.relax') }}</a>
-                <a class="simple-banner-switch" v-bind:class=" { 'active': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
+                <a class="simple-banner-switch" :class=" { 'active': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
                 @click="LoadLeaderboard(sort, mode, 'ap')">{{ t('global.mode.autopilot') }}</a>
             </div>
         </div>
diff --git a/templates/profile.html b/templates/profile.html
index af07c4fd..8047662a 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -19,7 +19,7 @@
 {% endmacro %}
 
 {% macro scores(title, id) %}
-<div class="log-block" v-bind:class="{ 'load' : data.scores.{{ id }}.load }">
+<div class="log-block" :class="{ load : data.scores.{{ id }}.load }">
     <div class="header">
         <div class="title">
             <i class="fas fa-trophy"></i> {{ title }}
@@ -31,7 +31,7 @@
             <div class="map-data" @click="window.open(`https://osu.ppy.sh/beatmaps/${map.beatmap.id}`) ">
                 <div class="map-content1">
                     <div class="map-image">
-                        <img v-bind:src="`https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/card.jpg`"
+                        <img :src="`https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/card.jpg`"
                             class="map-image-picture">
                     </div>
                     <div class="map-title-block">
@@ -41,7 +41,7 @@
                             </a>
                         </div>
                         <div class="play-stats">
-                            <% map.mods_str %> / <% map.max_combo %><b>x</b>
+                            <% map.mods_str %> / <b><% addCommas(map.max_combo) %></b>x
                         </div>
                         <div class="map-date">
                             <time>
@@ -55,7 +55,7 @@
                         <div class="score-details_right-block">
                             <div class="score-details_pp-block">
                                 <div class="map-pp">
-                                    <% map.pp.toFixed() %> <span class="map-pp-unit">{{ t('global.pp') }}</span>
+                                    <% addCommas(map.pp.toFixed()) %><span class="map-pp-unit">{{ t('global.pp') }}</span>
                                 </div>
                                 <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
                                         <% map.acc.toFixed(2) %>%
@@ -63,7 +63,7 @@
                             </div>
                             <div class="score-details_grade-block">
                                 <div class="rank-single">
-                                    <div v-bind:class="'map-rank rank-'+map.grade">
+                                    <div :class="`map-rank rank-${map.grade}`">
                                         <% map.grade.replace("X", "SS").replace("H", "") %>
                                     </div>
                                 </div>
@@ -92,7 +92,7 @@ <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
 {% endmacro %}
 
 {% macro maps(title, id) %}
-<div class="log-block" v-bind:class="{ 'load' : data.maps.{{ id }}.load }">
+<div class="log-block" :class="{ load : data.maps.{{ id }}.load }">
     <div class="header">
         <div class="title">
             <i class="fas fa-address-book"></i> {{ title }}
@@ -101,7 +101,7 @@ <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
     <div v-if="data.maps.{{ id }}.out.length" class="beatmaps">
         <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block rounded-sm" ref="mostPlayed" :key="map.id">
             <div class="beatmap-preview"
-                v-bind:style='{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }'>
+                :style='{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }'>
             </div>
             <div class="beatmap-stats"><span class="beatmap-title">
                     <% map.title %>
@@ -197,27 +197,27 @@ <h1 class="title">
             </div>
             <div class="bar-selection mode-selects">
                 <div class="select-left">
-                    <a class="simple-banner-switch" v-bind:class="{ 'selected': mode === 'std' }"
+                    <a class="simple-banner-switch" :class="{ 'selected': mode === 'std' }"
                         @click="ChangeModeMods('std',mods)"><i class="mode-icon mode-osu"></i><span
                             class="mode-text">{{ t('global.mode.osu') }}</span></a>
-                    <a class="simple-banner-switch" v-bind:class="{ 'selected': mode === 'taiko', 'disabled': mods === 'ap' }"
+                    <a class="simple-banner-switch" :class="{ 'selected': mode === 'taiko', 'disabled': mods === 'ap' }"
                         @click="ChangeModeMods('taiko',mods)"><i class="mode-icon mode-taiko"></i><span
                             class="mode-text">{{ t('global.mode.taiko') }}</span></a>
-                    <a class="simple-banner-switch" v-bind:class="{ 'selected': mode === 'catch', 'disabled': mods === 'ap' }"
+                    <a class="simple-banner-switch" :class="{ 'selected': mode === 'catch', 'disabled': mods === 'ap' }"
                         @click="ChangeModeMods('catch',mods)"><i class="mode-icon mode-catch"></i><span
                             class="mode-text">{{ t('global.mode.catch') }}</span></a>
-                    <a class="simple-banner-switch" v-bind:class="{ 'selected': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
+                    <a class="simple-banner-switch" :class="{ 'selected': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
                         @click="ChangeModeMods('mania',mods)"><i class="mode-icon mode-mania"></i><span
                             class="mode-text">{{ t('global.mode.mania') }}</span></a>
                 </div>
                 <div class="select-right">
-                    <a class="simple-banner-switch" v-bind:class=" { 'selected': mods === 'vn' }"
+                    <a class="simple-banner-switch" :class=" { 'selected': mods === 'vn' }"
                         @click="ChangeModeMods(mode,'vn')"><span class="mods-fulltext">{{ t('global.mode.vanilla') }}</span>
                         <span class="mods-shorttext">{{ t('global.mode.VN') }}</span></a>
-                    <a class="simple-banner-switch" v-bind:class=" { 'selected': mods === 'rx', 'disabled': mode === 'mania' }"
+                    <a class="simple-banner-switch" :class=" { 'selected': mods === 'rx', 'disabled': mode === 'mania' }"
                         @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">{{ t('global.mode.relax') }}</span>
                         <span class="mods-shorttext">{{ t('global.mode.RX') }}</span></a>
-                    <a class="simple-banner-switch" v-bind:class=" { 'selected': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
+                    <a class="simple-banner-switch" :class=" { 'selected': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
                         @click="ChangeModeMods(mode,'ap')"><span class="mods-fulltext">{{ t('global.mode.autopilot') }}</span><span
                             class="mods-shorttext">{{ t('global.mode.AP') }}</span></a>
                 </div>

From 3c5b0502f0d0e35505e52880e5f37a11d1ba6e15 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 1 Aug 2022 06:40:20 +0000
Subject: [PATCH 156/278] dumb

---
 main.py                    | 2 +-
 static/js/pages/profile.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/main.py b/main.py
index 4cf95326..e61e3448 100755
--- a/main.py
+++ b/main.py
@@ -25,7 +25,7 @@
 
 app = Quart(__name__)
 
-version = Version(1, 3, 1)
+version = Version(1, 3, 2)
 
 # used to secure session data.
 # we recommend using a long randomly generated ascii string.
diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index e3fc5f4e..6bbfc4a1 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -91,8 +91,8 @@ new Vue({
                 toShow.forEach(el => el.classList.add('show'))
                 this.data.scores[`${sort}`].load = false
             } else {
+                this.data.scores[`${sort}`].load = false
                 toShow.forEach((el, index) => {
-                    this.data.scores[`${sort}`].load = false
                     setTimeout(() => {
                         el.classList.add('show')
                     }, index * 30)

From ace6298cc8fc4d427b339d059637e7c528cc8ca9 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 1 Aug 2022 08:45:59 +0000
Subject: [PATCH 157/278] ts-check code

---
 blueprints/frontend.py            |  7 +--
 main.py                           |  2 +-
 package.json                      |  1 +
 static/js/main.js                 | 77 +++++++++++++++++++++----------
 templates/admin/restrictions.html |  6 +--
 templates/admin/users.html        |  4 +-
 templates/components/navbar.html  |  8 ++--
 7 files changed, 68 insertions(+), 37 deletions(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index b593deff..7fe79b2e 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -668,10 +668,11 @@ async def get_profile_banner(user_id: int):
 
     return b'{"status":404}'
 
-@frontend.route('/language/<lang>')
-async def set_language(lang: str):
+@frontend.route('/language/<lang>/<path:path>')
+@frontend.route('/language/<lang>', defaults = {'path' : 'home'})
+async def set_language(lang: str, path: str):
     session['lang'] = lang
-    return redirect('/home')
+    return redirect('/' + path)
 
 
 @frontend.route('/backgrounds/<user_id>')
diff --git a/main.py b/main.py
index e61e3448..3306a997 100755
--- a/main.py
+++ b/main.py
@@ -25,7 +25,7 @@
 
 app = Quart(__name__)
 
-version = Version(1, 3, 2)
+version = Version(1, 3, 3)
 
 # used to secure session data.
 # we recommend using a long randomly generated ascii string.
diff --git a/package.json b/package.json
index 2477f3e4..d5784a2f 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
   },
   "homepage": "https://github.com/ppy-sb/guweb#readme",
   "devDependencies": {
+    "@types/jquery": "^3.5.14",
     "@types/node": "^18.6.2",
     "clui": "^0.3.6",
     "glob": "^8.0.3",
diff --git a/static/js/main.js b/static/js/main.js
index 05af04e8..24430b11 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -1,6 +1,8 @@
+// @ts-check
 // sticky header
 $(window).scroll(() => {
     var header = document.getElementById("navbar");
+    if (!header) return
     var sticky = header.offsetTop;
 
     if (window.pageYOffset > sticky) {
@@ -12,65 +14,92 @@ $(window).scroll(() => {
 
 //toggle navbar for mobile
 function togglenavbar() {
-    document.getElementById('navbar').classList.toggle("is-active");
-    document.getElementById('navbar-burger').classList.toggle("is-active");
+    const navbar = document.getElementById('navbar')
+    navbar && navbar.classList.toggle("is-active");
+    const burger = document.getElementById('navbar-burger')
+    burger && burger.classList.toggle("is-active");
 }
 
-function search() {
-    const value = document.getElementById('u-search').value
-    document.getElementById('u-search-content').innerHTML = "";
-    $.get('//osu.' + the_domain + '/search?q=' + value, function(data, status) {
+function setStyle(el, obj) {
+    Object.entries(obj).forEach(([k, v]) => {
+        el.style[k] = v
+    })
+}
+
+function searchUser() {
+    const search = document.getElementById('u-search')
+    if (!search) return
+    const value = search.value
+    const content = document.getElementById('u-search-content')
+    content && (content.innerHTML = "");
+    $.get('//osu.' + the_domain + '/search?q=' + value, function (data, status) {
         if (data != '{}') {
-            document.getElementById('u-search-content').style = ''
-            $.each(data, function(e, n){
-                var result = ({
+            content && content.removeAttribute('style')
+            $.each(data, function (e, n) {
+                const result = ({
                     title: n.name,
                     url: "/u/" + n.id,
                     image: '//a.' + the_domain + '/' + n.id
                 })
-                var root = document.createElement('a')
+                const root = document.createElement('a')
                 root.href = result.url
                 root.className = 'navbar-item'
-                var image = document.createElement('img')
+                const image = document.createElement('img')
                 image.src = result.image
-                image.style = 'max-height: 3rem; width: 3rem; background-size: cover;'
+                setStyle(image, {
+                    width: '3rem',
+                    maxHeight: '3rem',
+                    backgroundSize: 'cover',
+                    borderRadius: '0.5em'
+                })
                 root.appendChild(image)
-                var textSpan = document.createElement('span')
-                textSpan.style = 'margin-left:5px; font-weight: 700;font-size: 1.2em;color: rgba(255, 255, 255, 0.9);'
+                const textSpan = document.createElement('span')
+                setStyle(textSpan, {
+                    marginLeft: '5px',
+                    fontWeight: 700,
+                    fontSize: '1.2em',
+                    color: 'rgba(255,255,255,0.9)'
+                })
                 textSpan.innerText = result.title
                 root.appendChild(textSpan)
-                document.getElementById('u-search-content').appendChild(root)
+                content && content.appendChild(root)
             })
         } else {
-            document.getElementById('u-search-content').style = 'display: none;'
+            content && setStyle(content, {
+                display: 'none'
+            })
         }
     })
 }
 
 function admin_search() {
-    var search = document.getElementById('search-bar').value
-    window.location.href='/admin/users?search=' + search
+    const search = document.getElementById('search-bar')
+    if (!search) return
+    window.location.href = '/admin/users?search=' + search.value
 }
 
 function map_admin_search(name) {
-    var search = document.getElementById('search-bar').value
-    window.location.href='/admin/beatmaps/search?' + name + '=' + search
+    const search = document.getElementById('search-bar')
+    if (!search) return
+    window.location.href = '/admin/beatmaps/search?' + name + '=' + search.value
 }
 
 function map_admin_force_update(sid) {
     var bar = document.getElementById('progress_bar')
     var elements = document.getElementsByClassName('operate-button');
-    bar.style=""
+    bar && bar.removeAttribute('style')
     Array.prototype.forEach.call(elements, function (element) {
         element.classList.add('is-disabled')
     });
-    $.get('//api.' + the_domain + '/update_beatmapsets?api_key=' + api_key + '&sid=' + sid, function(data, status) {
-        bar.style="display: none;"
+    $.get('//api.' + the_domain + '/update_beatmapsets?api_key=' + api_key + '&sid=' + sid, function (data, status) {
+        bar && setStyle(bar, {
+            display: 'none'
+        })
         Array.prototype.forEach.call(elements, function (element) {
             element.classList.remove('is-disabled')
         });
         if (status == 'success') {
-            window.location.href='/admin/beatmaps/search?sid=' + data['sid']
+            window.location.href = '/admin/beatmaps/search?sid=' + data['sid']
         }
     })
 }
\ No newline at end of file
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index 93b4f02d..0052dbaf 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -47,8 +47,8 @@ <h2 class="section-title">Restrictions</h2>
                         <tr>
                             <td class="has-text-right">{{ i.id }}</td>
                             <td class="td-truncate text-nowrap">
-                                <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
-                                <a href="/u/{{ i.id }}">{{ i.name }}</a>
+                                <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">
+                                <a class='ml-2' href="/u/{{ i.id }}">{{ i.name }}</a>
                             </td>
                             <td>
                                 {% if i.msg %}{{ i.msg }}
@@ -62,7 +62,7 @@ <h2 class="section-title">Restrictions</h2>
                             </td>
                             <td>
                                 <a class="btn text-nowrap" href="/admin/users/edit/{{ i.id }}">
-                                    <i class="far fa-edit" aria-hidden="true"></i>⠀Edit
+                                    <i class="far fa-edit" aria-hidden="true"></i><div class="ml-2">Edit</div>
                                 </a>
                             </td>
                         </tr>
diff --git a/templates/admin/users.html b/templates/admin/users.html
index 58a3e167..f144ad18 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -60,8 +60,8 @@ <h2 class="section-title">Users</h2>
                     <td class="has-text-right">{{ i.id }}</td>
                     <td class="td-truncate text-nowrap">
                         <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag"
-                            style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">⠀
-                        <a href="/u/{{ i.id }}">{{ i.name }}</a>
+                            style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">
+                        <a class='ml-2' href="/u/{{ i.id }}">{{ i.name }}</a>
                     </td>
                     <td class="has-text-centered">{{ decode_priv(i.priv) }}</td>
                     <td class="has-text-centered">
diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index 7aa0d6ea..a184f8cc 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -45,7 +45,7 @@
         <div class="navbar-end">
             <div class="navbar-item has-dropdown is-hoverable" style="align-items: center;">
                 <div class="navbar-search">
-                    <input autocomplete="off" type="text" placeholder="Looking for someone?" id="u-search" oninput="search()">
+                    <input autocomplete="off" type="text" placeholder="Looking for someone?" id="u-search" oninput="searchUser()">
                 </div>
                 <div id="u-search-content" class="navbar-dropdown" style="display: none;">
                 </div>
@@ -53,15 +53,15 @@
             <div class="navbar-item has-dropdown is-hoverable">
                 <i style="display: flex;" class="fa fa-globe navbar-link"></i>
                 <div class="navbar-dropdown">
-                    <a class="navbar-item" href="/language/zh_CN">
+                    <a class="navbar-item" href="/language/zh_CN{{ request.path }}">
                         <img style="size: 20px; margin-right: 5px;" src="/static/images/flags/CN.png">
                         简体中文
                     </a>
-                    <a class="navbar-item" href="/language/en_US">
+                    <a class="navbar-item" href="/language/en_US{{ request.path }}">
                         <img style="size: 20px; margin-right: 5px;" src="/static/images/flags/US.png">
                         English - US
                     </a>
-                    <a class="navbar-item" href="/language/en_GB">
+                    <a class="navbar-item" href="/language/en_GB{{ request.path }}">
                         <img style="size: 20px; margin-right: 5px;" src="/static/images/flags/GB.png">
                         English - Global
                     </a>

From 77d57e7497b389156fffe3fb90316b97a538e0c7 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 1 Aug 2022 09:38:28 +0000
Subject: [PATCH 158/278] scope control, code check, error return

---
 static/js/_runtime-check.js        |  7 ++++++
 static/js/main.js                  | 14 ++++++++---
 static/js/pages/admin/dashboard.js |  7 +++++-
 static/js/pages/leaderboard.js     | 35 +++++++++++++++-----------
 static/js/pages/profile.js         | 23 ++++++++++-------
 templates/admin/base.html          | 23 +++++++++--------
 templates/admin/beatmaps.html      |  2 +-
 templates/admin/home.html          |  2 +-
 templates/base.html                |  2 ++
 templates/components/navbar.html   |  2 +-
 templates/leaderboard.html         | 40 +++++++++++++++---------------
 templates/profile.html             |  8 +++---
 12 files changed, 99 insertions(+), 66 deletions(-)
 create mode 100644 static/js/_runtime-check.js

diff --git a/static/js/_runtime-check.js b/static/js/_runtime-check.js
new file mode 100644
index 00000000..10d5f3c1
--- /dev/null
+++ b/static/js/_runtime-check.js
@@ -0,0 +1,7 @@
+// runtime check
+function _testGlobals({ exists = [] } = {}) {
+  const _scope = globalThis || window
+  const result = exists.every(item => _scope[item] !== undefined)
+
+  if (!result) throw new Error('runtime check failed: ')
+}
\ No newline at end of file
diff --git a/static/js/main.js b/static/js/main.js
index 24430b11..ec78bf33 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -27,19 +27,22 @@ function setStyle(el, obj) {
 }
 
 function searchUser() {
+    _testGlobals(
+        { exists: ['domain'] }
+    )
     const search = document.getElementById('u-search')
     if (!search) return
     const value = search.value
     const content = document.getElementById('u-search-content')
     content && (content.innerHTML = "");
-    $.get('//osu.' + the_domain + '/search?q=' + value, function (data, status) {
+    $.get('//osu.' + window.domain + '/search?q=' + value, function (data, status) {
         if (data != '{}') {
             content && content.removeAttribute('style')
             $.each(data, function (e, n) {
                 const result = ({
                     title: n.name,
                     url: "/u/" + n.id,
-                    image: '//a.' + the_domain + '/' + n.id
+                    image: '//a.' + window.domain + '/' + n.id
                 })
                 const root = document.createElement('a')
                 root.href = result.url
@@ -85,13 +88,16 @@ function map_admin_search(name) {
 }
 
 function map_admin_force_update(sid) {
+    _testGlobals(
+        { exists: ['domain', 'api_key'] }
+    )
     var bar = document.getElementById('progress_bar')
     var elements = document.getElementsByClassName('operate-button');
     bar && bar.removeAttribute('style')
     Array.prototype.forEach.call(elements, function (element) {
         element.classList.add('is-disabled')
     });
-    $.get('//api.' + the_domain + '/update_beatmapsets?api_key=' + api_key + '&sid=' + sid, function (data, status) {
+    $.get('//api.' + window.domain + '/update_beatmapsets?api_key=' + window.api_key + '&sid=' + sid, function (data, status) {
         bar && setStyle(bar, {
             display: 'none'
         })
@@ -102,4 +108,4 @@ function map_admin_force_update(sid) {
             window.location.href = '/admin/beatmaps/search?sid=' + data['sid']
         }
     })
-}
\ No newline at end of file
+}
diff --git a/static/js/pages/admin/dashboard.js b/static/js/pages/admin/dashboard.js
index 1a23e3dd..9862a631 100644
--- a/static/js/pages/admin/dashboard.js
+++ b/static/js/pages/admin/dashboard.js
@@ -1,3 +1,8 @@
+// @ts-check
+_testGlobals(
+    { exists: ['domain'] }
+)
+// @ts-ignore
 new Vue({
     el: "#dashboard",
     delimiters: ["<%", "%>"],
@@ -13,7 +18,7 @@ new Vue({
     methods: {
         GetOnlineUsers() {
             var vm = this;
-            vm.$axios.get(`//api.${domain}/get_player_count`)
+            vm.$axios.get(`//api.${window.domain}/get_player_count`)
                 .then(function (response) {
                     vm.online_users = response.data.counts.online;
                 });
diff --git a/static/js/pages/leaderboard.js b/static/js/pages/leaderboard.js
index ebc5dcfe..339682d6 100644
--- a/static/js/pages/leaderboard.js
+++ b/static/js/pages/leaderboard.js
@@ -1,20 +1,23 @@
+// @ts-check
+_testGlobals({ exists: ['flags', 'mode', 'mods', 'sort', 'domain'] })
+// @ts-ignore
 new Vue({
     el: "#app",
     delimiters: ["<%", "%>"],
     data() {
         return {
             flags: window.flags,
-            boards : {},
-            mode : 'std',
-            mods : 'vn',
-            sort : 'pp',
-            load : false,
-            no_player : false, // soon
+            boards: {},
+            mode: window.mode || 'std',
+            mods: window.mods || 'vn',
+            sort: window.sort || 'pp',
+            load: false,
+            no_player: false, // soon ^TM
         };
     },
     created() {
-        this.LoadData(mode, mods, sort);
-        this.LoadLeaderboard(sort, mode, mods);
+        this.LoadData(window.mode, window.mods, window.sort);
+        this.LoadLeaderboard(this.sort, this.mode, this.mods);
     },
     methods: {
         secondsToDhm(seconds) {
@@ -25,9 +28,9 @@ new Vue({
             return dDisplay + hDisplay + mDisplay;
         },
         LoadData(mode, mods, sort) {
-            this.$set(this, 'mode', mode);
-            this.$set(this, 'mods', mods);
-            this.$set(this, 'sort', sort);
+            this.mode = mode
+            this.mods = mods
+            this.sort = sort
         },
         LoadLeaderboard(sort, mode, mods) {
             if (window.event)
@@ -38,10 +41,12 @@ new Vue({
             this.$set(this, 'mods', mods);
             this.$set(this, 'sort', sort);
             this.$set(this, 'load', true);
-            this.$axios.get(`//api.${domain}/get_leaderboard`, { params: {
-                mode: this.StrtoGulagInt(),
-                sort: this.sort
-            }}).then(res => {
+            this.$axios.get(`//api.${window.domain}/get_leaderboard`, {
+                params: {
+                    mode: this.StrtoGulagInt(),
+                    sort: this.sort
+                }
+            }).then(res => {
                 this.boards = res.data.leaderboard;
                 this.$set(this, 'load', false);
             });
diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 6bbfc4a1..2005c04e 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -1,3 +1,8 @@
+// @ts-check
+_testGlobals(
+    { exists: ['mode', 'mods', 'userid', 'domain'] }
+)
+// @ts-ignore
 new Vue({
     el: "#app",
     delimiters: ["<%", "%>"],
@@ -39,10 +44,10 @@ new Vue({
                 },
                 status: {}
             },
-            mode: mode,
-            mods: mods,
+            mode: window.mode,
+            mods: window.mods,
             modegulag: 0,
-            userid: userid
+            userid: window.userid
         };
     },
     created() {
@@ -60,7 +65,7 @@ new Vue({
         },
         LoadProfileData() {
             this.$set(this.data.stats, 'load', true);
-            this.$axios.get(`//api.${domain}/get_player_info`, {
+            this.$axios.get(`//api.${window.domain}/get_player_info`, {
                 params: {
                     id: this.userid,
                     scope: 'all'
@@ -73,7 +78,7 @@ new Vue({
         },
         async LoadScores(sort, { animation = true } = {}) {
             this.$set(this.data.scores[`${sort}`], 'load', true);
-            await this.$axios.get(`//api.${domain}/get_player_scores`, {
+            await this.$axios.get(`//api.${window.domain}/get_player_scores`, {
                 params: {
                     id: this.userid,
                     mode: this.StrtoGulagInt(),
@@ -101,7 +106,7 @@ new Vue({
         },
         async LoadMostBeatmaps({ animation = true } = {}) {
             this.$set(this.data.maps.most, 'load', true);
-            await this.$axios.get(`//api.${domain}/get_player_most_played`, {
+            await this.$axios.get(`//api.${window.domain}/get_player_most_played`, {
                 params: {
                     id: this.userid,
                     mode: this.StrtoGulagInt(),
@@ -127,7 +132,7 @@ new Vue({
             }
         },
         LoadUserStatus() {
-            this.$axios.get(`//api.${domain}/get_player_status`, {
+            this.$axios.get(`//api.${window.domain}/get_player_status`, {
                 params: {
                     id: this.userid
                 }
@@ -136,10 +141,10 @@ new Vue({
                     this.$set(this.data, 'status', res.data.player_status)
                 })
                 .catch(function (error) {
-                    clearTimeout(loop);
+                    clearTimeout(window.loop);
                     console.log(error);
                 });
-            loop = setTimeout(this.LoadUserStatus, 5000);
+            window.loop = setTimeout(this.LoadUserStatus, 5000);
         },
         ChangeModeMods(mode, mods) {
             if (window.event)
diff --git a/templates/admin/base.html b/templates/admin/base.html
index b5162b4f..19a4d548 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -1,6 +1,8 @@
 <html>
 
 <head>
+  <!-- injection check -->
+  <script src="/static/js/_runtime-check.js"></script>
   <!-- title -->
   <title>{{ appName() }} - {{ t('admin.base.admin') }} - {% block title %}{% endblock %}</title>
 
@@ -19,7 +21,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <!-- jquery -->
-  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
+  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>=
 
   <!-- bulma -->
   <link rel="stylesheet" href="/static/css/bulma.css?v={{ appVersion() }} " />
@@ -45,16 +47,17 @@
       <div class="colmun">
         <div class="sidebar">
           <div id="style-3" class="sidebar-wrapper">
-            <div class="logo"><a class="simple-text logo-normal">{{ t('admin.base.admin-panel', appName = appName()) }}</a></div>
+            <div class="logo"><a class="simple-text logo-normal">{{ t('admin.base.admin-panel', appName = appName())
+                }}</a></div>
             <ul class="nav">
-              <li class="nav-item"><a class="nav-link" href="/admin/dashboard"><span class="icon"><i class="fa fa-home"></i></span> <span
-                    class="name">{{ t('admin.base.dashboard') }}</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/users"><span class="icon"><i class="fa fa-user"></i></span> <span
-                class="name">Users</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/restrictions"><span class="icon"><i class="fa fa-ban"></i></span> <span
-                class="name">Restrictions</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/beatmaps"><span class="icon"><i class="fa fa-map"></i></span> <span
-                class="name">Beatmaps</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/dashboard"><span class="icon"><i
+                      class="fa fa-home"></i></span> <span class="name">{{ t('admin.base.dashboard') }}</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/users"><span class="icon"><i
+                      class="fa fa-user"></i></span> <span class="name">Users</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/restrictions"><span class="icon"><i
+                      class="fa fa-ban"></i></span> <span class="name">Restrictions</span></a></li>
+              <li class="nav-item"><a class="nav-link" href="/admin/beatmaps"><span class="icon"><i
+                      class="fa fa-map"></i></span> <span class="name">Beatmaps</span></a></li>
             </ul>
           </div>
         </div>
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 2c513ea6..bc2a04de 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -45,7 +45,7 @@
 
 {% block content %}
 <script>
-    var api_key = '{{ session.user_data['api_key'] }}'
+    window.api_key = '{{ session.user_data['api_key'] }}'
 </script>
 <progress id="progress_bar" class="progress is-small is-primary" max="100" style="display: none;"></progress>
 <div class="columns is-marginless">
diff --git a/templates/admin/home.html b/templates/admin/home.html
index ded7fd02..52b13777 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -5,7 +5,7 @@
 <script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
 <script>
-    var domain = "{{ domain() }}";
+    window.domain = "{{ domain() }}";
 </script>
 <style>
     .card .title, .card .stat {
diff --git a/templates/base.html b/templates/base.html
index 723acd35..68b2c254 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -1,6 +1,8 @@
 <html>
 
 <head>
+  <!-- injection check -->
+  <script src="/static/js/_runtime-check.js"></script>
   <!-- Title -->
   <title>{{ appName() }} - {% block title %}{% endblock %}</title>
 
diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index a184f8cc..5973b17e 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -1,5 +1,5 @@
 <script type="text/javascript">
-    var the_domain = '{{ domain() }}'
+    window.domain = '{{ domain() }}'
 </script>
 <nav id="navbar" class="navbar is-primary">
     <div class="navbar-brand">
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index a0a223b3..117395ad 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -6,10 +6,10 @@
 <script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
 
 <script>
-    var mode = "{{ mode }}";
-    var mods = "{{ mods }}";
-    var sort = "{{ sort }}";
-    var domain = "{{ domain() }}";
+    globalThis.mode = "{{ mode }}";
+    globalThis.mods = "{{ mods }}";
+    globalThis.sort = "{{ sort }}";
+    globalThis.domain = "{{ domain() }}";
 </script>
 
 <link rel="stylesheet" href="/static/css/pages/leaderboard.css?v={{ appVersion() }} ">
@@ -19,20 +19,19 @@
 <div id="app" :class="(load ? 'load' : '')">
     <div class="leaderboard-banner main-banner">
         <div class="main-selector">
-            <a class="mode-select" :class="{ 'active': mode === 'std' }"
-            @click="LoadLeaderboard(sort, 'std', mods)">
+            <a class="mode-select" :class="{ 'active': mode === 'std' }" @click="LoadLeaderboard(sort, 'std', mods)">
                 <i class="mode-icon mode-osu"></i><span class="modetext"> {{ t('global.mode.osu') }}</span>
             </a>
             <a class="mode-select" :class="{ 'active': mode === 'taiko', 'disabled': mods === 'ap' }"
-            @click="LoadLeaderboard(sort, 'taiko', mods)">
+                @click="LoadLeaderboard(sort, 'taiko', mods)">
                 <i class="mode-icon mode-taiko"></i><span class="modetext"> {{ t('global.mode.taiko') }}</span>
             </a>
             <a class="mode-select" :class="{ 'active': mode === 'catch', 'disabled': mods === 'ap' }"
-            @click="LoadLeaderboard(sort, 'catch', mods)">
+                @click="LoadLeaderboard(sort, 'catch', mods)">
                 <i class="mode-icon mode-catch"></i><span class="modetext"> {{ t('global.mode.catch') }}</span>
             </a>
             <a class="mode-select" :class="{ 'active': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
-            @click="LoadLeaderboard(sort, 'mania', mods)">
+                @click="LoadLeaderboard(sort, 'mania', mods)">
                 <i class="mode-icon mode-mania"></i><span class="modetext"> {{ t('global.mode.mania') }}</span>
             </a>
         </div>
@@ -40,23 +39,24 @@
         <div class="selector">
             <div class="left">
                 <a class="simple-banner-switch" :class="{ 'active': sort === 'pp' }"
-                @click="LoadLeaderboard('pp', mode, mods, '')">{{ t('global.pp').upper() }}</a>
+                    @click="LoadLeaderboard('pp', mode, mods, '')">{{ t('global.pp').upper() }}</a>
                 <a class="simple-banner-switch" :class="{ 'active': sort === 'rscore' }"
-                @click="LoadLeaderboard('rscore', mode, mods, '')">{{ t('global.score') }}</a>
+                    @click="LoadLeaderboard('rscore', mode, mods, '')">{{ t('global.score') }}</a>
                 <a class="simple-banner-switch" :class="{ 'active': sort === 'acc' }"
-                @click="LoadLeaderboard('acc', mode, mods, '')">{{ t('global.acc') }}</a>
+                    @click="LoadLeaderboard('acc', mode, mods, '')">{{ t('global.acc') }}</a>
                 <a class="simple-banner-switch" :class="{ 'active': sort === 'plays' }"
-                @click="LoadLeaderboard('plays', mode, mods, '')">{{ t('global.playcount') }}</a>
+                    @click="LoadLeaderboard('plays', mode, mods, '')">{{ t('global.playcount') }}</a>
                 <a class="simple-banner-switch" :class="{ 'active': sort === 'playtime' }"
-                @click="LoadLeaderboard('playtime', mode, mods, '')">{{ t('global.playtime') }}</a>
+                    @click="LoadLeaderboard('playtime', mode, mods, '')">{{ t('global.playtime') }}</a>
             </div>
             <div class="right">
                 <a class="simple-banner-switch" :class=" { 'active': mods === 'vn' }"
-                @click="LoadLeaderboard(sort, mode, 'vn')">{{ t('global.mode.vanilla') }}</a>
+                    @click="LoadLeaderboard(sort, mode, 'vn')">{{ t('global.mode.vanilla') }}</a>
                 <a class="simple-banner-switch" :class=" { 'active': mods === 'rx', 'disabled': mode === 'mania' }"
-                @click="LoadLeaderboard(sort, mode, 'rx')">{{ t('global.mode.relax') }}</a>
-                <a class="simple-banner-switch" :class=" { 'active': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
-                @click="LoadLeaderboard(sort, mode, 'ap')">{{ t('global.mode.autopilot') }}</a>
+                    @click="LoadLeaderboard(sort, mode, 'rx')">{{ t('global.mode.relax') }}</a>
+                <a class="simple-banner-switch"
+                    :class=" { 'active': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
+                    @click="LoadLeaderboard(sort, mode, 'ap')">{{ t('global.mode.autopilot') }}</a>
             </div>
         </div>
     </div>
@@ -124,5 +124,5 @@
 </div>
 
 <script src="/static/js/assets/vue-flags.js?v={{ appVersion() }} "></script>
-<script src="/static/js/pages/leaderboard.js?v=1.0"></script>
-{% endblock %}
+<script src="/static/js/pages/leaderboard.js?v={{ appVersion() }}"></script>
+{% endblock %}
\ No newline at end of file
diff --git a/templates/profile.html b/templates/profile.html
index 8047662a..5bf7240d 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -146,10 +146,10 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
 <link rel="stylesheet" href="/static/css/pages/profile.css?v={{ appVersion() }} ">
 
 <script>
-    var userid = Number("{{ user['id'] }}"); //For text editor doesn't dizzy lmao
-    var mode = '{{ mode }}';
-    var mods = '{{ mods }}';
-    var domain = "{{ domain() }}";
+    window.userid = Number("{{ user['id'] }}"); //For text editor doesn't dizzy lmao
+    window.mode = '{{ mode }}';
+    window.mods = '{{ mods }}';
+    window.domain = "{{ domain() }}";
 </script>
 <style>
     .rounded-sm {

From d44de4ba5f15ee91136b20acdc242b6fc1446f9f Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 1 Aug 2022 09:46:19 +0000
Subject: [PATCH 159/278] nowrap

---
 templates/admin/restrictions.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index 0052dbaf..26db2a3d 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -62,7 +62,7 @@ <h2 class="section-title">Restrictions</h2>
                             </td>
                             <td>
                                 <a class="btn text-nowrap" href="/admin/users/edit/{{ i.id }}">
-                                    <i class="far fa-edit" aria-hidden="true"></i><div class="ml-2">Edit</div>
+                                    <i class="far fa-edit" aria-hidden="true"></i> Edit
                                 </a>
                             </td>
                         </tr>

From 1fcac9aca6f2117d5b550b651ac6e6fe4fdeb7fc Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Mon, 1 Aug 2022 10:01:08 +0000
Subject: [PATCH 160/278] forgot page(not finished)

---
 blueprints/frontend.py |  4 +++
 templates/forgot.html  | 66 ++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 70 insertions(+)
 create mode 100644 templates/forgot.html

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 7fe79b2e..148d3b47 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -252,6 +252,10 @@ async def settings_aboutme_post():
 async def settings_password():
     return await render_template('settings/password.html')
 
+@frontend.route('/forgot')
+async def reset_password():
+    return await render_template('forgot.html')
+
 @frontend.route('/settings/password', methods=["POST"])
 @login_required
 async def settings_password_post():
diff --git a/templates/forgot.html b/templates/forgot.html
new file mode 100644
index 00000000..42fce30a
--- /dev/null
+++ b/templates/forgot.html
@@ -0,0 +1,66 @@
+{% extends "base.html" %}
+{% block title %} Reset Password {% endblock %}
+
+{% block header %}
+<link rel="stylesheet" href="/static/css/pages/auth.css?v={{ appVersion() }} ">
+{% endblock %}
+
+{% block content %}
+
+<div class="main-block is-marginless is-paddingless is-auth">
+  <div class="columns is-reset is-weeb">
+    <div class="column title-block">
+      <h1 class="title" id="regtitle">Reset Password</h1>
+    </div>
+  </div>
+  <div class="columns is-reset flex-lcenter is-block">
+    <div class="box">
+     <div class="content">
+    <form action="/reset_password" method="post" class="form-content">
+      <div class="field">
+        <label for="user" class="label">Username</label>
+        <div class="control has-icons-left">
+          <input id="user" type="text" name="username" placeholder="Username" class="input" autocomplete="off" required>
+          <span class="icon is-small is-left">
+            <i class="fa fa-user"></i>
+          </span>
+        </div>
+      </div>
+      <div class="field">
+        <label for="email" class="label">Email</label>
+        <div class="control has-icons-left">
+          <input id="email" type="text" name="email" placeholder="Email" class="input" autocomplete="off" required>
+          <span class="icon is-small is-left">
+            <i class="fa fa-envelope"></i>
+          </span>
+        </div>
+      </div>
+      <div class="field">
+        <label for="code" class="label">Verify Code</label>
+        <div class="control has-icons-left">
+          <input id="code" type="text" name="code" placeholder="Verify Code" class="input" autocomplete="off" required>
+          <span class="icon is-small is-left">
+            <i class="fa fa-lock"></i>
+          </span>
+        </div>
+      </div>
+      <div class="mt-5"></div>
+      <div class="field flex-vcenter">
+        <div class="buttons">
+          <button type="submit" class="button is-primary">
+              Reset
+          </button>
+        </div>
+      </div>
+    </form></div>
+    </div>
+  </div>
+</div>
+
+{% if flash %}
+<div class="paper-snackbar is-{{ status }}" style="opacity: 1;">
+  {{ flash }}
+</div>
+{% endif %}
+
+{% endblock %}

From 523ac11f47389617c02ebed23af80ea0b6219633 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Mon, 1 Aug 2022 10:05:00 +0000
Subject: [PATCH 161/278] hide badge

---
 templates/profile.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/templates/profile.html b/templates/profile.html
index 5bf7240d..81eb0ccf 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -227,7 +227,7 @@ <h1 class="title">
     <div class="second-block">
         <div class="columns is-marginless two-sides">
             <div class="column is-one-third" v-cloak>
-                <div class="header">
+                <!-- <div class="header">
                     <div class="title">
                         <i class="fas fa-user-friends"></i> Badge
                     </div>
@@ -240,7 +240,7 @@ <h1 class="title">
                             </tr>
                         </tbody>
                     </table>
-                </div>
+                </div> -->
                 <div class="header" v-if='data.stats.out[modegulag].rank != 0'>
                     <div class="title">
                         <i class="fas fa-user-friends"></i> Rank

From 8200bab5d52b6d48f0da15c03bb67a632e271f8e Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Mon, 1 Aug 2022 12:10:29 +0000
Subject: [PATCH 162/278] remove useless requirements

---
 ext/requirements.txt | 2 --
 1 file changed, 2 deletions(-)

diff --git a/ext/requirements.txt b/ext/requirements.txt
index c6c94b00..2402672d 100644
--- a/ext/requirements.txt
+++ b/ext/requirements.txt
@@ -6,8 +6,6 @@ aiohttp
 mysql-connector
 orjson
 timeago
-markdown2
-Pillow
 
 python-i18n[YAML]
 requires

From 71fa325cd70293e73237b6a0a5305b2ba3154a2a Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Mon, 1 Aug 2022 12:12:38 +0000
Subject: [PATCH 163/278] revert

---
 ext/requirements.txt | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/ext/requirements.txt b/ext/requirements.txt
index 2402672d..c6c94b00 100644
--- a/ext/requirements.txt
+++ b/ext/requirements.txt
@@ -6,6 +6,8 @@ aiohttp
 mysql-connector
 orjson
 timeago
+markdown2
+Pillow
 
 python-i18n[YAML]
 requires

From 4daae498ce62b59b6033a2a91b6122c1737ff799 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Wed, 3 Aug 2022 17:42:01 +0000
Subject: [PATCH 164/278] I hate sql very much

---
 blueprints/frontend.py |  9 ++++++---
 objects/varka.py       | 27 +++++++++++++++++++++++----
 2 files changed, 29 insertions(+), 7 deletions(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 148d3b47..d81f5967 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -624,9 +624,12 @@ async def search_user():
     res = await glob.db.fetchall(
         'SELECT id, name '
         'FROM `users` '
-        'WHERE priv >= 3 AND `name` LIKE %s '
-        'LIMIT 5',
-        [q + '%%']
+        'WHERE priv >= 3 '
+        'AND ('
+        '   `name` LIKE %s '
+        '   OR CONVERT(`id`, char) LIKE %s '
+        ') LIMIT 5',
+        [q + '%%', q + '%%']
     )
 
     if (len(res) == 0):
diff --git a/objects/varka.py b/objects/varka.py
index e28fb01d..c8ff32f8 100644
--- a/objects/varka.py
+++ b/objects/varka.py
@@ -4,14 +4,33 @@
 
 async def get_users(limit:int=100, search:str=None):
     """Returns the all of a users."""
-    query = ['SELECT * FROM users u']
+    query = """
+        select 
+            u.*,
+            l.ip,
+            l.osu_ver,
+            l.osu_stream,
+            l.datetime as last_login
+        from users u
+        left join (
+            select * from ingame_logins i1
+            inner join (
+                select max(id) as max_id
+                from ingame_logins
+                group by userid
+            ) as i2
+            ON i1.id = i2.max_id
+        ) as l
+        on u.id = l.userid
+    """.replace('  ', ' ').splitlines()
     args = []
-    query.append('left join (select userid, ANY_VALUE(ip) as ip, ANY_VALUE(osu_stream) as osu_stream, max(datetime) as last_login from ingame_logins group by userid) as l on u.id = l.userid')
 
     if search:
-        query.append("WHERE `name` LIKE %s")
+        query.append("WHERE u.`name` LIKE %s")
         args.append(f'{search}%')
-        query.append("OR `email` LIKE %s")
+        query.append("OR u.`email` LIKE %s")
+        args.append(f'{search}%')
+        query.append("OR CONVERT(u.`id`, char) LIKE %s")
         args.append(f'{search}%')
 
     query.append(f'ORDER BY u.id DESC LIMIT %s')

From 73f7201aa17bed61ab5763e38f8243cc8827659c Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Wed, 3 Aug 2022 17:46:56 +0000
Subject: [PATCH 165/278] id search

---
 objects/varka.py | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/objects/varka.py b/objects/varka.py
index c8ff32f8..8f12ee98 100644
--- a/objects/varka.py
+++ b/objects/varka.py
@@ -31,9 +31,9 @@ async def get_users(limit:int=100, search:str=None):
         query.append("OR u.`email` LIKE %s")
         args.append(f'{search}%')
         query.append("OR CONVERT(u.`id`, char) LIKE %s")
-        args.append(f'{search}%')
+        args.append(f'{search}%%')
 
-    query.append(f'ORDER BY u.id DESC LIMIT %s')
+    query.append(f'ORDER BY l.`datetime` DESC LIMIT %s')
     args.append(limit)
     
     

From 846e63745a21e53b3c397e1f35ec8f746f098663 Mon Sep 17 00:00:00 2001
From: DAYGoodTime <ken570015@163.com>
Date: Thu, 4 Aug 2022 04:05:30 +0000
Subject: [PATCH 166/278] complete admin plane translation

---
 locales/admin/base/en-GB.yml         |  3 ++
 locales/admin/base/en-US.yml         |  3 ++
 locales/admin/base/zh-CN.yml         |  3 ++
 locales/admin/beatmaps/en-GB.yml     | 21 +++++++++++
 locales/admin/beatmaps/en-US.yml     | 21 +++++++++++
 locales/admin/beatmaps/zh-CN.yml     | 21 +++++++++++
 locales/admin/restrictions/en-GB.yml |  4 ++
 locales/admin/restrictions/en-US.yml |  4 ++
 locales/admin/restrictions/zh-CN.yml |  4 ++
 locales/admin/users/en-GB.yml        | 19 ++++++++++
 locales/admin/users/en-US.yml        | 19 ++++++++++
 locales/admin/users/zh-CN.yml        | 19 ++++++++++
 locales/navbar/en-GB.yml             |  1 +
 locales/navbar/en-US.yml             |  1 +
 locales/navbar/zh-CN.yml             |  3 +-
 templates/admin/base.html            |  7 ++--
 templates/admin/beatmaps.html        | 56 ++++++++++++++--------------
 templates/admin/restrictions.html    | 16 ++++----
 templates/admin/users.html           | 26 ++++++-------
 templates/admin/users_edit.html      | 18 ++++-----
 templates/components/navbar.html     |  2 +-
 21 files changed, 208 insertions(+), 63 deletions(-)
 create mode 100644 locales/admin/beatmaps/en-GB.yml
 create mode 100644 locales/admin/beatmaps/en-US.yml
 create mode 100644 locales/admin/beatmaps/zh-CN.yml
 create mode 100644 locales/admin/restrictions/en-GB.yml
 create mode 100644 locales/admin/restrictions/en-US.yml
 create mode 100644 locales/admin/restrictions/zh-CN.yml
 create mode 100644 locales/admin/users/en-GB.yml
 create mode 100644 locales/admin/users/en-US.yml
 create mode 100644 locales/admin/users/zh-CN.yml

diff --git a/locales/admin/base/en-GB.yml b/locales/admin/base/en-GB.yml
index cc7229db..5799109e 100644
--- a/locales/admin/base/en-GB.yml
+++ b/locales/admin/base/en-GB.yml
@@ -7,3 +7,6 @@ discord: Discord
 youtube: YouTube
 twitter: Twitter
 instagram: Instagram
+users: Users
+restrictions: Restrictions
+beatmaps: Beatmaps
diff --git a/locales/admin/base/en-US.yml b/locales/admin/base/en-US.yml
index 5fe3f095..bd0fed16 100644
--- a/locales/admin/base/en-US.yml
+++ b/locales/admin/base/en-US.yml
@@ -7,3 +7,6 @@ instagram: Instagram
 github: GitHub
 twitter: Twitter
 youtube: YouTube
+users: Users
+restrictions: Restrictions
+beatmaps: Beatmaps
diff --git a/locales/admin/base/zh-CN.yml b/locales/admin/base/zh-CN.yml
index 835803bf..ffe8baec 100644
--- a/locales/admin/base/zh-CN.yml
+++ b/locales/admin/base/zh-CN.yml
@@ -7,3 +7,6 @@ instagram: Instagram
 github: GitHub
 twitter: 推特
 youtube: YouTube
+users: 用户管理
+restrictions: 封禁管理
+beatmaps: 铺面管理
diff --git a/locales/admin/beatmaps/en-GB.yml b/locales/admin/beatmaps/en-GB.yml
new file mode 100644
index 00000000..0bc3dd31
--- /dev/null
+++ b/locales/admin/beatmaps/en-GB.yml
@@ -0,0 +1,21 @@
+welcome-to-beatmaps-panel: Welcome to beatmaps panel
+total-beatmaps: Total beatmaps
+thats-a-lot-of-maps: That's a lot of maps
+ranked: Ranked
+these-maps-can-gain-many-pp: These maps can gain many pp
+loved: Loved
+we-loved-them-so-much: We loved them so much
+pending: Pending
+they-are-also-good-maps: They are also good maps
+search-by-bid: Search by BID
+search-by-sid: Search by SID
+search-by-name: Search by Name
+beatmap: Beatmap
+cs-keys: CS / Keys
+ar: AR
+hp: HP
+od: OD
+bpm: BPM
+stars: Stars
+status: Status
+edit-status: Edit status
diff --git a/locales/admin/beatmaps/en-US.yml b/locales/admin/beatmaps/en-US.yml
new file mode 100644
index 00000000..0bc3dd31
--- /dev/null
+++ b/locales/admin/beatmaps/en-US.yml
@@ -0,0 +1,21 @@
+welcome-to-beatmaps-panel: Welcome to beatmaps panel
+total-beatmaps: Total beatmaps
+thats-a-lot-of-maps: That's a lot of maps
+ranked: Ranked
+these-maps-can-gain-many-pp: These maps can gain many pp
+loved: Loved
+we-loved-them-so-much: We loved them so much
+pending: Pending
+they-are-also-good-maps: They are also good maps
+search-by-bid: Search by BID
+search-by-sid: Search by SID
+search-by-name: Search by Name
+beatmap: Beatmap
+cs-keys: CS / Keys
+ar: AR
+hp: HP
+od: OD
+bpm: BPM
+stars: Stars
+status: Status
+edit-status: Edit status
diff --git a/locales/admin/beatmaps/zh-CN.yml b/locales/admin/beatmaps/zh-CN.yml
new file mode 100644
index 00000000..517214ab
--- /dev/null
+++ b/locales/admin/beatmaps/zh-CN.yml
@@ -0,0 +1,21 @@
+welcome-to-beatmaps-panel: 欢迎来到铺面管理面板
+total-beatmaps: 铺面总数量
+thats-a-lot-of-maps: 那可真是不少图呀!
+ranked: Ranked
+these-maps-can-gain-many-pp: 这些图能刷到许多pp
+loved: Loved
+we-loved-them-so-much: 我们都"爱"它们
+pending: Pending
+they-are-also-good-maps: 它们仍然是张好图
+search-by-bid: Search by BID
+search-by-sid: Search by SID
+search-by-name: Search by Name
+beatmap: 铺面
+cs-keys: CS / Keys
+ar: AR
+hp: HP
+od: OD
+bpm: BPM
+stars: Stars
+status: 状态
+edit-status: 修改状态
diff --git a/locales/admin/restrictions/en-GB.yml b/locales/admin/restrictions/en-GB.yml
new file mode 100644
index 00000000..d937cc80
--- /dev/null
+++ b/locales/admin/restrictions/en-GB.yml
@@ -0,0 +1,4 @@
+welcome-to-restrictions-panel: Welcome to restrictions panel
+details: Details
+date: Date
+action: Action
diff --git a/locales/admin/restrictions/en-US.yml b/locales/admin/restrictions/en-US.yml
new file mode 100644
index 00000000..d937cc80
--- /dev/null
+++ b/locales/admin/restrictions/en-US.yml
@@ -0,0 +1,4 @@
+welcome-to-restrictions-panel: Welcome to restrictions panel
+details: Details
+date: Date
+action: Action
diff --git a/locales/admin/restrictions/zh-CN.yml b/locales/admin/restrictions/zh-CN.yml
new file mode 100644
index 00000000..221c6e7b
--- /dev/null
+++ b/locales/admin/restrictions/zh-CN.yml
@@ -0,0 +1,4 @@
+welcome-to-restrictions-panel: 欢迎来到封禁管理面板
+details: 详情
+date: 日期
+action: 操作
diff --git a/locales/admin/users/en-GB.yml b/locales/admin/users/en-GB.yml
new file mode 100644
index 00000000..c099b1b0
--- /dev/null
+++ b/locales/admin/users/en-GB.yml
@@ -0,0 +1,19 @@
+welcome-to-users-panel: Welcome to users panel
+search: Search
+id: ID
+flag-or-username: Flag | Username
+privilege: Privilege
+last-login: Last Login
+joined-at: Joined at
+client-channel: Client channel
+email: Email
+ip: IP
+edit: Edit
+edit-info-of: Edit Info of
+username: Username
+country: Country
+legality: Legality
+unrestricted: Unrestricted
+restricted: Restricted
+update: Update
+search-by-username-or-email: Search by username or email
diff --git a/locales/admin/users/en-US.yml b/locales/admin/users/en-US.yml
new file mode 100644
index 00000000..c099b1b0
--- /dev/null
+++ b/locales/admin/users/en-US.yml
@@ -0,0 +1,19 @@
+welcome-to-users-panel: Welcome to users panel
+search: Search
+id: ID
+flag-or-username: Flag | Username
+privilege: Privilege
+last-login: Last Login
+joined-at: Joined at
+client-channel: Client channel
+email: Email
+ip: IP
+edit: Edit
+edit-info-of: Edit Info of
+username: Username
+country: Country
+legality: Legality
+unrestricted: Unrestricted
+restricted: Restricted
+update: Update
+search-by-username-or-email: Search by username or email
diff --git a/locales/admin/users/zh-CN.yml b/locales/admin/users/zh-CN.yml
new file mode 100644
index 00000000..c19223ab
--- /dev/null
+++ b/locales/admin/users/zh-CN.yml
@@ -0,0 +1,19 @@
+welcome-to-users-panel: 欢迎来到用户管理面板
+search: 搜索
+id: ID
+flag-or-username: 地区 | 用户名
+privilege: 权限组
+last-login: 最近登录
+joined-at: 加入于
+client-channel: 客户端频道
+email: 邮箱
+ip: IP
+edit: 修改
+edit-info-of: '修改该用户的信息:'
+username: 用户名
+country: 地区
+legality: 封禁状态
+unrestricted: Unrestricted
+restricted: Restricted
+update: 更新
+search-by-username-or-email: 使用 用户名 或 邮箱 进行搜索
diff --git a/locales/navbar/en-GB.yml b/locales/navbar/en-GB.yml
index 14567547..8b8a2b23 100644
--- a/locales/navbar/en-GB.yml
+++ b/locales/navbar/en-GB.yml
@@ -6,3 +6,4 @@ profile: Profile
 settings: Settings
 logout: Logout
 todo: Todo..
+looking-for-someone: Looking for someone?
diff --git a/locales/navbar/en-US.yml b/locales/navbar/en-US.yml
index 14567547..8b8a2b23 100644
--- a/locales/navbar/en-US.yml
+++ b/locales/navbar/en-US.yml
@@ -6,3 +6,4 @@ profile: Profile
 settings: Settings
 logout: Logout
 todo: Todo..
+looking-for-someone: Looking for someone?
diff --git a/locales/navbar/zh-CN.yml b/locales/navbar/zh-CN.yml
index 929d9e2d..b9e2d215 100644
--- a/locales/navbar/zh-CN.yml
+++ b/locales/navbar/zh-CN.yml
@@ -1,8 +1,9 @@
 home: 主页
 leaderboards: 排行榜
-information: Information
+information: 文档
 admin: 管理员
 profile: 玩家资料
 settings: 设置
 logout: 登出
 todo: 敬请期待
+looking-for-someone: 想要找某个用户?
diff --git a/templates/admin/base.html b/templates/admin/base.html
index 19a4d548..deb59c9a 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -53,11 +53,12 @@
               <li class="nav-item"><a class="nav-link" href="/admin/dashboard"><span class="icon"><i
                       class="fa fa-home"></i></span> <span class="name">{{ t('admin.base.dashboard') }}</span></a></li>
               <li class="nav-item"><a class="nav-link" href="/admin/users"><span class="icon"><i
-                      class="fa fa-user"></i></span> <span class="name">Users</span></a></li>
+                      class="fa fa-user"></i></span> <span class="name">{{ t("admin.base.users") }}</span></a></li>
               <li class="nav-item"><a class="nav-link" href="/admin/restrictions"><span class="icon"><i
-                      class="fa fa-ban"></i></span> <span class="name">Restrictions</span></a></li>
+                      class="fa fa-ban"></i></span> <span class="name">{{ t("admin.base.restrictions") }}</span></a>
+              </li>
               <li class="nav-item"><a class="nav-link" href="/admin/beatmaps"><span class="icon"><i
-                      class="fa fa-map"></i></span> <span class="name">Beatmaps</span></a></li>
+                      class="fa fa-map"></i></span> <span class="name">{{ t("admin.base.beatmaps") }}</span></a></li>
             </ul>
           </div>
         </div>
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index bc2a04de..0ed5a119 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -54,68 +54,68 @@
             onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
     </div>
     <div class="column is-paddingless flex-vcenter">
-        <h2 class="section-title">Beatmaps</h2>
-        <p class="section-lead">Welcome to beatmaps panel</p>
+        <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
+        <p class="section-lead">{{t("admin.beatmaps.welcome-to-beatmaps-panel")}}</p>
     </div>
 </div>
 <div class="row row-deck row-cards" style="margin-top: 20px">
     <div class="columns is-marginless is-paddingless">
         <div class="column is-paddingless pr-3 py-3">
-            <a href="/admin/beatmaps/osu" class="button" style="width: 100%; margin-bottom: 10px">osu!</a>
+            <a href="/admin/beatmaps/osu" class="button" style="width: 100%; margin-bottom: 10px">{{t("global.mode.osu")}}</a>
             <div class="card has-text-right">
                 <i class="fa fa-plus"></i>
-                <div class="title">Total beatmaps</div>
+                <div class="title">{{t("admin.beatmaps.total-beatmaps")}}</div>
                 <div class="value">{{ counts['total'] }}</div>
-                <div class="stat has-text-left">That's a lot of maps</div>
+                <div class="stat has-text-left">{{t("admin.beatmaps.thats-a-lot-of-maps")}}</div>
             </div>
         </div>
         <div class="column is-paddingless p-3">
-            <a href="/admin/beatmaps/taiko" class="button" style="width: 100%; margin-bottom: 10px">osu!taiko</a>
+            <a href="/admin/beatmaps/taiko" class="button" style="width: 100%; margin-bottom: 10px">{{t("global.mode.taiko")}}</a>
             <div class="card has-text-right">
                 <i class="fa fa-bolt"></i>
-                <div class="title">Ranked</div>
+                <div class="title">{{t("admin.beatmaps.ranked")}}</div>
                 <div class="value">{{ counts['ranked'] }}</div>
-                <div class="stat has-text-left">These maps can gain many pp</div>
+                <div class="stat has-text-left">{{t("admin.beatmaps.these-maps-can-gain-many-pp")}}</div>
             </div>
         </div>
         <div class="column is-paddingless p-3">
-            <a href="/admin/beatmaps/catch" class="button" style="width: 100%; margin-bottom: 10px">osu!catch</a>
+            <a href="/admin/beatmaps/catch" class="button" style="width: 100%; margin-bottom: 10px">{{t("global.mode.catch")}}</a>
             <div class="card has-text-right">
                 <i class="fa fa-heart"></i>
-                <div class="title">Loved</div>
-                <div class="value">{{ counts['loved'] }}</div>
-                <div class="stat has-text-left">We loved them so much</div>
+                <div class="title">{{t("admin.beatmaps.loved")}}</div>
+                <div class="value"> {{counts['loved'] }}</div>
+                <div class="stat has-text-left">{{t("admin.beatmaps.we-loved-them-so-much")}}</div>
             </div>
         </div>
         <div class="column is-paddingless pl-3 py-3">
-            <a href="/admin/beatmaps/mania" class="button" style="width: 100%; margin-bottom: 10px">osu!mania</a>
+            <a href="/admin/beatmaps/mania" class="button" style="width: 100%; margin-bottom: 10px">{{t("global.mode.mania")}}</a>
             <div class="card has-text-right">
                 <i class="fa fa-arrows-rotate"></i>
-                <div class="title">Pending</div>
+                <div class="title">{{t("admin.beatmaps.pending")}}</div>
                 <div class="value">{{ counts['pending'] }}</div>
-                <div class="stat has-text-left">They are also good maps</div>
+                <div class="stat has-text-left">{{t("admin.beatmaps.they-are-also-good-maps")}}</div>
             </div>
         </div>
     </div>
     <div class="p-0 d-flex gap-2 py-3">
         <input id="search-bar" class="input" value="{{ search_word }}">
-        <button onclick="map_admin_search('bid')" class="button" style="width: 200px">Search by BID</button>
-        <button onclick="map_admin_search('sid')" class="button" style="width: 200px">Search by SID</button>
-        <button onclick="map_admin_search('name')" class="button" style="width: 200px">Search by Name</button>
+        <button onclick="map_admin_search('bid')" class="button" style="width: 200px">{{t("admin.beatmaps.search-by-bid")}}</button>
+        <button onclick="map_admin_search('sid')" class="button" style="width: 200px">{{t("admin.beatmaps.search-by-sid")}}</button>
+        <button onclick="map_admin_search('name')" class="button" style="width: 200px">{{t("admin.beatmaps.search-by-name")}}</button>
     </div>
     <div class="table-responsive py-3">
         <table class="table rounded">
             <thead>
                 <tr class="i-text-no-wrap">
-                    <th class="has-text-centered" style="width: 400px">Beatmap</th>
-                    <th class="has-text-right">CS / Keys</th>
-                    <th class="has-text-right">AR</th>
-                    <th class="has-text-right">HP</th>
-                    <th class="has-text-right">OD</th>
-                    <th class="has-text-right">BPM</th>
-                    <th class="has-text-right">Stars</th>
-                    <th class="has-text-centered">Status</th>
-                    <th class="has-text-centered">Actions</th>
+                    <th class="has-text-centered" style="width: 400px">{{t("admin.beatmaps.beatmap")}}</th>
+                    <th class="has-text-right">{{t("admin.beatmaps.cs-keys")}}</th>
+                    <th class="has-text-right">{{t("admin.beatmaps.ar")}}</th>
+                    <th class="has-text-right">{{t("admin.beatmaps.hp")}}</th>
+                    <th class="has-text-right">{{t("admin.beatmaps.od")}}</th>
+                    <th class="has-text-right">{{t("admin.beatmaps.bpm")}}</th>
+                    <th class="has-text-right">{{t("admin.beatmaps.stars")}}</th>
+                    <th class="has-text-centered">{{t("admin.beatmaps.status")}}</th>
+                    <th class="has-text-centered">{{t("admin.restrictions.action")}}</th>
                 </tr>
             </thead>
             <tbody>
@@ -166,7 +166,7 @@ <h2 class="section-title">Beatmaps</h2>
                         <div class="dropdown is-right" id="i-dropdown-{{ i.map_id }}">
                             <div class="dropdown-trigger">
                                 <button class="button" aria-haspopup="true" aria-controls="dropdown-menu" onclick="document.getElementById('i-dropdown-{{ i.map_id }}').classList.toggle('is-active')">
-                                    <span>Edit status</span>
+                                    <span>{{t("admin.beatmaps.edit-status")}}</span>
                                     <span class="icon is-small">
                                         <i class="fas fa-angle-down" aria-hidden="true"></i>
                                     </span>
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index 26db2a3d..7a2253e2 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -24,8 +24,8 @@
         onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
     </div>
     <div class="column is-paddingless flex-vcenter">
-      <h2 class="section-title">Restrictions</h2>
-      <p class="section-lead">Welcome to restrictions panel</p>
+      <h2 class="section-title">{{t("admin.base.restrictions")}}</h2>
+      <p class="section-lead">{{t("admin.restrictions.welcome-to-restrictions-panel")}}</p>
     </div>
 </div>
 <div class="row row-deck row-cards" style="margin-top: 20px">
@@ -35,11 +35,11 @@ <h2 class="section-title">Restrictions</h2>
                 <table class="table table-vcenter text-nowrap datatable rounded">
                     <thead>
                         <tr>
-                            <th class="has-text-right">ID</th>
-                            <th>Flag | Username</th>
-                            <th class="has-text-centered">Details</th>
-                            <th class="has-text-centered">Date</th>
-                            <th class="has-text-centered">Action</th>
+                            <th class="has-text-right">{{t("admin.users.id")}}</th>
+                            <th>{{t("admin.users.flag-or-username")}}</th>
+                            <th class="has-text-centered">{{t("admin.restrictions.details")}}</th>
+                            <th class="has-text-centered">{{t("admin.restrictions.date")}}</th>
+                            <th class="has-text-centered">{{t("admin.restrictions.action")}}</th>
                         </tr>
                     </thead>
                     <tbody>
@@ -62,7 +62,7 @@ <h2 class="section-title">Restrictions</h2>
                             </td>
                             <td>
                                 <a class="btn text-nowrap" href="/admin/users/edit/{{ i.id }}">
-                                    <i class="far fa-edit" aria-hidden="true"></i> Edit
+                                    <i class="far fa-edit" aria-hidden="true"></i> {{t("admin.users.edit")}}
                                 </a>
                             </td>
                         </tr>
diff --git a/templates/admin/users.html b/templates/admin/users.html
index f144ad18..d254e340 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -27,30 +27,30 @@
             onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
     </div>
     <div class="column is-paddingless flex-vcenter">
-        <h2 class="section-title">Users</h2>
-        <p class="section-lead">Welcome to users panel</p>
+        <h2 class="section-title">{{ t("admin.base.users") }}</h2>
+        <p class="section-lead">{{ t("admin.users.welcome-to-users-panel") }}</p>
     </div>
 </div>
 <div class="card" style="margin-top: 20px">
     <div class="columns">
         <div class="column px-3 pb-2 pt-4 d-flex gap-2">
-            <input id="search-bar" class="input" v-model.trim="search" placeholder="Search by username or email"
+            <input id="search-bar" class="input" v-model.trim="search" placeholder='{{t("admin.users.search-by-username-or-email")}}'
                 value="{{ search_value }}">
-            <a class="button is-primary" onclick="admin_search()">Search</a>
+            <a class="button is-primary" onclick="admin_search()">{{t("admin.users.search")}}</a>
         </div>
     </div>
     <div class="table-responsive">
         <table class="table card-table table-vcenter text-nowrap datatable rounded">
             <thead>
                 <tr>
-                    <th class="has-text-right">ID</th>
-                    <th>Flag | Username</th>
-                    <th class="has-text-centered">Privilege</th>
-                    <th class="has-text-centered">Last login</th>
-                    <th class="has-text-centered">Joined at</th>
-                    <th class="has-text-centered">Client channel</th>
-                    <th class="has-text-centered">Email</th>
-                    <th class="has-text-centered">IP</th>
+                    <th class="has-text-right">{{t("admin.users.id")}}</th>
+                    <th>{{t("admin.users.flag-or-username")}}</th>
+                    <th class="has-text-centered">{{t("admin.users.privilege")}}</th>
+                    <th class="has-text-centered">{{t("admin.users.last-login")}}</th>
+                    <th class="has-text-centered">{{t("admin.users.joined-at")}}</th>
+                    <th class="has-text-centered">{{t("admin.users.client-channel")}}</th>
+                    <th class="has-text-centered">{{t("admin.users.email")}}</th>
+                    <th class="has-text-centered">{{t("admin.users.ip")}}</th>
                     <th class="has-text-centered"></th>
                 </tr>
             </thead>
@@ -97,7 +97,7 @@ <h2 class="section-title">Users</h2>
                     </td>
                     <td class="has-text-centered">
                         <a class="btn text-nowrap" href="/admin/users/edit/{{ i.id }}">
-                            <i class="far fa-edit" aria-hidden="true"></i> Edit
+                            <i class="far fa-edit" aria-hidden="true"></i> {{t("admin.users.edit")}}
                         </a>
                     </td>
                 </tr>
diff --git a/templates/admin/users_edit.html b/templates/admin/users_edit.html
index 726b69db..c9529dce 100644
--- a/templates/admin/users_edit.html
+++ b/templates/admin/users_edit.html
@@ -22,12 +22,12 @@
     <div style="display: flex; align-items: center; flex-direction: column;">
         <article style="width: 40%;" class="panel is-primary">
             <p class="panel-heading">
-            Edit Info of {{ search_data['name'] }}
+            {{t("admin.users.edit-info-of")}} {{ search_data['name'] }}
             </p>
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-id-card" aria-hidden="true"></i>
-                    Username
+                    {{t("admin.users.username")}}
                 </div>
                 <div class="column">
                     <input name="edit-username" type="text" class="input" value="{{ search_data.name }}">
@@ -36,7 +36,7 @@
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-envelope" aria-hidden="true"></i>
-                    Email
+                    {{t("admin.users.email")}}
                 </div>
                 <div class="column">
                     <input name="edit-email" type="text" class="input" value="{{ search_data.email }}">
@@ -45,7 +45,7 @@
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-globe-americas" aria-hidden="true"></i>
-                    Country
+                    {{t("admin.users.country")}}
                 </div>
                 <div class="column">
                     <input name="edit-country" type="text" class="input" value="{{ search_data.country }}">
@@ -54,24 +54,24 @@
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-ban"  aria-hidden="true"></i>
-                    Legality
+                    {{t("admin.users.legality")}}
                 </div>
                 <div class="column">
                     <div class="select w-100">
                         <select name="legality" class="w-100">
-                            <option value="unrestricted">Unrestricted</option>
+                            <option value="unrestricted">{{t("admin.users.unrestricted")}}</option>
                             {% if search_data.priv == 2 %}
-                            <option value="restricted" selected>Restricted</option>
+                            <option value="restricted" selected>{{t("admin.users.restricted")}}</option>
                             {% endif %}
                             {% if search_data.priv != 2 %}
-                            <option value="restricted">Restricted</option>
+                            <option value="restricted">{{t("admin.users.restricted")}}</option>
                             {% endif %}
                         </select>
                     </div>
                 </div>
             </div>
             <div class="panel-block pb-4">
-                <button type="submit" form="edit-user" style="margin-left: auto; margin-right: 1em; width: 100px;" class="button is-primary">Update</button>
+                <button type="submit" form="edit-user" style="margin-left: auto; margin-right: 1em; width: 100px;" class="button is-primary">{{t("admin.users.update")}}</button>
             </div>
         </article>
     </div>
diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index 5973b17e..f33cd91a 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -45,7 +45,7 @@
         <div class="navbar-end">
             <div class="navbar-item has-dropdown is-hoverable" style="align-items: center;">
                 <div class="navbar-search">
-                    <input autocomplete="off" type="text" placeholder="Looking for someone?" id="u-search" oninput="searchUser()">
+                    <input autocomplete="off" type="text" placeholder='{{t("navbar.looking-for-someone")}}' id="u-search" oninput="searchUser()">
                 </div>
                 <div id="u-search-content" class="navbar-dropdown" style="display: none;">
                 </div>

From 33377a0c1328ea025dc64a8a0e96271a19a01d8c Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 4 Aug 2022 07:32:08 +0000
Subject: [PATCH 167/278] conditional rendering discord, add config sample

---
 config.sample.py      | 71 +++++++++++++++++++++++++++++++++++++++++++
 main.py               |  4 +++
 templates/verify.html |  2 ++
 3 files changed, 77 insertions(+)
 create mode 100644 config.sample.py

diff --git a/config.sample.py b/config.sample.py
new file mode 100644
index 00000000..4b40a780
--- /dev/null
+++ b/config.sample.py
@@ -0,0 +1,71 @@
+# -*- coding: utf-8 -*-
+import os
+
+# env
+_is_dev = os.environ.get("IS_DEV") == "true"
+_h_captcha_sitekey = os.environ.get("GUWEB_H_CAPTCHA_SITEKEY")
+_h_captcha_secret = os.environ.get("GUWEB_H_CAPTCHA_SECRET")
+
+_db_host = os.environ.get("GUWEB_DB_HOST")
+_db_user = os.environ.get("GUWEB_DB_USER")
+_db_password = os.environ.get("GUWEB_DB_PASSWORD")
+_db_database = os.environ.get("GUWEB_DB_DATABASE")
+
+_app_name = os.environ.get("GUWEB_APP_NAME")
+_secret_key = os.environ.get("GUWEB_SECRET_KEY")
+_domain = os.environ.get("GUWEB_DOMAIN")
+_path_to_bancho_py = os.environ.get("GUWEB_PATH_TO_BANCHO_PY")
+_discord_invite_id = os.environ.get("DISCORD_INVITE_ID")
+
+_registration_allowed = os.environ.get("GUWEB_REGISTRATION_ALLOWED")
+# end env
+
+# app name
+app_name = _app_name if _app_name is not None else 'guweb'
+
+# secret key
+secret_key = _secret_key if _secret_key is not None else 'changeme'
+
+#hCaptcha settings:
+hCaptcha_sitekey = _h_captcha_sitekey if _h_captcha_sitekey is not None else 'changeme'
+hCaptcha_secret = _h_captcha_secret if _h_captcha_secret is not None else 'changeme'
+
+# domain (used for api, avatar, etc)
+# *.dev.ppy.sb are resolved as 127.0.0.1, you can keep it as it is when developing.
+domain = _domain if _domain is not None else 'dev.ppy.sb'
+
+# mysql credentials
+mysql = {
+    'db': _db_database if _db_database is not None else 'banchopy',
+    'host': _db_host if _db_host is not None else 'mysql',
+    'user': _db_user if _db_user is not None else 'root',
+    'password': _db_password if _db_password is not None else '',
+}
+
+# path to gulag root (must have leading and following slash)
+path_to_gulag = _path_to_bancho_py if _path_to_bancho_py is not None else os.path.join(os.getcwd(), '../bancho.py') + '/'
+
+# enable debug (disable when in production to improve performance)
+debug = _is_dev
+
+# disallowed names (hardcoded banned usernames)
+disallowed_names = {
+    'cookiezi', 'rrtyui',
+    'hvick225', 'qsc20010'
+}
+
+# disallowed passwords (hardcoded banned passwords)
+disallowed_passwords = {
+    'password', 'minilamp'
+}
+
+# enable registration
+registration = _registration_allowed if _registration_allowed is not None else True
+
+# social links (used throughout guweb)
+github = 'https://github.com/ppy-sb/guweb'
+discord_invite_id = _discord_invite_id
+discord_server = 'https://discord.com/invite/' + discord_invite_id if discord_invite_id is not None else None
+youtube = 'https://youtube.com/'
+twitter = 'https://twitter.com/'
+instagram = 'https://instagram.com/'
diff --git a/main.py b/main.py
index 3306a997..e02d7aa3 100755
--- a/main.py
+++ b/main.py
@@ -124,6 +124,10 @@ def handle_timestamp(timestamp):
 def domain() -> str:
     return glob.config.domain
 
+@app.template_global()
+def config():
+    return glob.config
+
 from blueprints.frontend import frontend
 app.register_blueprint(frontend)
 
diff --git a/templates/verify.html b/templates/verify.html
index ef907cc2..ec5a8854 100644
--- a/templates/verify.html
+++ b/templates/verify.html
@@ -70,6 +70,7 @@ <h2 class="subtitle">{{ t('verify.login-to-your-app-name-account', appName = app
                     </div>
                 </div>
             </div>
+            {% if config().discord_invite_id %}
             <div class="bordertitle">
                 <div class="titlewithsub">
                     <h1 class="title is-left">{{ t('verify.oh-crap-i-am-stuck') }}</h1>
@@ -85,6 +86,7 @@ <h1 class="title">{{ t('verify.click-here-to-join-our-discord') }}</h1>
                     </div>
                 </a>
             </div>
+            {% endif %}
             <div class="box is-block is-paddingless is-marginless is-waiting">
                 <div class="columns flex is-paddingless is-marginless">
                     <div class="column flex flex-vcenter">

From 281793c64013d378118dadea94e6c670d6bbf986 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 4 Aug 2022 07:56:02 +0000
Subject: [PATCH 168/278] default locale

---
 blueprints/i18npy.py | 2 +-
 config.sample.py     | 6 +++++-
 main.py              | 2 +-
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/blueprints/i18npy.py b/blueprints/i18npy.py
index 25624f5b..01cc38f6 100644
--- a/blueprints/i18npy.py
+++ b/blueprints/i18npy.py
@@ -11,7 +11,7 @@
 
 @app.template_global()
 def t(key, **kwargs) -> str:
-    kwargs['locale'] = session.get('lang', 'zh_CN')
+    kwargs['locale'] = session.get('lang', glob.config.default_locale)
     try:
         return i18n.t(key, **kwargs)
     except:
diff --git a/config.sample.py b/config.sample.py
index 4b40a780..dbaaa603 100644
--- a/config.sample.py
+++ b/config.sample.py
@@ -16,6 +16,7 @@
 _domain = os.environ.get("GUWEB_DOMAIN")
 _path_to_bancho_py = os.environ.get("GUWEB_PATH_TO_BANCHO_PY")
 _discord_invite_id = os.environ.get("DISCORD_INVITE_ID")
+_default_locale = os.environ.get("GUWEB_default_locale")
 
 _registration_allowed = os.environ.get("GUWEB_REGISTRATION_ALLOWED")
 # end env
@@ -42,7 +43,8 @@
     'password': _db_password if _db_password is not None else '',
 }
 
-# path to gulag root (must have leading and following slash)
+# path to gulag root (must have leading and following slash),
+# you don't need to change this assume you put /guweb and /bancho.py in the same folder.
 path_to_gulag = _path_to_bancho_py if _path_to_bancho_py is not None else os.path.join(os.getcwd(), '../bancho.py') + '/'
 
 # enable debug (disable when in production to improve performance)
@@ -62,6 +64,8 @@
 # enable registration
 registration = _registration_allowed if _registration_allowed is not None else True
 
+default_locale = _default_locale if _default_locale is not None else 'en_GB'
+
 # social links (used throughout guweb)
 github = 'https://github.com/ppy-sb/guweb'
 discord_invite_id = _discord_invite_id
diff --git a/main.py b/main.py
index e02d7aa3..f12a2f4e 100755
--- a/main.py
+++ b/main.py
@@ -58,7 +58,7 @@ def appVersion() -> str:
 
 @app.template_global()
 def t(key, **kwargs) -> str:
-    kwargs['locale'] = session.get('lang', 'zh_CN')
+    kwargs['locale'] = session.get('lang', glob.config.default_locale)
     try:
         return i18n.t(key, **kwargs)
     except:

From 8f5bfb108fa258cda8ef2bfc2db0b9c17c9b1927 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 08:36:27 +0000
Subject: [PATCH 169/278] safe check

---
 blueprints/frontend.py | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index d81f5967..6661692d 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -233,11 +233,11 @@ async def settings_aboutme():
 async def settings_aboutme_post():
     form = await request.form
     userpage_content = form.get('userpage_content', type=str)
-    old_content = (await glob.db.fetch('SELECT userpage_content FROM users WHERE id = %s', [session['user_data']['id']]))['userpage_content']
-    if '<iframe' in userpage_content or '<script' in userpage_content:
-        return await render_template('settings/aboutme.html', flash='Not allowed method', status='error', userpage_content=old_content)
+    safe_content = userpage_content.lower()
+    if '<iframe' in safe_content or '<script' in safe_content:
+        return await render_template('settings/aboutme.html', flash='Not allowed method', status='error', userpage_content=userpage_content)
     if (len(userpage_content) > 2048):
-        return await render_template('settings/aboutme.html', flash='Too long text', status='error', userpage_content=old_content)
+        return await render_template('settings/aboutme.html', flash='Too long text', status='error', userpage_content=userpage_content)
     await glob.db.execute(
             'UPDATE users '
             'SET userpage_content = %s '

From c2dd119e03756f3b2f6036c77f1117d15ac6c436 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 4 Aug 2022 08:47:53 +0000
Subject: [PATCH 170/278] online-infomation

---
 static/css/pages/profile.css |   8 +--
 templates/profile.html       | 116 ++++++++++++++++++++---------------
 2 files changed, 69 insertions(+), 55 deletions(-)

diff --git a/static/css/pages/profile.css b/static/css/pages/profile.css
index 148be64d..403396e4 100644
--- a/static/css/pages/profile.css
+++ b/static/css/pages/profile.css
@@ -722,10 +722,10 @@ span.beatmap-mapper {
 }
 
 .online-infomation {
-  position: absolute;
-  top: 18px;
-  left: 42px;
-  padding: 0.5em 15px;
+  /* position: absolute;
+  bottom: 18px;
+  right: 42px; */
+  padding: 0.3em 1em;
   background: #00000040;
   border-radius: 6px;
 }
diff --git a/templates/profile.html b/templates/profile.html
index 81eb0ccf..a0f8749e 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -2,20 +2,20 @@
 {% block title %} {{ t('global.profile') }} {% endblock %}
 
 {% macro userpage(user) %}
-    {% if user['userpage_content'] != None and user['userpage_content'] != "" %}
-        <div class="log-block">
-            <div class="header">
-                <div class="title">
-                    <i class="fas fa-address-book"></i> About me
-                </div>
-            </div>
-            <div class="stats-block rank-block" style="padding: 12.5px;">
-                <article>
-                    {{ user['userpage_content']|safe }}
-                </article>
-            </div>
+{% if user['userpage_content'] != None and user['userpage_content'] != "" %}
+<div class="log-block">
+    <div class="header">
+        <div class="title">
+            <i class="fas fa-address-book"></i> About me
         </div>
-    {% endif %}
+    </div>
+    <div class="stats-block rank-block" style="padding: 12.5px;">
+        <article>
+            {{ user['userpage_content']|safe }}
+        </article>
+    </div>
+</div>
+{% endif %}
 {% endmacro %}
 
 {% macro scores(title, id) %}
@@ -26,7 +26,7 @@
         </div>
     </div>
     <div v-if="data.scores.{{ id }}.out.length" class="scores">
-        <div v-for="(map, index) in data.scores.{{ id }}.out" class="map-single" ref="scores" :key="map.beatmap.map_id" 
+        <div v-for="(map, index) in data.scores.{{ id }}.out" class="map-single" ref="scores" :key="map.beatmap.map_id"
             :style="`background: linear-gradient(hsl(var(--main), 25%, 25%, 90%), hsl(var(--main), 25%, 25%, 90%)), url(https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/cover.jpg)`">
             <div class="map-data" @click="window.open(`https://osu.ppy.sh/beatmaps/${map.beatmap.id}`) ">
                 <div class="map-content1">
@@ -37,11 +37,14 @@
                     <div class="map-title-block">
                         <div class="map-title">
                             <a class="beatmap-link">
-                                <% map.beatmap.artist %> - <% map.beatmap.title %> [<% map.beatmap.version %>] <!--<span v-if="map.mods != 0">+ <% modsStr(map.mods) %></span>-->
+                                <% map.beatmap.artist %> - <% map.beatmap.title %> [<% map.beatmap.version %>]
+                                            <!--<span v-if="map.mods != 0">+ <% modsStr(map.mods) %></span>-->
                             </a>
                         </div>
                         <div class="play-stats">
-                            <% map.mods_str %> / <b><% addCommas(map.max_combo) %></b>x
+                            <% map.mods_str %> / <b>
+                                    <% addCommas(map.max_combo) %>
+                                </b>x
                         </div>
                         <div class="map-date">
                             <time>
@@ -55,7 +58,8 @@
                         <div class="score-details_right-block">
                             <div class="score-details_pp-block">
                                 <div class="map-pp">
-                                    <% addCommas(map.pp.toFixed()) %><span class="map-pp-unit">{{ t('global.pp') }}</span>
+                                    <% addCommas(map.pp.toFixed()) %><span class="map-pp-unit">{{ t('global.pp')
+                                            }}</span>
                                 </div>
                                 <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
                                         <% map.acc.toFixed(2) %>%
@@ -64,7 +68,7 @@
                             <div class="score-details_grade-block">
                                 <div class="rank-single">
                                     <div :class="`map-rank rank-${map.grade}`">
-                                        <% map.grade.replace("X", "SS").replace("H", "") %>
+                                        <% map.grade.replace("X", "SS" ).replace("H", "" ) %>
                                     </div>
                                 </div>
                             </div>
@@ -99,7 +103,8 @@ <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
         </div>
     </div>
     <div v-if="data.maps.{{ id }}.out.length" class="beatmaps">
-        <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block rounded-sm" ref="mostPlayed" :key="map.id">
+        <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block rounded-sm" ref="mostPlayed"
+            :key="map.id">
             <div class="beatmap-preview"
                 :style='{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }'>
             </div>
@@ -173,8 +178,16 @@ <h1 class="title">
                     <div class="subtitle" v-if='data.status.online == false'>
                         <a class='circle'>●</a> {{ t('global.offline') }}
                     </div>
-                    <div class="subtitle" v-else-if='data.status.online == true'>
+                    <div class="subtitle" v-else-if='data.status.online == true' :style="{
+                        display: 'flex',
+                        gap: 0.5em
+                    }">
                         <a class='circle green'>●</a> {{ t('global.online') }}
+                        <transition name="click">
+                            <div class="online-infomation" :key="`online-information`">
+                                <% actionIntToStr(data.status.status) %>
+                            </div>
+                        </transition>
                     </div>
                 </transition>
             </div>
@@ -183,12 +196,6 @@ <h1 class="title">
                     <img src="{your transparent img src}" alt="">
                 -->
             </div>
-            <transition name="click">
-                <div class="online-infomation" v-if='data.status.online == true'
-                    :key="actionIntToStr(data.status.status)">
-                    <% actionIntToStr(data.status.status) %>
-                </div>
-            </transition>
         </div>
         <div class="profile-flex">
             <div class="profile-avatar-area">
@@ -198,28 +205,33 @@ <h1 class="title">
             <div class="bar-selection mode-selects">
                 <div class="select-left">
                     <a class="simple-banner-switch" :class="{ 'selected': mode === 'std' }"
-                        @click="ChangeModeMods('std',mods)"><i class="mode-icon mode-osu"></i><span
-                            class="mode-text">{{ t('global.mode.osu') }}</span></a>
+                        @click="ChangeModeMods('std',mods)"><i class="mode-icon mode-osu"></i><span class="mode-text">{{
+                            t('global.mode.osu') }}</span></a>
                     <a class="simple-banner-switch" :class="{ 'selected': mode === 'taiko', 'disabled': mods === 'ap' }"
                         @click="ChangeModeMods('taiko',mods)"><i class="mode-icon mode-taiko"></i><span
                             class="mode-text">{{ t('global.mode.taiko') }}</span></a>
                     <a class="simple-banner-switch" :class="{ 'selected': mode === 'catch', 'disabled': mods === 'ap' }"
                         @click="ChangeModeMods('catch',mods)"><i class="mode-icon mode-catch"></i><span
                             class="mode-text">{{ t('global.mode.catch') }}</span></a>
-                    <a class="simple-banner-switch" :class="{ 'selected': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
+                    <a class="simple-banner-switch"
+                        :class="{ 'selected': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
                         @click="ChangeModeMods('mania',mods)"><i class="mode-icon mode-mania"></i><span
                             class="mode-text">{{ t('global.mode.mania') }}</span></a>
                 </div>
                 <div class="select-right">
                     <a class="simple-banner-switch" :class=" { 'selected': mods === 'vn' }"
-                        @click="ChangeModeMods(mode,'vn')"><span class="mods-fulltext">{{ t('global.mode.vanilla') }}</span>
+                        @click="ChangeModeMods(mode,'vn')"><span class="mods-fulltext">{{ t('global.mode.vanilla')
+                            }}</span>
                         <span class="mods-shorttext">{{ t('global.mode.VN') }}</span></a>
-                    <a class="simple-banner-switch" :class=" { 'selected': mods === 'rx', 'disabled': mode === 'mania' }"
-                        @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">{{ t('global.mode.relax') }}</span>
+                    <a class="simple-banner-switch"
+                        :class=" { 'selected': mods === 'rx', 'disabled': mode === 'mania' }"
+                        @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">{{ t('global.mode.relax')
+                            }}</span>
                         <span class="mods-shorttext">{{ t('global.mode.RX') }}</span></a>
-                    <a class="simple-banner-switch" :class=" { 'selected': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
-                        @click="ChangeModeMods(mode,'ap')"><span class="mods-fulltext">{{ t('global.mode.autopilot') }}</span><span
-                            class="mods-shorttext">{{ t('global.mode.AP') }}</span></a>
+                    <a class="simple-banner-switch"
+                        :class=" { 'selected': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
+                        @click="ChangeModeMods(mode,'ap')"><span class="mods-fulltext">{{ t('global.mode.autopilot')
+                            }}</span><span class="mods-shorttext">{{ t('global.mode.AP') }}</span></a>
                 </div>
             </div>
         </div>
@@ -364,7 +376,7 @@ <h1 class="title">
             </div>
             <div class="column">
                 {{ userpage(user) }}
-                {{ scores(t('profile.best-scores')  , 'best')}}
+                {{ scores(t('profile.best-scores') , 'best')}}
                 {{ scores(t('profile.recent-scores'), 'recent')}}
                 {{ maps(t('profile.most-played-beatmaps'), 'most')}}
             </div>
@@ -376,21 +388,23 @@ <h1 class="title">
 {% block bottom %}
 <script src="/static/js/pages/profile.js?v={{ appVersion() }} "></script>
 {% if user['customisation']['banner'] == True %}
-    <style>
-        .profile-bg {
-            min-height: 262px;
-            background: linear-gradient(hsl(var(--main), 25%, 25%, 20%), hsl(var(--main), 25%, 25%, 60%)), url("/banners/{{ user['id'] }}");
-            background-size: cover;
-        }
-    </style>
+<style>
+    .profile-bg {
+        min-height: 262px;
+        background: linear-gradient(hsl(var(--main), 25%, 25%, 20%), hsl(var(--main), 25%, 25%, 60%)),
+        url("/banners/{{ user['id'] }}");
+        background-size: cover;
+    }
+</style>
 {% endif %}
 {% if user['customisation']['background'] == True %}
-    <style>
-        body {
-            background: linear-gradient(hsl(var(--main), 25%, 25%, 20%), hsl(var(--main), 10%, 10%)), url("/backgrounds/{{ user['id'] }}");
-            background-size: cover;
-            background-clip: content-box;
-        }
-    </style>
+<style>
+    body {
+        background: linear-gradient(hsl(var(--main), 25%, 25%, 20%), hsl(var(--main), 10%, 10%)),
+        url("/backgrounds/{{ user['id'] }}");
+        background-size: cover;
+        background-clip: content-box;
+    }
+</style>
 {% endif %}
-{% endblock bottom %}
+{% endblock bottom %}
\ No newline at end of file

From 231c71ce60090e91d1619ac877a91d9c70635c76 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 09:16:16 +0000
Subject: [PATCH 171/278] clean and improve code

---
 blueprints/admin.py     |  4 ----
 blueprints/frontend.py  | 24 +++++-------------------
 config.sample.py        |  8 ++++++++
 constants/privileges.py | 36 ------------------------------------
 main.py                 | 30 +++++-------------------------
 objects/varka.py        | 22 +++++++++++++++++++---
 6 files changed, 37 insertions(+), 87 deletions(-)
 delete mode 100644 constants/privileges.py

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 83489a7b..d911ba7f 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -31,7 +31,6 @@ async def get(table_name: str, id: str):
 @admin.route('/home')
 @admin.route('/dashboard')
 async def home():
-    """Render the homepage of guweb's admin panel."""
     if not 'authenticated' in session:
         return await flash('error', t('admin.please-login-in-first'), 'login')
 
@@ -62,7 +61,6 @@ async def home():
 
 @admin.route('/users', methods=['GET'])
 async def users():
-    """Render the homepage of guweb's admin panel."""
     if not 'authenticated' in session:
         return await flash('error', t('admin.please-login-in-first'), 'login')
 
@@ -78,7 +76,6 @@ async def users():
 
 @admin.route('/users/edit/<id>')
 async def users_edit(id:int):
-    """Render the homepage of guweb's admin panel."""
     if not 'authenticated' in session:
         return await flash('error', t('admin.please-login-in-first'), 'login')
 
@@ -135,7 +132,6 @@ async def beatmaps_edit(bid:int):
 
 @admin.route('/users/update/<id>', methods=['POST']) # POST
 async def users_update(id:int):
-    """Render the homepage of guweb's admin panel."""
     if not 'authenticated' in session:
         return await flash('error', t('admin.please-login-in-first'), 'login')
 
diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 6661692d..22dcb0bf 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -87,6 +87,9 @@ async def settings_profile_post():
         # - not contain both ' ' and '_', one is fine
         # - not be in the config's `disallowed_names` list
         # - not already be taken by another player
+        if not session['user_data']['priv'] & Privileges.Supporter and glob.config.name_change_only_for_supporter:
+            return await flash('error', t('username-changes-supporter-only'), 'settings/profile')
+
         if not regexes.username.match(new_name):
             return await flash('error', t('settings.profile.new-username-is-invalid'), 'settings/profile')
 
@@ -443,7 +446,7 @@ async def login_post():
 
     api_key = user_info['api_key']
 
-    if api_key is None:
+    if api_key is None and glob.config.create_api_key_if_not_exist:
         api_key = str(uuid.uuid4())
         await glob.db.execute(
         "UPDATE users SET api_key = %s WHERE id = %s",
@@ -618,24 +621,7 @@ async def logout():
 @frontend.route('/search')
 async def search_user():
     q = request.args.get('q', type=str)
-    if not q:
-        return b'{}'
-
-    res = await glob.db.fetchall(
-        'SELECT id, name '
-        'FROM `users` '
-        'WHERE priv >= 3 '
-        'AND ('
-        '   `name` LIKE %s '
-        '   OR CONVERT(`id`, char) LIKE %s '
-        ') LIMIT 5',
-        [q + '%%', q + '%%']
-    )
-
-    if (len(res) == 0):
-        return b'{}'
-    else:
-        return jsonify(res) 
+    return await search_user(q)
 
 # social media redirections
 
diff --git a/config.sample.py b/config.sample.py
index dbaaa603..d4db8d91 100644
--- a/config.sample.py
+++ b/config.sample.py
@@ -19,6 +19,8 @@
 _default_locale = os.environ.get("GUWEB_default_locale")
 
 _registration_allowed = os.environ.get("GUWEB_REGISTRATION_ALLOWED")
+_create_api_key_if_not_exist = os.environ.get("GUWEB_CREATE_API_KEY_IF_NOT_EXIST")
+_name_change_only_for_supporter = os.environ.get("GUWEB_NAME_CHANGE_ONLY_FOR_SUPPORTER")
 # end env
 
 # app name
@@ -64,6 +66,12 @@
 # enable registration
 registration = _registration_allowed if _registration_allowed is not None else True
 
+# create api_key if not exist (admin panel update maps requires the api key)
+create_api_key_if_not_exist = _create_api_key_if_not_exist if _create_api_key_if_not_exist is not None else False
+
+# only supporters can change their username through user edit page
+name_change_only_for_supporter = _name_change_only_for_supporter if _name_change_only_for_supporter is not None else True
+
 default_locale = _default_locale if _default_locale is not None else 'en_GB'
 
 # social links (used throughout guweb)
diff --git a/constants/privileges.py b/constants/privileges.py
deleted file mode 100644
index add174b9..00000000
--- a/constants/privileges.py
+++ /dev/null
@@ -1,36 +0,0 @@
-from __future__ import annotations
-
-from enum import IntEnum
-from enum import IntFlag
-from enum import unique
-
-__all__ = ("Privileges")
-
-
-@unique
-class Privileges(IntFlag):
-    """Server side user privileges."""
-
-    # privileges intended for all normal players.
-    legit = 1 << 0  # is an unbanned player.
-    active = 1 << 1  # has logged in to the server in-game.
-
-    # has bypass to low-ceiling anticheat measures (trusted).
-    whitelisted = 1 << 2
-
-    # donation tiers, receives some extra benefits.
-    supporter = 1 << 4
-    premium = 1 << 5
-
-    # notable users, receives some extra benefits.
-    alumni = 1 << 7
-
-    # staff permissions, able to manage server app.state.
-    tourment_manager = 1 << 10  # able to manage match state without host.
-    BN = 1 << 11  # able to manage maps ranked status.
-    manager = 1 << 12  # able to manage users (level 1).
-    administrator = 1 << 13  # able to manage users (level 2).
-    developer = 1 << 14  # able to manage full server app.state.
-
-    DONATOR = supporter | premium
-    STAFF = manager | administrator | developer
diff --git a/main.py b/main.py
index f12a2f4e..a01a1eb8 100755
--- a/main.py
+++ b/main.py
@@ -4,22 +4,19 @@
 __all__ = ()
 
 import os
-import random
 import time
-from datetime import datetime
-from constants.privileges import Privileges
+from objects.privileges import Privileges
 
 import aiohttp
 import i18n
 import orjson
-from quart import Blueprint, Quart, session
+from quart import Quart, session
 from quart import render_template
 
 from cmyui.logging import Ansi
 from cmyui.logging import log
 from cmyui.mysql import AsyncSQLPool
 from cmyui.version import Version
-from requests import cookies
 
 from objects import glob
 
@@ -73,15 +70,9 @@ def appName() -> str:
 
 @app.template_global()
 def decode_priv(target_priv: int) -> str:
-    priv_list = [
-                    priv.name for priv in Privileges if target_priv & priv and bin(priv).count("1") == 1
-                ][::-1]
-    if 'legit' in priv_list:
-        priv_list.remove('legit')
-    else:
-        priv_list.append('banned')
-    if 'active' not in priv_list:
-        priv_list.append('inactive')
+    priv_list = [priv.name for priv in Privileges if target_priv & priv and bin(priv).count("1") == 1][::-1]
+    if 'Normal' not in priv_list:
+        priv_list.append('Banned')
     return ', '.join(priv_list)
 
 @app.template_global()
@@ -101,17 +92,6 @@ def decode_map_status(status: int) -> str:
     if status == 5:
         return 'Loved'
 
-    priv_list = [
-                    priv.name for priv in Privileges if target_priv & priv and bin(priv).count("1") == 1
-                ][::-1]
-    if 'legit' in priv_list:
-        priv_list.remove('legit')
-    else:
-        priv_list.append('banned')
-    if 'active' not in priv_list:
-        priv_list.append('inactive')
-    return ', '.join(priv_list)
-
 @app.template_global()
 def captchaKey() -> str:
     return glob.config.hCaptcha_sitekey
diff --git a/objects/varka.py b/objects/varka.py
index 8f12ee98..995b73db 100644
--- a/objects/varka.py
+++ b/objects/varka.py
@@ -1,6 +1,5 @@
-from objects import glob, privileges
 from quart import jsonify
-import json
+from objects import glob
 
 async def get_users(limit:int=100, search:str=None):
     """Returns the all of a users."""
@@ -91,4 +90,21 @@ async def update(table, id, **kargs):
         else:
             params.append(f"{k}=NULL")
     await glob.db.execute("UPDATE `%s` SET %s WHERE %s = '%s'" % (table, ', '.join(params), *id))
-    return 'ok'
\ No newline at end of file
+    return 'ok'
+
+async def search_user(keyword: str):
+    if not keyword:
+        return b'{}'
+    result = await glob.db.fetchall(
+        'SELECT id, name '
+        'FROM `users` '
+        'WHERE priv >= 3 '
+        'AND ('
+        '   `name` LIKE %s '
+        '   OR CONVERT(`id`, char) LIKE %s '
+        ') LIMIT 5',
+        [keyword + '%%', keyword + '%%']
+    )
+    if (len(result) == 0):
+        return b'{}'
+    return jsonify(result) 

From d79e7341825ab2a06981607bb0d3ad7d277bd574 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 14:24:53 +0000
Subject: [PATCH 172/278] totally optimize

---
 blueprints/admin.py               | 215 ++++++++----------------------
 blueprints/frontend.py            |   4 +-
 locales/admin/beatmaps/en-GB.yml  |   4 +-
 locales/admin/beatmaps/en-US.yml  |   4 +-
 locales/admin/beatmaps/zh-CN.yml  |  10 +-
 main.py                           |  21 ++-
 objects/privileges.py             |   3 +-
 static/js/main.js                 |  38 +-----
 static/js/pages/admin/beatmaps.js |  29 ++++
 static/js/pages/admin/users.js    |   6 +
 templates/admin/beatmaps.html     |  32 ++---
 templates/admin/users.html        |   5 +-
 12 files changed, 136 insertions(+), 235 deletions(-)
 create mode 100644 static/js/pages/admin/beatmaps.js
 create mode 100644 static/js/pages/admin/users.js

diff --git a/blueprints/admin.py b/blueprints/admin.py
index d911ba7f..48b9aca6 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -2,14 +2,15 @@
 
 __all__ = ()
 
+from functools import wraps
 from quart import Blueprint
 from quart import render_template
 from quart import session
 from quart import request
 from quart import redirect
-from quart import jsonify
 
 from objects import glob
+from objects.privileges import Privileges
 from objects.utils import flash
 from objects import varka
 
@@ -27,16 +28,23 @@ async def get(table_name: str, id: str):
     data = await varka.get_data(table_name, id)
     return data
 
+def priv_check(priv: Privileges):
+    def decorate(func):
+        @wraps(func)
+        async def wrapper(*args, **kwargs):
+            if not 'authenticated' in session:
+                return await flash('error', t('admin.please-login-in-first'), 'login')
+            if not session['user_data']['priv'] & priv:
+                return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
+            return await func(*args, **kwargs)
+        return wrapper
+    return decorate
+
 @admin.route('/')
 @admin.route('/home')
 @admin.route('/dashboard')
+@priv_check(priv=Privileges.Staff)
 async def home():
-    if not 'authenticated' in session:
-        return await flash('error', t('admin.please-login-in-first'), 'login')
-
-    if not session['user_data']['is_staff']:
-        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
-
     # fetch data from database
     dash_data = await glob.db.fetch(
         'SELECT COUNT(id) count, '
@@ -59,85 +67,32 @@ async def home():
         datetime=datetime, timeago=timeago
     )
 
+@admin.route('/restrictions', methods=['GET', 'POST'])
+@priv_check(priv=Privileges.Staff)
+async def restrictions():
+    return await render_template('/admin/restrictions.html', query_data=await varka.get_res_users())
+
 @admin.route('/users', methods=['GET'])
+@priv_check(priv=Privileges.Staff)
 async def users():
-    if not 'authenticated' in session:
-        return await flash('error', t('admin.please-login-in-first'), 'login')
+    query_data = await varka.get_users()
+    return await render_template('/admin/users.html', query_data=query_data)
 
-    if not session['user_data']['is_staff']:
-        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
-    result = request.args.get('search', type=str)
-    if result is None:
-        query_data = await varka.get_users()
-        result = ''
-    else:
-        query_data = await varka.get_users(search=result)
-    return await render_template('admin/users.html', query_data=query_data, search_value=result)
+@admin.route('/users/search/<q>', methods=['GET'])
+@priv_check(priv=Privileges.Staff)
+async def users_search(q: str):
+    query_data = await varka.get_users(search=q)
+    return await render_template('/admin/users.html', query_data=query_data, search_value=q)
 
 @admin.route('/users/edit/<id>')
+@priv_check(priv=Privileges.Staff)
 async def users_edit(id:int):
-    if not 'authenticated' in session:
-        return await flash('error', t('admin.please-login-in-first'), 'login')
-
-    if not session['user_data']['is_staff']:
-        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
-    
     query = await varka.get_user(id)
     return await render_template('admin/users_edit.html', search_data=query)
 
-@admin.route('/beatmaps/edit/<bid>')
-async def beatmaps_edit(bid:int):
-    if not 'authenticated' in session:
-        return await flash('error', t('admin.please-login-in-first'), 'login')
-
-    if not session['user_data']['is_staff'] and not session['user_data']['is_bn']:
-        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
-    
-    status = request.args.get('status', type=int)
-    is_set = request.args.get('set', type=int) == 1
-    if is_set:
-        await glob.db.execute("UPDATE maps SET frozen=1, status=%s WHERE set_id=%s", [str(status), str(bid)])
-    else:
-        await glob.db.execute("UPDATE maps SET frozen=1, status=%s WHERE id=%s", [str(status), str(bid)])
-
-    query = await glob.db.fetch(
-        'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
-        '(SELECT COUNT(id) as `l` FROM maps WHERE `status`= 5) AS `l`, '
-        '(SELECT COUNT(id) as `p` FROM maps WHERE `status`= 0) AS `p`, '
-        '(SELECT COUNT(id) as `t` FROM maps) `t`'
-    )
-    counts = {
-        "ranked": query['r'], 
-        "loved": query['l'], 
-        "pending": query['p'], 
-        "total": query['t']
-    }
-    if is_set:
-        beatmaps = await glob.db.fetchall(
-        'SELECT set_id, id AS `map_id`, status, '
-        'artist, title, version AS `diff_name`, '
-        'total_length AS length, creator, mode, '
-        'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
-        'FROM maps WHERE set_id=%s ORDER BY id DESC '
-        'LIMIT 50 OFFSET 0', [str(bid)])
-    else:
-        beatmaps = await glob.db.fetchall(
-        'SELECT set_id, id AS `map_id`, status, '
-        'artist, title, version AS `diff_name`, '
-        'total_length AS length, creator, mode, '
-        'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
-        'FROM maps WHERE id=%s ORDER BY id DESC '
-        'LIMIT 50 OFFSET 0', [str(bid)])
-    return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps, search_word=str(bid))
-
 @admin.route('/users/update/<id>', methods=['POST']) # POST
+@priv_check(priv=Privileges.Staff)
 async def users_update(id:int):
-    if not 'authenticated' in session:
-        return await flash('error', t('admin.please-login-in-first'), 'login')
-
-    if not session['user_data']['is_staff']:
-        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
-
     try:
         form = await request.form
         datadef: dict = await get('users', id)
@@ -152,48 +107,13 @@ async def users_update(id:int):
         elif datadef['priv'] == 2 and form['legality'] == 'unrestricted':
             data['priv'] = 3 
         await varka.update('users', ('id', id), **dict_cmp(data, datadef))
-        return redirect('/admin/users')
+        return redirect(f'/admin/users/search/{id}')
     except: 
-        return redirect('/admin/users')
-
-@admin.route('/restrictions', methods=['GET', 'POST'])
-async def restrictions():
-    if not 'authenticated' in session:
-        return await flash('error', t('admin.please-login-in-first'), 'login')
-
-    if not session['user_data']['is_staff']:
-        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
+        return redirect('/admin/users.html')
 
-    error = ''
-    if request.method == 'POST':
-        try:
-            try:
-                username = (await request.form)['username']
-                id = (await varka.get_user_username(username))['id']
-                return redirect(f'/admin/users/edit/{id}')
-            except:
-                email = (await request.form)['email']
-                id = (await varka.get_user_email(email))['id']
-                return redirect(f'/admin/users/edit/{id}')
-        except:
-            error = 'User not found!'
-    return await render_template('admin/restrictions.html', query_data=await varka.get_res_users(), error=error)
-
-@admin.route('/beatmaps/<mode>')
-async def beatmaps(mode: str):
-    if not 'authenticated' in session:
-        return await flash('error', t('admin.please-login-in-first'), 'login')
-
-    if not session['user_data']['is_staff'] and not session['user_data']['is_bn']:
-        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
-
-    mode_vn = 0
-    if mode == 'taiko':
-        mode_vn = 1
-    if mode == 'catch':
-        mode_vn = 2
-    if mode == 'mania':
-        mode_vn = 3
+@admin.route('/beatmaps')
+@priv_check(priv=Privileges.Staff)
+async def beatmaps():
     query = await glob.db.fetch(
         'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
         '(SELECT COUNT(id) as `l` FROM maps WHERE `status`= 5) AS `l`, '
@@ -212,19 +132,14 @@ async def beatmaps(mode: str):
         'artist, title, version AS `diff_name`, '
         'total_length AS length, creator, mode, '
         'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
-        'FROM maps WHERE mode=%s ORDER BY id DESC '
-        'LIMIT 50 OFFSET 0', [mode_vn]
+        'FROM maps ORDER BY id DESC '
+        'LIMIT 50'
     )
     return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps)
 
-@admin.route('/beatmaps/search')
-async def beatmaps_search():
-    if not 'authenticated' in session:
-        return await flash('error', t('admin.please-login-in-first'), 'login')
-
-    if not session['user_data']['is_staff'] and not session['user_data']['is_bn']:
-        return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
-
+@admin.route('/beatmaps/search/<q>')
+@priv_check(priv=Privileges.Staff)
+async def beatmaps_search(q: str):
     query = await glob.db.fetch(
         'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
         '(SELECT COUNT(id) as `l` FROM maps WHERE `status`= 5) AS `l`, '
@@ -237,45 +152,23 @@ async def beatmaps_search():
         "pending": query['p'], 
         "total": query['t']
     }
-    bid = request.args.get('bid', type=str)
-    sid = request.args.get('sid', type=str)
-    name = request.args.get('name', type=str)
-    word = ''
-    if bid != None:
-        word = str(bid)
-        beatmaps = await glob.db.fetchall(
-        'SELECT set_id, id AS `map_id`, status, '
-        'artist, title, version AS `diff_name`, '
-        'total_length AS length, creator, mode, '
-        'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
-        'FROM maps WHERE id=%s ORDER BY id DESC '
-        'LIMIT 50 OFFSET 0', [bid]
-    )
-
-    if sid != None:
-        word = str(sid)
-        beatmaps = await glob.db.fetchall(
-        'SELECT set_id, id AS `map_id`, status, '
-        'artist, title, version AS `diff_name`, '
-        'total_length AS length, creator, mode, '
-        'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
-        'FROM maps WHERE set_id=%s ORDER BY id DESC '
-        'LIMIT 50 OFFSET 0', [sid]
-    )
-
-    if name != None:
-        word = str(name)
-        beatmaps = await glob.db.fetchall(
+    beatmaps = await glob.db.fetchall(
         'SELECT set_id, id AS `map_id`, status, '
         'artist, title, version AS `diff_name`, '
         'total_length AS length, creator, mode, '
         'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
-        'FROM maps WHERE title like %s ORDER BY id DESC '
-        'LIMIT 50 OFFSET 0', [name + '%']
+        'FROM maps WHERE id=%s OR set_id=%s OR title like %s ORDER BY id DESC '
+        'LIMIT 50 OFFSET 0', [q, q, q + '%']
     )
-    return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps, search_word=word)
+    return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps, search_word=q)
 
-
-@admin.route('/beatmaps')
-async def beatmaps_noargs():
-    return await beatmaps('osu')
\ No newline at end of file
+@admin.route('/beatmaps/edit/<id>')
+@priv_check(priv=Privileges.Nominator)
+async def beatmaps_edit(id:int): 
+    status = request.args.get('status', type=int)
+    is_set = request.args.get('set', type=int) == 1
+    if is_set:
+        await glob.db.execute("UPDATE maps SET frozen=1, status=%s WHERE set_id=%s", [str(status), str(id)])
+    else:
+        await glob.db.execute("UPDATE maps SET frozen=1, status=%s WHERE id=%s", [str(status), str(id)])
+    return redirect ('/admin/beatmaps/search/' + id)
\ No newline at end of file
diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 22dcb0bf..0a8c7641 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -20,7 +20,6 @@
 from quart import request
 from quart import session
 from quart import send_file
-from quart import jsonify
 
 from constants import regexes
 from objects import glob
@@ -30,6 +29,7 @@
 from objects.utils import flash_with_customizations
 
 from blueprints.i18npy import t
+from objects.varka import search_user
 
 VALID_MODES = frozenset({'std', 'taiko', 'catch', 'mania'})
 VALID_MODS = frozenset({'vn', 'rx', 'ap'})
@@ -619,7 +619,7 @@ async def logout():
     return await flash('success', t('logout.succeed'), 'login')
 
 @frontend.route('/search')
-async def search_user():
+async def user_search():
     q = request.args.get('q', type=str)
     return await search_user(q)
 
diff --git a/locales/admin/beatmaps/en-GB.yml b/locales/admin/beatmaps/en-GB.yml
index 0bc3dd31..4244df98 100644
--- a/locales/admin/beatmaps/en-GB.yml
+++ b/locales/admin/beatmaps/en-GB.yml
@@ -7,9 +7,7 @@ loved: Loved
 we-loved-them-so-much: We loved them so much
 pending: Pending
 they-are-also-good-maps: They are also good maps
-search-by-bid: Search by BID
-search-by-sid: Search by SID
-search-by-name: Search by Name
+search: Search
 beatmap: Beatmap
 cs-keys: CS / Keys
 ar: AR
diff --git a/locales/admin/beatmaps/en-US.yml b/locales/admin/beatmaps/en-US.yml
index 0bc3dd31..4244df98 100644
--- a/locales/admin/beatmaps/en-US.yml
+++ b/locales/admin/beatmaps/en-US.yml
@@ -7,9 +7,7 @@ loved: Loved
 we-loved-them-so-much: We loved them so much
 pending: Pending
 they-are-also-good-maps: They are also good maps
-search-by-bid: Search by BID
-search-by-sid: Search by SID
-search-by-name: Search by Name
+search: Search
 beatmap: Beatmap
 cs-keys: CS / Keys
 ar: AR
diff --git a/locales/admin/beatmaps/zh-CN.yml b/locales/admin/beatmaps/zh-CN.yml
index 517214ab..c8f6ac56 100644
--- a/locales/admin/beatmaps/zh-CN.yml
+++ b/locales/admin/beatmaps/zh-CN.yml
@@ -1,5 +1,5 @@
-welcome-to-beatmaps-panel: 欢迎来到铺面管理面板
-total-beatmaps: 铺面总数量
+welcome-to-beatmaps-panel: 欢迎来到谱面管理面板
+total-beatmaps: 谱面总数量
 thats-a-lot-of-maps: 那可真是不少图呀!
 ranked: Ranked
 these-maps-can-gain-many-pp: 这些图能刷到许多pp
@@ -7,10 +7,8 @@ loved: Loved
 we-loved-them-so-much: 我们都"爱"它们
 pending: Pending
 they-are-also-good-maps: 它们仍然是张好图
-search-by-bid: Search by BID
-search-by-sid: Search by SID
-search-by-name: Search by Name
-beatmap: 铺面
+search: 搜索
+beatmap: 谱面
 cs-keys: CS / Keys
 ar: AR
 hp: HP
diff --git a/main.py b/main.py
index a01a1eb8..d76e20f6 100755
--- a/main.py
+++ b/main.py
@@ -71,8 +71,25 @@ def appName() -> str:
 @app.template_global()
 def decode_priv(target_priv: int) -> str:
     priv_list = [priv.name for priv in Privileges if target_priv & priv and bin(priv).count("1") == 1][::-1]
-    if 'Normal' not in priv_list:
-        priv_list.append('Banned')
+    if 'Unrestricted' not in priv_list:
+        return 'Restricted'
+    if 'Verified' not in priv_list:
+        return 'Disclaimed'
+    if set(['Verified', 'Unrestricted']).issubset(priv_list):
+        priv_list.remove('Verified')
+        priv_list.remove('Unrestricted')
+        priv_list.append('Normal')
+    if set(['Dangerous', 'Admin', 'Mod']).issubset(priv_list):
+        priv_list.remove('Dangerous')
+        priv_list.remove('Admin')
+        priv_list.remove('Mod')
+        priv_list.append('Stuff')
+    if set(['Supporter', 'Premium']).issubset(priv_list):
+        priv_list.remove('Supporter')
+        priv_list.remove('Premium')
+        priv_list.append('Donator')
+    if 'Normal' in priv_list and len(priv_list) != 1:
+        priv_list.remove('Normal')
     return ', '.join(priv_list)
 
 @app.template_global()
diff --git a/objects/privileges.py b/objects/privileges.py
index 4c69b024..2c0affbb 100644
--- a/objects/privileges.py
+++ b/objects/privileges.py
@@ -10,7 +10,8 @@ class Privileges(IntFlag):
     """Server side user privileges."""
 
     # privileges intended for all normal players.
-    Normal      = 1 << 0 # is an unbanned player.
+    
+    Unrestricted = 1 << 0 # is an unbanned player.
     Verified    = 1 << 1 # has logged in to the server in-game.
 
     # has bypass to low-ceiling anticheat measures (trusted).
diff --git a/static/js/main.js b/static/js/main.js
index ec78bf33..128c61ea 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -1,4 +1,3 @@
-// @ts-check
 // sticky header
 $(window).scroll(() => {
     var header = document.getElementById("navbar");
@@ -73,39 +72,4 @@ function searchUser() {
             })
         }
     })
-}
-
-function admin_search() {
-    const search = document.getElementById('search-bar')
-    if (!search) return
-    window.location.href = '/admin/users?search=' + search.value
-}
-
-function map_admin_search(name) {
-    const search = document.getElementById('search-bar')
-    if (!search) return
-    window.location.href = '/admin/beatmaps/search?' + name + '=' + search.value
-}
-
-function map_admin_force_update(sid) {
-    _testGlobals(
-        { exists: ['domain', 'api_key'] }
-    )
-    var bar = document.getElementById('progress_bar')
-    var elements = document.getElementsByClassName('operate-button');
-    bar && bar.removeAttribute('style')
-    Array.prototype.forEach.call(elements, function (element) {
-        element.classList.add('is-disabled')
-    });
-    $.get('//api.' + window.domain + '/update_beatmapsets?api_key=' + window.api_key + '&sid=' + sid, function (data, status) {
-        bar && setStyle(bar, {
-            display: 'none'
-        })
-        Array.prototype.forEach.call(elements, function (element) {
-            element.classList.remove('is-disabled')
-        });
-        if (status == 'success') {
-            window.location.href = '/admin/beatmaps/search?sid=' + data['sid']
-        }
-    })
-}
+}
\ No newline at end of file
diff --git a/static/js/pages/admin/beatmaps.js b/static/js/pages/admin/beatmaps.js
new file mode 100644
index 00000000..4e1dea05
--- /dev/null
+++ b/static/js/pages/admin/beatmaps.js
@@ -0,0 +1,29 @@
+function searchMaps() {
+    const search = document.getElementById('search-bar')
+    if (!search) return
+    if (search.value == '') window.location.href = '/admin/beatmaps'
+    else window.location.href = '/admin/beatmaps/search/' + search.value
+}
+
+function updateMaps(sid) {
+    _testGlobals(
+        { exists: ['domain', 'api_key'] }
+    )
+    var bar = document.getElementById('progress_bar')
+    var elements = document.getElementsByClassName('operate-button');
+    bar && bar.removeAttribute('style')
+    Array.prototype.forEach.call(elements, function (element) {
+        element.classList.add('is-disabled')
+    });
+    $.get('//api.' + window.domain + '/update_maps?api_key=' + window.api_key + '&id=' + sid, function (data, status) {
+        bar && setStyle(bar, {
+            display: 'none'
+        })
+        Array.prototype.forEach.call(elements, function (element) {
+            element.classList.remove('is-disabled')
+        });
+        if (status == 'success') {
+            window.location.href = '/admin/beatmaps/search/' + data['sid']
+        }
+    })
+}
\ No newline at end of file
diff --git a/static/js/pages/admin/users.js b/static/js/pages/admin/users.js
new file mode 100644
index 00000000..93ee41d1
--- /dev/null
+++ b/static/js/pages/admin/users.js
@@ -0,0 +1,6 @@
+function searchUsers() {
+    const search = document.getElementById('search-bar')
+    if (!search) return
+    if (search.value == '') window.location.href = '/admin/users'
+    else window.location.href = '/admin/users/search/' + search.value
+}
\ No newline at end of file
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 0ed5a119..3a42f07c 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -61,7 +61,6 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
 <div class="row row-deck row-cards" style="margin-top: 20px">
     <div class="columns is-marginless is-paddingless">
         <div class="column is-paddingless pr-3 py-3">
-            <a href="/admin/beatmaps/osu" class="button" style="width: 100%; margin-bottom: 10px">{{t("global.mode.osu")}}</a>
             <div class="card has-text-right">
                 <i class="fa fa-plus"></i>
                 <div class="title">{{t("admin.beatmaps.total-beatmaps")}}</div>
@@ -70,7 +69,6 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
             </div>
         </div>
         <div class="column is-paddingless p-3">
-            <a href="/admin/beatmaps/taiko" class="button" style="width: 100%; margin-bottom: 10px">{{t("global.mode.taiko")}}</a>
             <div class="card has-text-right">
                 <i class="fa fa-bolt"></i>
                 <div class="title">{{t("admin.beatmaps.ranked")}}</div>
@@ -79,7 +77,6 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
             </div>
         </div>
         <div class="column is-paddingless p-3">
-            <a href="/admin/beatmaps/catch" class="button" style="width: 100%; margin-bottom: 10px">{{t("global.mode.catch")}}</a>
             <div class="card has-text-right">
                 <i class="fa fa-heart"></i>
                 <div class="title">{{t("admin.beatmaps.loved")}}</div>
@@ -88,7 +85,6 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
             </div>
         </div>
         <div class="column is-paddingless pl-3 py-3">
-            <a href="/admin/beatmaps/mania" class="button" style="width: 100%; margin-bottom: 10px">{{t("global.mode.mania")}}</a>
             <div class="card has-text-right">
                 <i class="fa fa-arrows-rotate"></i>
                 <div class="title">{{t("admin.beatmaps.pending")}}</div>
@@ -99,9 +95,7 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
     </div>
     <div class="p-0 d-flex gap-2 py-3">
         <input id="search-bar" class="input" value="{{ search_word }}">
-        <button onclick="map_admin_search('bid')" class="button" style="width: 200px">{{t("admin.beatmaps.search-by-bid")}}</button>
-        <button onclick="map_admin_search('sid')" class="button" style="width: 200px">{{t("admin.beatmaps.search-by-sid")}}</button>
-        <button onclick="map_admin_search('name')" class="button" style="width: 200px">{{t("admin.beatmaps.search-by-name")}}</button>
+        <button onclick="searchMaps()" class="button" style="width: 200px">{{t("admin.beatmaps.search")}}</button>
     </div>
     <div class="table-responsive py-3">
         <table class="table rounded">
@@ -156,9 +150,10 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
                     <td class="!bigger_td my-auto has-text-centered">
                         <div class="tag
                         {% if i.status == 2 %} is-primary
-                        {% elif i.status == 3 %} is-warning
-                        {% elif i.status == 4 %} is-success 
+                        {% elif i.status == 3 %} is-success
+                        {% elif i.status == 0 %} is-light
                         {% elif i.status == 5 %} is-danger 
+                        {% else %} is-dark 
                         {% endif %}
                         ">{{ decode_map_status(i.status) }}</div>
                     </td>
@@ -174,17 +169,17 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
                             </div>
                             <div class="dropdown-menu" id="dropdown-menu-{{ i.map_id }}" role="menu">
                                 <div class="dropdown-content has-background-primary">
-                                    <a class="dropdown-item {% if i.status == 2 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=2&set=0">To Ranked</a>
-                                    <a class="dropdown-item {#{% if i.status == 5 %} is-disabled {% endif %}#}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=5&set=0">To Loved</a>
-                                    <a class="dropdown-item {% if i.status == 3 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=3&set=0">To Approved</a>
-                                    <a class="dropdown-item {% if i.status == 1 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=0&set=0">To Pending</a>
+                                    <a class="dropdown-item {% if i.status == 2 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=2&set=0">Ranked Diff</a>
+                                    <a class="dropdown-item {% if i.status == 5 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=5&set=0">Loved Diff</a>
+                                    <a class="dropdown-item {% if i.status == 3 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=3&set=0">Approved Diff</a>
+                                    <a class="dropdown-item {% if i.status == 0 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=0&set=0">Pending Diff</a>
                                     <hr class="dropdown-divider">
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=2&set=1">Rank BeatmapSet</a>
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">Love BeatmapSet</a>
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">Approve BeatmapSet</a>
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">Pending BeatmapSet</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=2&set=1">Ranked Set</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">Loved Set</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">Approved Set</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">Pending Set</a>
                                     <hr class="dropdown-divider">
-                                    <a class="dropdown-item operate-button" href="javascript:void(0);" onclick="map_admin_force_update({{ i.set_id }})">
+                                    <a class="dropdown-item operate-button" href="javascript:void(0);" onclick="updateMaps({{ i.set_id }})">
                                         Sync Beatmapsets with Bancho
                                     </a>
                                 </div>
@@ -221,4 +216,5 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
         });
     });
 </script>
+<script src="/static/js/pages/admin/beatmaps.js?v={{ appVersion() }} " crossorigin="anonymous"></script>
 {% endblock %}
\ No newline at end of file
diff --git a/templates/admin/users.html b/templates/admin/users.html
index d254e340..ad0f2e53 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users.html
@@ -36,7 +36,7 @@ <h2 class="section-title">{{ t("admin.base.users") }}</h2>
         <div class="column px-3 pb-2 pt-4 d-flex gap-2">
             <input id="search-bar" class="input" v-model.trim="search" placeholder='{{t("admin.users.search-by-username-or-email")}}'
                 value="{{ search_value }}">
-            <a class="button is-primary" onclick="admin_search()">{{t("admin.users.search")}}</a>
+            <a class="button is-primary" onclick="searchUsers()">{{t("admin.users.search")}}</a>
         </div>
     </div>
     <div class="table-responsive">
@@ -110,9 +110,10 @@ <h2 class="section-title">{{ t("admin.base.users") }}</h2>
 <script>
     $("#search-bar").keydown(function (e) {
         if (e.keyCode == 13) {
-            admin_search()
+            searchUsers()
         }
     });  
 </script>
+<script src="/static/js/pages/admin/users.js?v={{ appVersion() }} " crossorigin="anonymous"></script>
 
 {% endblock content %}
\ No newline at end of file

From ed95b9d488f5ff59bf73e8c8a35b59b3f7f67fbc Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 14:33:08 +0000
Subject: [PATCH 173/278] fix priv

---
 blueprints/frontend.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 0a8c7641..f74381e8 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -359,7 +359,7 @@ async def profile_select(id):
         return (await render_template('404.html'), 404)
 
     is_staff = 'authenticated' in session and session['user_data']['is_staff']
-    if not user_data or not (user_data['priv'] & Privileges.Normal or is_staff):
+    if not user_data or not (user_data['priv'] & Privileges.Unrestricted or is_staff):
         return (await render_template('404.html'), 404)
 
     user_data['customisation'] = utils.has_profile_customizations(user_data['id'])

From 2ae2936ebc94f73759d58a0be89077025a8096c7 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 14:40:08 +0000
Subject: [PATCH 174/278] fix priv

---
 blueprints/frontend.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index f74381e8..5227e8d2 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -439,7 +439,7 @@ async def login_post():
         return await render_template('verify.html')
 
     # user banned; deny post
-    if not user_info['priv'] & Privileges.Normal:
+    if not user_info['priv'] & Privileges.Unrestricted:
         if glob.config.debug:
             log(f"{username}'s login failed - banned.", Ansi.RED)
         return await flash('error', t('login.restricted-not-allowed-to-login'), 'login')

From e4f355645e9216cb515b9053aa823b923c0a1c5e Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 14:42:10 +0000
Subject: [PATCH 175/278] fix glob not import

---
 blueprints/i18npy.py | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/blueprints/i18npy.py b/blueprints/i18npy.py
index 01cc38f6..5fefaeeb 100644
--- a/blueprints/i18npy.py
+++ b/blueprints/i18npy.py
@@ -3,7 +3,8 @@
 #不能放入main.py当中,会产生循环导入
 #(待翻译成en)
 
-from quart import Blueprint, Quart, session
+from quart import Quart, session
+from objects import glob
 
 import i18n
 

From f484b79935502c748f6a7272bed72c4335710f63 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 4 Aug 2022 14:51:45 +0000
Subject: [PATCH 176/278] fix breaking profile.html

---
 templates/profile.html | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/templates/profile.html b/templates/profile.html
index a0f8749e..e2acd123 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -180,7 +180,7 @@ <h1 class="title">
                     </div>
                     <div class="subtitle" v-else-if='data.status.online == true' :style="{
                         display: 'flex',
-                        gap: 0.5em
+                        gap: '0.5em'
                     }">
                         <a class='circle green'>●</a> {{ t('global.online') }}
                         <transition name="click">
@@ -225,8 +225,7 @@ <h1 class="title">
                         <span class="mods-shorttext">{{ t('global.mode.VN') }}</span></a>
                     <a class="simple-banner-switch"
                         :class=" { 'selected': mods === 'rx', 'disabled': mode === 'mania' }"
-                        @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">{{ t('global.mode.relax')
-                            }}</span>
+                        @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">{{ t('global.mode.relax') }}</span>
                         <span class="mods-shorttext">{{ t('global.mode.RX') }}</span></a>
                     <a class="simple-banner-switch"
                         :class=" { 'selected': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"

From c9a23cbbb91ece3239759bd34784a0b16f8dcd44 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 14:54:21 +0000
Subject: [PATCH 177/278] fix typo

---
 locales/admin/base/zh-CN.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/locales/admin/base/zh-CN.yml b/locales/admin/base/zh-CN.yml
index ffe8baec..757df833 100644
--- a/locales/admin/base/zh-CN.yml
+++ b/locales/admin/base/zh-CN.yml
@@ -9,4 +9,4 @@ twitter: 推特
 youtube: YouTube
 users: 用户管理
 restrictions: 封禁管理
-beatmaps: 铺面管理
+beatmaps: 谱面管理

From 12a9dc0999b3a5c8199a9644115cd762b01b3f34 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 15:03:05 +0000
Subject: [PATCH 178/278] edit readme

---
 README.md | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 6dd7fb71..69f02731 100644
--- a/README.md
+++ b/README.md
@@ -1,7 +1,7 @@
 Table of Contents
 ==================
 - [Table of Contents](#table-of-contents)
-  - [What is ppy-sb-guweb?](#what-is-ppy-sb-guweb)
+  - [What is guweb?](#what-is-guweb)
   - [Requirements](#requirements)
   - [Setup](#setup)
   - [Translation](#translation)
@@ -12,7 +12,7 @@ Table of Contents
   - [The team](#the-team)
   - [The End](#the-end)
 
-What is ppy-sb-guweb?
+What is guweb?
 ------
 
 guweb is the front-facing appearance of the osu! server protocol, [gulag](https://github.com/cmyui/gulag)!
@@ -121,6 +121,7 @@ The team
 ------
 - [Yoru](https://github.com/Yo-ru) | Backend, Grammar Checking [Deprecated]
 - [Varkaria](https://github.com/Varkaria) | Frontend, Backend?
+- [ppysb-Team](https://github.com/ppy-sb) | i18n, Maintainer
 
 The End
 ------

From 74cde191051e9eef4deea74295d4cc94f9dcaa0b Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 4 Aug 2022 15:53:04 +0000
Subject: [PATCH 179/278] render markdown

---
 README.md              | 20 ++++++++++----------
 main.py                |  6 ++++++
 templates/profile.html | 24 ++++++++++++++++++++++--
 3 files changed, 38 insertions(+), 12 deletions(-)

diff --git a/README.md b/README.md
index 69f02731..317567b7 100644
--- a/README.md
+++ b/README.md
@@ -1,16 +1,16 @@
 Table of Contents
 ==================
 - [Table of Contents](#table-of-contents)
-  - [What is guweb?](#what-is-guweb)
-  - [Requirements](#requirements)
-  - [Setup](#setup)
-  - [Translation](#translation)
-    - [requirements](#requirements-1)
-    - [prepare](#prepare)
-    - [how to](#how-to)
-  - [Directory Structure](#directory-structure)
-  - [The team](#the-team)
-  - [The End](#the-end)
+    - [What is guweb?](#what-is-guweb)
+    - [Requirements](#requirements)
+    - [Setup](#setup)
+    - [Translation](#translation)
+        - [requirements](#requirements-1)
+        - [prepare](#prepare)
+        - [how to](#how-to)
+    - [Directory Structure](#directory-structure)
+    - [The team](#the-team)
+    - [The End](#the-end)
 
 What is guweb?
 ------
diff --git a/main.py b/main.py
index d76e20f6..42058f83 100755
--- a/main.py
+++ b/main.py
@@ -7,6 +7,8 @@
 import time
 from objects.privileges import Privileges
 
+import markdown2
+
 import aiohttp
 import i18n
 import orjson
@@ -125,6 +127,10 @@ def domain() -> str:
 def config():
     return glob.config
 
+@app.template_global()
+def render_markdown(md: str) -> str:
+    return markdown2.markdown(md)
+
 from blueprints.frontend import frontend
 app.register_blueprint(frontend)
 
diff --git a/templates/profile.html b/templates/profile.html
index e2acd123..25af99ef 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -10,8 +10,8 @@
         </div>
     </div>
     <div class="stats-block rank-block" style="padding: 12.5px;">
-        <article>
-            {{ user['userpage_content']|safe }}
+        <article class="reset-bulma-style">
+            {{ render_markdown(user['userpage_content']) | safe }}
         </article>
     </div>
 </div>
@@ -160,6 +160,26 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
     .rounded-sm {
         border-radius: 0.5em;
     }
+    .reset-bulma-style {
+
+    }
+
+    .reset-bulma-style h1,
+    .reset-bulma-style h2,
+    .reset-bulma-style h3,
+    .reset-bulma-style h4,
+    .reset-bulma-style h5,
+    .reset-bulma-style h6 {
+        font-size: initial;
+        font-weight: initial;
+    }
+    .reset-bulma-style ul,
+    .reset-bulma-style li {
+        list-style: initial;
+        padding: initial;
+        margin: initial;
+        margin-left: 1em
+    }
 </style>
 {% endblock %}
 

From e045b582382128ff6a43813c30337cf03486736d Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 4 Aug 2022 16:08:33 +0000
Subject: [PATCH 180/278] styling (UGLY)

---
 templates/profile.html | 160 ++++++++++++++++++++++++++++++++++++++---
 1 file changed, 152 insertions(+), 8 deletions(-)

diff --git a/templates/profile.html b/templates/profile.html
index 25af99ef..e00fa457 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -11,7 +11,7 @@
     </div>
     <div class="stats-block rank-block" style="padding: 12.5px;">
         <article class="reset-bulma-style">
-            {{ render_markdown(user['userpage_content']) | safe }}
+            <div>{{ render_markdown(user['userpage_content']) | safe }}</div>
         </article>
     </div>
 </div>
@@ -160,25 +160,168 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
     .rounded-sm {
         border-radius: 0.5em;
     }
-    .reset-bulma-style {
-
-    }
 
+    .reset-bulma-style div,
+    .reset-bulma-style span,
+    .reset-bulma-style applet,
+    .reset-bulma-style object,
+    .reset-bulma-style iframe,
     .reset-bulma-style h1,
     .reset-bulma-style h2,
     .reset-bulma-style h3,
     .reset-bulma-style h4,
     .reset-bulma-style h5,
-    .reset-bulma-style h6 {
+    .reset-bulma-style h6,
+    .reset-bulma-style p,
+    .reset-bulma-style blockquote,
+    .reset-bulma-style pre,
+    .reset-bulma-style a,
+    .reset-bulma-style abbr,
+    .reset-bulma-style acronym,
+    .reset-bulma-style address,
+    .reset-bulma-style big,
+    .reset-bulma-style cite,
+    .reset-bulma-style code,
+    .reset-bulma-style del,
+    .reset-bulma-style dfn,
+    .reset-bulma-style em,
+    .reset-bulma-style img,
+    .reset-bulma-style ins,
+    .reset-bulma-style kbd,
+    .reset-bulma-style q,
+    .reset-bulma-style s,
+    .reset-bulma-style samp,
+    .reset-bulma-style small,
+    .reset-bulma-style strike,
+    .reset-bulma-style strong,
+    .reset-bulma-style sub,
+    .reset-bulma-style sup,
+    .reset-bulma-style tt,
+    .reset-bulma-style var,
+    .reset-bulma-style b,
+    .reset-bulma-style u,
+    .reset-bulma-style i,
+    .reset-bulma-style center,
+    .reset-bulma-style dl,
+    .reset-bulma-style dt,
+    .reset-bulma-style dd,
+    .reset-bulma-style ol,
+    .reset-bulma-style ul,
+    .reset-bulma-style li,
+    .reset-bulma-style fieldset,
+    .reset-bulma-style form,
+    .reset-bulma-style label,
+    .reset-bulma-style legend,
+    .reset-bulma-style table,
+    .reset-bulma-style caption,
+    .reset-bulma-style tbody,
+    .reset-bulma-style tfoot,
+    .reset-bulma-style thead,
+    .reset-bulma-style tr,
+    .reset-bulma-style th,
+    .reset-bulma-style td,
+    .reset-bulma-style article,
+    .reset-bulma-style aside,
+    .reset-bulma-style canvas,
+    .reset-bulma-style details,
+    .reset-bulma-style embed,
+    .reset-bulma-style figure,
+    .reset-bulma-style figcaption,
+    .reset-bulma-style footer,
+    .reset-bulma-style header,
+    .reset-bulma-style hgroup,
+    .reset-bulma-style menu,
+    .reset-bulma-style nav,
+    .reset-bulma-style output,
+    .reset-bulma-style ruby,
+    .reset-bulma-style section,
+    .reset-bulma-style summary,
+    .reset-bulma-style time,
+    .reset-bulma-style mark,
+    .reset-bulma-style audio,
+    .reset-bulma-style video {
+        margin: 0;
+        padding: 0;
+        border: 0;
         font-size: initial;
-        font-weight: initial;
+        font: inherit;
+        vertical-align: baseline;
     }
+
+
+    /* HTML5 display-role reset for older browsers */
+
+    article,
+    .reset-bulma-style aside,
+    .reset-bulma-style details,
+    .reset-bulma-style figcaption,
+    .reset-bulma-style figure,
+    .reset-bulma-style footer,
+    .reset-bulma-style header,
+    .reset-bulma-style hgroup,
+    .reset-bulma-style menu,
+    .reset-bulma-style nav,
+    .reset-bulma-style section {
+        display: block;
+    }
+
+    .reset-bulma-style body {
+        line-height: 1;
+    }
+
+    .reset-bulma-style ol,
+    .reset-bulma-style ul {
+        list-style: none;
+    }
+
+    .reset-bulma-style blockquote,
+    .reset-bulma-style q {
+        quotes: none;
+    }
+
+    .reset-bulma-style blockquote:before,
+    .reset-bulma-style blockquote:after,
+    .reset-bulma-style q:before,
+    .reset-bulma-style q:after {
+        content: '';
+        content: none;
+    }
+
+    .reset-bulma-style table {
+        border-collapse: collapse;
+        border-spacing: 0;
+    }
+
     .reset-bulma-style ul,
     .reset-bulma-style li {
         list-style: initial;
         padding: initial;
         margin: initial;
-        margin-left: 1em
+        margin-left: 1em;
+    }
+
+    .reset-bulma-style h1 {
+        font-size: 2.5em;
+    }
+
+    .reset-bulma-style h2 {
+        font-size: 2em;
+    }
+
+    .reset-bulma-style h3 {
+        font-size: 1.67em;
+    }
+
+    .reset-bulma-style h4 {
+        font-size: 1.33em;
+    }
+
+    .reset-bulma-style h5 {
+        font-size: 1em;
+    }
+
+    .reset-bulma-style h6 {
+        font-size: 0.5em;
     }
 </style>
 {% endblock %}
@@ -245,7 +388,8 @@ <h1 class="title">
                         <span class="mods-shorttext">{{ t('global.mode.VN') }}</span></a>
                     <a class="simple-banner-switch"
                         :class=" { 'selected': mods === 'rx', 'disabled': mode === 'mania' }"
-                        @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">{{ t('global.mode.relax') }}</span>
+                        @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">{{ t('global.mode.relax')
+                            }}</span>
                         <span class="mods-shorttext">{{ t('global.mode.RX') }}</span></a>
                     <a class="simple-banner-switch"
                         :class=" { 'selected': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"

From 43208d9f3249570cddeef888995f58a330986670 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 16:25:46 +0000
Subject: [PATCH 181/278] sid not id

---
 static/js/pages/admin/beatmaps.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/static/js/pages/admin/beatmaps.js b/static/js/pages/admin/beatmaps.js
index 4e1dea05..57f861dc 100644
--- a/static/js/pages/admin/beatmaps.js
+++ b/static/js/pages/admin/beatmaps.js
@@ -15,7 +15,7 @@ function updateMaps(sid) {
     Array.prototype.forEach.call(elements, function (element) {
         element.classList.add('is-disabled')
     });
-    $.get('//api.' + window.domain + '/update_maps?api_key=' + window.api_key + '&id=' + sid, function (data, status) {
+    $.get('//api.' + window.domain + '/update_maps?api_key=' + window.api_key + '&sid=' + sid, function (data, status) {
         bar && setStyle(bar, {
             display: 'none'
         })

From 03ccf3174ecc08f41fe767166fad23cf1c6163f5 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 4 Aug 2022 16:32:25 +0000
Subject: [PATCH 182/278] move style to macro

---
 templates/profile.html | 315 +++++++++++++++++++++--------------------
 1 file changed, 158 insertions(+), 157 deletions(-)

diff --git a/templates/profile.html b/templates/profile.html
index e00fa457..a59e8cf0 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -3,164 +3,7 @@
 
 {% macro userpage(user) %}
 {% if user['userpage_content'] != None and user['userpage_content'] != "" %}
-<div class="log-block">
-    <div class="header">
-        <div class="title">
-            <i class="fas fa-address-book"></i> About me
-        </div>
-    </div>
-    <div class="stats-block rank-block" style="padding: 12.5px;">
-        <article class="reset-bulma-style">
-            <div>{{ render_markdown(user['userpage_content']) | safe }}</div>
-        </article>
-    </div>
-</div>
-{% endif %}
-{% endmacro %}
-
-{% macro scores(title, id) %}
-<div class="log-block" :class="{ load : data.scores.{{ id }}.load }">
-    <div class="header">
-        <div class="title">
-            <i class="fas fa-trophy"></i> {{ title }}
-        </div>
-    </div>
-    <div v-if="data.scores.{{ id }}.out.length" class="scores">
-        <div v-for="(map, index) in data.scores.{{ id }}.out" class="map-single" ref="scores" :key="map.beatmap.map_id"
-            :style="`background: linear-gradient(hsl(var(--main), 25%, 25%, 90%), hsl(var(--main), 25%, 25%, 90%)), url(https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/cover.jpg)`">
-            <div class="map-data" @click="window.open(`https://osu.ppy.sh/beatmaps/${map.beatmap.id}`) ">
-                <div class="map-content1">
-                    <div class="map-image">
-                        <img :src="`https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/card.jpg`"
-                            class="map-image-picture">
-                    </div>
-                    <div class="map-title-block">
-                        <div class="map-title">
-                            <a class="beatmap-link">
-                                <% map.beatmap.artist %> - <% map.beatmap.title %> [<% map.beatmap.version %>]
-                                            <!--<span v-if="map.mods != 0">+ <% modsStr(map.mods) %></span>-->
-                            </a>
-                        </div>
-                        <div class="play-stats">
-                            <% map.mods_str %> / <b>
-                                    <% addCommas(map.max_combo) %>
-                                </b>x
-                        </div>
-                        <div class="map-date">
-                            <time>
-                                <% timeago.format(map.play_time) %>
-                            </time>
-                        </div>
-                    </div>
-                </div>
-                <div class="map-content2">
-                    <div class="score-details d-flex">
-                        <div class="score-details_right-block">
-                            <div class="score-details_pp-block">
-                                <div class="map-pp">
-                                    <% addCommas(map.pp.toFixed()) %><span class="map-pp-unit">{{ t('global.pp')
-                                            }}</span>
-                                </div>
-                                <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
-                                        <% map.acc.toFixed(2) %>%
-                                    </b></div>
-                            </div>
-                            <div class="score-details_grade-block">
-                                <div class="rank-single">
-                                    <div :class="`map-rank rank-${map.grade}`">
-                                        <% map.grade.replace("X", "SS" ).replace("H", "" ) %>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-    <div v-else-if="data.scores.{{ id }}.out.length == 0" class="stats-block">
-        <div class="columns is-marginless">
-            <div class="column is-1">
-                <h1 class="title">: (</h1>
-            </div>
-            <div class="column">
-                <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
-                <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
-            </div>
-        </div>
-    </div>
-    <div v-if="data.scores.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button rounded-sm" @click="AddLimit('{{ id }}score')">{{ t('profile.show-more') }}</a>
-    </div>
-</div>
-{% endmacro %}
-
-{% macro maps(title, id) %}
-<div class="log-block" :class="{ load : data.maps.{{ id }}.load }">
-    <div class="header">
-        <div class="title">
-            <i class="fas fa-address-book"></i> {{ title }}
-        </div>
-    </div>
-    <div v-if="data.maps.{{ id }}.out.length" class="beatmaps">
-        <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block rounded-sm" ref="mostPlayed"
-            :key="map.id">
-            <div class="beatmap-preview"
-                :style='{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }'>
-            </div>
-            <div class="beatmap-stats"><span class="beatmap-title">
-                    <% map.title %>
-                </span> <span class="beatmap-artist">
-                    <% map.artist %>
-                </span>
-                <div class="beatmap-footer"><span class="beatmap-mapper"> {{ t('profile.by') }} <span
-                            class="newmaps-color">
-                            <% map.creator %>
-                        </span></span>
-                    <div class="d-flex align-items-baseline"><span>
-                            <% map.plays %>
-                        </span>
-                        <div class="target-button newmaps-color"><i class="fas fa-arrow-right"></i>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </a>
-    </div>
-    <div v-else-if="data.maps.{{ id }}.out.length == 0" class="stats-block">
-        <div class="columns is-marginless">
-            <div class="column is-1">
-                <h1 class="title">: (</h1>
-            </div>
-            <div class="column">
-                <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
-                <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
-            </div>
-        </div>
-    </div>
-    <div v-if="data.maps.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button rounded-sm" @click="AddLimit('mostplay')">{{ t('profile.show-more') }}</a>
-    </div>
-</div>
-{% endmacro %}
-
-{% block header %}
-<script src="/static/js/assets/vue.js?v={{ appVersion() }} "></script>
-<script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
-<link rel="stylesheet" href="/static/css/pages/profile.css?v={{ appVersion() }} ">
-
-<script>
-    window.userid = Number("{{ user['id'] }}"); //For text editor doesn't dizzy lmao
-    window.mode = '{{ mode }}';
-    window.mods = '{{ mods }}';
-    window.domain = "{{ domain() }}";
-</script>
 <style>
-    .rounded-sm {
-        border-radius: 0.5em;
-    }
-
     .reset-bulma-style div,
     .reset-bulma-style span,
     .reset-bulma-style applet,
@@ -324,6 +167,164 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
         font-size: 0.5em;
     }
 </style>
+<div class="log-block">
+    <div class="header">
+        <div class="title">
+            <i class="fas fa-address-book"></i> About me
+        </div>
+    </div>
+    <div class="stats-block rank-block" style="padding: 12.5px;">
+        <article class="reset-bulma-style">
+            {{ render_markdown(user['userpage_content']) | safe }}
+        </article>
+    </div>
+</div>
+{% endif %}
+{% endmacro %}
+
+{% macro scores(title, id) %}
+<div class="log-block" :class="{ load : data.scores.{{ id }}.load }">
+    <div class="header">
+        <div class="title">
+            <i class="fas fa-trophy"></i> {{ title }}
+        </div>
+    </div>
+    <div v-if="data.scores.{{ id }}.out.length" class="scores">
+        <div v-for="(map, index) in data.scores.{{ id }}.out" class="map-single" ref="scores" :key="map.beatmap.map_id"
+            :style="`background: linear-gradient(hsl(var(--main), 25%, 25%, 90%), hsl(var(--main), 25%, 25%, 90%)), url(https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/cover.jpg)`">
+            <div class="map-data" @click="window.open(`https://osu.ppy.sh/beatmaps/${map.beatmap.id}`) ">
+                <div class="map-content1">
+                    <div class="map-image">
+                        <img :src="`https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/card.jpg`"
+                            class="map-image-picture">
+                    </div>
+                    <div class="map-title-block">
+                        <div class="map-title">
+                            <a class="beatmap-link">
+                                <% map.beatmap.artist %> - <% map.beatmap.title %> [<% map.beatmap.version %>]
+                                            <!--<span v-if="map.mods != 0">+ <% modsStr(map.mods) %></span>-->
+                            </a>
+                        </div>
+                        <div class="play-stats">
+                            <% map.mods_str %> / <b>
+                                    <% addCommas(map.max_combo) %>
+                                </b>x
+                        </div>
+                        <div class="map-date">
+                            <time>
+                                <% timeago.format(map.play_time) %>
+                            </time>
+                        </div>
+                    </div>
+                </div>
+                <div class="map-content2">
+                    <div class="score-details d-flex">
+                        <div class="score-details_right-block">
+                            <div class="score-details_pp-block">
+                                <div class="map-pp">
+                                    <% addCommas(map.pp.toFixed()) %><span class="map-pp-unit">{{ t('global.pp')
+                                            }}</span>
+                                </div>
+                                <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
+                                        <% map.acc.toFixed(2) %>%
+                                    </b></div>
+                            </div>
+                            <div class="score-details_grade-block">
+                                <div class="rank-single">
+                                    <div :class="`map-rank rank-${map.grade}`">
+                                        <% map.grade.replace("X", "SS" ).replace("H", "" ) %>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div v-else-if="data.scores.{{ id }}.out.length == 0" class="stats-block">
+        <div class="columns is-marginless">
+            <div class="column is-1">
+                <h1 class="title">: (</h1>
+            </div>
+            <div class="column">
+                <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
+                <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
+            </div>
+        </div>
+    </div>
+    <div v-if="data.scores.{{ id }}.more.full == false" class="extra-block">
+        <a class="show-button rounded-sm" @click="AddLimit('{{ id }}score')">{{ t('profile.show-more') }}</a>
+    </div>
+</div>
+{% endmacro %}
+
+{% macro maps(title, id) %}
+<div class="log-block" :class="{ load : data.maps.{{ id }}.load }">
+    <div class="header">
+        <div class="title">
+            <i class="fas fa-address-book"></i> {{ title }}
+        </div>
+    </div>
+    <div v-if="data.maps.{{ id }}.out.length" class="beatmaps">
+        <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block rounded-sm" ref="mostPlayed"
+            :key="map.id">
+            <div class="beatmap-preview"
+                :style='{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }'>
+            </div>
+            <div class="beatmap-stats"><span class="beatmap-title">
+                    <% map.title %>
+                </span> <span class="beatmap-artist">
+                    <% map.artist %>
+                </span>
+                <div class="beatmap-footer"><span class="beatmap-mapper"> {{ t('profile.by') }} <span
+                            class="newmaps-color">
+                            <% map.creator %>
+                        </span></span>
+                    <div class="d-flex align-items-baseline"><span>
+                            <% map.plays %>
+                        </span>
+                        <div class="target-button newmaps-color"><i class="fas fa-arrow-right"></i>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </a>
+    </div>
+    <div v-else-if="data.maps.{{ id }}.out.length == 0" class="stats-block">
+        <div class="columns is-marginless">
+            <div class="column is-1">
+                <h1 class="title">: (</h1>
+            </div>
+            <div class="column">
+                <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
+                <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
+            </div>
+        </div>
+    </div>
+    <div v-if="data.maps.{{ id }}.more.full == false" class="extra-block">
+        <a class="show-button rounded-sm" @click="AddLimit('mostplay')">{{ t('profile.show-more') }}</a>
+    </div>
+</div>
+{% endmacro %}
+
+{% block header %}
+<script src="/static/js/assets/vue.js?v={{ appVersion() }} "></script>
+<script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
+<link rel="stylesheet" href="/static/css/pages/profile.css?v={{ appVersion() }} ">
+
+<script>
+    window.userid = Number("{{ user['id'] }}"); //For text editor doesn't dizzy lmao
+    window.mode = '{{ mode }}';
+    window.mods = '{{ mods }}';
+    window.domain = "{{ domain() }}";
+</script>
+<style>
+    .rounded-sm {
+        border-radius: 0.5em;
+    }
+</style>
 {% endblock %}
 
 {% block content %}

From fd9318772da33becac7ea92a2d61f371e222b520 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 16:41:27 +0000
Subject: [PATCH 183/278] bump version & enter key when beatmaps search

---
 main.py                       | 2 +-
 templates/admin/beatmaps.html | 7 +++++++
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/main.py b/main.py
index 42058f83..b55ab52b 100755
--- a/main.py
+++ b/main.py
@@ -24,7 +24,7 @@
 
 app = Quart(__name__)
 
-version = Version(1, 3, 3)
+version = Version(1, 3, 4)
 
 # used to secure session data.
 # we recommend using a long randomly generated ascii string.
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 3a42f07c..c982b1cc 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -216,5 +216,12 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
         });
     });
 </script>
+<script>
+    $("#search-bar").keydown(function (e) {
+        if (e.keyCode == 13) {
+            searchMaps()
+        }
+    });  
+</script>
 <script src="/static/js/pages/admin/beatmaps.js?v={{ appVersion() }} " crossorigin="anonymous"></script>
 {% endblock %}
\ No newline at end of file

From b42014184e8685296374b71479ba6d7db8da78a8 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 16:45:13 +0000
Subject: [PATCH 184/278] numq should pass to where clause

---
 blueprints/admin.py | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 48b9aca6..73860b0d 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -2,6 +2,7 @@
 
 __all__ = ()
 
+from curses.ascii import isdigit
 from functools import wraps
 from quart import Blueprint
 from quart import render_template
@@ -152,13 +153,14 @@ async def beatmaps_search(q: str):
         "pending": query['p'], 
         "total": query['t']
     }
+    numq = int(q) if q.isdigit() else 0
     beatmaps = await glob.db.fetchall(
         'SELECT set_id, id AS `map_id`, status, '
         'artist, title, version AS `diff_name`, '
         'total_length AS length, creator, mode, '
         'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
         'FROM maps WHERE id=%s OR set_id=%s OR title like %s ORDER BY id DESC '
-        'LIMIT 50 OFFSET 0', [q, q, q + '%']
+        'LIMIT 50 OFFSET 0', [numq, numq, q + '%']
     )
     return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps, search_word=q)
 

From 028427e32d6377f40f047fae17d5a7ef19645c89 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 4 Aug 2022 16:50:36 +0000
Subject: [PATCH 185/278] align center

---
 templates/profile.html | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/templates/profile.html b/templates/profile.html
index a59e8cf0..4bfe6133 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -344,7 +344,8 @@ <h1 class="title">
                     </div>
                     <div class="subtitle" v-else-if='data.status.online == true' :style="{
                         display: 'flex',
-                        gap: '0.5em'
+                        gap: '0.5em',
+                        alignItems: 'center'
                     }">
                         <a class='circle green'>●</a> {{ t('global.online') }}
                         <transition name="click">

From 548fe18f9e3a1578635fd12839e0d531978cb3e8 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 16:57:02 +0000
Subject: [PATCH 186/278] fix permission

---
 blueprints/admin.py | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 73860b0d..3baf8bf1 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -113,7 +113,7 @@ async def users_update(id:int):
         return redirect('/admin/users.html')
 
 @admin.route('/beatmaps')
-@priv_check(priv=Privileges.Staff)
+@priv_check(priv=Privileges.Nominator)
 async def beatmaps():
     query = await glob.db.fetch(
         'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
@@ -139,7 +139,7 @@ async def beatmaps():
     return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps)
 
 @admin.route('/beatmaps/search/<q>')
-@priv_check(priv=Privileges.Staff)
+@priv_check(priv=Privileges.Nominator)
 async def beatmaps_search(q: str):
     query = await glob.db.fetch(
         'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '

From 854333e24ee6d2fc1a1c4061c3e91f3f1f6e3303 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 4 Aug 2022 16:57:27 +0000
Subject: [PATCH 187/278] fix styling

---
 templates/profile.html | 316 +++++++++++++++++++++--------------------
 1 file changed, 160 insertions(+), 156 deletions(-)

diff --git a/templates/profile.html b/templates/profile.html
index 4bfe6133..70f6ea84 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -2,6 +2,166 @@
 {% block title %} {{ t('global.profile') }} {% endblock %}
 
 {% macro userpage(user) %}
+{% if user['userpage_content'] != None and user['userpage_content'] != "" %}
+<div class="log-block">
+    <div class="header">
+        <div class="title">
+            <i class="fas fa-address-book"></i> About me
+        </div>
+    </div>
+    <div class="stats-block rank-block" style="padding: 12.5px;">
+        <article class="reset-bulma-style">
+            {{ render_markdown(user['userpage_content']) | safe }}
+        </article>
+    </div>
+</div>
+{% endif %}
+{% endmacro %}
+
+{% macro scores(title, id) %}
+<div class="log-block" :class="{ load : data.scores.{{ id }}.load }">
+    <div class="header">
+        <div class="title">
+            <i class="fas fa-trophy"></i> {{ title }}
+        </div>
+    </div>
+    <div v-if="data.scores.{{ id }}.out.length" class="scores">
+        <div v-for="(map, index) in data.scores.{{ id }}.out" class="map-single" ref="scores" :key="map.beatmap.map_id"
+            :style="`background: linear-gradient(hsl(var(--main), 25%, 25%, 90%), hsl(var(--main), 25%, 25%, 90%)), url(https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/cover.jpg)`">
+            <div class="map-data" @click="window.open(`https://osu.ppy.sh/beatmaps/${map.beatmap.id}`) ">
+                <div class="map-content1">
+                    <div class="map-image">
+                        <img :src="`https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/card.jpg`"
+                            class="map-image-picture">
+                    </div>
+                    <div class="map-title-block">
+                        <div class="map-title">
+                            <a class="beatmap-link">
+                                <% map.beatmap.artist %> - <% map.beatmap.title %> [<% map.beatmap.version %>]
+                                            <!--<span v-if="map.mods != 0">+ <% modsStr(map.mods) %></span>-->
+                            </a>
+                        </div>
+                        <div class="play-stats">
+                            <% map.mods_str %> / <b>
+                                    <% addCommas(map.max_combo) %>
+                                </b>x
+                        </div>
+                        <div class="map-date">
+                            <time>
+                                <% timeago.format(map.play_time) %>
+                            </time>
+                        </div>
+                    </div>
+                </div>
+                <div class="map-content2">
+                    <div class="score-details d-flex">
+                        <div class="score-details_right-block">
+                            <div class="score-details_pp-block">
+                                <div class="map-pp">
+                                    <% addCommas(map.pp.toFixed()) %><span class="map-pp-unit">{{ t('global.pp')
+                                            }}</span>
+                                </div>
+                                <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
+                                        <% map.acc.toFixed(2) %>%
+                                    </b></div>
+                            </div>
+                            <div class="score-details_grade-block">
+                                <div class="rank-single">
+                                    <div :class="`map-rank rank-${map.grade}`">
+                                        <% map.grade.replace("X", "SS" ).replace("H", "" ) %>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div v-else-if="data.scores.{{ id }}.out.length == 0" class="stats-block">
+        <div class="columns is-marginless">
+            <div class="column is-1">
+                <h1 class="title">: (</h1>
+            </div>
+            <div class="column">
+                <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
+                <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
+            </div>
+        </div>
+    </div>
+    <div v-if="data.scores.{{ id }}.more.full == false" class="extra-block">
+        <a class="show-button rounded-sm" @click="AddLimit('{{ id }}score')">{{ t('profile.show-more') }}</a>
+    </div>
+</div>
+{% endmacro %}
+
+{% macro maps(title, id) %}
+<div class="log-block" :class="{ load : data.maps.{{ id }}.load }">
+    <div class="header">
+        <div class="title">
+            <i class="fas fa-address-book"></i> {{ title }}
+        </div>
+    </div>
+    <div v-if="data.maps.{{ id }}.out.length" class="beatmaps">
+        <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block rounded-sm" ref="mostPlayed"
+            :key="map.id">
+            <div class="beatmap-preview"
+                :style='{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }'>
+            </div>
+            <div class="beatmap-stats"><span class="beatmap-title">
+                    <% map.title %>
+                </span> <span class="beatmap-artist">
+                    <% map.artist %>
+                </span>
+                <div class="beatmap-footer"><span class="beatmap-mapper"> {{ t('profile.by') }} <span
+                            class="newmaps-color">
+                            <% map.creator %>
+                        </span></span>
+                    <div class="d-flex align-items-baseline"><span>
+                            <% map.plays %>
+                        </span>
+                        <div class="target-button newmaps-color"><i class="fas fa-arrow-right"></i>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </a>
+    </div>
+    <div v-else-if="data.maps.{{ id }}.out.length == 0" class="stats-block">
+        <div class="columns is-marginless">
+            <div class="column is-1">
+                <h1 class="title">: (</h1>
+            </div>
+            <div class="column">
+                <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
+                <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
+            </div>
+        </div>
+    </div>
+    <div v-if="data.maps.{{ id }}.more.full == false" class="extra-block">
+        <a class="show-button rounded-sm" @click="AddLimit('mostplay')">{{ t('profile.show-more') }}</a>
+    </div>
+</div>
+{% endmacro %}
+
+{% block header %}
+<script src="/static/js/assets/vue.js?v={{ appVersion() }} "></script>
+<script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
+<link rel="stylesheet" href="/static/css/pages/profile.css?v={{ appVersion() }} ">
+
+<script>
+    window.userid = Number("{{ user['id'] }}"); //For text editor doesn't dizzy lmao
+    window.mode = '{{ mode }}';
+    window.mods = '{{ mods }}';
+    window.domain = "{{ domain() }}";
+</script>
+<style>
+    .rounded-sm {
+        border-radius: 0.5em;
+    }
+</style>
+
 {% if user['userpage_content'] != None and user['userpage_content'] != "" %}
 <style>
     .reset-bulma-style div,
@@ -167,164 +327,8 @@
         font-size: 0.5em;
     }
 </style>
-<div class="log-block">
-    <div class="header">
-        <div class="title">
-            <i class="fas fa-address-book"></i> About me
-        </div>
-    </div>
-    <div class="stats-block rank-block" style="padding: 12.5px;">
-        <article class="reset-bulma-style">
-            {{ render_markdown(user['userpage_content']) | safe }}
-        </article>
-    </div>
-</div>
 {% endif %}
-{% endmacro %}
-
-{% macro scores(title, id) %}
-<div class="log-block" :class="{ load : data.scores.{{ id }}.load }">
-    <div class="header">
-        <div class="title">
-            <i class="fas fa-trophy"></i> {{ title }}
-        </div>
-    </div>
-    <div v-if="data.scores.{{ id }}.out.length" class="scores">
-        <div v-for="(map, index) in data.scores.{{ id }}.out" class="map-single" ref="scores" :key="map.beatmap.map_id"
-            :style="`background: linear-gradient(hsl(var(--main), 25%, 25%, 90%), hsl(var(--main), 25%, 25%, 90%)), url(https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/cover.jpg)`">
-            <div class="map-data" @click="window.open(`https://osu.ppy.sh/beatmaps/${map.beatmap.id}`) ">
-                <div class="map-content1">
-                    <div class="map-image">
-                        <img :src="`https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/card.jpg`"
-                            class="map-image-picture">
-                    </div>
-                    <div class="map-title-block">
-                        <div class="map-title">
-                            <a class="beatmap-link">
-                                <% map.beatmap.artist %> - <% map.beatmap.title %> [<% map.beatmap.version %>]
-                                            <!--<span v-if="map.mods != 0">+ <% modsStr(map.mods) %></span>-->
-                            </a>
-                        </div>
-                        <div class="play-stats">
-                            <% map.mods_str %> / <b>
-                                    <% addCommas(map.max_combo) %>
-                                </b>x
-                        </div>
-                        <div class="map-date">
-                            <time>
-                                <% timeago.format(map.play_time) %>
-                            </time>
-                        </div>
-                    </div>
-                </div>
-                <div class="map-content2">
-                    <div class="score-details d-flex">
-                        <div class="score-details_right-block">
-                            <div class="score-details_pp-block">
-                                <div class="map-pp">
-                                    <% addCommas(map.pp.toFixed()) %><span class="map-pp-unit">{{ t('global.pp')
-                                            }}</span>
-                                </div>
-                                <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
-                                        <% map.acc.toFixed(2) %>%
-                                    </b></div>
-                            </div>
-                            <div class="score-details_grade-block">
-                                <div class="rank-single">
-                                    <div :class="`map-rank rank-${map.grade}`">
-                                        <% map.grade.replace("X", "SS" ).replace("H", "" ) %>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-    <div v-else-if="data.scores.{{ id }}.out.length == 0" class="stats-block">
-        <div class="columns is-marginless">
-            <div class="column is-1">
-                <h1 class="title">: (</h1>
-            </div>
-            <div class="column">
-                <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
-                <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
-            </div>
-        </div>
-    </div>
-    <div v-if="data.scores.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button rounded-sm" @click="AddLimit('{{ id }}score')">{{ t('profile.show-more') }}</a>
-    </div>
-</div>
-{% endmacro %}
 
-{% macro maps(title, id) %}
-<div class="log-block" :class="{ load : data.maps.{{ id }}.load }">
-    <div class="header">
-        <div class="title">
-            <i class="fas fa-address-book"></i> {{ title }}
-        </div>
-    </div>
-    <div v-if="data.maps.{{ id }}.out.length" class="beatmaps">
-        <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block rounded-sm" ref="mostPlayed"
-            :key="map.id">
-            <div class="beatmap-preview"
-                :style='{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }'>
-            </div>
-            <div class="beatmap-stats"><span class="beatmap-title">
-                    <% map.title %>
-                </span> <span class="beatmap-artist">
-                    <% map.artist %>
-                </span>
-                <div class="beatmap-footer"><span class="beatmap-mapper"> {{ t('profile.by') }} <span
-                            class="newmaps-color">
-                            <% map.creator %>
-                        </span></span>
-                    <div class="d-flex align-items-baseline"><span>
-                            <% map.plays %>
-                        </span>
-                        <div class="target-button newmaps-color"><i class="fas fa-arrow-right"></i>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </a>
-    </div>
-    <div v-else-if="data.maps.{{ id }}.out.length == 0" class="stats-block">
-        <div class="columns is-marginless">
-            <div class="column is-1">
-                <h1 class="title">: (</h1>
-            </div>
-            <div class="column">
-                <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
-                <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
-            </div>
-        </div>
-    </div>
-    <div v-if="data.maps.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button rounded-sm" @click="AddLimit('mostplay')">{{ t('profile.show-more') }}</a>
-    </div>
-</div>
-{% endmacro %}
-
-{% block header %}
-<script src="/static/js/assets/vue.js?v={{ appVersion() }} "></script>
-<script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
-<link rel="stylesheet" href="/static/css/pages/profile.css?v={{ appVersion() }} ">
-
-<script>
-    window.userid = Number("{{ user['id'] }}"); //For text editor doesn't dizzy lmao
-    window.mode = '{{ mode }}';
-    window.mods = '{{ mods }}';
-    window.domain = "{{ domain() }}";
-</script>
-<style>
-    .rounded-sm {
-        border-radius: 0.5em;
-    }
-</style>
 {% endblock %}
 
 {% block content %}

From 48e91396014554e2b8b3fb7ce7504fdb99fafb62 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 4 Aug 2022 17:15:14 +0000
Subject: [PATCH 188/278] table, newlinw

---
 main.py                |  6 ++-
 templates/profile.html | 88 ------------------------------------------
 2 files changed, 5 insertions(+), 89 deletions(-)

diff --git a/main.py b/main.py
index b55ab52b..96699f74 100755
--- a/main.py
+++ b/main.py
@@ -8,6 +8,7 @@
 from objects.privileges import Privileges
 
 import markdown2
+import html
 
 import aiohttp
 import i18n
@@ -129,7 +130,10 @@ def config():
 
 @app.template_global()
 def render_markdown(md: str) -> str:
-    return markdown2.markdown(md)
+    return markdown2.markdown(html.unescape(md), extras=[
+        'tables',
+        'nl2br'
+    ])
 
 from blueprints.frontend import frontend
 app.register_blueprint(frontend)
diff --git a/templates/profile.html b/templates/profile.html
index 70f6ea84..d70364d0 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -164,94 +164,6 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
 
 {% if user['userpage_content'] != None and user['userpage_content'] != "" %}
 <style>
-    .reset-bulma-style div,
-    .reset-bulma-style span,
-    .reset-bulma-style applet,
-    .reset-bulma-style object,
-    .reset-bulma-style iframe,
-    .reset-bulma-style h1,
-    .reset-bulma-style h2,
-    .reset-bulma-style h3,
-    .reset-bulma-style h4,
-    .reset-bulma-style h5,
-    .reset-bulma-style h6,
-    .reset-bulma-style p,
-    .reset-bulma-style blockquote,
-    .reset-bulma-style pre,
-    .reset-bulma-style a,
-    .reset-bulma-style abbr,
-    .reset-bulma-style acronym,
-    .reset-bulma-style address,
-    .reset-bulma-style big,
-    .reset-bulma-style cite,
-    .reset-bulma-style code,
-    .reset-bulma-style del,
-    .reset-bulma-style dfn,
-    .reset-bulma-style em,
-    .reset-bulma-style img,
-    .reset-bulma-style ins,
-    .reset-bulma-style kbd,
-    .reset-bulma-style q,
-    .reset-bulma-style s,
-    .reset-bulma-style samp,
-    .reset-bulma-style small,
-    .reset-bulma-style strike,
-    .reset-bulma-style strong,
-    .reset-bulma-style sub,
-    .reset-bulma-style sup,
-    .reset-bulma-style tt,
-    .reset-bulma-style var,
-    .reset-bulma-style b,
-    .reset-bulma-style u,
-    .reset-bulma-style i,
-    .reset-bulma-style center,
-    .reset-bulma-style dl,
-    .reset-bulma-style dt,
-    .reset-bulma-style dd,
-    .reset-bulma-style ol,
-    .reset-bulma-style ul,
-    .reset-bulma-style li,
-    .reset-bulma-style fieldset,
-    .reset-bulma-style form,
-    .reset-bulma-style label,
-    .reset-bulma-style legend,
-    .reset-bulma-style table,
-    .reset-bulma-style caption,
-    .reset-bulma-style tbody,
-    .reset-bulma-style tfoot,
-    .reset-bulma-style thead,
-    .reset-bulma-style tr,
-    .reset-bulma-style th,
-    .reset-bulma-style td,
-    .reset-bulma-style article,
-    .reset-bulma-style aside,
-    .reset-bulma-style canvas,
-    .reset-bulma-style details,
-    .reset-bulma-style embed,
-    .reset-bulma-style figure,
-    .reset-bulma-style figcaption,
-    .reset-bulma-style footer,
-    .reset-bulma-style header,
-    .reset-bulma-style hgroup,
-    .reset-bulma-style menu,
-    .reset-bulma-style nav,
-    .reset-bulma-style output,
-    .reset-bulma-style ruby,
-    .reset-bulma-style section,
-    .reset-bulma-style summary,
-    .reset-bulma-style time,
-    .reset-bulma-style mark,
-    .reset-bulma-style audio,
-    .reset-bulma-style video {
-        margin: 0;
-        padding: 0;
-        border: 0;
-        font-size: initial;
-        font: inherit;
-        vertical-align: baseline;
-    }
-
-
     /* HTML5 display-role reset for older browsers */
 
     article,

From 9449ee2486de42d308debdf983a8ea46dd3980f8 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 4 Aug 2022 17:17:43 +0000
Subject: [PATCH 189/278] extras

---
 main.py | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/main.py b/main.py
index 96699f74..9295e959 100755
--- a/main.py
+++ b/main.py
@@ -132,7 +132,10 @@ def config():
 def render_markdown(md: str) -> str:
     return markdown2.markdown(html.unescape(md), extras=[
         'tables',
-        'nl2br'
+        'break-on-newline',
+        'fenced-code-blocks',
+        'spoiler',
+        'strike'
     ])
 
 from blueprints.frontend import frontend

From 0bf5503b15aab4b8e2c3b054084d3f098f826960 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 17:38:45 +0000
Subject: [PATCH 190/278] modStr frontend side & remove ts check

---
 main.py                            |   2 +-
 static/js/pages/admin/dashboard.js |   3 +-
 static/js/pages/leaderboard.js     |   3 +-
 static/js/pages/profile.js         | 129 +++++++++++++++++++++++++++++
 templates/profile.html             |   3 +-
 5 files changed, 133 insertions(+), 7 deletions(-)

diff --git a/main.py b/main.py
index b55ab52b..39000f6b 100755
--- a/main.py
+++ b/main.py
@@ -24,7 +24,7 @@
 
 app = Quart(__name__)
 
-version = Version(1, 3, 4)
+version = Version(1, 3, 5)
 
 # used to secure session data.
 # we recommend using a long randomly generated ascii string.
diff --git a/static/js/pages/admin/dashboard.js b/static/js/pages/admin/dashboard.js
index 9862a631..8235b552 100644
--- a/static/js/pages/admin/dashboard.js
+++ b/static/js/pages/admin/dashboard.js
@@ -1,8 +1,7 @@
-// @ts-check
 _testGlobals(
     { exists: ['domain'] }
 )
-// @ts-ignore
+
 new Vue({
     el: "#dashboard",
     delimiters: ["<%", "%>"],
diff --git a/static/js/pages/leaderboard.js b/static/js/pages/leaderboard.js
index 339682d6..e7c5d0dd 100644
--- a/static/js/pages/leaderboard.js
+++ b/static/js/pages/leaderboard.js
@@ -1,6 +1,5 @@
-// @ts-check
 _testGlobals({ exists: ['flags', 'mode', 'mods', 'sort', 'domain'] })
-// @ts-ignore
+
 new Vue({
     el: "#app",
     delimiters: ["<%", "%>"],
diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 2005c04e..80210108 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -261,3 +261,132 @@ new Vue({
     },
     computed: {}
 });
+
+function getScoreMods(m) {
+	var r = '';
+	var hasNightcore = false;
+	if (m & NoFail) {
+		r += 'NF';
+	}
+	if (m & Easy) {
+		r += 'EZ';
+	}
+	if (m & NoVideo) {
+		r += 'NV';
+	}
+	if (m & Hidden) {
+		r += 'HD';
+	}
+	if (m & HardRock) {
+		r += 'HR';
+	}
+	if (m & SuddenDeath) {
+		r += 'SD';
+	}
+	if (m & Nightcore) {
+		r += 'NC';
+		hasNightcore = true;
+	}
+	if (!hasNightcore && (m & DoubleTime)) {
+		r += 'DT';
+	}
+	if (m & Relax) {
+		r += 'RX';
+	}
+	if (m & HalfTime) {
+		r += 'HT';
+	}
+	if (m & Flashlight) {
+		r += 'FL';
+	}
+	if (m & Autoplay) {
+		r += 'AP';
+	}
+	if (m & SpunOut) {
+		r += 'SO';
+	}
+	if (m & Relax2) {
+		r += 'AP';
+	}
+	if (m & Perfect) {
+		r += 'PF';
+	}
+	if (m & Key4) {
+		r += '4K';
+	}
+	if (m & Key5) {
+		r += '5K';
+	}
+	if (m & Key6) {
+		r += '6K';
+	}
+	if (m & Key7) {
+		r += '7K';
+	}
+	if (m & Key8) {
+		r += '8K';
+	}
+	if (m & keyMod) {
+		r += '';
+	}
+	if (m & FadeIn) {
+		r += 'FD';
+	}
+	if (m & Random) {
+		r += 'RD';
+	}
+	if (m & LastMod) {
+		r += 'CN';
+	}
+	if (m & Key9) {
+		r += '9K';
+	}
+	if (m & Key10) {
+		r += '10K';
+	}
+	if (m & Key1) {
+		r += '1K';
+	}
+	if (m & Key3) {
+		r += '3K';
+	}
+	if (m & Key2) {
+		r += '2K';
+	}
+	if (r.length > 0) {
+		return r.slice();
+	} else {
+		return '';
+	}
+}
+
+var None = 0;
+var NoFail = 1;
+var Easy = 2;
+var NoVideo = 4;
+var Hidden = 8;
+var HardRock = 16;
+var SuddenDeath = 32;
+var DoubleTime = 64;
+var Relax = 128;
+var HalfTime = 256;
+var Nightcore = 512;
+var Flashlight = 1024;
+var Autoplay = 2048;
+var SpunOut = 4096;
+var Relax2 = 8192;
+var Perfect = 16384;
+var Key4 = 32768;
+var Key5 = 65536;
+var Key6 = 131072;
+var Key7 = 262144;
+var Key8 = 524288;
+var keyMod = 1015808;
+var FadeIn = 1048576;
+var Random = 2097152;
+var LastMod = 4194304;
+var Key9 = 16777216;
+var Key10 = 33554432;
+var Key1 = 67108864;
+var Key3 = 134217728;
+var Key2 = 268435456;
\ No newline at end of file
diff --git a/templates/profile.html b/templates/profile.html
index 70f6ea84..320bdf7c 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -38,11 +38,10 @@
                         <div class="map-title">
                             <a class="beatmap-link">
                                 <% map.beatmap.artist %> - <% map.beatmap.title %> [<% map.beatmap.version %>]
-                                            <!--<span v-if="map.mods != 0">+ <% modsStr(map.mods) %></span>-->
                             </a>
                         </div>
                         <div class="play-stats">
-                            <% map.mods_str %> / <b>
+                            <% getScoreMods(map.mods) %> / <b>
                                     <% addCommas(map.max_combo) %>
                                 </b>x
                         </div>

From a293cc4348ae276bcdb57f458fcca137970b405c Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 18:08:27 +0000
Subject: [PATCH 191/278] add placeholder

---
 static/js/pages/profile.js    | 3 +--
 templates/admin/beatmaps.html | 2 +-
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 80210108..9fffec8b 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -1,8 +1,7 @@
-// @ts-check
 _testGlobals(
     { exists: ['mode', 'mods', 'userid', 'domain'] }
 )
-// @ts-ignore
+
 new Vue({
     el: "#app",
     delimiters: ["<%", "%>"],
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index c982b1cc..7915cdde 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -94,7 +94,7 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
         </div>
     </div>
     <div class="p-0 d-flex gap-2 py-3">
-        <input id="search-bar" class="input" value="{{ search_word }}">
+        <input placeholder="Search by bid, sid or title" id="search-bar" class="input" value="{{ search_word }}">
         <button onclick="searchMaps()" class="button" style="width: 200px">{{t("admin.beatmaps.search")}}</button>
     </div>
     <div class="table-responsive py-3">

From 4ee64ec39a29ba4c10342c4144b5db0c75cf6514 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 4 Aug 2022 18:09:36 +0000
Subject: [PATCH 192/278] return NM if mods not exist

---
 main.py                    | 2 +-
 static/js/pages/profile.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/main.py b/main.py
index 16bfcb0d..639dfc27 100755
--- a/main.py
+++ b/main.py
@@ -25,7 +25,7 @@
 
 app = Quart(__name__)
 
-version = Version(1, 3, 5)
+version = Version(1, 3, 6)
 
 # used to secure session data.
 # we recommend using a long randomly generated ascii string.
diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 9fffec8b..cff06f42 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -355,7 +355,7 @@ function getScoreMods(m) {
 	if (r.length > 0) {
 		return r.slice();
 	} else {
-		return '';
+		return 'NM';
 	}
 }
 

From 6b0409c32d54623f9cedb6c6a5277b0b0de3a24d Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 5 Aug 2022 04:05:34 +0000
Subject: [PATCH 193/278] profile.html margins, padding

---
 static/css/pages/profile.css | 15 +++++++++++++++
 templates/profile.html       |  8 +++++++-
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/static/css/pages/profile.css b/static/css/pages/profile.css
index 403396e4..92888e67 100644
--- a/static/css/pages/profile.css
+++ b/static/css/pages/profile.css
@@ -626,6 +626,15 @@ span.beatmap-mapper {
   display: none;
 }
 
+@media screen and (min-width: 1255px) {
+  .two-sides .column.is-one-third {
+    padding-right: 0.5em;
+  }
+  .two-sides .column.is-two-third {
+    padding-left: 0.5em;
+  }
+}
+
 @media screen and (max-width: 1255px) {
   .two-sides {
     display: contents !important;
@@ -636,6 +645,12 @@ span.beatmap-mapper {
     flex: none;
     width: 100%;
   }
+  .two-sides .column.is-one-third {
+    padding-bottom: 0;
+  }
+  .two-sides .column.is-one-third .stats-block:last-of-type {
+    margin-bottom: 0 !important;
+  }
   .columns.is-marginless.is-2 {
     display: none;
   }
diff --git a/templates/profile.html b/templates/profile.html
index b754b519..99dcc9e9 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -206,6 +206,8 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
         border-spacing: 0;
     }
 
+    /* custom css */
+
     .reset-bulma-style ul,
     .reset-bulma-style li {
         list-style: initial;
@@ -237,6 +239,10 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
     .reset-bulma-style h6 {
         font-size: 0.5em;
     }
+
+    .reset-bulma-style pre {
+        border-radius: 0.5em;
+    }
 </style>
 {% endif %}
 
@@ -454,7 +460,7 @@ <h1 class="title">
                     </div>
                 </div>
             </div>
-            <div class="column">
+            <div class="column is-two-third">
                 {{ userpage(user) }}
                 {{ scores(t('profile.best-scores') , 'best')}}
                 {{ scores(t('profile.recent-scores'), 'recent')}}

From ede9929a76d7eb1d36a906c63ac06928b3df9052 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 5 Aug 2022 04:13:06 +0000
Subject: [PATCH 194/278] move getScoreModes in to vue component

---
 static/js/pages/profile.js | 281 +++++++++++++++++++------------------
 1 file changed, 142 insertions(+), 139 deletions(-)

diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index cff06f42..42383368 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -1,7 +1,9 @@
+// @ts-check
+// @ts-ignore window._testGlobals
 _testGlobals(
     { exists: ['mode', 'mods', 'userid', 'domain'] }
 )
-
+// @ts-ignore window.Vue
 new Vue({
     el: "#app",
     delimiters: ["<%", "%>"],
@@ -46,7 +48,137 @@ new Vue({
             mode: window.mode,
             mods: window.mods,
             modegulag: 0,
-            userid: window.userid
+            userid: window.userid,
+            getScoreMods: (() => {
+                const None = 0;
+                const NoFail = 1;
+                const Easy = 2;
+                const NoVideo = 4;
+                const Hidden = 8;
+                const HardRock = 16;
+                const SuddenDeath = 32;
+                const DoubleTime = 64;
+                const Relax = 128;
+                const HalfTime = 256;
+                const Nightcore = 512;
+                const Flashlight = 1024;
+                const Autoplay = 2048;
+                const SpunOut = 4096;
+                const Relax2 = 8192;
+                const Perfect = 16384;
+                const Key4 = 32768;
+                const Key5 = 65536;
+                const Key6 = 131072;
+                const Key7 = 262144;
+                const Key8 = 524288;
+                const keyMod = 1015808;
+                const FadeIn = 1048576;
+                const Random = 2097152;
+                const LastMod = 4194304;
+                const Key9 = 16777216;
+                const Key10 = 33554432;
+                const Key1 = 67108864;
+                const Key3 = 134217728;
+                const Key2 = 268435456;
+            
+                return function getScoreMods(m) {
+                    let r = '';
+                    let hasNightcore = false;
+                    if (m & NoFail) {
+                        r += 'NF';
+                    }
+                    if (m & Easy) {
+                        r += 'EZ';
+                    }
+                    if (m & NoVideo) {
+                        r += 'NV';
+                    }
+                    if (m & Hidden) {
+                        r += 'HD';
+                    }
+                    if (m & HardRock) {
+                        r += 'HR';
+                    }
+                    if (m & SuddenDeath) {
+                        r += 'SD';
+                    }
+                    if (m & Nightcore) {
+                        r += 'NC';
+                        hasNightcore = true;
+                    }
+                    if (!hasNightcore && (m & DoubleTime)) {
+                        r += 'DT';
+                    }
+                    if (m & Relax) {
+                        r += 'RX';
+                    }
+                    if (m & HalfTime) {
+                        r += 'HT';
+                    }
+                    if (m & Flashlight) {
+                        r += 'FL';
+                    }
+                    if (m & Autoplay) {
+                        r += 'AP';
+                    }
+                    if (m & SpunOut) {
+                        r += 'SO';
+                    }
+                    if (m & Relax2) {
+                        r += 'AP';
+                    }
+                    if (m & Perfect) {
+                        r += 'PF';
+                    }
+                    if (m & Key4) {
+                        r += '4K';
+                    }
+                    if (m & Key5) {
+                        r += '5K';
+                    }
+                    if (m & Key6) {
+                        r += '6K';
+                    }
+                    if (m & Key7) {
+                        r += '7K';
+                    }
+                    if (m & Key8) {
+                        r += '8K';
+                    }
+                    if (m & keyMod) {
+                        r += '';
+                    }
+                    if (m & FadeIn) {
+                        r += 'FD';
+                    }
+                    if (m & Random) {
+                        r += 'RD';
+                    }
+                    if (m & LastMod) {
+                        r += 'CN';
+                    }
+                    if (m & Key9) {
+                        r += '9K';
+                    }
+                    if (m & Key10) {
+                        r += '10K';
+                    }
+                    if (m & Key1) {
+                        r += '1K';
+                    }
+                    if (m & Key3) {
+                        r += '3K';
+                    }
+                    if (m & Key2) {
+                        r += '2K';
+                    }
+                    if (r.length > 0) {
+                        return r.slice();
+                    } else {
+                        return 'NM';
+                    }
+                }
+            })()
         };
     },
     created() {
@@ -207,10 +339,10 @@ new Vue({
         },
         addCommas(nStr) {
             nStr += '';
-            var x = nStr.split('.');
-            var x1 = x[0];
-            var x2 = x.length > 1 ? '.' + x[1] : '';
-            var rgx = /(\d+)(\d{3})/;
+            const x = nStr.split('.');
+            let x1 = x[0];
+            const x2 = x.length > 1 ? '.' + x[1] : '';
+            const rgx = /(\d+)(\d{3})/;
             while (rgx.test(x1)) {
                 x1 = x1.replace(rgx, '$1' + ',' + '$2');
             }
@@ -218,9 +350,9 @@ new Vue({
         },
         secondsToDhm(seconds) {
             seconds = Number(seconds);
-            var dDisplay = `${Math.floor(seconds / (3600 * 24))}d `;
-            var hDisplay = `${Math.floor(seconds % (3600 * 24) / 3600)}h `;
-            var mDisplay = `${Math.floor(seconds % 3600 / 60)}m `;
+            const dDisplay = `${Math.floor(seconds / (3600 * 24))}d `;
+            const hDisplay = `${Math.floor(seconds % (3600 * 24) / 3600)}h `;
+            const mDisplay = `${Math.floor(seconds % 3600 / 60)}m `;
             return dDisplay + hDisplay + mDisplay;
         },
         StrtoGulagInt() {
@@ -259,133 +391,4 @@ new Vue({
         },
     },
     computed: {}
-});
-
-function getScoreMods(m) {
-	var r = '';
-	var hasNightcore = false;
-	if (m & NoFail) {
-		r += 'NF';
-	}
-	if (m & Easy) {
-		r += 'EZ';
-	}
-	if (m & NoVideo) {
-		r += 'NV';
-	}
-	if (m & Hidden) {
-		r += 'HD';
-	}
-	if (m & HardRock) {
-		r += 'HR';
-	}
-	if (m & SuddenDeath) {
-		r += 'SD';
-	}
-	if (m & Nightcore) {
-		r += 'NC';
-		hasNightcore = true;
-	}
-	if (!hasNightcore && (m & DoubleTime)) {
-		r += 'DT';
-	}
-	if (m & Relax) {
-		r += 'RX';
-	}
-	if (m & HalfTime) {
-		r += 'HT';
-	}
-	if (m & Flashlight) {
-		r += 'FL';
-	}
-	if (m & Autoplay) {
-		r += 'AP';
-	}
-	if (m & SpunOut) {
-		r += 'SO';
-	}
-	if (m & Relax2) {
-		r += 'AP';
-	}
-	if (m & Perfect) {
-		r += 'PF';
-	}
-	if (m & Key4) {
-		r += '4K';
-	}
-	if (m & Key5) {
-		r += '5K';
-	}
-	if (m & Key6) {
-		r += '6K';
-	}
-	if (m & Key7) {
-		r += '7K';
-	}
-	if (m & Key8) {
-		r += '8K';
-	}
-	if (m & keyMod) {
-		r += '';
-	}
-	if (m & FadeIn) {
-		r += 'FD';
-	}
-	if (m & Random) {
-		r += 'RD';
-	}
-	if (m & LastMod) {
-		r += 'CN';
-	}
-	if (m & Key9) {
-		r += '9K';
-	}
-	if (m & Key10) {
-		r += '10K';
-	}
-	if (m & Key1) {
-		r += '1K';
-	}
-	if (m & Key3) {
-		r += '3K';
-	}
-	if (m & Key2) {
-		r += '2K';
-	}
-	if (r.length > 0) {
-		return r.slice();
-	} else {
-		return 'NM';
-	}
-}
-
-var None = 0;
-var NoFail = 1;
-var Easy = 2;
-var NoVideo = 4;
-var Hidden = 8;
-var HardRock = 16;
-var SuddenDeath = 32;
-var DoubleTime = 64;
-var Relax = 128;
-var HalfTime = 256;
-var Nightcore = 512;
-var Flashlight = 1024;
-var Autoplay = 2048;
-var SpunOut = 4096;
-var Relax2 = 8192;
-var Perfect = 16384;
-var Key4 = 32768;
-var Key5 = 65536;
-var Key6 = 131072;
-var Key7 = 262144;
-var Key8 = 524288;
-var keyMod = 1015808;
-var FadeIn = 1048576;
-var Random = 2097152;
-var LastMod = 4194304;
-var Key9 = 16777216;
-var Key10 = 33554432;
-var Key1 = 67108864;
-var Key3 = 134217728;
-var Key2 = 268435456;
\ No newline at end of file
+});
\ No newline at end of file

From 3c5019652862f9ee48314cbe69b5e0016b81d857 Mon Sep 17 00:00:00 2001
From: DAYGoodTime <ken570015@163.com>
Date: Sat, 6 Aug 2022 03:20:03 +0000
Subject: [PATCH 195/278] Patch missing translations,and fix language errors

---
 locales/admin/beatmaps/en-GB.yml | 10 ++++++++++
 locales/admin/beatmaps/en-US.yml | 10 ++++++++++
 locales/admin/beatmaps/zh-CN.yml | 12 +++++++++++-
 locales/admin/users/zh-CN.yml    |  6 +++---
 locales/profile/zh-CN.yml        |  4 ++--
 locales/settings/en-GB.yml       |  1 +
 locales/settings/en-US.yml       |  1 +
 locales/settings/zh-CN.yml       |  1 +
 templates/admin/beatmaps.html    | 20 ++++++++++----------
 templates/settings/sidebar.html  |  2 +-
 10 files changed, 50 insertions(+), 17 deletions(-)

diff --git a/locales/admin/beatmaps/en-GB.yml b/locales/admin/beatmaps/en-GB.yml
index 4244df98..f6f8f60e 100644
--- a/locales/admin/beatmaps/en-GB.yml
+++ b/locales/admin/beatmaps/en-GB.yml
@@ -17,3 +17,13 @@ bpm: BPM
 stars: Stars
 status: Status
 edit-status: Edit status
+ranked-diff: Ranked Diff
+loved-diff: Loved Diff
+approved-diff: Approved Diff
+pending-diff: Pending Diff
+ranked-set: Ranked Set
+loved-set: Loved Set
+approved-set: Approved Set
+pending-set: Pending Set
+sync-beatmapsets-with-bancho: Sync Beatmapsets with Bancho
+search-by-bid-sid-or-title: Search by bid, sid or title
diff --git a/locales/admin/beatmaps/en-US.yml b/locales/admin/beatmaps/en-US.yml
index 4244df98..f6f8f60e 100644
--- a/locales/admin/beatmaps/en-US.yml
+++ b/locales/admin/beatmaps/en-US.yml
@@ -17,3 +17,13 @@ bpm: BPM
 stars: Stars
 status: Status
 edit-status: Edit status
+ranked-diff: Ranked Diff
+loved-diff: Loved Diff
+approved-diff: Approved Diff
+pending-diff: Pending Diff
+ranked-set: Ranked Set
+loved-set: Loved Set
+approved-set: Approved Set
+pending-set: Pending Set
+sync-beatmapsets-with-bancho: Sync Beatmapsets with Bancho
+search-by-bid-sid-or-title: Search by bid, sid or title
diff --git a/locales/admin/beatmaps/zh-CN.yml b/locales/admin/beatmaps/zh-CN.yml
index c8f6ac56..e872cc35 100644
--- a/locales/admin/beatmaps/zh-CN.yml
+++ b/locales/admin/beatmaps/zh-CN.yml
@@ -4,7 +4,7 @@ thats-a-lot-of-maps: 那可真是不少图呀!
 ranked: Ranked
 these-maps-can-gain-many-pp: 这些图能刷到许多pp
 loved: Loved
-we-loved-them-so-much: 我们都"爱"它们
+we-loved-them-so-much: 我们都"爱"它
 pending: Pending
 they-are-also-good-maps: 它们仍然是张好图
 search: 搜索
@@ -17,3 +17,13 @@ bpm: BPM
 stars: Stars
 status: 状态
 edit-status: 修改状态
+ranked-diff: 将该难度设置为 Ranked 状态
+loved-diff: 将该难度设置为 Loved 状态
+approved-diff: 将该难度设置为 Approved 状态
+pending-diff: 将该难度设置为 Pending 状态
+ranked-set: 将整个谱面设置为 Ranked 状态
+loved-set: 将整个谱面设置为 Loved 状态
+approved-set: 将整个谱面设置为 Approved 状态
+pending-set: 将整个谱面设置为 Pending 状态
+sync-beatmapsets-with-bancho: 将整个谱面的状态与 Bancho 进行同步
+search-by-bid-sid-or-title: 根据 bid, sid 或者是 谱面名字 进行搜索
diff --git a/locales/admin/users/zh-CN.yml b/locales/admin/users/zh-CN.yml
index c19223ab..cc31de11 100644
--- a/locales/admin/users/zh-CN.yml
+++ b/locales/admin/users/zh-CN.yml
@@ -13,7 +13,7 @@ edit-info-of: '修改该用户的信息:'
 username: 用户名
 country: 地区
 legality: 封禁状态
-unrestricted: Unrestricted
-restricted: Restricted
+unrestricted: 未封禁
+restricted: 封禁
 update: 更新
-search-by-username-or-email: 使用 用户名 或 邮箱 进行搜索
+search-by-username-or-email: 根据 用户名 或 邮箱 进行搜索
diff --git a/locales/profile/zh-CN.yml b/locales/profile/zh-CN.yml
index e45592ef..d03d3290 100644
--- a/locales/profile/zh-CN.yml
+++ b/locales/profile/zh-CN.yml
@@ -2,8 +2,8 @@ best-scores: 最好成绩
 no-scores-available: 暂无有效成绩
 try-playing-something: 尝试去游玩一会吧！
 show-more: 展示更多
-most-played-beatmaps: 游玩最多的铺面
-no-beatmaps-available: 暂无有效铺面
+most-played-beatmaps: 游玩最多的谱面
+no-beatmaps-available: 暂无有效谱面
 statistics: 数据统计
 recent-scores: 最近的成绩
 by: 作者
diff --git a/locales/settings/en-GB.yml b/locales/settings/en-GB.yml
index 9e938374..2d08283d 100644
--- a/locales/settings/en-GB.yml
+++ b/locales/settings/en-GB.yml
@@ -22,3 +22,4 @@ bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, o
 change-succeed: Your %{something} has been successfully changed!
 no-image-was-selected: No image was selected!
 customization: Customization
+about-me: About Me
diff --git a/locales/settings/en-US.yml b/locales/settings/en-US.yml
index 6455c529..3875fa68 100644
--- a/locales/settings/en-US.yml
+++ b/locales/settings/en-US.yml
@@ -23,3 +23,4 @@ bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, o
 change-succeed: Your %{something} has been successfully changed!
 no-image-was-selected: No image was selected!
 customization: Customization
+about-me: About Me
diff --git a/locales/settings/zh-CN.yml b/locales/settings/zh-CN.yml
index f78a2a9f..19485c77 100644
--- a/locales/settings/zh-CN.yml
+++ b/locales/settings/zh-CN.yml
@@ -20,3 +20,4 @@ settings: 设置
 bad-image-extension: 你选择的%{something}必须是 .jpg .jpeg .png 这三种文件之一
 change-succeed: 你的 %{something}已经修改成功!
 no-image-was-selected: 请选择一张图片
+about-me: 个人介绍
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 7915cdde..7b3ad337 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -94,7 +94,7 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
         </div>
     </div>
     <div class="p-0 d-flex gap-2 py-3">
-        <input placeholder="Search by bid, sid or title" id="search-bar" class="input" value="{{ search_word }}">
+        <input placeholder='{{t("admin.beatmaps.search-by-bid-sid-or-title")}}' id="search-bar" class="input" value="{{ search_word }}">
         <button onclick="searchMaps()" class="button" style="width: 200px">{{t("admin.beatmaps.search")}}</button>
     </div>
     <div class="table-responsive py-3">
@@ -169,18 +169,18 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
                             </div>
                             <div class="dropdown-menu" id="dropdown-menu-{{ i.map_id }}" role="menu">
                                 <div class="dropdown-content has-background-primary">
-                                    <a class="dropdown-item {% if i.status == 2 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=2&set=0">Ranked Diff</a>
-                                    <a class="dropdown-item {% if i.status == 5 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=5&set=0">Loved Diff</a>
-                                    <a class="dropdown-item {% if i.status == 3 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=3&set=0">Approved Diff</a>
-                                    <a class="dropdown-item {% if i.status == 0 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=0&set=0">Pending Diff</a>
+                                    <a class="dropdown-item {% if i.status == 2 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=2&set=0">{{t("admin.beatmaps.ranked-diff")}}</a>
+                                    <a class="dropdown-item {% if i.status == 5 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=5&set=0">{{t("admin.beatmaps.loved-diff")}}</a>
+                                    <a class="dropdown-item {% if i.status == 3 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=3&set=0">{{t("admin.beatmaps.approved-diff")}}</a>
+                                    <a class="dropdown-item {% if i.status == 0 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=0&set=0">{{t("admin.beatmaps.pending-diff")}}</a>
                                     <hr class="dropdown-divider">
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=2&set=1">Ranked Set</a>
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">Loved Set</a>
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">Approved Set</a>
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">Pending Set</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=2&set=1">{{t("admin.beatmaps.ranked-set")}}</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">{{t("admin.beatmaps.loved-set")}}</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">{{t("admin.beatmaps.approved-set")}}</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">{{t("admin.beatmaps.pending-set")}}</a>
                                     <hr class="dropdown-divider">
                                     <a class="dropdown-item operate-button" href="javascript:void(0);" onclick="updateMaps({{ i.set_id }})">
-                                        Sync Beatmapsets with Bancho
+                                        {{t("admin.beatmaps.sync-beatmapsets-with-bancho")}}
                                     </a>
                                 </div>
                             </div>
diff --git a/templates/settings/sidebar.html b/templates/settings/sidebar.html
index 9ba41262..84ff8497 100644
--- a/templates/settings/sidebar.html
+++ b/templates/settings/sidebar.html
@@ -21,7 +21,7 @@
             <i class="fas fa-air-freshener"></i><span class="single-menu--text"> {{ t('settings.customisation') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/aboutme">
-            <i class="fas fa-air-freshener"></i><span class="single-menu--text">About Me</span>
+            <i class="fas fa-air-freshener"></i><span class="single-menu--text">{{t("settings.about-me")}}</span>
         </a>
     </div>
 </div>

From 99f5fcee825fe99da2e1dd4d09115fcc9d0809b8 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 11 Aug 2022 06:13:51 +0000
Subject: [PATCH 196/278] password in admin panel

---
 blueprints/admin.py             | 14 +++++++++++++-
 templates/admin/users_edit.html |  9 +++++++++
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 3baf8bf1..66b34fa7 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -2,8 +2,11 @@
 
 __all__ = ()
 
+import bcrypt
+import hashlib
 from curses.ascii import isdigit
 from functools import wraps
+import hashlib
 from quart import Blueprint
 from quart import render_template
 from quart import session
@@ -107,10 +110,19 @@ async def users_update(id:int):
             data['priv'] = 2
         elif datadef['priv'] == 2 and form['legality'] == 'unrestricted':
             data['priv'] = 3 
+        if form['password'] != "":
+            pw_md5 = hashlib.md5(form['password'].encode()).hexdigest().encode()
+            pw_bcrypt = bcrypt.hashpw(pw_md5, bcrypt.gensalt())
+            await glob.db.execute(
+                'UPDATE users '
+                'SET pw_bcrypt = %s '
+                'WHERE id = %s',
+                [pw_bcrypt, id]
+            )
         await varka.update('users', ('id', id), **dict_cmp(data, datadef))
         return redirect(f'/admin/users/search/{id}')
     except: 
-        return redirect('/admin/users.html')
+        return redirect('/admin/users')
 
 @admin.route('/beatmaps')
 @priv_check(priv=Privileges.Nominator)
diff --git a/templates/admin/users_edit.html b/templates/admin/users_edit.html
index c9529dce..6d389e15 100644
--- a/templates/admin/users_edit.html
+++ b/templates/admin/users_edit.html
@@ -51,6 +51,15 @@
                     <input name="edit-country" type="text" class="input" value="{{ search_data.country }}">
                 </div>
             </div>
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+                    <i class="fas fa-key" aria-hidden="true"></i>
+                    Password
+                </div>
+                <div class="column">
+                    <input name="password" type="text" class="input" placeholder="New Password">
+                </div>
+            </div>
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-ban"  aria-hidden="true"></i>

From 777ea99218c8541fada9da30be851bc3609746bd Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 11 Aug 2022 06:27:48 +0000
Subject: [PATCH 197/278] fix avatar image mode

---
 blueprints/frontend.py | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 5227e8d2..8b707183 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -2,6 +2,7 @@
 
 __all__ = ()
 
+import imghdr
 import bcrypt
 import hashlib
 import os
@@ -169,7 +170,12 @@ async def settings_avatar_post():
 
     # avatar change success
     pilavatar = utils.crop_image(pilavatar)
-    pilavatar.save(os.path.join(AVATARS_PATH, f'{session["user_data"]["id"]}{file_extension.lower()}'))
+    
+    try:
+        pilavatar.save(os.path.join(AVATARS_PATH, f'{session["user_data"]["id"]}{file_extension.lower()}'))
+    except OSError:
+        pilavatar = pilavatar.convert('RGBA')
+        pilavatar.save(os.path.join(AVATARS_PATH, f'{session["user_data"]["id"]}.png'))
     return await flash('success', t('settings.change-succeed', something = t('settings.avatar').lower()), 'settings/avatar')
 
 @frontend.route('/settings/custom')

From 3d6793f51cf862adebb3258c09fae0897182cc53 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Thu, 11 Aug 2022 06:36:01 +0000
Subject: [PATCH 198/278] bump version

---
 main.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/main.py b/main.py
index 639dfc27..a8b082fb 100755
--- a/main.py
+++ b/main.py
@@ -25,7 +25,7 @@
 
 app = Quart(__name__)
 
-version = Version(1, 3, 6)
+version = Version(1, 3, 7)
 
 # used to secure session data.
 # we recommend using a long randomly generated ascii string.

From fc6a21c6b4e4207039ef966783d23920bf33cee3 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 11 Aug 2022 17:24:58 +0000
Subject: [PATCH 199/278] new meta for i18n

---
 .vscode/settings.json                         |   2 +-
 config.mjs                                    |   4 +
 locales/{ => default}/404/en-GB.yml           |   0
 locales/{ => default}/404/en-US.yml           |   0
 locales/{ => default}/404/zh-CN.yml           |   0
 locales/{ => default}/admin/base/en-GB.yml    |   0
 locales/{ => default}/admin/base/en-US.yml    |   0
 locales/{ => default}/admin/base/zh-CN.yml    |   0
 .../{ => default}/admin/beatmaps/en-GB.yml    |   0
 .../{ => default}/admin/beatmaps/en-US.yml    |   0
 .../{ => default}/admin/beatmaps/zh-CN.yml    |   0
 locales/{ => default}/admin/en-GB.yml         |   0
 locales/{ => default}/admin/en-US.yml         |   0
 locales/{ => default}/admin/home/en-GB.yml    |   0
 locales/{ => default}/admin/home/en-US.yml    |   0
 locales/{ => default}/admin/home/zh-CN.yml    |   0
 .../admin/restrictions/en-GB.yml              |   0
 .../admin/restrictions/en-US.yml              |   0
 .../admin/restrictions/zh-CN.yml              |   0
 locales/{ => default}/admin/users/en-GB.yml   |   0
 locales/{ => default}/admin/users/en-US.yml   |   0
 locales/{ => default}/admin/users/zh-CN.yml   |   0
 locales/{ => default}/admin/zh-CN.yml         |   0
 locales/{ => default}/global/en-GB.yml        |   0
 locales/{ => default}/global/en-US.yml        |   0
 locales/{ => default}/global/zh-CN.yml        |   0
 locales/{ => default}/home/en-GB.yml          |   0
 locales/{ => default}/home/en-US.yml          |   0
 locales/{ => default}/home/zh-CN.yml          |   0
 locales/{ => default}/leaderboard/en-GB.yml   |   0
 locales/{ => default}/leaderboard/en-US.yml   |   0
 locales/{ => default}/leaderboard/zh-CN.yml   |   0
 locales/{ => default}/login/en-GB.yml         |   0
 locales/{ => default}/login/en-US.yml         |   0
 locales/{ => default}/login/zh-CN.yml         |   0
 locales/{ => default}/logout/en-GB.yml        |   0
 locales/{ => default}/logout/en-US.yml        |   0
 locales/{ => default}/logout/zh-CN.yml        |   0
 locales/{ => default}/navbar/en-GB.yml        |   0
 locales/{ => default}/navbar/en-US.yml        |   0
 locales/{ => default}/navbar/zh-CN.yml        |   0
 locales/{ => default}/profile/en-GB.yml       |   0
 locales/{ => default}/profile/en-US.yml       |   0
 locales/{ => default}/profile/zh-CN.yml       |   0
 locales/{ => default}/register/en-GB.yml      |   0
 locales/{ => default}/register/en-US.yml      |   0
 locales/{ => default}/register/zh-CN.yml      |   2 +-
 locales/{ => default}/settings/en-GB.yml      |   0
 locales/{ => default}/settings/en-US.yml      |   0
 .../{ => default}/settings/password/en-GB.yml |   0
 .../{ => default}/settings/password/en-US.yml |   0
 .../{ => default}/settings/password/zh-CN.yml |   0
 .../{ => default}/settings/profile/en-GB.yml  |   0
 .../{ => default}/settings/profile/en-US.yml  |   0
 .../{ => default}/settings/profile/zh-CN.yml  |   0
 locales/{ => default}/settings/zh-CN.yml      |   0
 locales/{ => default}/verify/en-GB.yml        |   0
 locales/{ => default}/verify/en-US.yml        |   0
 locales/{ => default}/verify/zh-CN.yml        |   0
 locales/ppy.sb/home/zh-CN.yml                 |   2 +
 .../{original-reader.mjs => built-reader.mjs} |   0
 .../{original-writer.mjs => built-writer.mjs} |   0
 utils/i18n/commands/build.mjs                 |   2 +-
 utils/i18n/commands/migrate.mjs               |   2 +-
 utils/i18n/config.mjs                         |   4 +-
 utils/i18n/reader.mjs                         | 134 ++++++++++--------
 66 files changed, 91 insertions(+), 61 deletions(-)
 create mode 100644 config.mjs
 rename locales/{ => default}/404/en-GB.yml (100%)
 rename locales/{ => default}/404/en-US.yml (100%)
 rename locales/{ => default}/404/zh-CN.yml (100%)
 rename locales/{ => default}/admin/base/en-GB.yml (100%)
 rename locales/{ => default}/admin/base/en-US.yml (100%)
 rename locales/{ => default}/admin/base/zh-CN.yml (100%)
 rename locales/{ => default}/admin/beatmaps/en-GB.yml (100%)
 rename locales/{ => default}/admin/beatmaps/en-US.yml (100%)
 rename locales/{ => default}/admin/beatmaps/zh-CN.yml (100%)
 rename locales/{ => default}/admin/en-GB.yml (100%)
 rename locales/{ => default}/admin/en-US.yml (100%)
 rename locales/{ => default}/admin/home/en-GB.yml (100%)
 rename locales/{ => default}/admin/home/en-US.yml (100%)
 rename locales/{ => default}/admin/home/zh-CN.yml (100%)
 rename locales/{ => default}/admin/restrictions/en-GB.yml (100%)
 rename locales/{ => default}/admin/restrictions/en-US.yml (100%)
 rename locales/{ => default}/admin/restrictions/zh-CN.yml (100%)
 rename locales/{ => default}/admin/users/en-GB.yml (100%)
 rename locales/{ => default}/admin/users/en-US.yml (100%)
 rename locales/{ => default}/admin/users/zh-CN.yml (100%)
 rename locales/{ => default}/admin/zh-CN.yml (100%)
 rename locales/{ => default}/global/en-GB.yml (100%)
 rename locales/{ => default}/global/en-US.yml (100%)
 rename locales/{ => default}/global/zh-CN.yml (100%)
 rename locales/{ => default}/home/en-GB.yml (100%)
 rename locales/{ => default}/home/en-US.yml (100%)
 rename locales/{ => default}/home/zh-CN.yml (100%)
 rename locales/{ => default}/leaderboard/en-GB.yml (100%)
 rename locales/{ => default}/leaderboard/en-US.yml (100%)
 rename locales/{ => default}/leaderboard/zh-CN.yml (100%)
 rename locales/{ => default}/login/en-GB.yml (100%)
 rename locales/{ => default}/login/en-US.yml (100%)
 rename locales/{ => default}/login/zh-CN.yml (100%)
 rename locales/{ => default}/logout/en-GB.yml (100%)
 rename locales/{ => default}/logout/en-US.yml (100%)
 rename locales/{ => default}/logout/zh-CN.yml (100%)
 rename locales/{ => default}/navbar/en-GB.yml (100%)
 rename locales/{ => default}/navbar/en-US.yml (100%)
 rename locales/{ => default}/navbar/zh-CN.yml (100%)
 rename locales/{ => default}/profile/en-GB.yml (100%)
 rename locales/{ => default}/profile/en-US.yml (100%)
 rename locales/{ => default}/profile/zh-CN.yml (100%)
 rename locales/{ => default}/register/en-GB.yml (100%)
 rename locales/{ => default}/register/en-US.yml (100%)
 rename locales/{ => default}/register/zh-CN.yml (95%)
 rename locales/{ => default}/settings/en-GB.yml (100%)
 rename locales/{ => default}/settings/en-US.yml (100%)
 rename locales/{ => default}/settings/password/en-GB.yml (100%)
 rename locales/{ => default}/settings/password/en-US.yml (100%)
 rename locales/{ => default}/settings/password/zh-CN.yml (100%)
 rename locales/{ => default}/settings/profile/en-GB.yml (100%)
 rename locales/{ => default}/settings/profile/en-US.yml (100%)
 rename locales/{ => default}/settings/profile/zh-CN.yml (100%)
 rename locales/{ => default}/settings/zh-CN.yml (100%)
 rename locales/{ => default}/verify/en-GB.yml (100%)
 rename locales/{ => default}/verify/en-US.yml (100%)
 rename locales/{ => default}/verify/zh-CN.yml (100%)
 create mode 100644 locales/ppy.sb/home/zh-CN.yml
 rename utils/i18n/{original-reader.mjs => built-reader.mjs} (100%)
 rename utils/i18n/{original-writer.mjs => built-writer.mjs} (100%)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index d1de336f..892db09d 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -2,7 +2,7 @@
   "nuxt.isNuxtApp": false,
   "i18n-ally.namespace": true,
   "i18n-ally.pathMatcher": "{namespaces}/{locale}.{ext}",
-  "i18n-ally.localesPaths": "locales",
+  "i18n-ally.localesPaths": ["locales/default", "locales/ppy.sb"],
   "i18n-ally.extract.keygenStyle": "kebab-case",
   "i18n-ally.translate.engines": ["google"],
   "i18n-ally.extract.keyMaxLength": 50,
diff --git a/config.mjs b/config.mjs
new file mode 100644
index 00000000..fc6f884e
--- /dev/null
+++ b/config.mjs
@@ -0,0 +1,4 @@
+export const using = [
+  'locales/default', // default locales
+  'locales/ppy.sb' // locales for ppy.sb
+]
\ No newline at end of file
diff --git a/locales/404/en-GB.yml b/locales/default/404/en-GB.yml
similarity index 100%
rename from locales/404/en-GB.yml
rename to locales/default/404/en-GB.yml
diff --git a/locales/404/en-US.yml b/locales/default/404/en-US.yml
similarity index 100%
rename from locales/404/en-US.yml
rename to locales/default/404/en-US.yml
diff --git a/locales/404/zh-CN.yml b/locales/default/404/zh-CN.yml
similarity index 100%
rename from locales/404/zh-CN.yml
rename to locales/default/404/zh-CN.yml
diff --git a/locales/admin/base/en-GB.yml b/locales/default/admin/base/en-GB.yml
similarity index 100%
rename from locales/admin/base/en-GB.yml
rename to locales/default/admin/base/en-GB.yml
diff --git a/locales/admin/base/en-US.yml b/locales/default/admin/base/en-US.yml
similarity index 100%
rename from locales/admin/base/en-US.yml
rename to locales/default/admin/base/en-US.yml
diff --git a/locales/admin/base/zh-CN.yml b/locales/default/admin/base/zh-CN.yml
similarity index 100%
rename from locales/admin/base/zh-CN.yml
rename to locales/default/admin/base/zh-CN.yml
diff --git a/locales/admin/beatmaps/en-GB.yml b/locales/default/admin/beatmaps/en-GB.yml
similarity index 100%
rename from locales/admin/beatmaps/en-GB.yml
rename to locales/default/admin/beatmaps/en-GB.yml
diff --git a/locales/admin/beatmaps/en-US.yml b/locales/default/admin/beatmaps/en-US.yml
similarity index 100%
rename from locales/admin/beatmaps/en-US.yml
rename to locales/default/admin/beatmaps/en-US.yml
diff --git a/locales/admin/beatmaps/zh-CN.yml b/locales/default/admin/beatmaps/zh-CN.yml
similarity index 100%
rename from locales/admin/beatmaps/zh-CN.yml
rename to locales/default/admin/beatmaps/zh-CN.yml
diff --git a/locales/admin/en-GB.yml b/locales/default/admin/en-GB.yml
similarity index 100%
rename from locales/admin/en-GB.yml
rename to locales/default/admin/en-GB.yml
diff --git a/locales/admin/en-US.yml b/locales/default/admin/en-US.yml
similarity index 100%
rename from locales/admin/en-US.yml
rename to locales/default/admin/en-US.yml
diff --git a/locales/admin/home/en-GB.yml b/locales/default/admin/home/en-GB.yml
similarity index 100%
rename from locales/admin/home/en-GB.yml
rename to locales/default/admin/home/en-GB.yml
diff --git a/locales/admin/home/en-US.yml b/locales/default/admin/home/en-US.yml
similarity index 100%
rename from locales/admin/home/en-US.yml
rename to locales/default/admin/home/en-US.yml
diff --git a/locales/admin/home/zh-CN.yml b/locales/default/admin/home/zh-CN.yml
similarity index 100%
rename from locales/admin/home/zh-CN.yml
rename to locales/default/admin/home/zh-CN.yml
diff --git a/locales/admin/restrictions/en-GB.yml b/locales/default/admin/restrictions/en-GB.yml
similarity index 100%
rename from locales/admin/restrictions/en-GB.yml
rename to locales/default/admin/restrictions/en-GB.yml
diff --git a/locales/admin/restrictions/en-US.yml b/locales/default/admin/restrictions/en-US.yml
similarity index 100%
rename from locales/admin/restrictions/en-US.yml
rename to locales/default/admin/restrictions/en-US.yml
diff --git a/locales/admin/restrictions/zh-CN.yml b/locales/default/admin/restrictions/zh-CN.yml
similarity index 100%
rename from locales/admin/restrictions/zh-CN.yml
rename to locales/default/admin/restrictions/zh-CN.yml
diff --git a/locales/admin/users/en-GB.yml b/locales/default/admin/users/en-GB.yml
similarity index 100%
rename from locales/admin/users/en-GB.yml
rename to locales/default/admin/users/en-GB.yml
diff --git a/locales/admin/users/en-US.yml b/locales/default/admin/users/en-US.yml
similarity index 100%
rename from locales/admin/users/en-US.yml
rename to locales/default/admin/users/en-US.yml
diff --git a/locales/admin/users/zh-CN.yml b/locales/default/admin/users/zh-CN.yml
similarity index 100%
rename from locales/admin/users/zh-CN.yml
rename to locales/default/admin/users/zh-CN.yml
diff --git a/locales/admin/zh-CN.yml b/locales/default/admin/zh-CN.yml
similarity index 100%
rename from locales/admin/zh-CN.yml
rename to locales/default/admin/zh-CN.yml
diff --git a/locales/global/en-GB.yml b/locales/default/global/en-GB.yml
similarity index 100%
rename from locales/global/en-GB.yml
rename to locales/default/global/en-GB.yml
diff --git a/locales/global/en-US.yml b/locales/default/global/en-US.yml
similarity index 100%
rename from locales/global/en-US.yml
rename to locales/default/global/en-US.yml
diff --git a/locales/global/zh-CN.yml b/locales/default/global/zh-CN.yml
similarity index 100%
rename from locales/global/zh-CN.yml
rename to locales/default/global/zh-CN.yml
diff --git a/locales/home/en-GB.yml b/locales/default/home/en-GB.yml
similarity index 100%
rename from locales/home/en-GB.yml
rename to locales/default/home/en-GB.yml
diff --git a/locales/home/en-US.yml b/locales/default/home/en-US.yml
similarity index 100%
rename from locales/home/en-US.yml
rename to locales/default/home/en-US.yml
diff --git a/locales/home/zh-CN.yml b/locales/default/home/zh-CN.yml
similarity index 100%
rename from locales/home/zh-CN.yml
rename to locales/default/home/zh-CN.yml
diff --git a/locales/leaderboard/en-GB.yml b/locales/default/leaderboard/en-GB.yml
similarity index 100%
rename from locales/leaderboard/en-GB.yml
rename to locales/default/leaderboard/en-GB.yml
diff --git a/locales/leaderboard/en-US.yml b/locales/default/leaderboard/en-US.yml
similarity index 100%
rename from locales/leaderboard/en-US.yml
rename to locales/default/leaderboard/en-US.yml
diff --git a/locales/leaderboard/zh-CN.yml b/locales/default/leaderboard/zh-CN.yml
similarity index 100%
rename from locales/leaderboard/zh-CN.yml
rename to locales/default/leaderboard/zh-CN.yml
diff --git a/locales/login/en-GB.yml b/locales/default/login/en-GB.yml
similarity index 100%
rename from locales/login/en-GB.yml
rename to locales/default/login/en-GB.yml
diff --git a/locales/login/en-US.yml b/locales/default/login/en-US.yml
similarity index 100%
rename from locales/login/en-US.yml
rename to locales/default/login/en-US.yml
diff --git a/locales/login/zh-CN.yml b/locales/default/login/zh-CN.yml
similarity index 100%
rename from locales/login/zh-CN.yml
rename to locales/default/login/zh-CN.yml
diff --git a/locales/logout/en-GB.yml b/locales/default/logout/en-GB.yml
similarity index 100%
rename from locales/logout/en-GB.yml
rename to locales/default/logout/en-GB.yml
diff --git a/locales/logout/en-US.yml b/locales/default/logout/en-US.yml
similarity index 100%
rename from locales/logout/en-US.yml
rename to locales/default/logout/en-US.yml
diff --git a/locales/logout/zh-CN.yml b/locales/default/logout/zh-CN.yml
similarity index 100%
rename from locales/logout/zh-CN.yml
rename to locales/default/logout/zh-CN.yml
diff --git a/locales/navbar/en-GB.yml b/locales/default/navbar/en-GB.yml
similarity index 100%
rename from locales/navbar/en-GB.yml
rename to locales/default/navbar/en-GB.yml
diff --git a/locales/navbar/en-US.yml b/locales/default/navbar/en-US.yml
similarity index 100%
rename from locales/navbar/en-US.yml
rename to locales/default/navbar/en-US.yml
diff --git a/locales/navbar/zh-CN.yml b/locales/default/navbar/zh-CN.yml
similarity index 100%
rename from locales/navbar/zh-CN.yml
rename to locales/default/navbar/zh-CN.yml
diff --git a/locales/profile/en-GB.yml b/locales/default/profile/en-GB.yml
similarity index 100%
rename from locales/profile/en-GB.yml
rename to locales/default/profile/en-GB.yml
diff --git a/locales/profile/en-US.yml b/locales/default/profile/en-US.yml
similarity index 100%
rename from locales/profile/en-US.yml
rename to locales/default/profile/en-US.yml
diff --git a/locales/profile/zh-CN.yml b/locales/default/profile/zh-CN.yml
similarity index 100%
rename from locales/profile/zh-CN.yml
rename to locales/default/profile/zh-CN.yml
diff --git a/locales/register/en-GB.yml b/locales/default/register/en-GB.yml
similarity index 100%
rename from locales/register/en-GB.yml
rename to locales/default/register/en-GB.yml
diff --git a/locales/register/en-US.yml b/locales/default/register/en-US.yml
similarity index 100%
rename from locales/register/en-US.yml
rename to locales/default/register/en-US.yml
diff --git a/locales/register/zh-CN.yml b/locales/default/register/zh-CN.yml
similarity index 95%
rename from locales/register/zh-CN.yml
rename to locales/default/register/zh-CN.yml
index 5ed89c08..12f68c9f 100644
--- a/locales/register/zh-CN.yml
+++ b/locales/default/register/zh-CN.yml
@@ -3,7 +3,7 @@ register: 注册账号
 email: 电子邮箱
 already-have-an-account: 已经拥有账号了?
 username: 你的用户名
-captcha-failed: Captcha failed.
+captcha-failed: 验证码有问题。
 currently-disabled: 注册功能目前正在禁用中
 email-already-taken: 该电子邮箱已经被其他用户注册过了
 email-is-invalid: 无效的邮箱格式
diff --git a/locales/settings/en-GB.yml b/locales/default/settings/en-GB.yml
similarity index 100%
rename from locales/settings/en-GB.yml
rename to locales/default/settings/en-GB.yml
diff --git a/locales/settings/en-US.yml b/locales/default/settings/en-US.yml
similarity index 100%
rename from locales/settings/en-US.yml
rename to locales/default/settings/en-US.yml
diff --git a/locales/settings/password/en-GB.yml b/locales/default/settings/password/en-GB.yml
similarity index 100%
rename from locales/settings/password/en-GB.yml
rename to locales/default/settings/password/en-GB.yml
diff --git a/locales/settings/password/en-US.yml b/locales/default/settings/password/en-US.yml
similarity index 100%
rename from locales/settings/password/en-US.yml
rename to locales/default/settings/password/en-US.yml
diff --git a/locales/settings/password/zh-CN.yml b/locales/default/settings/password/zh-CN.yml
similarity index 100%
rename from locales/settings/password/zh-CN.yml
rename to locales/default/settings/password/zh-CN.yml
diff --git a/locales/settings/profile/en-GB.yml b/locales/default/settings/profile/en-GB.yml
similarity index 100%
rename from locales/settings/profile/en-GB.yml
rename to locales/default/settings/profile/en-GB.yml
diff --git a/locales/settings/profile/en-US.yml b/locales/default/settings/profile/en-US.yml
similarity index 100%
rename from locales/settings/profile/en-US.yml
rename to locales/default/settings/profile/en-US.yml
diff --git a/locales/settings/profile/zh-CN.yml b/locales/default/settings/profile/zh-CN.yml
similarity index 100%
rename from locales/settings/profile/zh-CN.yml
rename to locales/default/settings/profile/zh-CN.yml
diff --git a/locales/settings/zh-CN.yml b/locales/default/settings/zh-CN.yml
similarity index 100%
rename from locales/settings/zh-CN.yml
rename to locales/default/settings/zh-CN.yml
diff --git a/locales/verify/en-GB.yml b/locales/default/verify/en-GB.yml
similarity index 100%
rename from locales/verify/en-GB.yml
rename to locales/default/verify/en-GB.yml
diff --git a/locales/verify/en-US.yml b/locales/default/verify/en-US.yml
similarity index 100%
rename from locales/verify/en-US.yml
rename to locales/default/verify/en-US.yml
diff --git a/locales/verify/zh-CN.yml b/locales/default/verify/zh-CN.yml
similarity index 100%
rename from locales/verify/zh-CN.yml
rename to locales/default/verify/zh-CN.yml
diff --git a/locales/ppy.sb/home/zh-CN.yml b/locales/ppy.sb/home/zh-CN.yml
new file mode 100644
index 00000000..9fe92e31
--- /dev/null
+++ b/locales/ppy.sb/home/zh-CN.yml
@@ -0,0 +1,2 @@
+subtitle-big: |-
+  欢迎来到 %{appName}, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. %{appName} 新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
\ No newline at end of file
diff --git a/utils/i18n/original-reader.mjs b/utils/i18n/built-reader.mjs
similarity index 100%
rename from utils/i18n/original-reader.mjs
rename to utils/i18n/built-reader.mjs
diff --git a/utils/i18n/original-writer.mjs b/utils/i18n/built-writer.mjs
similarity index 100%
rename from utils/i18n/original-writer.mjs
rename to utils/i18n/built-writer.mjs
diff --git a/utils/i18n/commands/build.mjs b/utils/i18n/commands/build.mjs
index dd62dccc..8752dc55 100644
--- a/utils/i18n/commands/build.mjs
+++ b/utils/i18n/commands/build.mjs
@@ -1,6 +1,6 @@
 
 import { readLocales } from '../reader.mjs'
-import { writeToDisk } from '../original-writer.mjs'
+import { writeToDisk } from '../built-writer.mjs'
 import clui from 'clui'
 const { Spinner } = clui
 
diff --git a/utils/i18n/commands/migrate.mjs b/utils/i18n/commands/migrate.mjs
index 4d239184..16faed23 100644
--- a/utils/i18n/commands/migrate.mjs
+++ b/utils/i18n/commands/migrate.mjs
@@ -1,5 +1,5 @@
 
-import { readLocales } from '../original-reader.mjs'
+import { readLocales } from '../built-reader.mjs'
 import { writeToDisk } from '../writer.mjs'
 
 readLocales().then(locales => writeToDisk(locales))
\ No newline at end of file
diff --git a/utils/i18n/config.mjs b/utils/i18n/config.mjs
index 72b53665..a7c66d4b 100644
--- a/utils/i18n/config.mjs
+++ b/utils/i18n/config.mjs
@@ -4,12 +4,14 @@ import { join, dirname } from 'path';
 import { fileURLToPath } from 'url';
 import { merge } from 'lodash-es'
 
+import { using } from '../../config.mjs'
+
 const __dirname = dirname(fileURLToPath(import.meta.url));
 
 export const compiledFileNameSchema = ['namespace', 'locale', 'extension']
 export const compiledFileSchema = ['locale', 'entries']
 export const compiled = join(__dirname, '../../.locales')
-export const path = join(__dirname, '../../locales')
+export const paths = using.map(p => join(__dirname, '../../', p))
 export const divider = '.'
 
 export function contextToFileName (context) {
diff --git a/utils/i18n/reader.mjs b/utils/i18n/reader.mjs
index 0038967c..bf6a2c8b 100644
--- a/utils/i18n/reader.mjs
+++ b/utils/i18n/reader.mjs
@@ -1,13 +1,19 @@
 // @ts-check
 import glob from 'glob'
-import path from 'path'
+import path, { resolve } from 'path'
 import fs from 'fs'
 import yaml from 'js-yaml'
-import { mergeWith, merge } from 'lodash-es'
-
-import { compiledFileSchema, path as translationPath, contextFromFileName, createConfilitKeyHandler } from './config.mjs'
+import { mergeWith, merge, reject } from 'lodash-es'
 
+import { compiledFileSchema, paths as translationPaths, contextFromFileName, createConfilitKeyHandler } from './config.mjs'
 
+// context
+// {
+//     namespace: namespaces.join('.'),
+//     namespaces,
+//     locale: locale.replace('_', '-'),
+//     extension
+// }
 const parseLocale = (file, context) => {
     const locale = yaml.load(fs.readFileSync(file, 'utf8'))
     const _parse = (locale) => {
@@ -43,6 +49,60 @@ const parseLocale = (file, context) => {
         return _parse(locale)
     }
 }
+
+// file
+// {
+//     namespace: namespaces.join('.'),
+//     namespaces,
+//     locale: locale.replace('_', '-'),
+//     extension
+// }
+const mixinLocale = ({ merging, joinedLocales, mixingWith: { parsedLocale, context } }) => {
+    if (!joinedLocales[context.locale]) joinedLocales[context.locale] = {}
+    joinedLocales[context.locale] = mergeWith(
+        joinedLocales[context.locale],
+        parsedLocale[context.locale],
+        (objValue, srcValue, key, object, source, stack) => {
+            if (!objValue) {
+                return srcValue
+            }
+            for (const k in srcValue) {
+                if (objValue[k] && objValue[k] !== srcValue[k]) {
+                    if (!merging) console.warn(`[Warning] Merging into initilazed value:
+${key}.${k}:
+[${typeof srcValue[k]}${typeof srcValue[k] === 'string' && ' `' + srcValue[k] + '`' || ''}] merging into [${typeof objValue[k]}${typeof objValue[k] === 'string' && ' `' + objValue[k] + '`' || ''}].`)
+                    objValue = createConfilitKeyHandler(merging)(objValue, srcValue, k)
+                    if (!merging) console.log('')
+                } else {
+                    objValue[k] = srcValue[k]
+                }
+            }
+            return objValue
+            // return merge(objValue, srcValue)
+        }
+    )
+}
+
+const createReducer = ({ translationPath, merging }) => async (acc, match) => {
+    console.log('parsing', match, '...\n')
+    try {
+        acc = await acc
+        const relative = path.relative(translationPath, match)
+        const context = contextFromFileName(relative)
+        const data = await parseLocale(match, context)
+        mixinLocale({
+            merging,
+            joinedLocales: acc,
+            mixingWith: {
+                parsedLocale: data,
+                context
+            }
+        })
+        return acc
+    } catch (error) {
+        console.error(error)
+    }
+}
 /* ----------------------------------------------------------------
 ** return format: {
   [locale]: {
@@ -53,57 +113,19 @@ const parseLocale = (file, context) => {
 }
 * allow customization if {lang}.custom.(yml|yaml) is provided.
 */
-export const readLocales = () => new Promise((resolve, reject) => {
-    glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
-        if (err) throw err
-        const { normal, custom } = matches.reduce((acc, cur) => {
-            if (!cur.includes('.custom')) {
-                acc.normal.push(cur)
-            }
-            else {
-                acc.custom.push(cur)
-            }
-            return acc
-        }, { normal: [], custom: [] })
-        const reducer = (customMerge) => async (acc, match) => {
-            console.log('parsing', match, '...\n')
-            try {
-                acc = await acc
-                const relative = path.relative(translationPath, match)
-                const removeOverwrite = relative.replace('.custom', '')
-                const context = contextFromFileName(removeOverwrite)
-                const data = await parseLocale(match, context)
-                if (!acc[context.locale]) acc[context.locale] = {}
-                acc[context.locale] = mergeWith(
-                    acc[context.locale],
-                    data[context.locale],
-                    (objValue, srcValue, key, object, source, stack) => {
-                        if (!objValue) {
-                            return srcValue
-                        }
-                        for (const k in srcValue) {
-                            if (objValue[k] && objValue[k] !== srcValue[k]) {
-                                if (!customMerge) console.warn(`[Warning] Merging into initilazed value:
-  ${key}.${k}:
-    [${typeof srcValue[k]}${typeof srcValue[k] === 'string' && ' `' + srcValue[k] + '`' || ''}] merging into [${typeof objValue[k]}${typeof objValue[k] === 'string' && ' `' + objValue[k] + '`' || ''}].`)
-                                objValue = createConfilitKeyHandler(customMerge)(objValue, srcValue, k)
-                                if (!customMerge) console.log('')
-                            } else {
-                                objValue[k] = srcValue[k]
-                            }
-                        }
-                        return objValue
-                        // return merge(objValue, srcValue)
-                    }
-                )
-                return acc
-            } catch (error) {
-                reject(error)
-            }
-        }
-        let locales = await normal.reduce(reducer(false), {})
-        locales = await custom.reduce(reducer(true), locales)
-        // console.log(locales)
-        resolve(locales)
+const asyncGlob = (path) => new Promise((resolve, reject) => {
+    glob(path, (err, matches) => {
+        if (err) reject(err)
+        else resolve(matches)
     })
 })
+export const readLocales = async () => {
+    let locales = {}
+    for (const [index, translationPath] of translationPaths.entries()) {
+        const matches = await asyncGlob(path.join(translationPath, '**/*.yml'))
+        const reducer = createReducer({ translationPath, merging: index > 0 })
+        locales = await matches.reduce(reducer, locales)
+    }
+
+    return locales
+}

From 9686a8f7bd73401e4c01aaac14a826f581c686b3 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 12 Aug 2022 02:56:57 +0000
Subject: [PATCH 200/278] how are these two route different?

---
 blueprints/frontend.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 8b707183..a1c1d7a8 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -668,7 +668,7 @@ async def get_profile_banner(user_id: int):
     return b'{"status":404}'
 
 @frontend.route('/language/<lang>/<path:path>')
-@frontend.route('/language/<lang>', defaults = {'path' : 'home'})
+@frontend.route('/language/<lang>/', defaults = {'path' : 'home'})
 async def set_language(lang: str, path: str):
     session['lang'] = lang
     return redirect('/' + path)

From 7b737137e5e17c45d45ed1d60eacfc11d43c77d5 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 12 Aug 2022 03:41:23 +0000
Subject: [PATCH 201/278] advanced language pack function

---
 config.mjs            |  4 +++-
 utils/i18n/config.mjs | 46 ++++++++++++++++++++++++++++++++++++++-----
 utils/i18n/reader.mjs |  6 ++++--
 3 files changed, 48 insertions(+), 8 deletions(-)

diff --git a/config.mjs b/config.mjs
index fc6f884e..2814af11 100644
--- a/config.mjs
+++ b/config.mjs
@@ -1,4 +1,6 @@
 export const using = [
   'locales/default', // default locales
-  'locales/ppy.sb' // locales for ppy.sb
+  ['locales/ppy.sb', {
+    only: 'home'
+  }]
 ]
\ No newline at end of file
diff --git a/utils/i18n/config.mjs b/utils/i18n/config.mjs
index a7c66d4b..628a09d8 100644
--- a/utils/i18n/config.mjs
+++ b/utils/i18n/config.mjs
@@ -1,8 +1,8 @@
 // @ts-check
 // @ts-ignore
-import { join, dirname } from 'path';
+import path, { join, dirname } from 'path';
 import { fileURLToPath } from 'url';
-import { merge } from 'lodash-es'
+import { every, merge } from 'lodash-es'
 
 import { using } from '../../config.mjs'
 
@@ -11,10 +11,46 @@ const __dirname = dirname(fileURLToPath(import.meta.url));
 export const compiledFileNameSchema = ['namespace', 'locale', 'extension']
 export const compiledFileSchema = ['locale', 'entries']
 export const compiled = join(__dirname, '../../.locales')
-export const paths = using.map(p => join(__dirname, '../../', p))
+export const paths = using.map(p => {
+    if (typeof p === "string") {
+        return {
+            path: join(__dirname, '../../', p),
+            filter: () => true
+        }
+    } else if (Array.isArray(p)) {
+        if (p.length < 1) return
+        const path = p[0]
+        const returnValue = {
+            path: join(__dirname, '../../', path),
+            filter: () => true
+        }
+        if (p.length < 2) return returnValue
+
+        const conf = p[1]
+        if (conf.filter) {
+            returnValue.filter = conf.filter
+            return returnValue
+        } else {
+            if (typeof conf.only === "string") {
+                conf.only = [conf.only]
+                conf.only = conf.only.map((path) => join(returnValue.path, path))
+                console.log(conf.only)
+                returnValue.filter = (path) => conf.only.some(only => path.startsWith(only))
+                return returnValue
+            }
+            if (typeof conf.except === "string") {
+                conf.except = [conf.except]
+                conf.except = conf.except.map((path) => join(returnValue.path, path))
+                returnValue.filter = (path) => conf.except.every(except => !path.startsWith(except))
+                return returnValue
+            }
+            throw new Error('config invalid:' + p)
+        }
+    }
+}).filter(Boolean)
 export const divider = '.'
 
-export function contextToFileName (context) {
+export function contextToFileName(context) {
     return `${context.namespace}/${context.locale}.${context.extension || 'yml'}`
 }
 export function contextFromFileName(fileName) {
@@ -29,7 +65,7 @@ export function contextFromFileName(fileName) {
     }
 }
 export const createConfilitKeyHandler = (mergeMode) => function onConflictingKey(oldVal, newVal, key) {
-    if (typeof newVal[key] !== 'object' && typeof oldVal[key]  !== 'object') {
+    if (typeof newVal[key] !== 'object' && typeof oldVal[key] !== 'object') {
         console.log(typeof newVal[key], oldVal[key], newVal[key])
         return {
             ...oldVal,
diff --git a/utils/i18n/reader.mjs b/utils/i18n/reader.mjs
index bf6a2c8b..1ed0ed67 100644
--- a/utils/i18n/reader.mjs
+++ b/utils/i18n/reader.mjs
@@ -121,8 +121,10 @@ const asyncGlob = (path) => new Promise((resolve, reject) => {
 })
 export const readLocales = async () => {
     let locales = {}
-    for (const [index, translationPath] of translationPaths.entries()) {
-        const matches = await asyncGlob(path.join(translationPath, '**/*.yml'))
+    for (const [index, conf] of translationPaths.entries()) {
+        const { path: translationPath, filter } = conf
+        const matches = (await asyncGlob(path.join(translationPath, '**/*.yml')))
+        .filter(filter)
         const reducer = createReducer({ translationPath, merging: index > 0 })
         locales = await matches.reduce(reducer, locales)
     }

From 49c9a70ec14bfef8a96a436df3a503440184d2f9 Mon Sep 17 00:00:00 2001
From: DAYGoodTime <ken570015@163.com>
Date: Fri, 12 Aug 2022 03:56:43 +0000
Subject: [PATCH 202/278] Translate proprietary ppy-sb text and remove 
 soon-to-be-removed features Translate

---
 locales/default/admin/beatmaps/en-GB.yml | 1 -
 locales/default/admin/beatmaps/en-US.yml | 1 -
 locales/default/admin/beatmaps/zh-CN.yml | 1 -
 locales/default/admin/users/en-GB.yml    | 2 ++
 locales/default/admin/users/en-US.yml    | 2 ++
 locales/default/admin/users/zh-CN.yml    | 2 ++
 locales/default/home/zh-CN.yml           | 2 +-
 locales/default/navbar/zh-CN.yml         | 2 +-
 locales/default/verify/zh-CN.yml         | 7 +++----
 locales/ppy.sb/home/en-GB.yml            | 2 ++
 locales/ppy.sb/home/en-US.yml            | 2 ++
 locales/ppy.sb/verify/en-GB.yml          | 2 ++
 locales/ppy.sb/verify/en-US.yml          | 2 ++
 locales/ppy.sb/verify/zh-CN.yml          | 2 ++
 templates/admin/beatmaps.html            | 4 ----
 templates/admin/users_edit.html          | 4 ++--
 16 files changed, 23 insertions(+), 15 deletions(-)
 create mode 100644 locales/ppy.sb/home/en-GB.yml
 create mode 100644 locales/ppy.sb/home/en-US.yml
 create mode 100644 locales/ppy.sb/verify/en-GB.yml
 create mode 100644 locales/ppy.sb/verify/en-US.yml
 create mode 100644 locales/ppy.sb/verify/zh-CN.yml

diff --git a/locales/default/admin/beatmaps/en-GB.yml b/locales/default/admin/beatmaps/en-GB.yml
index f6f8f60e..8bdb7e47 100644
--- a/locales/default/admin/beatmaps/en-GB.yml
+++ b/locales/default/admin/beatmaps/en-GB.yml
@@ -25,5 +25,4 @@ ranked-set: Ranked Set
 loved-set: Loved Set
 approved-set: Approved Set
 pending-set: Pending Set
-sync-beatmapsets-with-bancho: Sync Beatmapsets with Bancho
 search-by-bid-sid-or-title: Search by bid, sid or title
diff --git a/locales/default/admin/beatmaps/en-US.yml b/locales/default/admin/beatmaps/en-US.yml
index f6f8f60e..8bdb7e47 100644
--- a/locales/default/admin/beatmaps/en-US.yml
+++ b/locales/default/admin/beatmaps/en-US.yml
@@ -25,5 +25,4 @@ ranked-set: Ranked Set
 loved-set: Loved Set
 approved-set: Approved Set
 pending-set: Pending Set
-sync-beatmapsets-with-bancho: Sync Beatmapsets with Bancho
 search-by-bid-sid-or-title: Search by bid, sid or title
diff --git a/locales/default/admin/beatmaps/zh-CN.yml b/locales/default/admin/beatmaps/zh-CN.yml
index e872cc35..35cd3bf8 100644
--- a/locales/default/admin/beatmaps/zh-CN.yml
+++ b/locales/default/admin/beatmaps/zh-CN.yml
@@ -25,5 +25,4 @@ ranked-set: 将整个谱面设置为 Ranked 状态
 loved-set: 将整个谱面设置为 Loved 状态
 approved-set: 将整个谱面设置为 Approved 状态
 pending-set: 将整个谱面设置为 Pending 状态
-sync-beatmapsets-with-bancho: 将整个谱面的状态与 Bancho 进行同步
 search-by-bid-sid-or-title: 根据 bid, sid 或者是 谱面名字 进行搜索
diff --git a/locales/default/admin/users/en-GB.yml b/locales/default/admin/users/en-GB.yml
index c099b1b0..d0e73517 100644
--- a/locales/default/admin/users/en-GB.yml
+++ b/locales/default/admin/users/en-GB.yml
@@ -17,3 +17,5 @@ unrestricted: Unrestricted
 restricted: Restricted
 update: Update
 search-by-username-or-email: Search by username or email
+password: Password
+new-password: New Password
diff --git a/locales/default/admin/users/en-US.yml b/locales/default/admin/users/en-US.yml
index c099b1b0..d0e73517 100644
--- a/locales/default/admin/users/en-US.yml
+++ b/locales/default/admin/users/en-US.yml
@@ -17,3 +17,5 @@ unrestricted: Unrestricted
 restricted: Restricted
 update: Update
 search-by-username-or-email: Search by username or email
+password: Password
+new-password: New Password
diff --git a/locales/default/admin/users/zh-CN.yml b/locales/default/admin/users/zh-CN.yml
index cc31de11..c4cabd8c 100644
--- a/locales/default/admin/users/zh-CN.yml
+++ b/locales/default/admin/users/zh-CN.yml
@@ -17,3 +17,5 @@ unrestricted: 未封禁
 restricted: 封禁
 update: 更新
 search-by-username-or-email: 根据 用户名 或 邮箱 进行搜索
+password: 密码
+new-password: 请输入新密码
diff --git a/locales/default/home/zh-CN.yml b/locales/default/home/zh-CN.yml
index ba81081c..58a51f29 100644
--- a/locales/default/home/zh-CN.yml
+++ b/locales/default/home/zh-CN.yml
@@ -1,5 +1,5 @@
 subtitle-big: |-
-  欢迎来到 %{appName}, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. %{appName} 新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
+  欢迎来到 %{appName}, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会.
 some-of-our-coolest-features: 我们觉得最酷的一些功能
 features-title-1: 对Relax 和 Autopilot mod的PP计算
 features-content-1: |-
diff --git a/locales/default/navbar/zh-CN.yml b/locales/default/navbar/zh-CN.yml
index b9e2d215..576f5e9a 100644
--- a/locales/default/navbar/zh-CN.yml
+++ b/locales/default/navbar/zh-CN.yml
@@ -6,4 +6,4 @@ profile: 玩家资料
 settings: 设置
 logout: 登出
 todo: 敬请期待
-looking-for-someone: 想要找某个用户?
+looking-for-someone: 想要寻找某个用户?
diff --git a/locales/default/verify/zh-CN.yml b/locales/default/verify/zh-CN.yml
index 7b077f11..666ef43e 100644
--- a/locales/default/verify/zh-CN.yml
+++ b/locales/default/verify/zh-CN.yml
@@ -3,7 +3,7 @@ how-to-verify-your-account: 如何来认证你的账号
 what-do-you-mean-this-must-be-easy-right: 别想太复杂, 肯定很简单拉~。
 follow-these-three-simple-steps: 跟随以下三个简单的步骤即可游玩 %{appName} 了!
 osu-shortcut: Osu! 快捷方式
-find-your-shortcut: 在桌面上寻找你的osu!快捷方式并复制一份 (如果没有，可以去osu!目录里创建一份)
+find-your-shortcut: 在桌面上寻找你的osu!快捷方式并复制一份 (如果没有,可以去osu!目录里创建一份)
 edit-it: 修改属性
 right-click-properties: 右键快捷方式, 在菜单中找到 "属性" 选项, (一般在最下边)
 find-target-element-box: 找到 "目标" 这一行
@@ -12,8 +12,7 @@ login-to-your-account: 登入你的账号
 login-to-your-app-name-account: 登录你的 %{appName} 账号, 然后就应该万事大吉了!
 oh-crap-i-am-stuck: 妈的，我卡在这个步骤了, 赶紧过来帮我一下
 need-help-join-discord-server: >-
-  Need help? We've got you covered - join the Discord so our community can help
-  you out!
-click-here-to-join-our-discord: Click here to join our Discord!
+  看上去你需要点帮助,没问题!加入我们的Discord服务器即可为你解决你的疑难杂症
+click-here-to-join-our-discord: 点击此处加入到我们的Discord服务器!
 waiting-for-verification: 正在等待验证结果~
 follow-the-simple-instructions: 只需按照上面的简单说明进行操作，完成后重新加载此页面！
diff --git a/locales/ppy.sb/home/en-GB.yml b/locales/ppy.sb/home/en-GB.yml
new file mode 100644
index 00000000..650b7c6c
--- /dev/null
+++ b/locales/ppy.sb/home/en-GB.yml
@@ -0,0 +1,2 @@
+subtitle-big: |-
+  Welcome to %{appName}, an all mode osu! private server. We have all-round pp system including advanced Relax and AutoPilot formula. Ranking system is also opened to all maps. And we provide unlimited chances to change your name. Our chatbot is always there providing you 24h profile and score presentation.-- For more information, join our QQ Group 792778662.Many services of %{appName} are still under construction, any issues can be reported to us
\ No newline at end of file
diff --git a/locales/ppy.sb/home/en-US.yml b/locales/ppy.sb/home/en-US.yml
new file mode 100644
index 00000000..650b7c6c
--- /dev/null
+++ b/locales/ppy.sb/home/en-US.yml
@@ -0,0 +1,2 @@
+subtitle-big: |-
+  Welcome to %{appName}, an all mode osu! private server. We have all-round pp system including advanced Relax and AutoPilot formula. Ranking system is also opened to all maps. And we provide unlimited chances to change your name. Our chatbot is always there providing you 24h profile and score presentation.-- For more information, join our QQ Group 792778662.Many services of %{appName} are still under construction, any issues can be reported to us
\ No newline at end of file
diff --git a/locales/ppy.sb/verify/en-GB.yml b/locales/ppy.sb/verify/en-GB.yml
new file mode 100644
index 00000000..334d0920
--- /dev/null
+++ b/locales/ppy.sb/verify/en-GB.yml
@@ -0,0 +1,2 @@
+need-help-join-discord-server: Need help? We've got you covered - join the QQ Group so our community can help you out!
+click-here-to-join-our-discord: 点击此处加入到我们的QQ群!
\ No newline at end of file
diff --git a/locales/ppy.sb/verify/en-US.yml b/locales/ppy.sb/verify/en-US.yml
new file mode 100644
index 00000000..99659f69
--- /dev/null
+++ b/locales/ppy.sb/verify/en-US.yml
@@ -0,0 +1,2 @@
+need-help-join-discord-server: 看上去你需要点帮助,没问题!加入我们的QQ群即可为你解决你的疑难杂症
+click-here-to-join-our-discord: Click here to join our QQ Group or search 792778662!!
\ No newline at end of file
diff --git a/locales/ppy.sb/verify/zh-CN.yml b/locales/ppy.sb/verify/zh-CN.yml
new file mode 100644
index 00000000..b343c20c
--- /dev/null
+++ b/locales/ppy.sb/verify/zh-CN.yml
@@ -0,0 +1,2 @@
+need-help-join-discord-server: 看上去你需要点帮助,没问题!加入我们的QQ群即可为你解决你的疑难杂症
+click-here-to-join-our-discord: 点击此处加入到我们的QQ群!
\ No newline at end of file
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 7b3ad337..ede8d087 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -178,10 +178,6 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
                                     <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">{{t("admin.beatmaps.loved-set")}}</a>
                                     <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">{{t("admin.beatmaps.approved-set")}}</a>
                                     <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">{{t("admin.beatmaps.pending-set")}}</a>
-                                    <hr class="dropdown-divider">
-                                    <a class="dropdown-item operate-button" href="javascript:void(0);" onclick="updateMaps({{ i.set_id }})">
-                                        {{t("admin.beatmaps.sync-beatmapsets-with-bancho")}}
-                                    </a>
                                 </div>
                             </div>
                         </div>
diff --git a/templates/admin/users_edit.html b/templates/admin/users_edit.html
index 6d389e15..0ea55e24 100644
--- a/templates/admin/users_edit.html
+++ b/templates/admin/users_edit.html
@@ -54,10 +54,10 @@
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-key" aria-hidden="true"></i>
-                    Password
+                    {{t("admin.users.password")}}
                 </div>
                 <div class="column">
-                    <input name="password" type="text" class="input" placeholder="New Password">
+                    <input name="password" type="text" class="input" placeholder='{{t("admin.users.new-password")}}'>
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">

From ae588d0019dd4623c398bb48fac0f9746adc0c18 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 12 Aug 2022 03:41:23 +0000
Subject: [PATCH 203/278] Translate proprietary ppy-sb text and remove 
 soon-to-be-removed features Translate

---
 locales/ppy.sb/verify/en-GB.yml | 6 +++++-
 locales/ppy.sb/verify/en-US.yml | 4 ++++
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/locales/ppy.sb/verify/en-GB.yml b/locales/ppy.sb/verify/en-GB.yml
index 334d0920..e1f155a1 100644
--- a/locales/ppy.sb/verify/en-GB.yml
+++ b/locales/ppy.sb/verify/en-GB.yml
@@ -1,2 +1,6 @@
 need-help-join-discord-server: Need help? We've got you covered - join the QQ Group so our community can help you out!
-click-here-to-join-our-discord: 点击此处加入到我们的QQ群!
\ No newline at end of file
+<<<<<<< HEAD
+click-here-to-join-our-discord: 点击此处加入到我们的QQ群!
+=======
+click-here-to-join-our-discord: Click here to join our QQ Group or search 792778662!!
+>>>>>>> 36b4c28 (Translate proprietary ppy-sb text)
diff --git a/locales/ppy.sb/verify/en-US.yml b/locales/ppy.sb/verify/en-US.yml
index 99659f69..5be03475 100644
--- a/locales/ppy.sb/verify/en-US.yml
+++ b/locales/ppy.sb/verify/en-US.yml
@@ -1,2 +1,6 @@
+<<<<<<< HEAD
 need-help-join-discord-server: 看上去你需要点帮助,没问题!加入我们的QQ群即可为你解决你的疑难杂症
+=======
+need-help-join-discord-server: Need help? We've got you covered - join the QQ Group so our community can help you out!
+>>>>>>> 36b4c28 (Translate proprietary ppy-sb text)
 click-here-to-join-our-discord: Click here to join our QQ Group or search 792778662!!
\ No newline at end of file

From a36adf6f2b3fb7e622a9a18885e08fcb3fdd2027 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Fri, 12 Aug 2022 04:15:23 +0000
Subject: [PATCH 204/278] code clean

---
 blueprints/admin.py                  |   8 +--
 blueprints/frontend.py               |   9 +--
 blueprints/i18npy.py                 |  22 ------
 constants/beatmaps.py                |  11 +++
 {objects => constants}/privileges.py |   0
 main.py                              | 102 +--------------------------
 objects/glob.py                      |  95 +++++++++++++++++++++++--
 templates/verify.html                |  17 -----
 8 files changed, 105 insertions(+), 159 deletions(-)
 delete mode 100644 blueprints/i18npy.py
 create mode 100644 constants/beatmaps.py
 rename {objects => constants}/privileges.py (100%)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 66b34fa7..21b3b340 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -4,7 +4,6 @@
 
 import bcrypt
 import hashlib
-from curses.ascii import isdigit
 from functools import wraps
 import hashlib
 from quart import Blueprint
@@ -12,15 +11,14 @@
 from quart import session
 from quart import request
 from quart import redirect
-
 from objects import glob
-from objects.privileges import Privileges
+from constants.privileges import Privileges
 from objects.utils import flash
 from objects import varka
-
+from objects.glob import t
 import datetime
 import timeago
-from blueprints.i18npy import t
+
 
 admin = Blueprint('admin', __name__)
 
diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index a1c1d7a8..c4ab603e 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -2,14 +2,11 @@
 
 __all__ = ()
 
-import imghdr
 import bcrypt
 import hashlib
 import os
 import time
 import uuid
-
-
 from cmyui.logging import Ansi
 from cmyui.logging import log
 from functools import wraps
@@ -21,15 +18,13 @@
 from quart import request
 from quart import session
 from quart import send_file
-
 from constants import regexes
 from objects import glob
 from objects import utils
-from objects.privileges import Privileges
+from constants.privileges import Privileges
 from objects.utils import flash
 from objects.utils import flash_with_customizations
-
-from blueprints.i18npy import t
+from objects.glob import t
 from objects.varka import search_user
 
 VALID_MODES = frozenset({'std', 'taiko', 'catch', 'mania'})
diff --git a/blueprints/i18npy.py b/blueprints/i18npy.py
deleted file mode 100644
index 5fefaeeb..00000000
--- a/blueprints/i18npy.py
+++ /dev/null
@@ -1,22 +0,0 @@
-
-#把locale传入i18n方法当中用于识别locale
-#不能放入main.py当中,会产生循环导入
-#(待翻译成en)
-
-from quart import Quart, session
-from objects import glob
-
-import i18n
-
-app = Quart(__name__)
-
-@app.template_global()
-def t(key, **kwargs) -> str:
-    kwargs['locale'] = session.get('lang', glob.config.default_locale)
-    try:
-        return i18n.t(key, **kwargs)
-    except:
-        try:
-            return i18n.t(key + '._string', **kwargs)
-        except:
-            return key
diff --git a/constants/beatmaps.py b/constants/beatmaps.py
new file mode 100644
index 00000000..5d57b850
--- /dev/null
+++ b/constants/beatmaps.py
@@ -0,0 +1,11 @@
+from enum import IntEnum
+
+
+class RankedStatus(IntEnum):
+    NotSubmitted = -1
+    Pending = 0
+    UpdateAvailable = 1
+    Ranked = 2
+    Approved = 3
+    Qualified = 4
+    Loved = 5
\ No newline at end of file
diff --git a/objects/privileges.py b/constants/privileges.py
similarity index 100%
rename from objects/privileges.py
rename to constants/privileges.py
diff --git a/main.py b/main.py
index a8b082fb..ed573a85 100755
--- a/main.py
+++ b/main.py
@@ -4,28 +4,15 @@
 __all__ = ()
 
 import os
-import time
-from objects.privileges import Privileges
-
-import markdown2
-import html
-
 import aiohttp
 import i18n
 import orjson
-from quart import Quart, session
 from quart import render_template
-
 from cmyui.logging import Ansi
 from cmyui.logging import log
 from cmyui.mysql import AsyncSQLPool
-from cmyui.version import Version
-
 from objects import glob
-
-app = Quart(__name__)
-
-version = Version(1, 3, 7)
+from objects.glob import app
 
 # used to secure session data.
 # we recommend using a long randomly generated ascii string.
@@ -51,93 +38,6 @@ async def shutdown() -> None:
     await glob.db.close()
     await glob.http.close()
 
-# globals which can be used in template code
-@app.template_global()
-def appVersion() -> str:
-    return repr(version)
-
-@app.template_global()
-def t(key, **kwargs) -> str:
-    kwargs['locale'] = session.get('lang', glob.config.default_locale)
-    try:
-        return i18n.t(key, **kwargs)
-    except:
-        try:
-            return i18n.t(key + '._string', **kwargs)
-        except:
-            return key
-
-@app.template_global()
-def appName() -> str:
-    return glob.config.app_name
-
-@app.template_global()
-def decode_priv(target_priv: int) -> str:
-    priv_list = [priv.name for priv in Privileges if target_priv & priv and bin(priv).count("1") == 1][::-1]
-    if 'Unrestricted' not in priv_list:
-        return 'Restricted'
-    if 'Verified' not in priv_list:
-        return 'Disclaimed'
-    if set(['Verified', 'Unrestricted']).issubset(priv_list):
-        priv_list.remove('Verified')
-        priv_list.remove('Unrestricted')
-        priv_list.append('Normal')
-    if set(['Dangerous', 'Admin', 'Mod']).issubset(priv_list):
-        priv_list.remove('Dangerous')
-        priv_list.remove('Admin')
-        priv_list.remove('Mod')
-        priv_list.append('Stuff')
-    if set(['Supporter', 'Premium']).issubset(priv_list):
-        priv_list.remove('Supporter')
-        priv_list.remove('Premium')
-        priv_list.append('Donator')
-    if 'Normal' in priv_list and len(priv_list) != 1:
-        priv_list.remove('Normal')
-    return ', '.join(priv_list)
-
-@app.template_global()
-def decode_map_status(status: int) -> str:
-    if status == -1:
-        return 'NotSubmitted'
-    if status == 0:
-        return 'Pending'
-    if status == 1:
-        return 'UpdateAvailable'
-    if status == 2:
-        return 'Ranked'
-    if status == 3:
-        return 'Approved'
-    if status == 4:
-        return 'Qualified'
-    if status == 5:
-        return 'Loved'
-
-@app.template_global()
-def captchaKey() -> str:
-    return glob.config.hCaptcha_sitekey
-
-@app.template_global()
-def handle_timestamp(timestamp):
-    return time.strftime("%Y-%m-%d %H:%M", time.localtime(int(timestamp)))
-
-@app.template_global()
-def domain() -> str:
-    return glob.config.domain
-
-@app.template_global()
-def config():
-    return glob.config
-
-@app.template_global()
-def render_markdown(md: str) -> str:
-    return markdown2.markdown(html.unescape(md), extras=[
-        'tables',
-        'break-on-newline',
-        'fenced-code-blocks',
-        'spoiler',
-        'strike'
-    ])
-
 from blueprints.frontend import frontend
 app.register_blueprint(frontend)
 
diff --git a/objects/glob.py b/objects/glob.py
index 9d6a0550..40fe83b6 100644
--- a/objects/glob.py
+++ b/objects/glob.py
@@ -2,20 +2,101 @@
 
 __all__ = ('db', 'http', 'version', 'cache')
 
-from typing import TYPE_CHECKING
+from datetime import time
+import os
+from quart import Quart, session
+import i18n
+import markdown2
+import html
+from aiohttp import ClientSession
+from cmyui.mysql import AsyncSQLPool
+from cmyui.version import Version
+import config
+from constants.beatmaps import RankedStatus
+from constants.privileges import Privileges
 
-import config  # imported for indirect use
-
-if TYPE_CHECKING:
-    from aiohttp import ClientSession
-    from cmyui.mysql import AsyncSQLPool
-    from cmyui.version import Version
 
 db: 'AsyncSQLPool'
 http: 'ClientSession'
 version: 'Version'
+app = Quart(__name__, template_folder=f'{os.getcwd()}/templates', static_folder=f'{os.getcwd()}/static')
+version = Version(1, 3, 7)
 
 cache = {
     'bcrypt': {},
     'search_data': {}
 }
+
+@app.template_global()
+def t(key, **kwargs) -> str:
+    kwargs['locale'] = session.get('lang', config.default_locale)
+    try:
+        return i18n.t(key, **kwargs)
+    except:
+        try:
+            return i18n.t(key + '._string', **kwargs)
+        except:
+            return key
+
+@app.template_global()
+def appName() -> str:
+    return config.app_name
+
+@app.template_global()
+def appVersion() -> str:
+    return repr(version)
+
+# Verified Unrestricted -> Normal
+# Dangerous Admin Mod -> Stuff
+# Supporter Premium -> Donator
+# Not Verified -> Disclaimed
+# Not Unrestricted -> Restricted
+@app.template_global()
+def decode_priv(target_priv: int) -> str:
+    priv_list = [priv.name for priv in Privileges if target_priv & priv and bin(priv).count("1") == 1][::-1]
+    if 'Unrestricted' not in priv_list:
+        return 'Restricted'
+    if 'Verified' not in priv_list:
+        return 'Disclaimed'
+    if set(['Verified', 'Unrestricted']).issubset(priv_list):
+        priv_list.remove('Verified')
+        priv_list.remove('Unrestricted')
+        priv_list.append('Normal')
+    if set(['Dangerous', 'Admin', 'Mod']).issubset(priv_list):
+        priv_list.remove('Dangerous')
+        priv_list.remove('Admin')
+        priv_list.remove('Mod')
+        priv_list.append('Stuff')
+    if set(['Supporter', 'Premium']).issubset(priv_list):
+        priv_list.remove('Supporter')
+        priv_list.remove('Premium')
+        priv_list.append('Donator')
+    if 'Normal' in priv_list and len(priv_list) != 1:
+        priv_list.remove('Normal')
+    return ', '.join(priv_list)
+
+@app.template_global()
+def captchaKey() -> str:
+    return config.hCaptcha_sitekey
+
+@app.template_global()
+def handle_timestamp(timestamp):
+    return time.strftime("%Y-%m-%d %H:%M", time.localtime(int(timestamp)))
+
+@app.template_global()
+def domain() -> str:
+    return config.domain
+
+@app.template_global()
+def render_markdown(md: str) -> str:
+    return markdown2.markdown(html.unescape(md), extras=[
+        'tables',
+        'break-on-newline',
+        'fenced-code-blocks',
+        'spoiler',
+        'strike'
+    ])
+
+@app.template_global()
+def decode_map_status(status: int) -> str:
+    return RankedStatus(status).name
\ No newline at end of file
diff --git a/templates/verify.html b/templates/verify.html
index ec5a8854..f3aaafb6 100644
--- a/templates/verify.html
+++ b/templates/verify.html
@@ -70,23 +70,6 @@ <h2 class="subtitle">{{ t('verify.login-to-your-app-name-account', appName = app
                     </div>
                 </div>
             </div>
-            {% if config().discord_invite_id %}
-            <div class="bordertitle">
-                <div class="titlewithsub">
-                    <h1 class="title is-left">{{ t('verify.oh-crap-i-am-stuck') }}</h1>
-                    <h2 class="subtitle">{{ t('verify.need-help-join-discord-server') }}</h2>
-                </div>
-            </div>
-            <div class="box flex is-mpadding is-marginless">
-                <a href="/discord" class="flex" id="discord"><img
-                        src="https://cdn.iconscout.com/icon/free/png-256/discord-2752210-2285027.png"
-                        class="discord-logo">
-                    <div class="clickhere-title flex flex-vcenter">
-                        <h1 class="title">{{ t('verify.click-here-to-join-our-discord') }}</h1>
-                    </div>
-                </a>
-            </div>
-            {% endif %}
             <div class="box is-block is-paddingless is-marginless is-waiting">
                 <div class="columns flex is-paddingless is-marginless">
                     <div class="column flex flex-vcenter">

From c6e78af33035f7b39e198d809394ff532df1740a Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Fri, 12 Aug 2022 04:27:20 +0000
Subject: [PATCH 205/278] remove sync & fix time and aboutme

---
 blueprints/frontend.py            |  7 ++++---
 objects/glob.py                   |  2 +-
 static/js/pages/admin/beatmaps.js | 23 -----------------------
 3 files changed, 5 insertions(+), 27 deletions(-)

diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index c4ab603e..2dc1dd38 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -226,11 +226,12 @@ async def settings_custom_post():
 @frontend.route('/settings/aboutme')
 @login_required
 async def settings_aboutme():
-    user = await glob.db.fetch(
+    content = (await glob.db.fetch(
         'SELECT userpage_content FROM users WHERE id = %s',
         [session['user_data']['id']]
-    )
-    return await render_template('settings/aboutme.html', userpage_content=user['userpage_content'])
+    ))['userpage_content']
+    content = content if content is not None else ""
+    return await render_template('settings/aboutme.html', userpage_content=content)
 
 @frontend.route('/settings/aboutme', methods=['POST'])
 @login_required
diff --git a/objects/glob.py b/objects/glob.py
index 40fe83b6..0cfa91cd 100644
--- a/objects/glob.py
+++ b/objects/glob.py
@@ -2,8 +2,8 @@
 
 __all__ = ('db', 'http', 'version', 'cache')
 
-from datetime import time
 import os
+import time
 from quart import Quart, session
 import i18n
 import markdown2
diff --git a/static/js/pages/admin/beatmaps.js b/static/js/pages/admin/beatmaps.js
index 57f861dc..fda6fe21 100644
--- a/static/js/pages/admin/beatmaps.js
+++ b/static/js/pages/admin/beatmaps.js
@@ -3,27 +3,4 @@ function searchMaps() {
     if (!search) return
     if (search.value == '') window.location.href = '/admin/beatmaps'
     else window.location.href = '/admin/beatmaps/search/' + search.value
-}
-
-function updateMaps(sid) {
-    _testGlobals(
-        { exists: ['domain', 'api_key'] }
-    )
-    var bar = document.getElementById('progress_bar')
-    var elements = document.getElementsByClassName('operate-button');
-    bar && bar.removeAttribute('style')
-    Array.prototype.forEach.call(elements, function (element) {
-        element.classList.add('is-disabled')
-    });
-    $.get('//api.' + window.domain + '/update_maps?api_key=' + window.api_key + '&sid=' + sid, function (data, status) {
-        bar && setStyle(bar, {
-            display: 'none'
-        })
-        Array.prototype.forEach.call(elements, function (element) {
-            element.classList.remove('is-disabled')
-        });
-        if (status == 'success') {
-            window.location.href = '/admin/beatmaps/search/' + data['sid']
-        }
-    })
 }
\ No newline at end of file

From 196559dd550a9b405387420223814f27c92d2550 Mon Sep 17 00:00:00 2001
From: DAYGoodTime <ken570015@163.com>
Date: Fri, 12 Aug 2022 04:54:39 +0000
Subject: [PATCH 206/278] Translate proprietary ppy-sb text and remove 
 soon-to-be-removed features Translate

---
 locales/default/admin/beatmaps/en-GB.yml | 1 -
 locales/default/admin/beatmaps/en-US.yml | 1 -
 locales/default/admin/beatmaps/zh-CN.yml | 1 -
 locales/default/admin/users/en-GB.yml    | 2 ++
 locales/default/admin/users/en-US.yml    | 2 ++
 locales/default/admin/users/zh-CN.yml    | 2 ++
 locales/default/home/zh-CN.yml           | 2 +-
 locales/default/navbar/zh-CN.yml         | 2 +-
 locales/default/verify/zh-CN.yml         | 7 +++----
 locales/ppy.sb/home/en-GB.yml            | 2 ++
 locales/ppy.sb/home/en-US.yml            | 2 ++
 locales/ppy.sb/verify/en-GB.yml          | 2 ++
 locales/ppy.sb/verify/en-US.yml          | 2 ++
 locales/ppy.sb/verify/zh-CN.yml          | 2 ++
 templates/admin/beatmaps.html            | 4 ----
 templates/admin/users_edit.html          | 4 ++--
 16 files changed, 23 insertions(+), 15 deletions(-)
 create mode 100644 locales/ppy.sb/home/en-GB.yml
 create mode 100644 locales/ppy.sb/home/en-US.yml
 create mode 100644 locales/ppy.sb/verify/en-GB.yml
 create mode 100644 locales/ppy.sb/verify/en-US.yml
 create mode 100644 locales/ppy.sb/verify/zh-CN.yml

diff --git a/locales/default/admin/beatmaps/en-GB.yml b/locales/default/admin/beatmaps/en-GB.yml
index f6f8f60e..8bdb7e47 100644
--- a/locales/default/admin/beatmaps/en-GB.yml
+++ b/locales/default/admin/beatmaps/en-GB.yml
@@ -25,5 +25,4 @@ ranked-set: Ranked Set
 loved-set: Loved Set
 approved-set: Approved Set
 pending-set: Pending Set
-sync-beatmapsets-with-bancho: Sync Beatmapsets with Bancho
 search-by-bid-sid-or-title: Search by bid, sid or title
diff --git a/locales/default/admin/beatmaps/en-US.yml b/locales/default/admin/beatmaps/en-US.yml
index f6f8f60e..8bdb7e47 100644
--- a/locales/default/admin/beatmaps/en-US.yml
+++ b/locales/default/admin/beatmaps/en-US.yml
@@ -25,5 +25,4 @@ ranked-set: Ranked Set
 loved-set: Loved Set
 approved-set: Approved Set
 pending-set: Pending Set
-sync-beatmapsets-with-bancho: Sync Beatmapsets with Bancho
 search-by-bid-sid-or-title: Search by bid, sid or title
diff --git a/locales/default/admin/beatmaps/zh-CN.yml b/locales/default/admin/beatmaps/zh-CN.yml
index e872cc35..35cd3bf8 100644
--- a/locales/default/admin/beatmaps/zh-CN.yml
+++ b/locales/default/admin/beatmaps/zh-CN.yml
@@ -25,5 +25,4 @@ ranked-set: 将整个谱面设置为 Ranked 状态
 loved-set: 将整个谱面设置为 Loved 状态
 approved-set: 将整个谱面设置为 Approved 状态
 pending-set: 将整个谱面设置为 Pending 状态
-sync-beatmapsets-with-bancho: 将整个谱面的状态与 Bancho 进行同步
 search-by-bid-sid-or-title: 根据 bid, sid 或者是 谱面名字 进行搜索
diff --git a/locales/default/admin/users/en-GB.yml b/locales/default/admin/users/en-GB.yml
index c099b1b0..d0e73517 100644
--- a/locales/default/admin/users/en-GB.yml
+++ b/locales/default/admin/users/en-GB.yml
@@ -17,3 +17,5 @@ unrestricted: Unrestricted
 restricted: Restricted
 update: Update
 search-by-username-or-email: Search by username or email
+password: Password
+new-password: New Password
diff --git a/locales/default/admin/users/en-US.yml b/locales/default/admin/users/en-US.yml
index c099b1b0..d0e73517 100644
--- a/locales/default/admin/users/en-US.yml
+++ b/locales/default/admin/users/en-US.yml
@@ -17,3 +17,5 @@ unrestricted: Unrestricted
 restricted: Restricted
 update: Update
 search-by-username-or-email: Search by username or email
+password: Password
+new-password: New Password
diff --git a/locales/default/admin/users/zh-CN.yml b/locales/default/admin/users/zh-CN.yml
index cc31de11..c4cabd8c 100644
--- a/locales/default/admin/users/zh-CN.yml
+++ b/locales/default/admin/users/zh-CN.yml
@@ -17,3 +17,5 @@ unrestricted: 未封禁
 restricted: 封禁
 update: 更新
 search-by-username-or-email: 根据 用户名 或 邮箱 进行搜索
+password: 密码
+new-password: 请输入新密码
diff --git a/locales/default/home/zh-CN.yml b/locales/default/home/zh-CN.yml
index ba81081c..58a51f29 100644
--- a/locales/default/home/zh-CN.yml
+++ b/locales/default/home/zh-CN.yml
@@ -1,5 +1,5 @@
 subtitle-big: |-
-  欢迎来到 %{appName}, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会. 群内的兽耳机器人24小时为您提供成绩查询等服务. 详情请加QQ群: 792778662. %{appName} 新版本目前仍在测试阶段, 如出现问题或有改进建议, 欢迎与我们联系与沟通.
+  欢迎来到 %{appName}, 一个面向全模式的osu!私服. 我们有最先进的RX, AP算法, 同时为全模式提供PP计算支持. 我们拥有全图排行榜, 以及无限次数的改名机会.
 some-of-our-coolest-features: 我们觉得最酷的一些功能
 features-title-1: 对Relax 和 Autopilot mod的PP计算
 features-content-1: |-
diff --git a/locales/default/navbar/zh-CN.yml b/locales/default/navbar/zh-CN.yml
index b9e2d215..576f5e9a 100644
--- a/locales/default/navbar/zh-CN.yml
+++ b/locales/default/navbar/zh-CN.yml
@@ -6,4 +6,4 @@ profile: 玩家资料
 settings: 设置
 logout: 登出
 todo: 敬请期待
-looking-for-someone: 想要找某个用户?
+looking-for-someone: 想要寻找某个用户?
diff --git a/locales/default/verify/zh-CN.yml b/locales/default/verify/zh-CN.yml
index 7b077f11..666ef43e 100644
--- a/locales/default/verify/zh-CN.yml
+++ b/locales/default/verify/zh-CN.yml
@@ -3,7 +3,7 @@ how-to-verify-your-account: 如何来认证你的账号
 what-do-you-mean-this-must-be-easy-right: 别想太复杂, 肯定很简单拉~。
 follow-these-three-simple-steps: 跟随以下三个简单的步骤即可游玩 %{appName} 了!
 osu-shortcut: Osu! 快捷方式
-find-your-shortcut: 在桌面上寻找你的osu!快捷方式并复制一份 (如果没有，可以去osu!目录里创建一份)
+find-your-shortcut: 在桌面上寻找你的osu!快捷方式并复制一份 (如果没有,可以去osu!目录里创建一份)
 edit-it: 修改属性
 right-click-properties: 右键快捷方式, 在菜单中找到 "属性" 选项, (一般在最下边)
 find-target-element-box: 找到 "目标" 这一行
@@ -12,8 +12,7 @@ login-to-your-account: 登入你的账号
 login-to-your-app-name-account: 登录你的 %{appName} 账号, 然后就应该万事大吉了!
 oh-crap-i-am-stuck: 妈的，我卡在这个步骤了, 赶紧过来帮我一下
 need-help-join-discord-server: >-
-  Need help? We've got you covered - join the Discord so our community can help
-  you out!
-click-here-to-join-our-discord: Click here to join our Discord!
+  看上去你需要点帮助,没问题!加入我们的Discord服务器即可为你解决你的疑难杂症
+click-here-to-join-our-discord: 点击此处加入到我们的Discord服务器!
 waiting-for-verification: 正在等待验证结果~
 follow-the-simple-instructions: 只需按照上面的简单说明进行操作，完成后重新加载此页面！
diff --git a/locales/ppy.sb/home/en-GB.yml b/locales/ppy.sb/home/en-GB.yml
new file mode 100644
index 00000000..650b7c6c
--- /dev/null
+++ b/locales/ppy.sb/home/en-GB.yml
@@ -0,0 +1,2 @@
+subtitle-big: |-
+  Welcome to %{appName}, an all mode osu! private server. We have all-round pp system including advanced Relax and AutoPilot formula. Ranking system is also opened to all maps. And we provide unlimited chances to change your name. Our chatbot is always there providing you 24h profile and score presentation.-- For more information, join our QQ Group 792778662.Many services of %{appName} are still under construction, any issues can be reported to us
\ No newline at end of file
diff --git a/locales/ppy.sb/home/en-US.yml b/locales/ppy.sb/home/en-US.yml
new file mode 100644
index 00000000..650b7c6c
--- /dev/null
+++ b/locales/ppy.sb/home/en-US.yml
@@ -0,0 +1,2 @@
+subtitle-big: |-
+  Welcome to %{appName}, an all mode osu! private server. We have all-round pp system including advanced Relax and AutoPilot formula. Ranking system is also opened to all maps. And we provide unlimited chances to change your name. Our chatbot is always there providing you 24h profile and score presentation.-- For more information, join our QQ Group 792778662.Many services of %{appName} are still under construction, any issues can be reported to us
\ No newline at end of file
diff --git a/locales/ppy.sb/verify/en-GB.yml b/locales/ppy.sb/verify/en-GB.yml
new file mode 100644
index 00000000..b95437ec
--- /dev/null
+++ b/locales/ppy.sb/verify/en-GB.yml
@@ -0,0 +1,2 @@
+need-help-join-discord-server: Need help? We've got you covered - join the QQ Group so our community can help you out!
+click-here-to-join-our-discord: Click here to join our QQ Group or search 792778662!!
\ No newline at end of file
diff --git a/locales/ppy.sb/verify/en-US.yml b/locales/ppy.sb/verify/en-US.yml
new file mode 100644
index 00000000..b95437ec
--- /dev/null
+++ b/locales/ppy.sb/verify/en-US.yml
@@ -0,0 +1,2 @@
+need-help-join-discord-server: Need help? We've got you covered - join the QQ Group so our community can help you out!
+click-here-to-join-our-discord: Click here to join our QQ Group or search 792778662!!
\ No newline at end of file
diff --git a/locales/ppy.sb/verify/zh-CN.yml b/locales/ppy.sb/verify/zh-CN.yml
new file mode 100644
index 00000000..b343c20c
--- /dev/null
+++ b/locales/ppy.sb/verify/zh-CN.yml
@@ -0,0 +1,2 @@
+need-help-join-discord-server: 看上去你需要点帮助,没问题!加入我们的QQ群即可为你解决你的疑难杂症
+click-here-to-join-our-discord: 点击此处加入到我们的QQ群!
\ No newline at end of file
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 7b3ad337..ede8d087 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -178,10 +178,6 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
                                     <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">{{t("admin.beatmaps.loved-set")}}</a>
                                     <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">{{t("admin.beatmaps.approved-set")}}</a>
                                     <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">{{t("admin.beatmaps.pending-set")}}</a>
-                                    <hr class="dropdown-divider">
-                                    <a class="dropdown-item operate-button" href="javascript:void(0);" onclick="updateMaps({{ i.set_id }})">
-                                        {{t("admin.beatmaps.sync-beatmapsets-with-bancho")}}
-                                    </a>
                                 </div>
                             </div>
                         </div>
diff --git a/templates/admin/users_edit.html b/templates/admin/users_edit.html
index 6d389e15..0ea55e24 100644
--- a/templates/admin/users_edit.html
+++ b/templates/admin/users_edit.html
@@ -54,10 +54,10 @@
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-key" aria-hidden="true"></i>
-                    Password
+                    {{t("admin.users.password")}}
                 </div>
                 <div class="column">
-                    <input name="password" type="text" class="input" placeholder="New Password">
+                    <input name="password" type="text" class="input" placeholder='{{t("admin.users.new-password")}}'>
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">

From 0f2b77d877f8adf8cf3dbdc73393700275c555eb Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 12 Aug 2022 11:06:05 +0000
Subject: [PATCH 207/278] uploads

---
 package.json                       |  11 ++-
 utils/i18n/commands/format-html.ts |  40 +++++++++
 utils/i18n/commands/format-yaml.ts |  45 ++++++++++
 utils/i18n/reader.ts               | 133 +++++++++++++++++++++++++++++
 4 files changed, 228 insertions(+), 1 deletion(-)
 create mode 100644 utils/i18n/commands/format-html.ts
 create mode 100644 utils/i18n/commands/format-yaml.ts
 create mode 100644 utils/i18n/reader.ts

diff --git a/package.json b/package.json
index d5784a2f..dd516da3 100644
--- a/package.json
+++ b/package.json
@@ -8,6 +8,7 @@
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
+    "build: "
     "i18n:build": "node utils/i18n/commands/build.mjs",
     "i18n:compile": "node utils/i18n/commands/build.mjs echo 'use i18n:build from now on.'",
     "i18n:format:templates": "node utils/i18n/commands/format-html.mjs",
@@ -35,7 +36,15 @@
     "js-yaml": "^4.1.0",
     "lodash-es": "^4.17.21",
     "nodemon": "^2.0.16",
+    "typescript": "^4.7.4",
     "yaml": "^2.1.1"
   },
-  "dependencies": {}
+  "dependencies": {
+    "@typescript-eslint/eslint-plugin": "^5.0.0",
+    "eslint": "^8.0.1",
+    "eslint-config-standard-with-typescript": "^22.0.0",
+    "eslint-plugin-import": "^2.25.2",
+    "eslint-plugin-n": "^15.0.0",
+    "eslint-plugin-promise": "^6.0.0"
+  }
 }
diff --git a/utils/i18n/commands/format-html.ts b/utils/i18n/commands/format-html.ts
new file mode 100644
index 00000000..515f61b4
--- /dev/null
+++ b/utils/i18n/commands/format-html.ts
@@ -0,0 +1,40 @@
+const parallel = process.env.PARALLEL || false
+
+import glob from 'glob'
+import path from 'path'
+import fs from 'fs/promises'
+import clui from 'clui'
+const { Spinner } = clui
+
+import { path as translationPath } from '../config.js'
+
+const doWork = async (match) => {
+    try {
+        const template = await fs.readFile(match, { encoding: 'utf8' })
+        const wb = template.replace(/\{\{\s?t\('(.*)'\s?(,\s?(.+)\s?)?\)\s?\}\}/gmu, '{{ t(\'$1\'$2) }}')
+        await fs.writeFile(match, wb, 'utf8')
+    } catch (error) {
+        console.error(error)
+    }
+}
+
+glob(path.join(translationPath, '../templates/**/*.html'), async (err, matches) => {
+    if (err) throw err
+    const work = new Spinner(`formatting templates...`)
+    work.start()
+    if (parallel) {
+        await Promise.all(matches.map(async match => {
+            const work = new Spinner(`formatting template: ${match}`)
+            work.start()
+            await doWork(match)
+            work.stop()
+        }))
+    } else {
+        for (const match of matches) {
+            work.message(`formatting template: ${match}`)
+            await doWork(match)
+        }
+    }
+    work.stop()
+    console.log(`formatting templates...  done`)
+})
\ No newline at end of file
diff --git a/utils/i18n/commands/format-yaml.ts b/utils/i18n/commands/format-yaml.ts
new file mode 100644
index 00000000..dddfa93e
--- /dev/null
+++ b/utils/i18n/commands/format-yaml.ts
@@ -0,0 +1,45 @@
+const parallel = process.env.PARALLEL || false
+
+import YAML, { parseDocument } from 'yaml'
+
+import glob from 'glob'
+import path from 'path'
+import fs from 'fs/promises'
+import clui from 'clui'
+const { Spinner } = clui
+
+import { path as translationPath } from '../config.js'
+
+const doWork = async (match) => {
+    try {
+        const data = parseDocument(await fs.readFile(match, { encoding: 'utf8' }))
+        const formatted = data.toString({
+            blockQuote: 'literal',
+            defaultStringType: 'BLOCK_FOLDED'
+        })
+        await fs.writeFile(match, formatted, 'utf8')
+    } catch (error) {
+        console.error(error)
+    }
+}
+
+glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
+    if (err) throw err
+    const work = new Spinner(`formatting locales...`)
+    work.start()
+    if (parallel) {
+        await Promise.all(matches.map(async (match) => {
+            const work = new Spinner(`formatting locale: ${match}`)
+            work.start()
+            await doWork(match)
+            work.stop()
+        }))
+    } else {
+        for (const match of matches) {
+            work.message(`formatting locale: ${match}`)
+            await doWork(match)
+        }
+    }
+    work.stop()
+    console.log(`formatting locales...  done`)
+})
\ No newline at end of file
diff --git a/utils/i18n/reader.ts b/utils/i18n/reader.ts
new file mode 100644
index 00000000..2bbb2ae9
--- /dev/null
+++ b/utils/i18n/reader.ts
@@ -0,0 +1,133 @@
+// @ts-check
+import glob from 'glob'
+import path, { resolve } from 'path'
+import fs from 'fs'
+import yaml from 'js-yaml'
+import { mergeWith, merge, reject } from 'lodash-es'
+
+import { compiledFileSchema, paths as translationPaths, contextFromFileName, createConfilitKeyHandler } from './config.js'
+
+// context
+// {
+//     namespace: namespaces.join('.'),
+//     namespaces,
+//     locale: locale.replace('_', '-'),
+//     extension
+// }
+const parseLocale = (file, context) => {
+    const locale = yaml.load(fs.readFileSync(file, 'utf8'))
+    const _parse = (locale) => {
+        if (!context.namespaces) return {
+            [context.locale]: {
+                [context.namespace]: locale
+            }
+        }
+        const rtn = {}
+        let inner = rtn
+        context.namespaces.forEach((ns, index) => {
+            if (index === context.namespaces.length - 1) {
+                return inner[ns] = locale
+            }
+            rtn[ns] = {}
+            inner = rtn[ns]
+        })
+        return {
+            [context.locale]: rtn
+        }
+    }
+    if (Array.isArray(locale)) {
+        const toMerge = locale.map(_parse)
+        let rtn = {}
+        for (const item of toMerge) {
+            rtn = {
+                ...rtn,
+                ...item
+            }
+        }
+        return rtn
+    } else {
+        return _parse(locale)
+    }
+}
+
+// file
+// {
+//     namespace: namespaces.join('.'),
+//     namespaces,
+//     locale: locale.replace('_', '-'),
+//     extension
+// }
+const mixinLocale = ({ merging, joinedLocales, mixingWith: { parsedLocale, context } }) => {
+    if (!joinedLocales[context.locale]) joinedLocales[context.locale] = {}
+    joinedLocales[context.locale] = mergeWith(
+        joinedLocales[context.locale],
+        parsedLocale[context.locale],
+        (objValue, srcValue, key, object, source, stack) => {
+            if (!objValue) {
+                return srcValue
+            }
+            for (const k in srcValue) {
+                if (objValue[k] && objValue[k] !== srcValue[k]) {
+                    if (!merging) console.warn(`[Warning] Merging into initilazed value:
+${key}.${k}:
+[${typeof srcValue[k]}${typeof srcValue[k] === 'string' && ' `' + srcValue[k] + '`' || ''}] merging into [${typeof objValue[k]}${typeof objValue[k] === 'string' && ' `' + objValue[k] + '`' || ''}].`)
+                    objValue = createConfilitKeyHandler(merging)(objValue, srcValue, k)
+                    if (!merging) console.log('')
+                } else {
+                    objValue[k] = srcValue[k]
+                }
+            }
+            return objValue
+            // return merge(objValue, srcValue)
+        }
+    )
+}
+
+const createReducer = ({ translationPath, merging }) => async (acc, match) => {
+    console.log('parsing', match, '...\n')
+    try {
+        acc = await acc
+        const relative = path.relative(translationPath, match)
+        const context = contextFromFileName(relative)
+        const data = await parseLocale(match, context)
+        mixinLocale({
+            merging,
+            joinedLocales: acc,
+            mixingWith: {
+                parsedLocale: data,
+                context
+            }
+        })
+        return acc
+    } catch (error) {
+        console.error(error)
+    }
+}
+/* ----------------------------------------------------------------
+** return format: {
+  [locale]: {
+      [namespace]: {
+          ...entries
+      }
+  }    
+}
+* allow customization if {lang}.custom.(yml|yaml) is provided.
+*/
+const asyncGlob = (path) => new Promise((resolve, reject) => {
+    glob(path, (err, matches) => {
+        if (err) reject(err)
+        else resolve(matches)
+    })
+})
+export const readLocales = async () => {
+    let locales = {}
+    for (const [index, conf] of translationPaths.entries()) {
+        const { path: translationPath, filter } = conf
+        const matches = (await asyncGlob(path.join(translationPath, '**/*.yml')))
+        .filter(filter)
+        const reducer = createReducer({ translationPath, merging: index > 0 })
+        locales = await matches.reduce(reducer, locales)
+    }
+
+    return locales
+}

From 534702ba86afe5862e601ecdc899fbf39d6e1ca8 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 12 Aug 2022 11:06:32 +0000
Subject: [PATCH 208/278] upload

---
 .eslintrc.js                                  |   6 +
 .vscode/settings.json                         |   8 +-
 tsconfig.json                                 | 103 ++++++++++++++
 ...18n-editor.mjs => adapt-to-i18n-editor.ts} |   0
 .../{built-reader.mjs => built-reader.ts}     |   2 +-
 .../{built-writer.mjs => built-writer.ts}     |   2 +-
 utils/i18n/commands/{build.mjs => build.ts}   |   4 +-
 utils/i18n/commands/format-html.mjs           |  40 ------
 utils/i18n/commands/format-yaml.mjs           |  45 ------
 utils/i18n/commands/migrate.mjs               |   5 -
 utils/i18n/commands/migrate.ts                |   5 +
 utils/i18n/{config.mjs => config.ts}          |   0
 utils/i18n/reader.mjs                         | 133 ------------------
 utils/i18n/writer.mjs                         |  40 ------
 utils/i18n/writer.ts                          |  41 ++++++
 15 files changed, 163 insertions(+), 271 deletions(-)
 create mode 100644 .eslintrc.js
 create mode 100644 tsconfig.json
 rename utils/i18n/{adapt-to-i18n-editor.mjs => adapt-to-i18n-editor.ts} (100%)
 rename utils/i18n/{built-reader.mjs => built-reader.ts} (98%)
 rename utils/i18n/{built-writer.mjs => built-writer.ts} (97%)
 rename utils/i18n/commands/{build.mjs => build.ts} (73%)
 delete mode 100644 utils/i18n/commands/format-html.mjs
 delete mode 100644 utils/i18n/commands/format-yaml.mjs
 delete mode 100644 utils/i18n/commands/migrate.mjs
 create mode 100644 utils/i18n/commands/migrate.ts
 rename utils/i18n/{config.mjs => config.ts} (100%)
 delete mode 100644 utils/i18n/reader.mjs
 delete mode 100644 utils/i18n/writer.mjs
 create mode 100644 utils/i18n/writer.ts

diff --git a/.eslintrc.js b/.eslintrc.js
new file mode 100644
index 00000000..9d42242d
--- /dev/null
+++ b/.eslintrc.js
@@ -0,0 +1,6 @@
+module.exports = {
+  extends: 'standard-with-typescript',
+  parserOptions: {
+    project: './tsconfig.json'
+  }
+}
diff --git a/.vscode/settings.json b/.vscode/settings.json
index 892db09d..af55d853 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -43,10 +43,10 @@
   "i18n-ally.keystyle": "nested",
   "emeraldwalk.runonsave": {
     "commands": [
-      {
-        "match": ".(yml|yaml)$",
-        "cmd": "npm run i18n:compile"
-      },
+      // {
+      //   "match": ".(yml|yaml)$",
+      //   "cmd": "npm run i18n:compile"
+      // },
       {
         "match": ".html",
         "cmd": "npm run i18n:format:templates"
diff --git a/tsconfig.json b/tsconfig.json
new file mode 100644
index 00000000..11673453
--- /dev/null
+++ b/tsconfig.json
@@ -0,0 +1,103 @@
+{
+  "compilerOptions": {
+    /* Visit https://aka.ms/tsconfig to read more about this file */
+
+    /* Projects */
+    // "incremental": true,                              /* Save .tsbuildinfo files to allow for incremental compilation of projects. */
+    // "composite": true,                                /* Enable constraints that allow a TypeScript project to be used with project references. */
+    // "tsBuildInfoFile": "./.tsbuildinfo",              /* Specify the path to .tsbuildinfo incremental compilation file. */
+    // "disableSourceOfProjectReferenceRedirect": true,  /* Disable preferring source files instead of declaration files when referencing composite projects. */
+    // "disableSolutionSearching": true,                 /* Opt a project out of multi-project reference checking when editing. */
+    // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */
+
+    /* Language and Environment */
+    "target": "ES2020",                                  /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
+    // "lib": [],                                        /* Specify a set of bundled library declaration files that describe the target runtime environment. */
+    // "jsx": "preserve",                                /* Specify what JSX code is generated. */
+    // "experimentalDecorators": true,                   /* Enable experimental support for TC39 stage 2 draft decorators. */
+    // "emitDecoratorMetadata": true,                    /* Emit design-type metadata for decorated declarations in source files. */
+    // "jsxFactory": "",                                 /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */
+    // "jsxFragmentFactory": "",                         /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */
+    // "jsxImportSource": "",                            /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */
+    // "reactNamespace": "",                             /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */
+    // "noLib": true,                                    /* Disable including any library files, including the default lib.d.ts. */
+    // "useDefineForClassFields": true,                  /* Emit ECMAScript-standard-compliant class fields. */
+    // "moduleDetection": "auto",                        /* Control what method is used to detect module-format JS files. */
+
+    /* Modules */
+    "module": "ESNext",                                /* Specify what module code is generated. */
+    // "rootDir": "./utils",                                  /* Specify the root folder within your source files. */
+    // "moduleResolution": "node",                       /* Specify how TypeScript looks up a file from a given module specifier. */
+    // "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
+    // "paths": {},                                      /* Specify a set of entries that re-map imports to additional lookup locations. */
+    "rootDirs": ["./utils", "./src"],                                   /* Allow multiple folders to be treated as one when resolving modules. */
+    // "typeRoots": [],                                  /* Specify multiple folders that act like './node_modules/@types'. */
+    // "types": [],                                      /* Specify type package names to be included without being referenced in a source file. */
+    // "allowUmdGlobalAccess": true,                     /* Allow accessing UMD globals from modules. */
+    // "moduleSuffixes": [],                             /* List of file name suffixes to search when resolving a module. */
+    // "resolveJsonModule": true,                        /* Enable importing .json files. */
+    // "noResolve": true,                                /* Disallow 'import's, 'require's or '<reference>'s from expanding the number of files TypeScript should add to a project. */
+
+    /* JavaScript Support */
+    "allowJs": true,                                  /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */
+    "checkJs": true,                                  /* Enable error reporting in type-checked JavaScript files. */
+    // "maxNodeModuleJsDepth": 1,                        /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */
+
+    /* Emit */
+    "declaration": true,                              /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
+    // "declarationMap": true,                           /* Create sourcemaps for d.ts files. */
+    // "emitDeclarationOnly": true,                      /* Only output d.ts files and not JavaScript files. */
+    "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
+    // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
+    "outDir": ".built",                                   /* Specify an output folder for all emitted files. */
+    // "removeComments": true,                           /* Disable emitting comments. */
+    // "noEmit": true,                                   /* Disable emitting files from a compilation. */
+    // "importHelpers": true,                            /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
+    // "importsNotUsedAsValues": "remove",               /* Specify emit/checking behavior for imports that are only used for types. */
+    // "downlevelIteration": true,                       /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
+    // "sourceRoot": "",                                 /* Specify the root path for debuggers to find the reference source code. */
+    // "mapRoot": "",                                    /* Specify the location where debugger should locate map files instead of generated locations. */
+    // "inlineSourceMap": true,                          /* Include sourcemap files inside the emitted JavaScript. */
+    // "inlineSources": true,                            /* Include source code in the sourcemaps inside the emitted JavaScript. */
+    // "emitBOM": true,                                  /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */
+    // "newLine": "crlf",                                /* Set the newline character for emitting files. */
+    // "stripInternal": true,                            /* Disable emitting declarations that have '@internal' in their JSDoc comments. */
+    // "noEmitHelpers": true,                            /* Disable generating custom helper functions like '__extends' in compiled output. */
+    // "noEmitOnError": true,                            /* Disable emitting files if any type checking errors are reported. */
+    // "preserveConstEnums": true,                       /* Disable erasing 'const enum' declarations in generated code. */
+    // "declarationDir": "./",                           /* Specify the output directory for generated declaration files. */
+    // "preserveValueImports": true,                     /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */
+
+    /* Interop Constraints */
+    // "isolatedModules": true,                          /* Ensure that each file can be safely transpiled without relying on other imports. */
+    // "allowSyntheticDefaultImports": true,             /* Allow 'import x from y' when a module doesn't have a default export. */
+    "esModuleInterop": true,                             /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */
+    // "preserveSymlinks": true,                         /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
+    "forceConsistentCasingInFileNames": true,            /* Ensure that casing is correct in imports. */
+
+    /* Type Checking */
+    "strict": true,                                      /* Enable all strict type-checking options. */
+    // "noImplicitAny": true,                            /* Enable error reporting for expressions and declarations with an implied 'any' type. */
+    // "strictNullChecks": true,                         /* When type checking, take into account 'null' and 'undefined'. */
+    // "strictFunctionTypes": true,                      /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
+    // "strictBindCallApply": true,                      /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */
+    // "strictPropertyInitialization": true,             /* Check for class properties that are declared but not set in the constructor. */
+    // "noImplicitThis": true,                           /* Enable error reporting when 'this' is given the type 'any'. */
+    // "useUnknownInCatchVariables": true,               /* Default catch clause variables as 'unknown' instead of 'any'. */
+    // "alwaysStrict": true,                             /* Ensure 'use strict' is always emitted. */
+    // "noUnusedLocals": true,                           /* Enable error reporting when local variables aren't read. */
+    // "noUnusedParameters": true,                       /* Raise an error when a function parameter isn't read. */
+    // "exactOptionalPropertyTypes": true,               /* Interpret optional property types as written, rather than adding 'undefined'. */
+    // "noImplicitReturns": true,                        /* Enable error reporting for codepaths that do not explicitly return in a function. */
+    // "noFallthroughCasesInSwitch": true,               /* Enable error reporting for fallthrough cases in switch statements. */
+    // "noUncheckedIndexedAccess": true,                 /* Add 'undefined' to a type when accessed using an index. */
+    // "noImplicitOverride": true,                       /* Ensure overriding members in derived classes are marked with an override modifier. */
+    // "noPropertyAccessFromIndexSignature": true,       /* Enforces using indexed accessors for keys declared using an indexed type. */
+    // "allowUnusedLabels": true,                        /* Disable error reporting for unused labels. */
+    // "allowUnreachableCode": true,                     /* Disable error reporting for unreachable code. */
+
+    /* Completeness */
+    // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
+    "skipLibCheck": true                                 /* Skip type checking all .d.ts files. */
+  }
+}
diff --git a/utils/i18n/adapt-to-i18n-editor.mjs b/utils/i18n/adapt-to-i18n-editor.ts
similarity index 100%
rename from utils/i18n/adapt-to-i18n-editor.mjs
rename to utils/i18n/adapt-to-i18n-editor.ts
diff --git a/utils/i18n/built-reader.mjs b/utils/i18n/built-reader.ts
similarity index 98%
rename from utils/i18n/built-reader.mjs
rename to utils/i18n/built-reader.ts
index eb738805..933580e6 100644
--- a/utils/i18n/built-reader.mjs
+++ b/utils/i18n/built-reader.ts
@@ -3,7 +3,7 @@ import path from 'path'
 import fs from 'fs'
 import yaml from 'js-yaml'
 
-import { compiledFileNameSchema, compiledFileSchema, compiled as translationPath, divider } from './config.mjs'
+import { compiledFileNameSchema, compiledFileSchema, compiled as translationPath, divider } from './config.js'
 
 const parseFileName = (file) => {
     const fileName = path.relative(translationPath, file)
diff --git a/utils/i18n/built-writer.mjs b/utils/i18n/built-writer.ts
similarity index 97%
rename from utils/i18n/built-writer.mjs
rename to utils/i18n/built-writer.ts
index 7b9613e5..fea1bb41 100644
--- a/utils/i18n/built-writer.mjs
+++ b/utils/i18n/built-writer.ts
@@ -1,4 +1,4 @@
-import { compiledFileNameSchema, compiledFileSchema, compiled as translationPath, divider } from './config.mjs'
+import { compiledFileNameSchema, compiledFileSchema, compiled as translationPath, divider } from './config.js'
 import yaml from 'js-yaml'
 import { join, dirname } from 'path'
 import fs from 'fs/promises'
diff --git a/utils/i18n/commands/build.mjs b/utils/i18n/commands/build.ts
similarity index 73%
rename from utils/i18n/commands/build.mjs
rename to utils/i18n/commands/build.ts
index 8752dc55..80800cf0 100644
--- a/utils/i18n/commands/build.mjs
+++ b/utils/i18n/commands/build.ts
@@ -1,6 +1,6 @@
 
-import { readLocales } from '../reader.mjs'
-import { writeToDisk } from '../built-writer.mjs'
+import { readLocales } from '../reader'
+import { writeToDisk } from '../built-writer.ts/index.js'
 import clui from 'clui'
 const { Spinner } = clui
 
diff --git a/utils/i18n/commands/format-html.mjs b/utils/i18n/commands/format-html.mjs
deleted file mode 100644
index 4cbd30d1..00000000
--- a/utils/i18n/commands/format-html.mjs
+++ /dev/null
@@ -1,40 +0,0 @@
-const parallel = process.env.PARALLEL || false
-
-import glob from 'glob'
-import path from 'path'
-import fs from 'fs/promises'
-import clui from 'clui'
-const { Spinner } = clui
-
-import { path as translationPath } from '../config.mjs'
-
-const doWork = async (match) => {
-    try {
-        const template = await fs.readFile(match, { encoding: 'utf8' })
-        const wb = template.replace(/\{\{\s?t\('(.*)'\s?(,\s?(.+)\s?)?\)\s?\}\}/gmu, '{{ t(\'$1\'$2) }}')
-        await fs.writeFile(match, wb, 'utf8')
-    } catch (error) {
-        console.error(error)
-    }
-}
-
-glob(path.join(translationPath, '../templates/**/*.html'), async (err, matches) => {
-    if (err) throw err
-    const work = new Spinner(`formatting templates...`)
-    work.start()
-    if (parallel) {
-        await Promise.all(matches.map(async match => {
-            const work = new Spinner(`formatting template: ${match}`)
-            work.start()
-            await doWork(match)
-            work.stop()
-        }))
-    } else {
-        for (const match of matches) {
-            work.message(`formatting template: ${match}`)
-            await doWork(match)
-        }
-    }
-    work.stop()
-    console.log(`formatting templates...  done`)
-})
\ No newline at end of file
diff --git a/utils/i18n/commands/format-yaml.mjs b/utils/i18n/commands/format-yaml.mjs
deleted file mode 100644
index 389e3402..00000000
--- a/utils/i18n/commands/format-yaml.mjs
+++ /dev/null
@@ -1,45 +0,0 @@
-const parallel = process.env.PARALLEL || false
-
-import YAML, { parseDocument } from 'yaml'
-
-import glob from 'glob'
-import path from 'path'
-import fs from 'fs/promises'
-import clui from 'clui'
-const { Spinner } = clui
-
-import { path as translationPath } from '../config.mjs'
-
-const doWork = async (match) => {
-    try {
-        const data = parseDocument(await fs.readFile(match, { encoding: 'utf8' }))
-        const formatted = data.toString({
-            blockQuote: 'literal',
-            defaultStringType: 'BLOCK_FOLDED'
-        })
-        await fs.writeFile(match, formatted, 'utf8')
-    } catch (error) {
-        console.error(error)
-    }
-}
-
-glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
-    if (err) throw err
-    const work = new Spinner(`formatting locales...`)
-    work.start()
-    if (parallel) {
-        await Promise.all(matches.map(async (match) => {
-            const work = new Spinner(`formatting locale: ${match}`)
-            work.start()
-            await doWork(match)
-            work.stop()
-        }))
-    } else {
-        for (const match of matches) {
-            work.message(`formatting locale: ${match}`)
-            await doWork(match)
-        }
-    }
-    work.stop()
-    console.log(`formatting locales...  done`)
-})
\ No newline at end of file
diff --git a/utils/i18n/commands/migrate.mjs b/utils/i18n/commands/migrate.mjs
deleted file mode 100644
index 16faed23..00000000
--- a/utils/i18n/commands/migrate.mjs
+++ /dev/null
@@ -1,5 +0,0 @@
-
-import { readLocales } from '../built-reader.mjs'
-import { writeToDisk } from '../writer.mjs'
-
-readLocales().then(locales => writeToDisk(locales))
\ No newline at end of file
diff --git a/utils/i18n/commands/migrate.ts b/utils/i18n/commands/migrate.ts
new file mode 100644
index 00000000..e8aa093b
--- /dev/null
+++ b/utils/i18n/commands/migrate.ts
@@ -0,0 +1,5 @@
+
+import { readLocales } from '../built-reader.ts/index.js'
+import { writeToDisk } from '../writer'
+
+readLocales().then(locales => writeToDisk(locales))
\ No newline at end of file
diff --git a/utils/i18n/config.mjs b/utils/i18n/config.ts
similarity index 100%
rename from utils/i18n/config.mjs
rename to utils/i18n/config.ts
diff --git a/utils/i18n/reader.mjs b/utils/i18n/reader.mjs
deleted file mode 100644
index 1ed0ed67..00000000
--- a/utils/i18n/reader.mjs
+++ /dev/null
@@ -1,133 +0,0 @@
-// @ts-check
-import glob from 'glob'
-import path, { resolve } from 'path'
-import fs from 'fs'
-import yaml from 'js-yaml'
-import { mergeWith, merge, reject } from 'lodash-es'
-
-import { compiledFileSchema, paths as translationPaths, contextFromFileName, createConfilitKeyHandler } from './config.mjs'
-
-// context
-// {
-//     namespace: namespaces.join('.'),
-//     namespaces,
-//     locale: locale.replace('_', '-'),
-//     extension
-// }
-const parseLocale = (file, context) => {
-    const locale = yaml.load(fs.readFileSync(file, 'utf8'))
-    const _parse = (locale) => {
-        if (!context.namespaces) return {
-            [context.locale]: {
-                [context.namespace]: locale
-            }
-        }
-        const rtn = {}
-        let inner = rtn
-        context.namespaces.forEach((ns, index) => {
-            if (index === context.namespaces.length - 1) {
-                return inner[ns] = locale
-            }
-            rtn[ns] = {}
-            inner = rtn[ns]
-        })
-        return {
-            [context.locale]: rtn
-        }
-    }
-    if (Array.isArray(locale)) {
-        const toMerge = locale.map(_parse)
-        let rtn = {}
-        for (const item of toMerge) {
-            rtn = {
-                ...rtn,
-                ...item
-            }
-        }
-        return rtn
-    } else {
-        return _parse(locale)
-    }
-}
-
-// file
-// {
-//     namespace: namespaces.join('.'),
-//     namespaces,
-//     locale: locale.replace('_', '-'),
-//     extension
-// }
-const mixinLocale = ({ merging, joinedLocales, mixingWith: { parsedLocale, context } }) => {
-    if (!joinedLocales[context.locale]) joinedLocales[context.locale] = {}
-    joinedLocales[context.locale] = mergeWith(
-        joinedLocales[context.locale],
-        parsedLocale[context.locale],
-        (objValue, srcValue, key, object, source, stack) => {
-            if (!objValue) {
-                return srcValue
-            }
-            for (const k in srcValue) {
-                if (objValue[k] && objValue[k] !== srcValue[k]) {
-                    if (!merging) console.warn(`[Warning] Merging into initilazed value:
-${key}.${k}:
-[${typeof srcValue[k]}${typeof srcValue[k] === 'string' && ' `' + srcValue[k] + '`' || ''}] merging into [${typeof objValue[k]}${typeof objValue[k] === 'string' && ' `' + objValue[k] + '`' || ''}].`)
-                    objValue = createConfilitKeyHandler(merging)(objValue, srcValue, k)
-                    if (!merging) console.log('')
-                } else {
-                    objValue[k] = srcValue[k]
-                }
-            }
-            return objValue
-            // return merge(objValue, srcValue)
-        }
-    )
-}
-
-const createReducer = ({ translationPath, merging }) => async (acc, match) => {
-    console.log('parsing', match, '...\n')
-    try {
-        acc = await acc
-        const relative = path.relative(translationPath, match)
-        const context = contextFromFileName(relative)
-        const data = await parseLocale(match, context)
-        mixinLocale({
-            merging,
-            joinedLocales: acc,
-            mixingWith: {
-                parsedLocale: data,
-                context
-            }
-        })
-        return acc
-    } catch (error) {
-        console.error(error)
-    }
-}
-/* ----------------------------------------------------------------
-** return format: {
-  [locale]: {
-      [namespace]: {
-          ...entries
-      }
-  }    
-}
-* allow customization if {lang}.custom.(yml|yaml) is provided.
-*/
-const asyncGlob = (path) => new Promise((resolve, reject) => {
-    glob(path, (err, matches) => {
-        if (err) reject(err)
-        else resolve(matches)
-    })
-})
-export const readLocales = async () => {
-    let locales = {}
-    for (const [index, conf] of translationPaths.entries()) {
-        const { path: translationPath, filter } = conf
-        const matches = (await asyncGlob(path.join(translationPath, '**/*.yml')))
-        .filter(filter)
-        const reducer = createReducer({ translationPath, merging: index > 0 })
-        locales = await matches.reduce(reducer, locales)
-    }
-
-    return locales
-}
diff --git a/utils/i18n/writer.mjs b/utils/i18n/writer.mjs
deleted file mode 100644
index 0b6fdc75..00000000
--- a/utils/i18n/writer.mjs
+++ /dev/null
@@ -1,40 +0,0 @@
-// @ts-check
-import {
-    compiledFileNameSchema,
-    compiledFileSchema,
-    path as translationPath,
-    divider,
-    contextToFileName
-} from './config.mjs'
-import yaml from 'js-yaml'
-import { join } from 'path'
-import fs from 'fs/promises'
-import _path from 'path'
-import { existsSync, mkdirSync } from 'fs'
-
-export function formatLocaleData(locale, context) {
-    const current = locale[context.locale][context.namespace]
-    return yaml.dump(current)
-}
-
-export function writeToDisk(locales) {
-    for (const locale in locales) {
-        const namespaces = locales[locale]
-        for (const namespace in namespaces) {
-            const entries = namespaces[namespace]
-            const context = {
-                locale,
-                namespace,
-                extension: 'yml'
-            }
-            const fileName = contextToFileName(context)
-            const yaml = formatLocaleData(locales, context)
-            const path = join(translationPath, fileName)
-            const dir = _path.dirname(path)
-            if (!existsSync(path)) {
-                mkdirSync(dir, {recursive: true})
-            }
-            fs.writeFile(path, yaml, 'utf8')
-        }
-    }
-}
diff --git a/utils/i18n/writer.ts b/utils/i18n/writer.ts
new file mode 100644
index 00000000..dab1bdab
--- /dev/null
+++ b/utils/i18n/writer.ts
@@ -0,0 +1,41 @@
+// @ts-check
+import {
+    compiledFileNameSchema,
+    compiledFileSchema,
+    paths as translationPath,
+    divider,
+    contextToFileName
+} from './config.js'
+import yaml from 'js-yaml'
+import { join } from 'path'
+import fs from 'fs/promises'
+import _path from 'path'
+import { existsSync, mkdirSync } from 'fs'
+
+export function formatLocaleData(locale, context) {
+    const current = locale[context.locale][context.namespace]
+    return yaml.dump(current)
+}
+
+export function writeToDisk(locales) {
+    throw new Error('deprecated!! nothing has changed.')
+    // for (const locale in locales) {
+    //     const namespaces = locales[locale]
+    //     for (const namespace in namespaces) {
+    //         const entries = namespaces[namespace]
+    //         const context = {
+    //             locale,
+    //             namespace,
+    //             extension: 'yml'
+    //         }
+    //         const fileName = contextToFileName(context)
+    //         const yaml = formatLocaleData(locales, context)
+    //         const path = join(translationPath, fileName)
+    //         const dir = _path.dirname(path)
+    //         if (!existsSync(path)) {
+    //             mkdirSync(dir, {recursive: true})
+    //         }
+    //         fs.writeFile(path, yaml, 'utf8')
+    //     }
+    // }
+}

From 31878cec4c4a8d2ea559be8e7942345defa0aac1 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Fri, 12 Aug 2022 14:15:23 +0000
Subject: [PATCH 209/278] parse osr frontend

---
 blueprints/admin.py  | 34 +++++++++++++++++++++++++++++++++-
 ext/requirements.txt |  1 +
 objects/varka.py     |  9 +++++++++
 3 files changed, 43 insertions(+), 1 deletion(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 21b3b340..58bfbf8b 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -16,6 +16,7 @@
 from objects.utils import flash
 from objects import varka
 from objects.glob import t
+from osrparse import Replay
 import datetime
 import timeago
 
@@ -183,4 +184,35 @@ async def beatmaps_edit(id:int):
         await glob.db.execute("UPDATE maps SET frozen=1, status=%s WHERE set_id=%s", [str(status), str(id)])
     else:
         await glob.db.execute("UPDATE maps SET frozen=1, status=%s WHERE id=%s", [str(status), str(id)])
-    return redirect ('/admin/beatmaps/search/' + id)
\ No newline at end of file
+    return redirect ('/admin/beatmaps/search/' + id)
+
+@admin.route('/replays/parse', methods=['POST'])
+async def replays_parse(): 
+    file = (await request.files)['replay_file']
+    if file is None:
+        return {'status': 300, 'msg': 'Replay is not exists in multipart.'}
+    try:
+        replay = Replay.from_file(file)
+        timestamp = replay.timestamp.timestamp()
+    except:
+        return {'status': 400, 'msg': 'Failed to parse the replay file.'}
+    return {
+        'status': 200,
+        'replay': {
+            'map_md5': replay.beatmap_hash,
+            'score': replay.score,
+            'max_combo': replay.max_combo,
+            'mods': replay.mods.value,
+            'n300': replay.count_300,
+            'n100': replay.count_100,
+            'n50': replay.count_50,
+            'nmiss': replay.count_miss,
+            'ngeki': replay.count_geki,
+            'nkatu': replay.count_katu,
+            'mode': replay.mode.value,
+            'playtime': int(timestamp),
+            'replay_id': replay.replay_id,
+            'perfect': replay.perfect,
+            'username': replay.username
+        }
+    }
\ No newline at end of file
diff --git a/ext/requirements.txt b/ext/requirements.txt
index c6c94b00..e1658513 100644
--- a/ext/requirements.txt
+++ b/ext/requirements.txt
@@ -12,3 +12,4 @@ Pillow
 python-i18n[YAML]
 requires
 uuid
+osrparse
\ No newline at end of file
diff --git a/objects/varka.py b/objects/varka.py
index 995b73db..495c7d0f 100644
--- a/objects/varka.py
+++ b/objects/varka.py
@@ -92,6 +92,15 @@ async def update(table, id, **kargs):
     await glob.db.execute("UPDATE `%s` SET %s WHERE %s = '%s'" % (table, ', '.join(params), *id))
     return 'ok'
 
+async def insert(table, **kargs):
+    params = []
+    for k, v in kargs.items():
+        if v is not None:
+            params.append(f"{k}='{v}'")
+        else:
+            params.append(f"{k}=NULL")
+    return glob.db.execute("INSERT INTO `%s` SET %s" % (table, ', '.join(params)))
+
 async def search_user(keyword: str):
     if not keyword:
         return b'{}'

From 3f1eb1c5cad00e7b4f733d371cabf0b42b056b1e Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 12 Aug 2022 14:53:38 +0000
Subject: [PATCH 210/278] update

---
 config.mjs                         |   2 +-
 package.json                       |  29 ++--
 tsconfig.json                      |  22 ++-
 utils/i18n/adapt-to-i18n-editor.ts |  30 ++--
 utils/i18n/built-reader.ts         | 138 +++++++++---------
 utils/i18n/built-writer.ts         |  97 ++++++-------
 utils/i18n/commands/build.ts       |   4 +-
 utils/i18n/commands/format-html.ts |  63 +++++----
 utils/i18n/commands/format-yaml.ts |  80 +++++------
 utils/i18n/commands/migrate.ts     |   6 +-
 utils/i18n/config.ts               | 187 +++++++++++++-----------
 utils/i18n/reader.ts               | 220 ++++++++++++++---------------
 utils/i18n/types/index.ts          |  17 +++
 utils/i18n/writer.ts               |  78 +++++-----
 14 files changed, 506 insertions(+), 467 deletions(-)
 create mode 100644 utils/i18n/types/index.ts

diff --git a/config.mjs b/config.mjs
index 2814af11..deee6277 100644
--- a/config.mjs
+++ b/config.mjs
@@ -3,4 +3,4 @@ export const using = [
   ['locales/ppy.sb', {
     only: 'home'
   }]
-]
\ No newline at end of file
+]
diff --git a/package.json b/package.json
index dd516da3..e606c3b7 100644
--- a/package.json
+++ b/package.json
@@ -8,15 +8,9 @@
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "build: "
-    "i18n:build": "node utils/i18n/commands/build.mjs",
-    "i18n:compile": "node utils/i18n/commands/build.mjs echo 'use i18n:build from now on.'",
-    "i18n:format:templates": "node utils/i18n/commands/format-html.mjs",
-    "i18n:format:locales": "node utils/i18n/commands/format-yaml.mjs",
-    "i18n:format": "npm run i18n:format:templates & npm run i18n:format:locales",
-    "i18n:format:parallel": "PARALLEL=TRUE npm run i18n:format",
-    "i18n:dev": "nodemon --watch ./locales -e yml, yaml utils/i18n/commands/build.mjs",
-    "i18n:make-sure-you-understand-what-you-are-doing:migrate": "node utils/i18n/commands/migrate.mjs"
+    "i18n:build": "ts-node utils/i18n/commands/build",
+    "i18n:compile": "ts-node utils/i18n/commands/build echo 'use i18n:build from now on.'",
+    "i18n:format:templates": "ts-node utils/i18n/commands/format-html"
   },
   "repository": {
     "type": "git",
@@ -29,9 +23,19 @@
   },
   "homepage": "https://github.com/ppy-sb/guweb#readme",
   "devDependencies": {
+    "@types/clui": "^0.3.1",
+    "@types/glob": "^7.2.0",
     "@types/jquery": "^3.5.14",
+    "@types/js-yaml": "^4.0.5",
+    "@types/lodash-es": "^4.17.6",
     "@types/node": "^18.6.2",
+    "@typescript-eslint/eslint-plugin": "^5.0.0",
     "clui": "^0.3.6",
+    "eslint": "^8.0.1",
+    "eslint-config-standard-with-typescript": "^22.0.0",
+    "eslint-plugin-import": "^2.25.2",
+    "eslint-plugin-n": "^15.0.0",
+    "eslint-plugin-promise": "^6.0.0",
     "glob": "^8.0.3",
     "js-yaml": "^4.1.0",
     "lodash-es": "^4.17.21",
@@ -40,11 +44,6 @@
     "yaml": "^2.1.1"
   },
   "dependencies": {
-    "@typescript-eslint/eslint-plugin": "^5.0.0",
-    "eslint": "^8.0.1",
-    "eslint-config-standard-with-typescript": "^22.0.0",
-    "eslint-plugin-import": "^2.25.2",
-    "eslint-plugin-n": "^15.0.0",
-    "eslint-plugin-promise": "^6.0.0"
+    "ts-node": "^10.9.1"
   }
 }
diff --git a/tsconfig.json b/tsconfig.json
index 11673453..67980131 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,4 +1,15 @@
 {
+  "ts-node": {
+    // It is faster to skip typechecking.
+    // Remove if you want ts-node to do typechecking.
+    "transpileOnly": true,
+    "files": true,
+    "compilerOptions": {
+      // compilerOptions specified here will override those declared below,
+      // but *only* in ts-node.  Useful if you want ts-node and tsc to use
+      // different options with a single tsconfig.json.
+    }
+  },
   "compilerOptions": {
     /* Visit https://aka.ms/tsconfig to read more about this file */
 
@@ -27,11 +38,11 @@
     /* Modules */
     "module": "ESNext",                                /* Specify what module code is generated. */
     // "rootDir": "./utils",                                  /* Specify the root folder within your source files. */
-    // "moduleResolution": "node",                       /* Specify how TypeScript looks up a file from a given module specifier. */
+    "moduleResolution": "node",                       /* Specify how TypeScript looks up a file from a given module specifier. */
     // "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
     // "paths": {},                                      /* Specify a set of entries that re-map imports to additional lookup locations. */
-    "rootDirs": ["./utils", "./src"],                                   /* Allow multiple folders to be treated as one when resolving modules. */
-    // "typeRoots": [],                                  /* Specify multiple folders that act like './node_modules/@types'. */
+    "rootDirs": ["./utils"],                                   /* Allow multiple folders to be treated as one when resolving modules. */
+    "typeRoots": ["./utils/i18n/types"],                                  /* Specify multiple folders that act like './node_modules/@types'. */
     // "types": [],                                      /* Specify type package names to be included without being referenced in a source file. */
     // "allowUmdGlobalAccess": true,                     /* Allow accessing UMD globals from modules. */
     // "moduleSuffixes": [],                             /* List of file name suffixes to search when resolving a module. */
@@ -47,7 +58,7 @@
     "declaration": true,                              /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
     // "declarationMap": true,                           /* Create sourcemaps for d.ts files. */
     // "emitDeclarationOnly": true,                      /* Only output d.ts files and not JavaScript files. */
-    "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
+    // "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
     // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
     "outDir": ".built",                                   /* Specify an output folder for all emitted files. */
     // "removeComments": true,                           /* Disable emitting comments. */
@@ -99,5 +110,6 @@
     /* Completeness */
     // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
     "skipLibCheck": true                                 /* Skip type checking all .d.ts files. */
-  }
+  },
+  "include": ["./utils/**/*"]
 }
diff --git a/utils/i18n/adapt-to-i18n-editor.ts b/utils/i18n/adapt-to-i18n-editor.ts
index db63588f..f9ca0638 100644
--- a/utils/i18n/adapt-to-i18n-editor.ts
+++ b/utils/i18n/adapt-to-i18n-editor.ts
@@ -1,19 +1,19 @@
-export function toI18nEditor(locales) {
-    const rtn = {}
-    for (const locale in locales) {
-        const namespaces = locales[locale]
-        for (const namespace in namespaces) {
-            const entries = namespaces[namespace]
-            const context = {
-                locale,
-                namespace,
-                extension: 'yml'
-            }
-        }
+export function toI18nEditor (locales) {
+  const rtn = {}
+  for (const locale in locales) {
+    const namespaces = locales[locale]
+    for (const namespace in namespaces) {
+      const entries = namespaces[namespace]
+      const context = {
+        locale,
+        namespace,
+        extension: 'yml'
+      }
     }
-    return rtn
+  }
+  return rtn
 }
 
-export function fromI18nEditor(locales) {
+export function fromI18nEditor (locales) {
 
-}
\ No newline at end of file
+}
diff --git a/utils/i18n/built-reader.ts b/utils/i18n/built-reader.ts
index 933580e6..fdc02c82 100644
--- a/utils/i18n/built-reader.ts
+++ b/utils/i18n/built-reader.ts
@@ -3,60 +3,58 @@ import path from 'path'
 import fs from 'fs'
 import yaml from 'js-yaml'
 
-import { compiledFileNameSchema, compiledFileSchema, compiled as translationPath, divider } from './config.js'
+import { compiledFileNameSchema, compiledFileSchema, compiled as translationPath, divider, FileContext } from './config'
 
-const parseFileName = (file) => {
-    const fileName = path.relative(translationPath, file)
-    const parts = fileName.split(divider)
-    return compiledFileNameSchema.reduce((acc, part, index) => {
-        acc[part] = parts[index]
-        return acc
-    }, {})
+const parseFileName = (file: string): FileContext => {
+  const fileName = path.relative(translationPath, file)
+  const parts = fileName.split(divider)
+  return compiledFileNameSchema.reduce((acc: Partial<FileContext>, part: 'namespace' | 'locale' | 'extension', index) => {
+    acc[part] = parts[index]
+    return acc
+  }, {}) as FileContext
 }
 
-const parseLocale = (file, context) => {
-    const locale = yaml.load(fs.readFileSync(file, 'utf8'))
-    const _parse = (locale) => {
-        const rtn = {
-            // [context.namespace]: {
-            //     [context.locale]: null,
-            // }
-            [context.locale]: {
-                [context.namespace]: null
-            }
-        }
-        let current = locale
-        let currentLocale = undefined
-        compiledFileSchema.forEach(part => {
-            switch (part) {
-                case 'locale': {
-                    currentLocale = context.locale
-                    current = current[currentLocale]
-                    break
-                }
-                case 'entries': {
-                    rtn[currentLocale][context.namespace] = current
-                    break
-                }
-                default: {
-                    throw new Error('unknown type of file')
-                }
-            }
-        })
-        return rtn
+const parseLocale = (file: string, context: FileContext): LocaleRoot | undefined => {
+  const locale = yaml.load(fs.readFileSync(file, 'utf8')) as Locale | Locale[]
+  const _parse = (locale: Locale): LocaleRoot => {
+    const rtn: LocaleRoot = {
+      [context.locale]: {
+        [context.namespace]: null
+      }
     }
-    if (Array.isArray(locale)) {
-        const toMerge = locale.forEach(_parse)
-        let rtn = {}
-        for (const item of toMerge) {
-            rtn = {
-                ...rtn,
-                ...item
-            }
+    let current = locale
+    let currentLocale: string
+    compiledFileSchema.forEach(part => {
+      switch (part) {
+        case 'locale': {
+          currentLocale = context.locale
+          current = (current as InnerLocale)?.[currentLocale]
+          break
         }
-    } else {
-        return _parse(locale)
+        case 'entries': {
+          if (currentLocale === undefined) break
+          rtn[currentLocale][context.namespace] = current
+          break
+        }
+        default: {
+          throw new Error('unknown type of file')
+        }
+      }
+    })
+    return rtn
+  }
+  if (Array.isArray(locale)) {
+    const toMerge = locale.map(_parse)
+    let rtn = {}
+    for (const item of toMerge) {
+      rtn = {
+        ...rtn,
+        ...item
+      }
     }
+  } else {
+    return _parse(locale)
+  }
 }
 /* ----------------------------------------------------------------
 ** return format: {
@@ -64,28 +62,30 @@ const parseLocale = (file, context) => {
       [namespace]: {
           ...entries
       }
-  }    
+  }
 }
 */
-export const readLocales = () => new Promise((resolve, reject) => {
-    glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
-        if (err) throw err
-        const locales = await matches.reduce(async (acc, match) => {
-            try {
-                acc = await acc
-                const name = parseFileName(match)
-                const data = await parseLocale(match, name)
-                if (!acc[name.locale]) acc[name.locale] = {}
-                acc[name.locale] = {
-                    ...acc[name.locale],
-                    ...data[name.locale]
-                }
-                return acc
-            } catch (error) {
-                reject(error)
-            }
-        }, {})
+export const readLocales = async (): Promise<LocaleRoot> => await new Promise((resolve, reject) => {
+  glob(path.join(translationPath, '**/*.yml'), (err, matches) => {
+    if (err != null) throw err
+    const locales = matches.reduce(async (acc: Promise<LocaleRoot> | LocaleRoot, match): Promise<LocaleRoot> => {
+      try {
+        acc = await acc
+        const name = parseFileName(match)
+        const data = parseLocale(match, name)
+        if (data === undefined) { return acc }
+        if (acc[name.locale] == null) { acc[name.locale] = {} }
+        acc[name.locale] = {
+          ...acc[name.locale] as Record<string, Locale>,
+          ...data[name.locale] as Record<string, Locale>
+        }
+        return acc
+      } catch (error) {
+        reject(error)
+        return acc as LocaleRoot
+      }
+    }, {})
 
-        resolve(locales)
-    })
+    resolve(locales)
+  })
 })
diff --git a/utils/i18n/built-writer.ts b/utils/i18n/built-writer.ts
index fea1bb41..d4e29660 100644
--- a/utils/i18n/built-writer.ts
+++ b/utils/i18n/built-writer.ts
@@ -1,61 +1,62 @@
-import { compiledFileNameSchema, compiledFileSchema, compiled as translationPath, divider } from './config.js'
+import { compiledFileNameSchema, compiledFileSchema, compiled as translationPath, divider, FileContext } from './config'
 import yaml from 'js-yaml'
 import { join, dirname } from 'path'
 import fs from 'fs/promises'
 import { existsSync, mkdirSync } from 'fs'
 
-export function formatLocaleData(locale, context) {
-    const current = locale[context.locale][context.namespace]
-    // transform schema
-    let write = {}
-    const path = []
-    compiledFileSchema.forEach(k => {
-        switch (k) {
-            case 'locale': {
-                write = {
-                    [context.locale.replace('-','_')]: write
-                }
-                path.push(context.locale.replace('-','_'))
-                break
-            }
-            case 'entries': {
-                const readonly = [...path]
-                const last = readonly.pop()
-                const target = readonly.reduce((acc, cur) => {
-                    return acc[cur]
-                }, write)
-                target[last] = current
-            }
+export function formatLocaleData (locale: LocaleRoot, context: FileContext): string {
+  const current = locale[context.locale][context.namespace]
+  // transform schema
+  let write: LocaleRoot = {}
+  const path: string[] = []
+  compiledFileSchema.forEach(k => {
+    switch (k) {
+      case 'locale': {
+        write = {
+          [context.locale.replace('-', '_')]: write
         }
-    })
+        path.push(context.locale.replace('-', '_'))
+        break
+      }
+      case 'entries': {
+        if (path.length === 0) throw new Error('should at least have one entry')
+        const readonly = [...path]
+        const last = readonly.pop() as string
+        const target = readonly.reduce((acc: Locale, cur): InnerLocale => {
+          if (acc === undefined || ['string', 'number'].includes(typeof acc)) throw new Error('unable to find Locale')
+          return (acc as InnerLocale)?.[cur] as InnerLocale
+        }, write)
+        ;(target as InnerLocale)[last] = current
+      }
+    }
+  })
 
-    return yaml.dump(write)
+  return yaml.dump(write)
 }
 
-export function generateFileName(context) {
-    return compiledFileNameSchema.map(k => context[k].replace('-','_')).join(divider)
+export function generateFileName (context: FileContext): string {
+  return compiledFileNameSchema.map(k => context[k].replace('-', '_')).join(divider)
 }
 
-export async function writeToDisk(locales) {
-    const works = []
-    for (const locale in locales) {
-        const namespaces = locales[locale]
-        for (const namespace in namespaces) {
-            const entries = namespaces[namespace]
-            const context = {
-                locale,
-                namespace,
-                extension: 'yml'
-            }
-            const fileName = generateFileName(context)
-            const yaml = formatLocaleData(locales, context)
-            const path = join(translationPath, fileName)
-            const dir = dirname(path)
-            if (!existsSync(path)) {
-                mkdirSync(dir, {recursive: true})
-            }
-            works.push(fs.writeFile(path, yaml, 'utf8'))
-        }
+export async function writeToDisk (locales: LocaleRoot): Promise<unknown> {
+  const works = []
+  for (const locale in locales) {
+    const namespaces = locales[locale]
+    for (const namespace in namespaces) {
+      const context: FileContext = {
+        locale,
+        namespace,
+        extension: 'yml'
+      }
+      const fileName = generateFileName(context)
+      const yaml = formatLocaleData(locales, context)
+      const path = join(translationPath, fileName)
+      const dir = dirname(path)
+      if (!existsSync(path)) {
+        mkdirSync(dir, { recursive: true })
+      }
+      works.push(fs.writeFile(path, yaml, 'utf8'))
     }
-    return Promise.all(works)
+  }
+  return await Promise.all(works)
 }
diff --git a/utils/i18n/commands/build.ts b/utils/i18n/commands/build.ts
index 80800cf0..a80956ef 100644
--- a/utils/i18n/commands/build.ts
+++ b/utils/i18n/commands/build.ts
@@ -1,6 +1,6 @@
 
 import { readLocales } from '../reader'
-import { writeToDisk } from '../built-writer.ts/index.js'
+import { writeToDisk } from '../built-writer'
 import clui from 'clui'
 const { Spinner } = clui
 
@@ -9,4 +9,4 @@ const data = await readLocales()
 work.message('transforming to python-i18n format...')
 await writeToDisk(data)
 work.stop()
-console.log('transformed to python-i18n format')
\ No newline at end of file
+console.log('transformed to python-i18n format')
diff --git a/utils/i18n/commands/format-html.ts b/utils/i18n/commands/format-html.ts
index 515f61b4..f3631d80 100644
--- a/utils/i18n/commands/format-html.ts
+++ b/utils/i18n/commands/format-html.ts
@@ -1,40 +1,41 @@
-const parallel = process.env.PARALLEL || false
-
+/* eslint-disable @typescript-eslint/no-misused-promises */
 import glob from 'glob'
 import path from 'path'
 import fs from 'fs/promises'
 import clui from 'clui'
-const { Spinner } = clui
 
-import { path as translationPath } from '../config.js'
+import { rootPath } from '../config'
 
-const doWork = async (match) => {
-    try {
-        const template = await fs.readFile(match, { encoding: 'utf8' })
-        const wb = template.replace(/\{\{\s?t\('(.*)'\s?(,\s?(.+)\s?)?\)\s?\}\}/gmu, '{{ t(\'$1\'$2) }}')
-        await fs.writeFile(match, wb, 'utf8')
-    } catch (error) {
-        console.error(error)
-    }
+const parallel = (process.env.PARALLEL != null) || false
+const { Spinner } = clui
+
+const doWork = async (match: string): Promise<void> => {
+  try {
+    const template = await fs.readFile(match, { encoding: 'utf8' })
+    const wb = template.replace(/\{\{\s?t\('(.*)'\s?(,\s?(.+)\s?)?\)\s?\}\}/gmu, '{{ t(\'$1\'$2) }}')
+    await fs.writeFile(match, wb, 'utf8')
+  } catch (error) {
+    console.error(error)
+  }
 }
 
-glob(path.join(translationPath, '../templates/**/*.html'), async (err, matches) => {
-    if (err) throw err
-    const work = new Spinner(`formatting templates...`)
-    work.start()
-    if (parallel) {
-        await Promise.all(matches.map(async match => {
-            const work = new Spinner(`formatting template: ${match}`)
-            work.start()
-            await doWork(match)
-            work.stop()
-        }))
-    } else {
-        for (const match of matches) {
-            work.message(`formatting template: ${match}`)
-            await doWork(match)
-        }
+glob(path.join(rootPath, 'templates/**/*.html'), async (err, matches) => {
+  if (err != null) throw err
+  const work = new Spinner('formatting templates...')
+  work.start()
+  if (parallel) {
+    await Promise.all(matches.map(async match => {
+      const work = new Spinner(`formatting template: ${match}`)
+      work.start()
+      await doWork(match)
+      work.stop()
+    }))
+  } else {
+    for (const match of matches) {
+      work.message(`formatting template: ${match}`)
+      await doWork(match)
     }
-    work.stop()
-    console.log(`formatting templates...  done`)
-})
\ No newline at end of file
+  }
+  work.stop()
+  console.log('formatting templates...  done')
+})
diff --git a/utils/i18n/commands/format-yaml.ts b/utils/i18n/commands/format-yaml.ts
index dddfa93e..f7641e60 100644
--- a/utils/i18n/commands/format-yaml.ts
+++ b/utils/i18n/commands/format-yaml.ts
@@ -1,45 +1,45 @@
-const parallel = process.env.PARALLEL || false
+// import { parseDocument } from 'yaml'
 
-import YAML, { parseDocument } from 'yaml'
+// import glob from 'glob'
+// import path from 'path'
+// import fs from 'fs/promises'
+// import clui from 'clui'
 
-import glob from 'glob'
-import path from 'path'
-import fs from 'fs/promises'
-import clui from 'clui'
-const { Spinner } = clui
+// import { path as translationPath } from '../config'
 
-import { path as translationPath } from '../config.js'
+// const parallel = (process.env.PARALLEL != null) || false
+// const { Spinner } = clui
 
-const doWork = async (match) => {
-    try {
-        const data = parseDocument(await fs.readFile(match, { encoding: 'utf8' }))
-        const formatted = data.toString({
-            blockQuote: 'literal',
-            defaultStringType: 'BLOCK_FOLDED'
-        })
-        await fs.writeFile(match, formatted, 'utf8')
-    } catch (error) {
-        console.error(error)
-    }
-}
+// const doWork = async (match: string): Promise<void> => {
+//   try {
+//     const data = parseDocument(await fs.readFile(match, { encoding: 'utf8' }))
+//     const formatted = data.toString({
+//       blockQuote: 'literal',
+//       defaultStringType: 'BLOCK_FOLDED'
+//     })
+//     await fs.writeFile(match, formatted, 'utf8')
+//   } catch (error) {
+//     console.error(error)
+//   }
+// }
 
-glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
-    if (err) throw err
-    const work = new Spinner(`formatting locales...`)
-    work.start()
-    if (parallel) {
-        await Promise.all(matches.map(async (match) => {
-            const work = new Spinner(`formatting locale: ${match}`)
-            work.start()
-            await doWork(match)
-            work.stop()
-        }))
-    } else {
-        for (const match of matches) {
-            work.message(`formatting locale: ${match}`)
-            await doWork(match)
-        }
-    }
-    work.stop()
-    console.log(`formatting locales...  done`)
-})
\ No newline at end of file
+// glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
+//   if (err != null) throw err
+//   const work = new Spinner('formatting locales...')
+//   work.start()
+//   if (parallel) {
+//     await Promise.all(matches.map(async (match) => {
+//       const work = new Spinner(`formatting locale: ${match}`)
+//       work.start()
+//       await doWork(match)
+//       work.stop()
+//     }))
+//   } else {
+//     for (const match of matches) {
+//       work.message(`formatting locale: ${match}`)
+//       await doWork(match)
+//     }
+//   }
+//   work.stop()
+//   console.log('formatting locales...  done')
+// })
diff --git a/utils/i18n/commands/migrate.ts b/utils/i18n/commands/migrate.ts
index e8aa093b..78585747 100644
--- a/utils/i18n/commands/migrate.ts
+++ b/utils/i18n/commands/migrate.ts
@@ -1,5 +1,5 @@
 
-import { readLocales } from '../built-reader.ts/index.js'
-import { writeToDisk } from '../writer'
+// import { readLocales } from '../built-reader'
+// import { writeToDisk } from '../writer'
 
-readLocales().then(locales => writeToDisk(locales))
\ No newline at end of file
+// void readLocales().then(locales => writeToDisk(locales))
diff --git a/utils/i18n/config.ts b/utils/i18n/config.ts
index 628a09d8..3ed54a57 100644
--- a/utils/i18n/config.ts
+++ b/utils/i18n/config.ts
@@ -1,101 +1,118 @@
-// @ts-check
-// @ts-ignore
-import path, { join, dirname } from 'path';
-import { fileURLToPath } from 'url';
-import { every, merge } from 'lodash-es'
+/* eslint-disable @typescript-eslint/naming-convention */
+/* eslint-disable @typescript-eslint/strict-boolean-expressions */
+import { join, dirname } from 'path'
+import { fileURLToPath } from 'url'
+import { merge } from 'lodash-es'
 
 import { using } from '../../config.mjs'
 
-const __dirname = dirname(fileURLToPath(import.meta.url));
+const __dirname = dirname(fileURLToPath(import.meta.url))
 
-export const compiledFileNameSchema = ['namespace', 'locale', 'extension']
+export const compiledFileNameSchema = ['namespace', 'locale', 'extension'] as Array<'namespace' | 'locale' | 'extension'>
 export const compiledFileSchema = ['locale', 'entries']
 export const compiled = join(__dirname, '../../.locales')
-export const paths = using.map(p => {
-    if (typeof p === "string") {
-        return {
-            path: join(__dirname, '../../', p),
-            filter: () => true
-        }
-    } else if (Array.isArray(p)) {
-        if (p.length < 1) return
-        const path = p[0]
-        const returnValue = {
-            path: join(__dirname, '../../', path),
-            filter: () => true
-        }
-        if (p.length < 2) return returnValue
+export const rootPath = join(__dirname, '../../')
 
-        const conf = p[1]
-        if (conf.filter) {
-            returnValue.filter = conf.filter
-            return returnValue
-        } else {
-            if (typeof conf.only === "string") {
-                conf.only = [conf.only]
-                conf.only = conf.only.map((path) => join(returnValue.path, path))
-                console.log(conf.only)
-                returnValue.filter = (path) => conf.only.some(only => path.startsWith(only))
-                return returnValue
-            }
-            if (typeof conf.except === "string") {
-                conf.except = [conf.except]
-                conf.except = conf.except.map((path) => join(returnValue.path, path))
-                returnValue.filter = (path) => conf.except.every(except => !path.startsWith(except))
-                return returnValue
-            }
-            throw new Error('config invalid:' + p)
-        }
+export type LocalePathConfig =
+    | string
+    | [string, Partial<{
+      filter: (path: string) => boolean
+      only: string | string[]
+      except: string | string[]
+    }>]
+
+// eslint-disable-next-line array-callback-return
+export const paths = (using as LocalePathConfig[]).map((p) => {
+  if (typeof p === 'string') {
+    return {
+      path: join(__dirname, '../../', p),
+      filter: () => true
     }
+  } else if (Array.isArray(p)) {
+    if (p.length < 1) return undefined
+    const path = p[0]
+    const returnValue = {
+      path: join(__dirname, '../../', path),
+      filter: (_: string) => true
+    }
+    if (p.length < 2) return returnValue
+
+    const conf = p[1]
+    if (conf.filter) {
+      returnValue.filter = conf.filter
+      return returnValue
+    } else {
+      if (typeof conf.only === 'string') {
+        conf.only = [conf.only]
+        conf.only = conf.only.map((path) => join(returnValue.path, path))
+        returnValue.filter = (path: string) => (conf.only as string[]).some(only => path.startsWith(only))
+        return returnValue
+      }
+      if (typeof conf.except === 'string') {
+        conf.except = [conf.except]
+        conf.except = conf.except.map((path) => join(returnValue.path, path))
+        returnValue.filter = (path) => (conf.except as string[]).every(except => !path.startsWith(except))
+        return returnValue
+      }
+      throw new Error(`config invalid: ${p.toString()}`)
+    }
+  }
 }).filter(Boolean)
 export const divider = '.'
 
-export function contextToFileName(context) {
-    return `${context.namespace}/${context.locale}.${context.extension || 'yml'}`
+export function contextToFileName (context: FileContext): string {
+  return `${context.namespace}/${context.locale}.${context.extension || 'yml'}`
 }
-export function contextFromFileName(fileName) {
-    const split = fileName.split('/').join(divider).split(divider)
-    const namespaces = split.slice(0, split.length - 2)
-    const [locale, extension] = split.slice(-2)
-    return {
-        namespace: namespaces.join('.'),
-        namespaces,
-        locale: locale.replace('_', '-'),
-        extension
-    }
+// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
+export function contextFromFileName (fileName: string) {
+  const split = fileName.split('/').join(divider).split(divider)
+  const namespaces = split.slice(0, split.length - 2)
+  const [locale, extension] = split.slice(-2)
+  return {
+    namespace: namespaces.join('.'),
+    namespaces,
+    locale: locale.replace('_', '-'),
+    extension
+  }
 }
-export const createConfilitKeyHandler = (mergeMode) => function onConflictingKey(oldVal, newVal, key) {
-    if (typeof newVal[key] !== 'object' && typeof oldVal[key] !== 'object') {
-        console.log(typeof newVal[key], oldVal[key], newVal[key])
-        return {
-            ...oldVal,
-            ...newVal
-        }
-    }
-    if (typeof newVal[key] === 'object' && typeof oldVal[key] === 'object') {
-        if (!mergeMode) console.info('merged object', oldVal, newVal)
-        return merge(oldVal, newVal)
+export interface FileContext {
+  namespace: string
+  namespaces?: string[]
+  locale: string
+  extension: string
+}
+
+export const createConfilitKeyHandler = (mergeMode: boolean) => function onConflictingKey (oldVal: any, newVal: any, key: string) {
+  if (typeof newVal[key] !== 'object' && typeof oldVal[key] !== 'object') {
+    console.log(typeof newVal[key], oldVal[key], newVal[key])
+    return {
+      ...oldVal,
+      ...newVal
     }
-    if (typeof newVal[key] === 'string') {
-        console.info(`[info] ${key} renamed into ${key}._string.`)
-        return {
-            ...oldVal,
-            ...newVal,
-            [key]: {
-                ...oldVal[key],
-                _string: newVal[key]
-            }
-        }
+  }
+  if (typeof newVal[key] === 'object' && typeof oldVal[key] === 'object') {
+    if (!mergeMode) console.info('merged object', oldVal, newVal)
+    return merge(oldVal, newVal)
+  }
+  if (typeof newVal[key] === 'string') {
+    console.info(`[info] ${key} renamed into ${key}._string.`)
+    return {
+      ...oldVal,
+      ...newVal,
+      [key]: {
+        ...oldVal[key],
+        _string: newVal[key]
+      }
     }
-    else if (typeof oldVal[key] === 'string') {
-        console.info(`[info] ${key} renamed into ${key}._string.`)
-        return {
-            ...oldVal,
-            ...newVal,
-            [key]: {
-                ...newVal[key],
-                _string: oldVal[key]
-            }
-        }
+  } else if (typeof oldVal[key] === 'string') {
+    console.info(`[info] ${key} renamed into ${key}._string.`)
+    return {
+      ...oldVal,
+      ...newVal,
+      [key]: {
+        ...newVal[key],
+        _string: oldVal[key]
+      }
     }
-}
\ No newline at end of file
+  }
+}
diff --git a/utils/i18n/reader.ts b/utils/i18n/reader.ts
index 2bbb2ae9..6162fa89 100644
--- a/utils/i18n/reader.ts
+++ b/utils/i18n/reader.ts
@@ -1,133 +1,125 @@
-// @ts-check
 import glob from 'glob'
-import path, { resolve } from 'path'
+import path from 'path'
 import fs from 'fs'
 import yaml from 'js-yaml'
-import { mergeWith, merge, reject } from 'lodash-es'
+import { mergeWith } from 'lodash-es'
 
-import { compiledFileSchema, paths as translationPaths, contextFromFileName, createConfilitKeyHandler } from './config.js'
+import { paths as translationPaths, contextFromFileName, createConfilitKeyHandler, FileContext } from './config'
 
-// context
-// {
-//     namespace: namespaces.join('.'),
-//     namespaces,
-//     locale: locale.replace('_', '-'),
-//     extension
-// }
-const parseLocale = (file, context) => {
-    const locale = yaml.load(fs.readFileSync(file, 'utf8'))
-    const _parse = (locale) => {
-        if (!context.namespaces) return {
-            [context.locale]: {
-                [context.namespace]: locale
-            }
-        }
-        const rtn = {}
-        let inner = rtn
-        context.namespaces.forEach((ns, index) => {
-            if (index === context.namespaces.length - 1) {
-                return inner[ns] = locale
-            }
-            rtn[ns] = {}
-            inner = rtn[ns]
-        })
-        return {
-            [context.locale]: rtn
+const parseLocale = (file: string, context: FileContext): LocaleRoot => {
+  const locale = yaml.load(fs.readFileSync(file, 'utf8')) as Locale
+  const _parse = (locale: Locale): LocaleRoot => {
+    if (context.namespaces == null) {
+      return {
+        [context.locale]: {
+          [context.namespace]: locale
         }
+      }
     }
-    if (Array.isArray(locale)) {
-        const toMerge = locale.map(_parse)
-        let rtn = {}
-        for (const item of toMerge) {
-            rtn = {
-                ...rtn,
-                ...item
-            }
-        }
-        return rtn
-    } else {
-        return _parse(locale)
+    const rtn: Record<string, any> = {}
+    let inner = rtn
+    context.namespaces.forEach((ns, index) => {
+      if (index === (context as FileContext & {namespaces: []}).namespaces.length - 1) {
+        inner[ns] = locale
+        return
+      }
+      rtn[ns] = {}
+      inner = rtn[ns]
+    })
+    return {
+      [context.locale]: rtn
     }
+  }
+  if (Array.isArray(locale)) {
+    const toMerge = locale.map(_parse)
+    let rtn = {}
+    for (const item of toMerge) {
+      rtn = {
+        ...rtn,
+        ...item
+      }
+    }
+    return rtn
+  } else {
+    return _parse(locale)
+  }
 }
 
-// file
-// {
-//     namespace: namespaces.join('.'),
-//     namespaces,
-//     locale: locale.replace('_', '-'),
-//     extension
-// }
-const mixinLocale = ({ merging, joinedLocales, mixingWith: { parsedLocale, context } }) => {
-    if (!joinedLocales[context.locale]) joinedLocales[context.locale] = {}
-    joinedLocales[context.locale] = mergeWith(
-        joinedLocales[context.locale],
-        parsedLocale[context.locale],
-        (objValue, srcValue, key, object, source, stack) => {
-            if (!objValue) {
-                return srcValue
-            }
-            for (const k in srcValue) {
-                if (objValue[k] && objValue[k] !== srcValue[k]) {
-                    if (!merging) console.warn(`[Warning] Merging into initilazed value:
+const mixinLocale = (
+  { merging, joinedLocales, mixingWith: { parsedLocale, context } }:
+  { merging: boolean
+    joinedLocales: LocaleRoot
+    mixingWith: {
+      parsedLocale: LocaleRoot
+      context: FileContext
+    }
+  }
+): void => {
+  if (joinedLocales[context.locale] == null) joinedLocales[context.locale] = {}
+  joinedLocales[context.locale] = mergeWith(
+    joinedLocales[context.locale],
+    parsedLocale[context.locale],
+    (objValue, srcValue, key) => {
+      if (objValue == null) {
+        return srcValue
+      }
+      for (const k in srcValue) {
+        if (objValue?.[k] !== srcValue[k]) {
+          if (!merging) {
+            console.warn(`[Warning] Merging into initilazed value:
 ${key}.${k}:
-[${typeof srcValue[k]}${typeof srcValue[k] === 'string' && ' `' + srcValue[k] + '`' || ''}] merging into [${typeof objValue[k]}${typeof objValue[k] === 'string' && ' `' + objValue[k] + '`' || ''}].`)
-                    objValue = createConfilitKeyHandler(merging)(objValue, srcValue, k)
-                    if (!merging) console.log('')
-                } else {
-                    objValue[k] = srcValue[k]
-                }
-            }
-            return objValue
-            // return merge(objValue, srcValue)
+[${typeof srcValue[k]}${(typeof srcValue[k] === 'string' && `\`${srcValue[k] as string}\``) || ''}] merging into [${typeof objValue[k]}${(typeof objValue[k] === 'string' && `\`${objValue[k] as string}\``) || ''}].`)
+          }
+          objValue = createConfilitKeyHandler(merging)(objValue, srcValue, k)
+          if (!merging) console.log('')
+        } else {
+          objValue[k] = srcValue[k]
         }
-    )
-}
-
-const createReducer = ({ translationPath, merging }) => async (acc, match) => {
-    console.log('parsing', match, '...\n')
-    try {
-        acc = await acc
-        const relative = path.relative(translationPath, match)
-        const context = contextFromFileName(relative)
-        const data = await parseLocale(match, context)
-        mixinLocale({
-            merging,
-            joinedLocales: acc,
-            mixingWith: {
-                parsedLocale: data,
-                context
-            }
-        })
-        return acc
-    } catch (error) {
-        console.error(error)
+      }
+      return objValue
+      // return merge(objValue, srcValue)
     }
+  )
 }
-/* ----------------------------------------------------------------
-** return format: {
-  [locale]: {
-      [namespace]: {
-          ...entries
+
+const createReducer = ({ translationPath, merging }: {translationPath: string, merging: boolean}) => async (acc: LocaleRoot, match: string) => {
+  console.log('parsing', match, '...\n')
+  try {
+    acc = await acc
+    const relative = path.relative(translationPath, match)
+    const context = contextFromFileName(relative)
+    const data = await parseLocale(match, context)
+    mixinLocale({
+      merging,
+      joinedLocales: acc,
+      mixingWith: {
+        parsedLocale: data,
+        context
       }
-  }    
-}
-* allow customization if {lang}.custom.(yml|yaml) is provided.
-*/
-const asyncGlob = (path) => new Promise((resolve, reject) => {
-    glob(path, (err, matches) => {
-        if (err) reject(err)
-        else resolve(matches)
     })
+    return acc
+  } catch (error) {
+    console.error(error)
+  }
+}
+
+const asyncGlob = async (path: string): Promise<string[]> => await new Promise((resolve, reject) => {
+  glob(path, (err, matches) => {
+    if (err != null) reject(err)
+    else resolve(matches)
+  })
 })
-export const readLocales = async () => {
-    let locales = {}
-    for (const [index, conf] of translationPaths.entries()) {
-        const { path: translationPath, filter } = conf
-        const matches = (await asyncGlob(path.join(translationPath, '**/*.yml')))
-        .filter(filter)
-        const reducer = createReducer({ translationPath, merging: index > 0 })
-        locales = await matches.reduce(reducer, locales)
-    }
 
-    return locales
+export const readLocales = async (): Promise<LocaleRoot> => {
+  let locales = {}
+  for (const [index, conf] of translationPaths.entries()) {
+    if (conf == null) continue
+    const { path: translationPath, filter } = conf
+    const matches = (await asyncGlob(path.join(translationPath, '**/*.yml')))
+      .filter(filter)
+    const reducer = createReducer({ translationPath, merging: index > 0 })
+    locales = await matches.reduce(reducer, locales)
+  }
+
+  return locales
 }
diff --git a/utils/i18n/types/index.ts b/utils/i18n/types/index.ts
new file mode 100644
index 00000000..6bd7e5cf
--- /dev/null
+++ b/utils/i18n/types/index.ts
@@ -0,0 +1,17 @@
+
+/* eslint-disable @typescript-eslint/no-unused-vars */
+interface InnerLocale {
+  [index: string]: Locale
+}
+type Locale =
+| InnerLocale
+| string
+| number
+| undefined
+| null
+
+interface LocaleRoot {
+  [locale: string]: {
+    [namespace: string]: Locale
+  }
+}
diff --git a/utils/i18n/writer.ts b/utils/i18n/writer.ts
index dab1bdab..f255364f 100644
--- a/utils/i18n/writer.ts
+++ b/utils/i18n/writer.ts
@@ -1,41 +1,41 @@
-// @ts-check
-import {
-    compiledFileNameSchema,
-    compiledFileSchema,
-    paths as translationPath,
-    divider,
-    contextToFileName
-} from './config.js'
-import yaml from 'js-yaml'
-import { join } from 'path'
-import fs from 'fs/promises'
-import _path from 'path'
-import { existsSync, mkdirSync } from 'fs'
+// // @ts-check
+// import {
+//   compiledFileNameSchema,
+//   compiledFileSchema,
+//   paths as translationPath,
+//   divider,
+//   contextToFileName,
+//   FileContext
+// } from './config'
+// import yaml from 'js-yaml'
+// import _path, { join } from 'path'
+// import fs from 'fs/promises'
+// import { existsSync, mkdirSync } from 'fs'
 
-export function formatLocaleData(locale, context) {
-    const current = locale[context.locale][context.namespace]
-    return yaml.dump(current)
-}
+// export function formatLocaleData (locale: Record<string, any>, context: FileContext) {
+//   const current = locale[context.locale][context.namespace]
+//   return yaml.dump(current)
+// }
 
-export function writeToDisk(locales) {
-    throw new Error('deprecated!! nothing has changed.')
-    // for (const locale in locales) {
-    //     const namespaces = locales[locale]
-    //     for (const namespace in namespaces) {
-    //         const entries = namespaces[namespace]
-    //         const context = {
-    //             locale,
-    //             namespace,
-    //             extension: 'yml'
-    //         }
-    //         const fileName = contextToFileName(context)
-    //         const yaml = formatLocaleData(locales, context)
-    //         const path = join(translationPath, fileName)
-    //         const dir = _path.dirname(path)
-    //         if (!existsSync(path)) {
-    //             mkdirSync(dir, {recursive: true})
-    //         }
-    //         fs.writeFile(path, yaml, 'utf8')
-    //     }
-    // }
-}
+// export function writeToDisk (locales: any): void {
+//   throw new Error('deprecated!! nothing has changed.')
+//   for (const locale in locales) {
+//       const namespaces = locales[locale]
+//       for (const namespace in namespaces) {
+//           const entries = namespaces[namespace]
+//           const context = {
+//               locale,
+//               namespace,
+//               extension: 'yml'
+//           }
+//           const fileName = contextToFileName(context)
+//           const yaml = formatLocaleData(locales, context)
+//           const path = join(translationPath, fileName)
+//           const dir = _path.dirname(path)
+//           if (!existsSync(path)) {
+//               mkdirSync(dir, {recursive: true})
+//           }
+//           fs.writeFile(path, yaml, 'utf8')
+//       }
+//   }
+// }

From 9301129b27f8a3ee4237cff831343e0511375ab7 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 12 Aug 2022 15:21:55 +0000
Subject: [PATCH 211/278] working?

---
 config.mjs => config.js            |  0
 package.json                       | 10 +++++-----
 tsconfig.json                      |  2 +-
 utils/i18n/adapt-to-i18n-editor.ts | 19 -------------------
 utils/i18n/commands/build.ts       | 14 ++++++++------
 utils/i18n/config.ts               | 10 ++++------
 utils/i18n/reader.ts               |  4 ++--
 7 files changed, 20 insertions(+), 39 deletions(-)
 rename config.mjs => config.js (100%)
 delete mode 100644 utils/i18n/adapt-to-i18n-editor.ts

diff --git a/config.mjs b/config.js
similarity index 100%
rename from config.mjs
rename to config.js
diff --git a/package.json b/package.json
index e606c3b7..c60c9f2f 100644
--- a/package.json
+++ b/package.json
@@ -8,9 +8,9 @@
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "i18n:build": "ts-node utils/i18n/commands/build",
-    "i18n:compile": "ts-node utils/i18n/commands/build echo 'use i18n:build from now on.'",
-    "i18n:format:templates": "ts-node utils/i18n/commands/format-html"
+    "i18n:build": "node -r ts-node/register utils/i18n/commands/build",
+    "i18n:compile": "node -r ts-node/register utils/i18n/commands/build echo 'use i18n:build from now on.'",
+    "i18n:format:templates": "node -r ts-node/register utils/i18n/commands/format-html"
   },
   "repository": {
     "type": "git",
@@ -27,7 +27,6 @@
     "@types/glob": "^7.2.0",
     "@types/jquery": "^3.5.14",
     "@types/js-yaml": "^4.0.5",
-    "@types/lodash-es": "^4.17.6",
     "@types/node": "^18.6.2",
     "@typescript-eslint/eslint-plugin": "^5.0.0",
     "clui": "^0.3.6",
@@ -38,12 +37,13 @@
     "eslint-plugin-promise": "^6.0.0",
     "glob": "^8.0.3",
     "js-yaml": "^4.1.0",
-    "lodash-es": "^4.17.21",
     "nodemon": "^2.0.16",
     "typescript": "^4.7.4",
     "yaml": "^2.1.1"
   },
   "dependencies": {
+    "@types/lodash": "^4.14.182",
+    "lodash": "^4.17.21",
     "ts-node": "^10.9.1"
   }
 }
diff --git a/tsconfig.json b/tsconfig.json
index 67980131..ec303c7e 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -36,7 +36,7 @@
     // "moduleDetection": "auto",                        /* Control what method is used to detect module-format JS files. */
 
     /* Modules */
-    "module": "ESNext",                                /* Specify what module code is generated. */
+    "module": "CommonJS",                                /* Specify what module code is generated. */
     // "rootDir": "./utils",                                  /* Specify the root folder within your source files. */
     "moduleResolution": "node",                       /* Specify how TypeScript looks up a file from a given module specifier. */
     // "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
diff --git a/utils/i18n/adapt-to-i18n-editor.ts b/utils/i18n/adapt-to-i18n-editor.ts
deleted file mode 100644
index f9ca0638..00000000
--- a/utils/i18n/adapt-to-i18n-editor.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-export function toI18nEditor (locales) {
-  const rtn = {}
-  for (const locale in locales) {
-    const namespaces = locales[locale]
-    for (const namespace in namespaces) {
-      const entries = namespaces[namespace]
-      const context = {
-        locale,
-        namespace,
-        extension: 'yml'
-      }
-    }
-  }
-  return rtn
-}
-
-export function fromI18nEditor (locales) {
-
-}
diff --git a/utils/i18n/commands/build.ts b/utils/i18n/commands/build.ts
index a80956ef..a97d154e 100644
--- a/utils/i18n/commands/build.ts
+++ b/utils/i18n/commands/build.ts
@@ -4,9 +4,11 @@ import { writeToDisk } from '../built-writer'
 import clui from 'clui'
 const { Spinner } = clui
 
-const work = new Spinner('reading locales...')
-const data = await readLocales()
-work.message('transforming to python-i18n format...')
-await writeToDisk(data)
-work.stop()
-console.log('transformed to python-i18n format')
+void (async () => {
+  const work = new Spinner('reading locales...')
+  const data = await readLocales()
+  work.message('transforming to python-i18n format...')
+  await writeToDisk(data)
+  work.stop()
+  console.log('transformed to python-i18n format')
+})()
diff --git a/utils/i18n/config.ts b/utils/i18n/config.ts
index 3ed54a57..48f33824 100644
--- a/utils/i18n/config.ts
+++ b/utils/i18n/config.ts
@@ -1,12 +1,10 @@
 /* eslint-disable @typescript-eslint/naming-convention */
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
-import { join, dirname } from 'path'
-import { fileURLToPath } from 'url'
-import { merge } from 'lodash-es'
+import { join } from 'path'
+// import { fileURLToPath } from 'url'
+import { merge } from 'lodash'
 
-import { using } from '../../config.mjs'
-
-const __dirname = dirname(fileURLToPath(import.meta.url))
+import { using } from '../../config'
 
 export const compiledFileNameSchema = ['namespace', 'locale', 'extension'] as Array<'namespace' | 'locale' | 'extension'>
 export const compiledFileSchema = ['locale', 'entries']
diff --git a/utils/i18n/reader.ts b/utils/i18n/reader.ts
index 6162fa89..0aae9cae 100644
--- a/utils/i18n/reader.ts
+++ b/utils/i18n/reader.ts
@@ -2,7 +2,7 @@ import glob from 'glob'
 import path from 'path'
 import fs from 'fs'
 import yaml from 'js-yaml'
-import { mergeWith } from 'lodash-es'
+import { mergeWith } from 'lodash'
 
 import { paths as translationPaths, contextFromFileName, createConfilitKeyHandler, FileContext } from './config'
 
@@ -64,7 +64,7 @@ const mixinLocale = (
         return srcValue
       }
       for (const k in srcValue) {
-        if (objValue?.[k] !== srcValue[k]) {
+        if ((Boolean(objValue[k])) && objValue[k] !== srcValue[k]) {
           if (!merging) {
             console.warn(`[Warning] Merging into initilazed value:
 ${key}.${k}:

From 11d1dcee0fa68c8612fe2efcc3e0cfeffb74e654 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 12 Aug 2022 15:32:32 +0000
Subject: [PATCH 212/278] should done

---
 utils/i18n/commands/format-yaml.ts | 64 ++++++++++++++++++++----------
 utils/i18n/lib.ts                  |  7 ++++
 utils/i18n/reader.ts               |  9 +----
 3 files changed, 52 insertions(+), 28 deletions(-)
 create mode 100644 utils/i18n/lib.ts

diff --git a/utils/i18n/commands/format-yaml.ts b/utils/i18n/commands/format-yaml.ts
index f7641e60..53262463 100644
--- a/utils/i18n/commands/format-yaml.ts
+++ b/utils/i18n/commands/format-yaml.ts
@@ -1,27 +1,51 @@
-// import { parseDocument } from 'yaml'
+import { parseDocument } from 'yaml'
 
-// import glob from 'glob'
-// import path from 'path'
-// import fs from 'fs/promises'
-// import clui from 'clui'
+import fs from 'fs/promises'
+import clui from 'clui'
 
-// import { path as translationPath } from '../config'
+import { asyncGlob } from '../lib'
 
-// const parallel = (process.env.PARALLEL != null) || false
-// const { Spinner } = clui
+import { paths } from '../config'
 
-// const doWork = async (match: string): Promise<void> => {
-//   try {
-//     const data = parseDocument(await fs.readFile(match, { encoding: 'utf8' }))
-//     const formatted = data.toString({
-//       blockQuote: 'literal',
-//       defaultStringType: 'BLOCK_FOLDED'
-//     })
-//     await fs.writeFile(match, formatted, 'utf8')
-//   } catch (error) {
-//     console.error(error)
-//   }
-// }
+const parallel = (process.env.PARALLEL != null) || false
+const { Spinner } = clui
+
+const doWork = async (match: string): Promise<void> => {
+  try {
+    const data = parseDocument(await fs.readFile(match, { encoding: 'utf8' }))
+    const formatted = data.toString({
+      blockQuote: 'literal',
+      defaultStringType: 'BLOCK_FOLDED'
+    })
+    await fs.writeFile(match, formatted, 'utf8')
+  } catch (error) {
+    console.error(error)
+  }
+}
+
+void (async () => {
+  for (const translationPath of paths) {
+    if (translationPath == null) continue
+    const matches = await asyncGlob(translationPath.path)
+    const work = new Spinner('formatting locales...')
+    work.start()
+    if (parallel) {
+      await Promise.all(matches.map(async (match) => {
+        const work = new Spinner(`formatting locale: ${match}`)
+        work.start()
+        await doWork(match)
+        work.stop()
+      }))
+    } else {
+      for (const match of matches) {
+        work.message(`formatting locale: ${match}`)
+        await doWork(match)
+      }
+    }
+    work.stop()
+    console.log('formatting locales...  done')
+  }
+})()
 
 // glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
 //   if (err != null) throw err
diff --git a/utils/i18n/lib.ts b/utils/i18n/lib.ts
new file mode 100644
index 00000000..0d5e1c2c
--- /dev/null
+++ b/utils/i18n/lib.ts
@@ -0,0 +1,7 @@
+import glob from 'glob'
+export const asyncGlob = async (path: string): Promise<string[]> => await new Promise((resolve, reject) => {
+  glob(path, (err, matches) => {
+    if (err != null) reject(err)
+    else resolve(matches)
+  })
+})
diff --git a/utils/i18n/reader.ts b/utils/i18n/reader.ts
index 0aae9cae..ee679461 100644
--- a/utils/i18n/reader.ts
+++ b/utils/i18n/reader.ts
@@ -1,8 +1,8 @@
-import glob from 'glob'
 import path from 'path'
 import fs from 'fs'
 import yaml from 'js-yaml'
 import { mergeWith } from 'lodash'
+import { asyncGlob } from './lib'
 
 import { paths as translationPaths, contextFromFileName, createConfilitKeyHandler, FileContext } from './config'
 
@@ -103,13 +103,6 @@ const createReducer = ({ translationPath, merging }: {translationPath: string, m
   }
 }
 
-const asyncGlob = async (path: string): Promise<string[]> => await new Promise((resolve, reject) => {
-  glob(path, (err, matches) => {
-    if (err != null) reject(err)
-    else resolve(matches)
-  })
-})
-
 export const readLocales = async (): Promise<LocaleRoot> => {
   let locales = {}
   for (const [index, conf] of translationPaths.entries()) {

From 6f3a24465f13eb49162fefddd3b474caab6ebfb7 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 12 Aug 2022 15:35:34 +0000
Subject: [PATCH 213/278] update

---
 utils/i18n/built-writer.ts         |  2 +-
 utils/i18n/commands/format-yaml.ts | 21 ---------------------
 utils/i18n/config.ts               |  2 --
 3 files changed, 1 insertion(+), 24 deletions(-)

diff --git a/utils/i18n/built-writer.ts b/utils/i18n/built-writer.ts
index d4e29660..e54c62f1 100644
--- a/utils/i18n/built-writer.ts
+++ b/utils/i18n/built-writer.ts
@@ -39,7 +39,7 @@ export function generateFileName (context: FileContext): string {
 }
 
 export async function writeToDisk (locales: LocaleRoot): Promise<unknown> {
-  const works = []
+  const works: Array<Promise<void>> = []
   for (const locale in locales) {
     const namespaces = locales[locale]
     for (const namespace in namespaces) {
diff --git a/utils/i18n/commands/format-yaml.ts b/utils/i18n/commands/format-yaml.ts
index 53262463..d820985c 100644
--- a/utils/i18n/commands/format-yaml.ts
+++ b/utils/i18n/commands/format-yaml.ts
@@ -46,24 +46,3 @@ void (async () => {
     console.log('formatting locales...  done')
   }
 })()
-
-// glob(path.join(translationPath, '**/*.yml'), async (err, matches) => {
-//   if (err != null) throw err
-//   const work = new Spinner('formatting locales...')
-//   work.start()
-//   if (parallel) {
-//     await Promise.all(matches.map(async (match) => {
-//       const work = new Spinner(`formatting locale: ${match}`)
-//       work.start()
-//       await doWork(match)
-//       work.stop()
-//     }))
-//   } else {
-//     for (const match of matches) {
-//       work.message(`formatting locale: ${match}`)
-//       await doWork(match)
-//     }
-//   }
-//   work.stop()
-//   console.log('formatting locales...  done')
-// })
diff --git a/utils/i18n/config.ts b/utils/i18n/config.ts
index 48f33824..bbc61535 100644
--- a/utils/i18n/config.ts
+++ b/utils/i18n/config.ts
@@ -1,7 +1,6 @@
 /* eslint-disable @typescript-eslint/naming-convention */
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
 import { join } from 'path'
-// import { fileURLToPath } from 'url'
 import { merge } from 'lodash'
 
 import { using } from '../../config'
@@ -82,7 +81,6 @@ export interface FileContext {
 
 export const createConfilitKeyHandler = (mergeMode: boolean) => function onConflictingKey (oldVal: any, newVal: any, key: string) {
   if (typeof newVal[key] !== 'object' && typeof oldVal[key] !== 'object') {
-    console.log(typeof newVal[key], oldVal[key], newVal[key])
     return {
       ...oldVal,
       ...newVal

From 81a4cec34dcdda55cdc198dd2ad2c81e6e846e54 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 12 Aug 2022 15:36:52 +0000
Subject: [PATCH 214/278] last error

---
 utils/i18n/config.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/utils/i18n/config.ts b/utils/i18n/config.ts
index bbc61535..526449a6 100644
--- a/utils/i18n/config.ts
+++ b/utils/i18n/config.ts
@@ -3,7 +3,7 @@
 import { join } from 'path'
 import { merge } from 'lodash'
 
-import { using } from '../../config'
+import { using } from '../../config.js'
 
 export const compiledFileNameSchema = ['namespace', 'locale', 'extension'] as Array<'namespace' | 'locale' | 'extension'>
 export const compiledFileSchema = ['locale', 'entries']

From b60be198b25fa63d2fcf7c814f78cc7fb45859c7 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 12 Aug 2022 20:11:11 +0000
Subject: [PATCH 215/278] should work but untested

---
 blueprints/admin.py                           |  16 +-
 static/js/pages/admin/users/upload-scores.js  | 176 +++++++++++
 .../{users_edit.html => users/edit.html}      |  19 +-
 .../admin/{users.html => users/index.html}    |   2 +-
 templates/admin/users/upload-scores.html      | 292 ++++++++++++++++++
 5 files changed, 493 insertions(+), 12 deletions(-)
 create mode 100644 static/js/pages/admin/users/upload-scores.js
 rename templates/admin/{users_edit.html => users/edit.html} (76%)
 rename templates/admin/{users.html => users/index.html} (99%)
 create mode 100644 templates/admin/users/upload-scores.html

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 58bfbf8b..72fb997b 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -79,21 +79,27 @@ async def restrictions():
 @priv_check(priv=Privileges.Staff)
 async def users():
     query_data = await varka.get_users()
-    return await render_template('/admin/users.html', query_data=query_data)
+    return await render_template('/admin/users/index.html', query_data=query_data)
 
 @admin.route('/users/search/<q>', methods=['GET'])
 @priv_check(priv=Privileges.Staff)
 async def users_search(q: str):
     query_data = await varka.get_users(search=q)
-    return await render_template('/admin/users.html', query_data=query_data, search_value=q)
+    return await render_template('/admin/users/index.html', query_data=query_data, search_value=q)
 
-@admin.route('/users/edit/<id>')
+@admin.route('/user/<id>/edit')
 @priv_check(priv=Privileges.Staff)
 async def users_edit(id:int):
     query = await varka.get_user(id)
-    return await render_template('admin/users_edit.html', search_data=query)
+    return await render_template('admin/users/edit.html', search_data=query)
 
-@admin.route('/users/update/<id>', methods=['POST']) # POST
+@admin.route('/user/<id>/upload-scores')
+@priv_check(priv=Privileges.Staff)
+async def users_upload_score(id:int):
+    query = await varka.get_user(id)
+    return await render_template('admin/users/upload-scores.html', search_data=query)
+
+@admin.route('/user/<id>/update', methods=['POST']) # POST
 @priv_check(priv=Privileges.Staff)
 async def users_update(id:int):
     try:
diff --git a/static/js/pages/admin/users/upload-scores.js b/static/js/pages/admin/users/upload-scores.js
new file mode 100644
index 00000000..bd2e766b
--- /dev/null
+++ b/static/js/pages/admin/users/upload-scores.js
@@ -0,0 +1,176 @@
+/* eslint-disable no-unused-vars */
+
+function createState (initial) {
+  const isProxy = Symbol('isProxy')
+  const hooks = []
+  const recursiveReactive = {
+    get (target, key) {
+      if (key === isProxy) { return true }
+      return target[key]
+    },
+    set (target, key, value, proxy) {
+      if (
+        value instanceof File ||
+        value instanceof Blob
+      ) {
+        target[key] = value
+      } else if (typeof value === 'object') {
+        target[key] = new Proxy(value, recursiveReactive)
+      } else if (Array.isArray(value)) {
+        target[key] = new Proxy(value, recursiveReactive)
+      } else target[key] = value
+    }
+  }
+  const state = new Proxy(initial, recursiveReactive)
+  const reactive = new Proxy(state, {
+    get (target, key) {
+      const returnValue = target[key]
+      // if (returnValue && returnValue[isProxy]) {
+      //   setTimeout(updateState, 0)
+      // }
+      return returnValue
+    },
+    set (target, key, value) {
+      target[key] = value
+      updateState()
+    }
+  })
+  function useHook (cb) {
+    hooks.push(cb)
+  }
+  async function updateState () {
+    console.log('update state:', state)
+    for (const hook of hooks) {
+      await hook(reactive)
+    }
+  }
+  function transaction (cb, immediate = true) {
+    cb(state)
+    if (immediate) updateState()
+    else return () => updateState()
+  }
+
+  return {
+    useHook,
+    forceUpdate: updateState,
+    state,
+    reactive,
+    transaction
+  }
+}
+
+const { state, reactive: s, useHook, forceUpdate, transaction } = createState({
+  parseSucceed: false,
+  parsed: {},
+  replayFile: undefined,
+  submitting: {}
+})
+
+useHook((state) => {
+  const classes = document.getElementById('copy-to-form').classList
+  if (state.parseSucceed) {
+    classes.remove('is-hidden')
+  } else {
+    classes.add('is-hidden')
+  }
+  if (!state.replayFile) {
+    const form = document.getElementById('osr-reader')
+    form.replay_file.value = undefined
+  }
+})
+
+useHook((state) => {
+  const display = document.getElementById('replay-data')
+  const dReplayMd5 = document.getElementById('display-map_md5')
+  const dReplayScore = document.getElementById('display-score')
+  if (
+    dReplayMd5?.value == state.parsed.map_md5 &&
+    dReplayScore?.value == state.parsed.score
+  ) return
+  console.log('re-render osr-reader result')
+  const template = document.getElementById('record')
+  const elements = Object.entries(state.parsed).map(([key, value]) => {
+    const copy = template.content.cloneNode(true)
+    const _key = copy.querySelector('#key')
+    _key.innerText = key
+    const _value = copy.querySelector('#value')
+    _value.value = value
+    _value.id = `display-${key}`
+
+    if (typeof value === 'string') {
+      _value.type = 'text'
+    } else if (typeof value === 'number') {
+      _value.type = 'number'
+    } else if (typeof value === 'boolean') {
+      _value.type = 'checkbox'
+      _value.classList.remove('input')
+      _value.classList.add('checkbox')
+    }
+
+    return copy
+  })
+  display.replaceChildren(...elements)
+})
+
+useHook(state => {
+  const form = document.getElementById('submit-replay')
+  // if (form.replay_id.value == state.submitting.replay_id) return
+  console.log('re-populate submitting values')
+  Object.entries(state.submitting).forEach(([key, value]) => {
+    if (!form[key]) return
+    form[key].value = value
+  })
+})
+
+async function uploadOsr () {
+  const update = transaction((s) => {
+    s.parseSucceed = false
+    s.parsed = {}
+    s.replayFile = undefined
+  }, false)
+
+  const form = document.getElementById('osr-reader')
+  const formData = new FormData(form)
+  const replay = formData.get('replay_file')
+  if (replay.size > 0 && replay.name.endsWith('.osr')) {
+    const { replay: data, status } = await fetch('/admin/replays/parse', {
+      method: 'post',
+      body: formData
+    }).then(res => res.json())
+    if (status === 200) {
+      transaction((s) => {
+        s.parseSucceed = true
+        s.parsed = data
+        s.replayFile = replay
+      })
+    }
+  } else {
+    update()
+  }
+}
+function copyReplayToForm () {
+  transaction(s => {
+    s.submitting = {
+      ...s.parsed
+    }
+  })
+}
+
+async function submitReplay () {
+  const form = document.getElementById('submit-replay')
+  const formData = new FormData(form)
+  const replayFile = state.replayFile
+  formData.append('replay_file', replayFile)
+  const userId = formData.get('userid')
+
+  if (!userId) return
+  // console.log([...formData.entries()])
+  const endpoint = `//api.${window.domain}/submit_score`
+  await fetch(endpoint, {
+    method: 'post',
+    body: formData
+    // headers: {
+    //   Authorization:
+    // }
+  }).then(res => res.json())
+}
diff --git a/templates/admin/users_edit.html b/templates/admin/users/edit.html
similarity index 76%
rename from templates/admin/users_edit.html
rename to templates/admin/users/edit.html
index 0ea55e24..26ec06c5 100644
--- a/templates/admin/users_edit.html
+++ b/templates/admin/users/edit.html
@@ -18,9 +18,9 @@
 {% block title %} Users {% endblock %} 
 
 {% block content %} 
-<form action="/admin/users/update/{{ search_data['id'] }}" method="POST" id="edit-user">
-    <div style="display: flex; align-items: center; flex-direction: column;">
-        <article style="width: 40%;" class="panel is-primary">
+<form action="/admin/user/{{ search_data['id'] }}/update" method="POST" id="edit-user">
+    <div class="is-flex is-align-items-center is-flex-direction-column">
+        <article style="min-width: fit-content; width: 40vw;" class="panel is-primary">
             <p class="panel-heading">
             {{t("admin.users.edit-info-of")}} {{ search_data['name'] }}
             </p>
@@ -47,8 +47,13 @@
                     <i class="fas fa-globe-americas" aria-hidden="true"></i>
                     {{t("admin.users.country")}}
                 </div>
-                <div class="column">
-                    <input name="edit-country" type="text" class="input" value="{{ search_data.country }}">
+                <div class="column is-flex gap-2 is-align-items-center">
+                    <img id="country-preview" src="/static/images/flags/JP.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">
+                    <input name="edit-country" type="text" class="input" value="{{ search_data.country }}" oninput="
+                        if (this.value.length === 2) {
+                            document.getElementById('country-preview').src = '/static/images/flags/' + this.value.toUpperCase() + '.png'
+                        }
+                    ">
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">
@@ -80,7 +85,9 @@
                 </div>
             </div>
             <div class="panel-block pb-4">
-                <button type="submit" form="edit-user" style="margin-left: auto; margin-right: 1em; width: 100px;" class="button is-primary">{{t("admin.users.update")}}</button>
+                <a href="./upload-scores" style="margin-right: 1em;" class="button is-info">{{t("admin.users.upload-new-score")}}</a>
+                <div style="margin-left: auto;"></div>
+                <button type="submit" form="edit-user" style="margin-right: 1em; width: 100px;" class="button is-primary">{{t("admin.users.update")}}</button>
             </div>
         </article>
     </div>
diff --git a/templates/admin/users.html b/templates/admin/users/index.html
similarity index 99%
rename from templates/admin/users.html
rename to templates/admin/users/index.html
index ad0f2e53..210da02f 100644
--- a/templates/admin/users.html
+++ b/templates/admin/users/index.html
@@ -96,7 +96,7 @@ <h2 class="section-title">{{ t("admin.base.users") }}</h2>
                         {% endif %}
                     </td>
                     <td class="has-text-centered">
-                        <a class="btn text-nowrap" href="/admin/users/edit/{{ i.id }}">
+                        <a class="btn text-nowrap" href="/admin/user/{{ i.id }}/edit">
                             <i class="far fa-edit" aria-hidden="true"></i> {{t("admin.users.edit")}}
                         </a>
                     </td>
diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
new file mode 100644
index 00000000..06bd7894
--- /dev/null
+++ b/templates/admin/users/upload-scores.html
@@ -0,0 +1,292 @@
+{% extends 'admin/base.html' %}
+{% block header %}
+<style>
+    .text-nowrap {
+        white-space: nowrap;
+    }
+
+    .w-100 {
+        width: 100%;
+    }
+
+    .ml-auto {
+        margin-left: auto;
+    }
+
+    .gap-2 {
+        gap: 0.5em;
+    }
+
+    .is-right {
+        text-align: right;
+    }
+</style>
+<script src="/static/js/pages/admin/users/upload-scores.js" crossorigin="anonymous"></script>
+{% endblock %}
+{% block title %} Users {% endblock %}
+
+{% block content %}
+<template id="record">
+    <div class="panel-block columns" style="height: 50px;">
+        <div id="key" class="column is-one-quarter text-nowrap is-right"></div>
+        <div class="column">
+            <input id="value" class="input" disabled>
+        </div>
+    </div>
+</template>
+<template id="record-selectable">
+    <div class="panel-block columns" style="height: 50px;">
+        <div class="column is-one-quarter text-nowrap is-right"></div>
+        <div class="column">
+            <div class="select w-100">
+                <select name="legality" class="w-100">
+                </select>
+            </div>
+        </div>
+    </div>
+</template>
+<div class="is-flex is-align-items-center is-flex-direction-column">
+    <article style="min-width: fit-content; width: 60vw;" class="panel is-primary">
+        <form id="osr-reader" onsubmit="event.preventDefault(); uploadOsr()">
+            <p class="panel-heading">
+                {{t("osr-reader.name")}}
+            </p>
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+                    <i class="fas fa-id-card" aria-hidden="true"></i>
+                    {{t("osr-reader.file")}}
+                </div>
+                <div class="column">
+                    <div class="file">
+                        <label class="file-label">
+                            <input class="file-input" type="file" name="replay_file">
+                            <span class="file-cta">
+                                <span class="file-icon">
+                                    <i class="fas fa-upload"></i>
+                                </span>
+                                <span class="file-label">
+                                    {{t("osr-reader.upload-osr")}}
+                                </span>
+                            </span>
+                        </label>
+                    </div>
+                </div>
+            </div>
+
+            <div class="panel-block pb-4">
+                <div style="margin-left: auto;"></div>
+                <button type="submit" class="button is-primary">{{t("osr-reader.read")}}</button>
+                <div style="margin-right: 1em;"></div>
+            </div>
+        </form>
+
+        <div id="copy-to-form" class="is-hidden">
+            <hr>
+            <div id="replay-data"></div>
+            <hr class="mb-2">
+            <div class="panel-block">
+                <div style="margin-left: auto;"></div>
+                <button class="button is-primary"
+                    onclick="copyReplayToForm()">{{t("admin.upload-replay.replay-copy-to-form")}}</button>
+                <div style="margin-right: 1em;"></div>
+            </div>
+        </div>
+    </article>
+</div>
+<!-- action="/admin/user/{{ search_data['id'] }}/upload-score" method="POST" -->
+<div class="is-flex is-align-items-center is-flex-direction-column pt-4">
+    <form id="submit-replay" onsubmit="event.preventDefault(); submitReplay()">
+        <article style="min-width: fit-content; width: 60vw;" class="panel is-primary">
+            <p class="panel-heading">
+                {{t("admin.upload-replay.upload-score-for", name = search_data['name'])}}
+            </p>
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+                    <i class="fas fa-id-card" aria-hidden="true"></i>
+                    {{t("admin.users.id")}}
+                </div>
+                <div class="column">
+                    <input name="userid" type="text" class="input" value="{{ search_data.id }}">
+                </div>
+            </div>
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+                    <i class="fab fa-octopus-deploy"></i>
+                    {{t("grade.grade")}}
+                </div>
+                <div class="column">
+                    <div class="select w-100">
+                        <select name="grade" class="w-100">
+                            <option value="N">{{t("grade.N")}}</option>
+                            <option value="F">{{t("grade.F")}}</option>
+                            <option value="D">{{t("grade.D")}}</option>
+                            <option value="C">{{t("grade.C")}}</option>
+                            <option value="B">{{t("grade.B")}}</option>
+                            <option value="A">{{t("grade.A")}}</option>
+                            <option value="S">{{t("grade.S")}}</option>
+                            <option value="SH">{{t("grade.SH")}}</option>
+                            <option value="X">{{t("grade.X")}}</option>
+                            <option value="XH">{{t("grade.XH")}}</option>
+                        </select>
+                    </div>
+                </div>
+            </div>
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+                    <i class="fa-solid fa-server"></i>
+                    {{t("servers.server")}}
+                </div>
+                <div class="column">
+                    <div class="select w-100">
+                        <select name="server" class="w-100">
+                            <option value="bancho">{{t("servers.bancho")}}</option>
+                            <option value="ppysb">{{t("servers.ppy-sb")}}</option>
+                            <option value="akatsuki">{{t("servers.akatsuki")}}</option>
+                            <option value="offline">{{t("servers.offline")}}</option>
+                        </select>
+                    </div>
+                </div>
+            </div>
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+                    <i class="fas fa-user-check"></i>
+                    {{t("admin.upload-replay.identifier-type")}}
+                </div>
+                <div class="column">
+                    <div class="select w-100">
+                        <select name="identifier_type" class="w-100">
+                            <option value="replay_username">
+                                {{t("admin.upload-replay.identifier-types.replay_username")}}</option>
+                            <option value="server_userid">{{t("admin.upload-replay.identifier-types.server_userid")}}
+                            </option>
+                            <option value="replay_id">{{t("admin.upload-replay.identifier-types.replay_id")}}</option>
+                        </select>
+                    </div>
+                </div>
+            </div>
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">
+                    <i class="fas fa-address-card"></i>
+                    {{t("admin.outer-identifier")}}
+                </div>
+                <div class="column">
+                    <input type="text" class="input" name="outer_identifier">
+                </div>
+            </div>
+            <hr>
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">map_md5</div>
+                <div class="column">
+                    <input type="text" class="input" name="map_md5">
+                </div>
+            </div>
+
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">max_combo</div>
+                <div class="column">
+                    <input type="number" class="input" name="max_combo">
+                </div>
+            </div>
+
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">mode</div>
+                <div class="column">
+                    <input type="number" class="input" name="mode">
+                </div>
+            </div>
+
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">mods</div>
+                <div class="column">
+                    <input type="number" class="input" name="mods">
+                </div>
+            </div>
+
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">n100</div>
+                <div class="column">
+                    <input type="number" class="input" name="n100">
+                </div>
+            </div>
+
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">n300</div>
+                <div class="column">
+                    <input type="number" class="input" name="n300">
+                </div>
+            </div>
+
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">n50</div>
+                <div class="column">
+                    <input type="number" class="input" name="n50">
+                </div>
+            </div>
+
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">ngeki</div>
+                <div class="column">
+                    <input type="number" class="input" name="ngeki">
+                </div>
+            </div>
+
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">nkatu</div>
+                <div class="column">
+                    <input type="number" class="input" name="nkatu">
+                </div>
+            </div>
+
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">nmiss</div>
+                <div class="column">
+                    <input type="number" class="input" name="nmiss">
+                </div>
+            </div>
+
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">perfect</div>
+                <div class="column">
+                    <input type="checkbox" class="checkbox" name="perfect">
+                </div>
+            </div>
+
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">playtime</div>
+                <div class="column">
+                    <input type="number" class="input" name="playtime">
+                </div>
+            </div>
+
+            <!-- <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">replay_id</div>
+                <div class="column">
+                    <input type="number" class="input" name="replay_id">
+                </div>
+            </div> -->
+
+            <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">score</div>
+                <div class="column">
+                    <input type="number" class="input" name="score">
+                </div>
+            </div>
+
+            <!-- <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-right">username</div>
+                <div class="column">
+                    <input type="text" class="input" name="username">
+                </div>
+            </div> -->
+            <hr>
+            <div class="panel-block pb-4">
+                <div style="margin-left: auto;"></div>
+                <button type="submit" form="submit-replay"
+                    class="button is-primary">{{t("admin.upload-replay.upload")}}</button>
+                <div style="margin-right: 1em;"></div>
+            </div>
+        </article>
+    </form>
+</div>
+
+{% endblock content %}
\ No newline at end of file

From bc22f6540c4ae1b862235a10c7db89422d3f2e2b Mon Sep 17 00:00:00 2001
From: TrueRou <chenbohan911@163.com>
Date: Sat, 13 Aug 2022 02:03:07 +0000
Subject: [PATCH 216/278] authorite with api_key

---
 static/js/pages/admin/users/upload-scores.js | 8 ++++----
 templates/admin/users/upload-scores.html     | 3 +++
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/static/js/pages/admin/users/upload-scores.js b/static/js/pages/admin/users/upload-scores.js
index bd2e766b..3891e01d 100644
--- a/static/js/pages/admin/users/upload-scores.js
+++ b/static/js/pages/admin/users/upload-scores.js
@@ -168,9 +168,9 @@ async function submitReplay () {
   const endpoint = `//api.${window.domain}/submit_score`
   await fetch(endpoint, {
     method: 'post',
-    body: formData
-    // headers: {
-    //   Authorization:
-    // }
+    body: formData,
+    headers: {
+      Authorization: api_key
+    }
   }).then(res => res.json())
 }
diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index 06bd7894..c124cb20 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -22,6 +22,9 @@
     }
 </style>
 <script src="/static/js/pages/admin/users/upload-scores.js" crossorigin="anonymous"></script>
+<script>
+    api_key = "{{ session['user_data']['api_key'] }}"
+</script>
 {% endblock %}
 {% block title %} Users {% endblock %}
 

From 73a6fb5750815684c0f8a83f5d4046986841ce9e Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 13 Aug 2022 05:49:38 +0000
Subject: [PATCH 217/278] update

---
 static/js/pages/admin/users/upload-scores.js | 120 ++++++++-----
 templates/admin/users/upload-scores.html     | 179 ++++++++++---------
 2 files changed, 170 insertions(+), 129 deletions(-)

diff --git a/static/js/pages/admin/users/upload-scores.js b/static/js/pages/admin/users/upload-scores.js
index 3891e01d..45e78fce 100644
--- a/static/js/pages/admin/users/upload-scores.js
+++ b/static/js/pages/admin/users/upload-scores.js
@@ -62,61 +62,85 @@ function createState (initial) {
 const { state, reactive: s, useHook, forceUpdate, transaction } = createState({
   parseSucceed: false,
   parsed: {},
-  replayFile: undefined,
-  submitting: {}
+  replayFile: undefined
 })
 
 useHook((state) => {
-  const classes = document.getElementById('copy-to-form').classList
+  // const result = document.getElementById('osr-result')
+  const file = document.getElementById('form-replay-file-label')
   if (state.parseSucceed) {
-    classes.remove('is-hidden')
+    // result.classList.remove('is-hidden')
+    file.classList.add('is-success')
   } else {
-    classes.add('is-hidden')
+    // result.classList.add('is-hidden')
+    file.classList.add('is-danger')
   }
   if (!state.replayFile) {
     const form = document.getElementById('osr-reader')
-    form.replay_file.value = undefined
+    delete form.replay_file.value
   }
 })
 
-useHook((state) => {
-  const display = document.getElementById('replay-data')
-  const dReplayMd5 = document.getElementById('display-map_md5')
-  const dReplayScore = document.getElementById('display-score')
-  if (
-    dReplayMd5?.value == state.parsed.map_md5 &&
-    dReplayScore?.value == state.parsed.score
-  ) return
-  console.log('re-render osr-reader result')
-  const template = document.getElementById('record')
-  const elements = Object.entries(state.parsed).map(([key, value]) => {
-    const copy = template.content.cloneNode(true)
-    const _key = copy.querySelector('#key')
-    _key.innerText = key
-    const _value = copy.querySelector('#value')
-    _value.value = value
-    _value.id = `display-${key}`
-
-    if (typeof value === 'string') {
-      _value.type = 'text'
-    } else if (typeof value === 'number') {
-      _value.type = 'number'
-    } else if (typeof value === 'boolean') {
-      _value.type = 'checkbox'
-      _value.classList.remove('input')
-      _value.classList.add('checkbox')
-    }
-
-    return copy
-  })
+useHook(state => {
+  const display = document.getElementById('replay-result')
+  const template = document.getElementById('template-replay-row')
+  const elements = Object.entries(state.parsed)
+    .filter(([key, value]) =>
+      ['username', 'replay_id'].includes(key) &&
+      value
+    )
+    .map(([key, value]) => {
+      const copy = template.content.cloneNode(true)
+      const _key = copy.querySelector('#key')
+      _key.innerText = key
+      const _value = copy.querySelector('#value')
+      _value.innerText = value
+      _value.id = `display-${key}`
+      return copy
+    })
   display.replaceChildren(...elements)
 })
 
+// useHook((state) => {
+//   const display = document.getElementById('replay-data')
+//   const dReplayMd5 = document.getElementById('display-map_md5')
+//   const dReplayScore = document.getElementById('display-score')
+//   if (
+//     dReplayMd5?.value == state.parsed.map_md5 &&
+//     dReplayScore?.value == state.parsed.score
+//   ) return
+//   console.log('re-render osr-reader result')
+//   const template = document.getElementById('record')
+//   const elements = Object.entries(state.parsed)
+//     .filter(([key]) => ['username', 'replay_id'].includes(key))
+//     .map(([key, value]) => {
+//       const copy = template.content.cloneNode(true)
+//       const _key = copy.querySelector('#key')
+//       _key.innerText = key
+//       const _value = copy.querySelector('#value')
+//       _value.value = value
+//       _value.id = `display-${key}`
+
+//       if (typeof value === 'string') {
+//         _value.type = 'text'
+//       } else if (typeof value === 'number') {
+//         _value.type = 'number'
+//       } else if (typeof value === 'boolean') {
+//         _value.type = 'checkbox'
+//         _value.classList.remove('input')
+//         _value.classList.add('checkbox')
+//       }
+
+//       return copy
+//     })
+//   display.replaceChildren(...elements)
+// })
+
 useHook(state => {
   const form = document.getElementById('submit-replay')
-  // if (form.replay_id.value == state.submitting.replay_id) return
+  // if (form.replay_id.value == state.parsed.replay_id) return
   console.log('re-populate submitting values')
-  Object.entries(state.submitting).forEach(([key, value]) => {
+  Object.entries(state.parsed).forEach(([key, value]) => {
     if (!form[key]) return
     form[key].value = value
   })
@@ -148,13 +172,13 @@ async function uploadOsr () {
     update()
   }
 }
-function copyReplayToForm () {
-  transaction(s => {
-    s.submitting = {
-      ...s.parsed
-    }
-  })
-}
+// function copyReplayToForm () {
+//   transaction(s => {
+//     s.parsed = {
+//       ...s.parsed
+//     }
+//   })
+// }
 
 async function submitReplay () {
   const form = document.getElementById('submit-replay')
@@ -164,13 +188,17 @@ async function submitReplay () {
   const userId = formData.get('userid')
 
   if (!userId) return
+  if (!s.parseSucceed) {
+    window.alert('osr parse failed.')
+    return
+  }
   // console.log([...formData.entries()])
   const endpoint = `//api.${window.domain}/submit_score`
   await fetch(endpoint, {
     method: 'post',
     body: formData,
     headers: {
-      Authorization: api_key
+      Authorization: s.api_key
     }
   }).then(res => res.json())
 }
diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index c124cb20..496169e2 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -21,48 +21,38 @@
         text-align: right;
     }
 </style>
-<script src="/static/js/pages/admin/users/upload-scores.js" crossorigin="anonymous"></script>
+<script src="/static/js/pages/admin/users/upload-scores.js"></script>
 <script>
-    api_key = "{{ session['user_data']['api_key'] }}"
+    transaction(state => {
+        state.apiKey = "{{ session['user_data']['api_key'] }}"
+    }, false)
 </script>
 {% endblock %}
 {% block title %} Users {% endblock %}
 
 {% block content %}
-<template id="record">
-    <div class="panel-block columns" style="height: 50px;">
-        <div id="key" class="column is-one-quarter text-nowrap is-right"></div>
-        <div class="column">
-            <input id="value" class="input" disabled>
-        </div>
+<template id="template-replay-row">
+    <div class="tags has-addons m-0">
+      <span class="tag mb-0" id="key"></span>
+      <span class="tag mb-0 is-primary" id="value"></span>
     </div>
 </template>
-<template id="record-selectable">
-    <div class="panel-block columns" style="height: 50px;">
-        <div class="column is-one-quarter text-nowrap is-right"></div>
-        <div class="column">
-            <div class="select w-100">
-                <select name="legality" class="w-100">
-                </select>
-            </div>
-        </div>
-    </div>
-</template>
-<div class="is-flex is-align-items-center is-flex-direction-column">
+<!-- action="/admin/user/{{ search_data['id'] }}/upload-score" method="POST" -->
+<div class="is-flex is-align-items-center is-flex-direction-column pt-4">
     <article style="min-width: fit-content; width: 60vw;" class="panel is-primary">
-        <form id="osr-reader" onsubmit="event.preventDefault(); uploadOsr()">
-            <p class="panel-heading">
-                {{t("osr-reader.name")}}
-            </p>
+        <p class="panel-heading">
+            {{t("admin.upload-replay.upload-score-for", name = search_data['name'])}}
+        </p>
+        <form id="osr-reader" onsubmit="event.preventDefault()">
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-id-card" aria-hidden="true"></i>
                     {{t("osr-reader.file")}}
                 </div>
-                <div class="column">
-                    <div class="file">
+                <div class="column is-flex is-align-items-center gap-2">
+                    <div class="file" id="form-replay-file-label">
                         <label class="file-label">
-                            <input class="file-input" type="file" name="replay_file">
+                            <input class="file-input" type="file" name="replay_file" onchange="uploadOsr()">
                             <span class="file-cta">
                                 <span class="file-icon">
                                     <i class="fas fa-upload"></i>
@@ -73,63 +63,43 @@
                             </span>
                         </label>
                     </div>
+                    <div id="replay-result" class="is-flex is-align-items-center gap-2"></div>
                 </div>
             </div>
-
-            <div class="panel-block pb-4">
-                <div style="margin-left: auto;"></div>
-                <button type="submit" class="button is-primary">{{t("osr-reader.read")}}</button>
-                <div style="margin-right: 1em;"></div>
-            </div>
         </form>
 
-        <div id="copy-to-form" class="is-hidden">
-            <hr>
+        <!-- <div id="osr-result" class="is-hidden">
             <div id="replay-data"></div>
-            <hr class="mb-2">
-            <div class="panel-block">
-                <div style="margin-left: auto;"></div>
-                <button class="button is-primary"
-                    onclick="copyReplayToForm()">{{t("admin.upload-replay.replay-copy-to-form")}}</button>
-                <div style="margin-right: 1em;"></div>
-            </div>
-        </div>
-    </article>
-</div>
-<!-- action="/admin/user/{{ search_data['id'] }}/upload-score" method="POST" -->
-<div class="is-flex is-align-items-center is-flex-direction-column pt-4">
-    <form id="submit-replay" onsubmit="event.preventDefault(); submitReplay()">
-        <article style="min-width: fit-content; width: 60vw;" class="panel is-primary">
-            <p class="panel-heading">
-                {{t("admin.upload-replay.upload-score-for", name = search_data['name'])}}
-            </p>
+        </div> -->
+        <hr>
+        <form id="submit-replay" onsubmit="event.preventDefault(); submitReplay()">
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-id-card" aria-hidden="true"></i>
                     {{t("admin.users.id")}}
                 </div>
                 <div class="column">
-                    <input name="userid" type="text" class="input" value="{{ search_data.id }}">
+                    <input name="userid" type="text" class="input" value="{{ search_data.id }}" required>
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fab fa-octopus-deploy"></i>
-                    {{t("grade.grade")}}
+                    {{t("grades.grade")}}
                 </div>
                 <div class="column">
                     <div class="select w-100">
-                        <select name="grade" class="w-100">
-                            <option value="N">{{t("grade.N")}}</option>
-                            <option value="F">{{t("grade.F")}}</option>
-                            <option value="D">{{t("grade.D")}}</option>
-                            <option value="C">{{t("grade.C")}}</option>
-                            <option value="B">{{t("grade.B")}}</option>
-                            <option value="A">{{t("grade.A")}}</option>
-                            <option value="S">{{t("grade.S")}}</option>
-                            <option value="SH">{{t("grade.SH")}}</option>
-                            <option value="X">{{t("grade.X")}}</option>
-                            <option value="XH">{{t("grade.XH")}}</option>
+                        <select name="grade" class="w-100" required>
+                            <option value="N">{{t("grades.N")}}</option>
+                            <option value="F">{{t("grades.F")}}</option>
+                            <option value="D">{{t("grades.D")}}</option>
+                            <option value="C">{{t("grades.C")}}</option>
+                            <option value="B">{{t("grades.B")}}</option>
+                            <option value="A">{{t("grades.A")}}</option>
+                            <option value="S">{{t("grades.S")}}</option>
+                            <option value="SH">{{t("grades.SH")}}</option>
+                            <option value="X">{{t("grades.X")}}</option>
+                            <option value="XH">{{t("grades.XH")}}</option>
                         </select>
                     </div>
                 </div>
@@ -141,7 +111,7 @@
                 </div>
                 <div class="column">
                     <div class="select w-100">
-                        <select name="server" class="w-100">
+                        <select name="server" class="w-100" required>
                             <option value="bancho">{{t("servers.bancho")}}</option>
                             <option value="ppysb">{{t("servers.ppy-sb")}}</option>
                             <option value="akatsuki">{{t("servers.akatsuki")}}</option>
@@ -151,13 +121,56 @@
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">
+                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+                    <i class="fas fa-user-check"></i>
+                    {{t("admin.upload-replay.identifier-type")}}
+                </div>
+                <div class="column">
+                    <div class="field has-addons w-100 pt-3">
+                        <p class="control w-100">
+                            <span class="select">
+                                <select name="identifier_type" required>
+                                    <option value="replay_username">
+                                        {{t("admin.upload-replay.identifier-types.replay_username")}}</option>
+                                    <option value="server_userid">
+                                        {{t("admin.upload-replay.identifier-types.server_userid")}}
+                                    </option>
+                                    <option value="replay_id">{{t("admin.upload-replay.identifier-types.replay_id")}}
+                                    </option>
+                                </select>
+                            </span>
+                        </p>
+                        <p class="control w-100">
+                            <input class="input" name="outer_identifier" required type="text"
+                                placeholder="{{ t('admin.outer-identifier') }}">
+                        </p>
+                    </div>
+                </div>
+
+                <!-- <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+                    <i class="fas fa-user-check"></i>
+                    {{t("admin.upload-replay.identifier-type")}}
+                </div>
+                <div class="column">
+                    <div class="select w-100">
+                        <select name="identifier_type" class="w-100" required>
+                            <option value="replay_username">
+                                {{t("admin.upload-replay.identifier-types.replay_username")}}</option>
+                            <option value="server_userid">{{t("admin.upload-replay.identifier-types.server_userid")}}
+                            </option>
+                            <option value="replay_id">{{t("admin.upload-replay.identifier-types.replay_id")}}</option>
+                        </select>
+                    </div>
+                </div> -->
+            </div>
+            <!-- <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-user-check"></i>
                     {{t("admin.upload-replay.identifier-type")}}
                 </div>
                 <div class="column">
                     <div class="select w-100">
-                        <select name="identifier_type" class="w-100">
+                        <select name="identifier_type" class="w-100" required>
                             <option value="replay_username">
                                 {{t("admin.upload-replay.identifier-types.replay_username")}}</option>
                             <option value="server_userid">{{t("admin.upload-replay.identifier-types.server_userid")}}
@@ -173,77 +186,77 @@
                     {{t("admin.outer-identifier")}}
                 </div>
                 <div class="column">
-                    <input type="text" class="input" name="outer_identifier">
+                    <input type="text" class="input" name="outer_identifier" required>
                 </div>
-            </div>
+            </div> -->
             <hr>
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-right">map_md5</div>
                 <div class="column">
-                    <input type="text" class="input" name="map_md5">
+                    <input type="text" class="input" name="map_md5" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-right">max_combo</div>
                 <div class="column">
-                    <input type="number" class="input" name="max_combo">
+                    <input type="number" class="input" name="max_combo" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-right">mode</div>
                 <div class="column">
-                    <input type="number" class="input" name="mode">
+                    <input type="number" class="input" name="mode" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-right">mods</div>
                 <div class="column">
-                    <input type="number" class="input" name="mods">
+                    <input type="number" class="input" name="mods" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-right">n100</div>
                 <div class="column">
-                    <input type="number" class="input" name="n100">
+                    <input type="number" class="input" name="n100" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-right">n300</div>
                 <div class="column">
-                    <input type="number" class="input" name="n300">
+                    <input type="number" class="input" name="n300" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-right">n50</div>
                 <div class="column">
-                    <input type="number" class="input" name="n50">
+                    <input type="number" class="input" name="n50" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-right">ngeki</div>
                 <div class="column">
-                    <input type="number" class="input" name="ngeki">
+                    <input type="number" class="input" name="ngeki" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-right">nkatu</div>
                 <div class="column">
-                    <input type="number" class="input" name="nkatu">
+                    <input type="number" class="input" name="nkatu" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-right">nmiss</div>
                 <div class="column">
-                    <input type="number" class="input" name="nmiss">
+                    <input type="number" class="input" name="nmiss" required>
                 </div>
             </div>
 
@@ -257,7 +270,7 @@
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-right">playtime</div>
                 <div class="column">
-                    <input type="number" class="input" name="playtime">
+                    <input type="number" class="input" name="playtime" required>
                 </div>
             </div>
 
@@ -271,7 +284,7 @@
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-right">score</div>
                 <div class="column">
-                    <input type="number" class="input" name="score">
+                    <input type="number" class="input" name="score" required>
                 </div>
             </div>
 
@@ -288,8 +301,8 @@
                     class="button is-primary">{{t("admin.upload-replay.upload")}}</button>
                 <div style="margin-right: 1em;"></div>
             </div>
-        </article>
-    </form>
+        </form>
+    </article>
 </div>
 
 {% endblock content %}
\ No newline at end of file

From 8f96239457e8ecb18516bded2121200648f115b1 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 13 Aug 2022 05:51:04 +0000
Subject: [PATCH 218/278] remove is right

---
 templates/admin/users/upload-scores.html | 32 ++++++++++++------------
 1 file changed, 16 insertions(+), 16 deletions(-)

diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index 496169e2..dc4ffdae 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -181,7 +181,7 @@
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">
+                <div class="column is-one-quarter text-nowrap">
                     <i class="fas fa-address-card"></i>
                     {{t("admin.outer-identifier")}}
                 </div>
@@ -191,105 +191,105 @@
             </div> -->
             <hr>
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">map_md5</div>
+                <div class="column is-one-quarter text-nowrap">map_md5</div>
                 <div class="column">
                     <input type="text" class="input" name="map_md5" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">max_combo</div>
+                <div class="column is-one-quarter text-nowrap">max_combo</div>
                 <div class="column">
                     <input type="number" class="input" name="max_combo" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">mode</div>
+                <div class="column is-one-quarter text-nowrap">mode</div>
                 <div class="column">
                     <input type="number" class="input" name="mode" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">mods</div>
+                <div class="column is-one-quarter text-nowrap">mods</div>
                 <div class="column">
                     <input type="number" class="input" name="mods" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">n100</div>
+                <div class="column is-one-quarter text-nowrap">n100</div>
                 <div class="column">
                     <input type="number" class="input" name="n100" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">n300</div>
+                <div class="column is-one-quarter text-nowrap">n300</div>
                 <div class="column">
                     <input type="number" class="input" name="n300" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">n50</div>
+                <div class="column is-one-quarter text-nowrap">n50</div>
                 <div class="column">
                     <input type="number" class="input" name="n50" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">ngeki</div>
+                <div class="column is-one-quarter text-nowrap">ngeki</div>
                 <div class="column">
                     <input type="number" class="input" name="ngeki" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">nkatu</div>
+                <div class="column is-one-quarter text-nowrap">nkatu</div>
                 <div class="column">
                     <input type="number" class="input" name="nkatu" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">nmiss</div>
+                <div class="column is-one-quarter text-nowrap">nmiss</div>
                 <div class="column">
                     <input type="number" class="input" name="nmiss" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">perfect</div>
+                <div class="column is-one-quarter text-nowrap">perfect</div>
                 <div class="column">
                     <input type="checkbox" class="checkbox" name="perfect">
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">playtime</div>
+                <div class="column is-one-quarter text-nowrap">playtime</div>
                 <div class="column">
                     <input type="number" class="input" name="playtime" required>
                 </div>
             </div>
 
             <!-- <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">replay_id</div>
+                <div class="column is-one-quarter text-nowrap">replay_id</div>
                 <div class="column">
                     <input type="number" class="input" name="replay_id">
                 </div>
             </div> -->
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">score</div>
+                <div class="column is-one-quarter text-nowrap">score</div>
                 <div class="column">
                     <input type="number" class="input" name="score" required>
                 </div>
             </div>
 
             <!-- <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-right">username</div>
+                <div class="column is-one-quarter text-nowrap">username</div>
                 <div class="column">
                     <input type="text" class="input" name="username">
                 </div>

From b8d9f765d615b605291beb91a17f9b22f00e1e0f Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 13 Aug 2022 05:56:50 +0000
Subject: [PATCH 219/278] add translation

---
 templates/admin/users/upload-scores.html | 30 ++++++++++++------------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index dc4ffdae..904df2f8 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -191,105 +191,105 @@
             </div> -->
             <hr>
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">map_md5</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.map_md5") }}</div>
                 <div class="column">
                     <input type="text" class="input" name="map_md5" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">max_combo</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.max_combo") }}</div>
                 <div class="column">
                     <input type="number" class="input" name="max_combo" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">mode</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.mode") }}</div>
                 <div class="column">
                     <input type="number" class="input" name="mode" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">mods</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.mods") }}</div>
                 <div class="column">
                     <input type="number" class="input" name="mods" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">n100</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.n100") }}</div>
                 <div class="column">
                     <input type="number" class="input" name="n100" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">n300</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.n300") }}</div>
                 <div class="column">
                     <input type="number" class="input" name="n300" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">n50</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.n50") }}</div>
                 <div class="column">
                     <input type="number" class="input" name="n50" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">ngeki</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.ngeki") }}</div>
                 <div class="column">
                     <input type="number" class="input" name="ngeki" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">nkatu</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.nkatu") }}</div>
                 <div class="column">
                     <input type="number" class="input" name="nkatu" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">nmiss</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.nmiss") }}</div>
                 <div class="column">
                     <input type="number" class="input" name="nmiss" required>
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">perfect</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.perfect") }}</div>
                 <div class="column">
                     <input type="checkbox" class="checkbox" name="perfect">
                 </div>
             </div>
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">playtime</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.playtime") }}</div>
                 <div class="column">
                     <input type="number" class="input" name="playtime" required>
                 </div>
             </div>
 
             <!-- <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">replay_id</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.replay_id") }}</div>
                 <div class="column">
                     <input type="number" class="input" name="replay_id">
                 </div>
             </div> -->
 
             <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">score</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.score") }}</div>
                 <div class="column">
                     <input type="number" class="input" name="score" required>
                 </div>
             </div>
 
             <!-- <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">username</div>
+                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.username") }}</div>
                 <div class="column">
                     <input type="text" class="input" name="username">
                 </div>

From 006b7b4028579aa8ec286459c063f4184a590fb3 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 13 Aug 2022 07:19:19 +0000
Subject: [PATCH 220/278] validation

---
 static/js/pages/admin/users/upload-scores.js | 148 +++++++++------
 templates/admin/users/upload-scores.html     | 184 +++++++------------
 2 files changed, 158 insertions(+), 174 deletions(-)

diff --git a/static/js/pages/admin/users/upload-scores.js b/static/js/pages/admin/users/upload-scores.js
index 45e78fce..e9b7b71b 100644
--- a/static/js/pages/admin/users/upload-scores.js
+++ b/static/js/pages/admin/users/upload-scores.js
@@ -3,7 +3,7 @@
 function createState (initial) {
   const isProxy = Symbol('isProxy')
   const hooks = []
-  const recursiveReactive = {
+  const recursiveReactive = (bubbleUp = false) => ({
     get (target, key) {
       if (key === isProxy) { return true }
       return target[key]
@@ -15,13 +15,19 @@ function createState (initial) {
       ) {
         target[key] = value
       } else if (typeof value === 'object') {
-        target[key] = new Proxy(value, recursiveReactive)
+        target[key] = new Proxy(value, recursiveReactive(true))
       } else if (Array.isArray(value)) {
-        target[key] = new Proxy(value, recursiveReactive)
+        target[key] = new Proxy(value, recursiveReactive(true))
       } else target[key] = value
+      if (bubbleUp) {
+        updateState({ bubble: true })
+      }
     }
+  })
+  const state = new Proxy({}, recursiveReactive())
+  for (const [k, v] of Object.entries(initial)) {
+    state[k] = v
   }
-  const state = new Proxy(initial, recursiveReactive)
   const reactive = new Proxy(state, {
     get (target, key) {
       const returnValue = target[key]
@@ -38,7 +44,7 @@ function createState (initial) {
   function useHook (cb) {
     hooks.push(cb)
   }
-  async function updateState () {
+  async function updateState ({ bubble = false } = {}) {
     console.log('update state:', state)
     for (const hook of hooks) {
       await hook(reactive)
@@ -53,16 +59,20 @@ function createState (initial) {
   return {
     useHook,
     forceUpdate: updateState,
-    state,
+    nonReactive: state,
     reactive,
     transaction
   }
 }
 
-const { state, reactive: s, useHook, forceUpdate, transaction } = createState({
+const { nonReactive, reactive: s, useHook, forceUpdate, transaction } = createState({
+  userId: -1,
+  apiKey: undefined,
+
   parseSucceed: false,
   parsed: {},
-  replayFile: undefined
+  replayFile: undefined,
+  validationErrors: {}
 })
 
 useHook((state) => {
@@ -101,44 +111,8 @@ useHook(state => {
   display.replaceChildren(...elements)
 })
 
-// useHook((state) => {
-//   const display = document.getElementById('replay-data')
-//   const dReplayMd5 = document.getElementById('display-map_md5')
-//   const dReplayScore = document.getElementById('display-score')
-//   if (
-//     dReplayMd5?.value == state.parsed.map_md5 &&
-//     dReplayScore?.value == state.parsed.score
-//   ) return
-//   console.log('re-render osr-reader result')
-//   const template = document.getElementById('record')
-//   const elements = Object.entries(state.parsed)
-//     .filter(([key]) => ['username', 'replay_id'].includes(key))
-//     .map(([key, value]) => {
-//       const copy = template.content.cloneNode(true)
-//       const _key = copy.querySelector('#key')
-//       _key.innerText = key
-//       const _value = copy.querySelector('#value')
-//       _value.value = value
-//       _value.id = `display-${key}`
-
-//       if (typeof value === 'string') {
-//         _value.type = 'text'
-//       } else if (typeof value === 'number') {
-//         _value.type = 'number'
-//       } else if (typeof value === 'boolean') {
-//         _value.type = 'checkbox'
-//         _value.classList.remove('input')
-//         _value.classList.add('checkbox')
-//       }
-
-//       return copy
-//     })
-//   display.replaceChildren(...elements)
-// })
-
 useHook(state => {
   const form = document.getElementById('submit-replay')
-  // if (form.replay_id.value == state.parsed.replay_id) return
   console.log('re-populate submitting values')
   Object.entries(state.parsed).forEach(([key, value]) => {
     if (!form[key]) return
@@ -146,6 +120,27 @@ useHook(state => {
   })
 })
 
+useHook(state => {
+  const inputs = submittingForm.querySelectorAll('input, select')
+  inputs.forEach(el => {
+    const id = `error-${el.name}`
+    let error = document.getElementById(id)
+    if (state.validationErrors[el.name]) {
+      if (!error) {
+        error = document.createElement('p')
+        error.classList.add('has-text-danger', 'm-0')
+        error.setAttribute('id', id)
+        el.parentNode.appendChild(error)
+      }
+      error.innerText = state.validationErrors[el.name]
+    } else {
+      if (error) {
+        error.remove()
+      }
+    }
+  })
+})
+
 async function uploadOsr () {
   const update = transaction((s) => {
     s.parseSucceed = false
@@ -172,33 +167,66 @@ async function uploadOsr () {
     update()
   }
 }
-// function copyReplayToForm () {
-//   transaction(s => {
-//     s.parsed = {
-//       ...s.parsed
-//     }
-//   })
-// }
 
 async function submitReplay () {
-  const form = document.getElementById('submit-replay')
-  const formData = new FormData(form)
-  const replayFile = state.replayFile
-  formData.append('replay_file', replayFile)
-  const userId = formData.get('userid')
-
-  if (!userId) return
+  s.validationErrors = {}
+  if (!nonReactive.userId) {
+    window.alert('need userid but unset.')
+    return
+  }
   if (!s.parseSucceed) {
     window.alert('osr parse failed.')
     return
   }
+  const form = document.getElementById('submit-replay')
+  const formData = new FormData(form)
+  const replayFile = nonReactive.replayFile
+  formData.append('replay_file', replayFile)
+  formData.append('userid', nonReactive.userId)
+  formData.append('perfect', nonReactive.parsed.perfect)
+
   // console.log([...formData.entries()])
   const endpoint = `//api.${window.domain}/submit_score`
-  await fetch(endpoint, {
+  const { detail, status, score_id: scoreId } = await fetch(endpoint, {
     method: 'post',
     body: formData,
     headers: {
-      Authorization: s.api_key
+      Authorization: s.apiKey
     }
   }).then(res => res.json())
+  if (detail) {
+    detail.forEach(setError(form))
+    forceUpdate()
+  }
+  if (status === 200) {
+    window.alert('submitted!\n score id: ' + scoreId)
+    transaction((state) => {
+      state.parseSucceed = false
+      state.parsed = {}
+      state.replayFile = undefined
+      state.validationErrors = {}
+    })
+  }
 }
+
+function setError (el) {
+  return (error) => {
+    const occured = error.loc[1]
+    const message = error.msg
+    nonReactive.validationErrors[occured] = message
+  }
+}
+const submittingForm = document.getElementById('submit-replay')
+
+submittingForm.querySelectorAll('input, select').forEach((el) => {
+  // console.log(el)
+  el.addEventListener('change', (value) => {
+    if (el.type === 'checkbox') {
+      s.parsed[el.name] = el.checked
+    } else if (el.type === 'number') {
+      s.parsed[el.name] = el.valueAsNumber
+    } else {
+      s.parsed[el.name] = el.value
+    }
+  })
+})
diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index 904df2f8..e8949448 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -21,11 +21,14 @@
         text-align: right;
     }
 </style>
-<script src="/static/js/pages/admin/users/upload-scores.js"></script>
+<script src="/static/js/pages/admin/users/upload-scores.js" defer></script>
 <script>
-    transaction(state => {
-        state.apiKey = "{{ session['user_data']['api_key'] }}"
-    }, false)
+    document.addEventListener('DOMContentLoaded', () => {
+        transaction(state => {
+            state.apiKey = "{{ session['user_data']['api_key'] }}"
+            state.userId = parseInt('{{ search_data.id }}')
+        }, false)
+    })
 </script>
 {% endblock %}
 {% block title %} Users {% endblock %}
@@ -33,23 +36,22 @@
 {% block content %}
 <template id="template-replay-row">
     <div class="tags has-addons m-0">
-      <span class="tag mb-0" id="key"></span>
-      <span class="tag mb-0 is-primary" id="value"></span>
+        <span class="tag mb-0" id="key"></span>
+        <span class="tag mb-0 is-primary" id="value"></span>
     </div>
 </template>
-<!-- action="/admin/user/{{ search_data['id'] }}/upload-score" method="POST" -->
 <div class="is-flex is-align-items-center is-flex-direction-column pt-4">
     <article style="min-width: fit-content; width: 60vw;" class="panel is-primary">
         <p class="panel-heading">
             {{t("admin.upload-replay.upload-score-for", name = search_data['name'])}}
         </p>
         <form id="osr-reader" onsubmit="event.preventDefault()">
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-id-card" aria-hidden="true"></i>
                     {{t("osr-reader.file")}}
                 </div>
-                <div class="column is-flex is-align-items-center gap-2">
+                <div class="column py-0 is-flex is-align-items-center gap-2">
                     <div class="file" id="form-replay-file-label">
                         <label class="file-label">
                             <input class="file-input" type="file" name="replay_file" onchange="uploadOsr()">
@@ -67,27 +69,23 @@
                 </div>
             </div>
         </form>
-
-        <!-- <div id="osr-result" class="is-hidden">
-            <div id="replay-data"></div>
-        </div> -->
         <hr>
         <form id="submit-replay" onsubmit="event.preventDefault(); submitReplay()">
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+            <!-- <div class="panel-block columns is-hidden" >
+                <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-id-card" aria-hidden="true"></i>
                     {{t("admin.users.id")}}
                 </div>
-                <div class="column">
+                <div class="column py-0">
                     <input name="userid" type="text" class="input" value="{{ search_data.id }}" required>
                 </div>
-            </div>
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+            </div> -->
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fab fa-octopus-deploy"></i>
                     {{t("grades.grade")}}
                 </div>
-                <div class="column">
+                <div class="column py-0">
                     <div class="select w-100">
                         <select name="grade" class="w-100" required>
                             <option value="N">{{t("grades.N")}}</option>
@@ -104,12 +102,12 @@
                     </div>
                 </div>
             </div>
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fa-solid fa-server"></i>
                     {{t("servers.server")}}
                 </div>
-                <div class="column">
+                <div class="column py-0">
                     <div class="select w-100">
                         <select name="server" class="w-100" required>
                             <option value="bancho">{{t("servers.bancho")}}</option>
@@ -120,12 +118,12 @@
                     </div>
                 </div>
             </div>
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-user-check"></i>
                     {{t("admin.upload-replay.identifier-type")}}
                 </div>
-                <div class="column">
+                <div class="column py-0">
                     <div class="field has-addons w-100 pt-3">
                         <p class="control w-100">
                             <span class="select">
@@ -146,151 +144,109 @@
                         </p>
                     </div>
                 </div>
-
-                <!-- <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
-                    <i class="fas fa-user-check"></i>
-                    {{t("admin.upload-replay.identifier-type")}}
-                </div>
-                <div class="column">
-                    <div class="select w-100">
-                        <select name="identifier_type" class="w-100" required>
-                            <option value="replay_username">
-                                {{t("admin.upload-replay.identifier-types.replay_username")}}</option>
-                            <option value="server_userid">{{t("admin.upload-replay.identifier-types.server_userid")}}
-                            </option>
-                            <option value="replay_id">{{t("admin.upload-replay.identifier-types.replay_id")}}</option>
-                        </select>
-                    </div>
-                </div> -->
             </div>
-            <!-- <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
-                    <i class="fas fa-user-check"></i>
-                    {{t("admin.upload-replay.identifier-type")}}
-                </div>
-                <div class="column">
-                    <div class="select w-100">
-                        <select name="identifier_type" class="w-100" required>
-                            <option value="replay_username">
-                                {{t("admin.upload-replay.identifier-types.replay_username")}}</option>
-                            <option value="server_userid">{{t("admin.upload-replay.identifier-types.server_userid")}}
-                            </option>
-                            <option value="replay_id">{{t("admin.upload-replay.identifier-types.replay_id")}}</option>
-                        </select>
-                    </div>
-                </div>
-            </div>
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">
-                    <i class="fas fa-address-card"></i>
-                    {{t("admin.outer-identifier")}}
-                </div>
-                <div class="column">
-                    <input type="text" class="input" name="outer_identifier" required>
-                </div>
-            </div> -->
             <hr>
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.map_md5") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.map_md5") }}</div>
+                <div class="column py-0">
                     <input type="text" class="input" name="map_md5" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.max_combo") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.max_combo") }}</div>
+                <div class="column py-0">
                     <input type="number" class="input" name="max_combo" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.mode") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.mode") }}</div>
+                <div class="column py-0">
                     <input type="number" class="input" name="mode" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.mods") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.mods") }}</div>
+                <div class="column py-0">
                     <input type="number" class="input" name="mods" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.n100") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.n100") }}</div>
+                <div class="column py-0">
                     <input type="number" class="input" name="n100" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.n300") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.n300") }}</div>
+                <div class="column py-0">
                     <input type="number" class="input" name="n300" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.n50") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.n50") }}</div>
+                <div class="column py-0">
                     <input type="number" class="input" name="n50" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.ngeki") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.ngeki") }}</div>
+                <div class="column py-0">
                     <input type="number" class="input" name="ngeki" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.nkatu") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.nkatu") }}</div>
+                <div class="column py-0">
                     <input type="number" class="input" name="nkatu" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.nmiss") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.nmiss") }}</div>
+                <div class="column py-0">
                     <input type="number" class="input" name="nmiss" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.perfect") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.perfect") }}</div>
+                <div class="column py-0">
                     <input type="checkbox" class="checkbox" name="perfect">
                 </div>
             </div>
 
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.playtime") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.playtime") }}</div>
+                <div class="column py-0">
                     <input type="number" class="input" name="playtime" required>
                 </div>
             </div>
 
-            <!-- <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.replay_id") }}</div>
-                <div class="column">
+            <!-- <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.replay_id") }}</div>
+                <div class="column py-0">
                     <input type="number" class="input" name="replay_id">
                 </div>
             </div> -->
 
-            <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.score") }}</div>
-                <div class="column">
+            <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.score") }}</div>
+                <div class="column py-0">
                     <input type="number" class="input" name="score" required>
                 </div>
             </div>
 
-            <!-- <div class="panel-block columns" style="height: 50px;">
-                <div class="column is-one-quarter text-nowrap">{{ t("osr-reader.username") }}</div>
-                <div class="column">
+            <!-- <div class="panel-block columns" >
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.username") }}</div>
+                <div class="column py-0">
                     <input type="text" class="input" name="username">
                 </div>
             </div> -->

From 34518e48d503f74c9b688661449ae7537ab4eeed Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 13 Aug 2022 07:20:51 +0000
Subject: [PATCH 221/278] fix default flag

---
 templates/admin/users/edit.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/admin/users/edit.html b/templates/admin/users/edit.html
index 26ec06c5..3f587abe 100644
--- a/templates/admin/users/edit.html
+++ b/templates/admin/users/edit.html
@@ -48,7 +48,7 @@
                     {{t("admin.users.country")}}
                 </div>
                 <div class="column is-flex gap-2 is-align-items-center">
-                    <img id="country-preview" src="/static/images/flags/JP.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">
+                    <img id="country-preview" src="/static/images/flags/{{ search_data.country | upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">
                     <input name="edit-country" type="text" class="input" value="{{ search_data.country }}" oninput="
                         if (this.value.length === 2) {
                             document.getElementById('country-preview').src = '/static/images/flags/' + this.value.toUpperCase() + '.png'

From 4278efa94cf603dc8e015827ff41256b0cc9c153 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 13 Aug 2022 07:24:54 +0000
Subject: [PATCH 222/278] class list

---
 templates/admin/users/upload-scores.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index e8949448..c51831c2 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -125,7 +125,7 @@
                 </div>
                 <div class="column py-0">
                     <div class="field has-addons w-100 pt-3">
-                        <p class="control w-100">
+                        <p class="control">
                             <span class="select">
                                 <select name="identifier_type" required>
                                     <option value="replay_username">
@@ -139,7 +139,7 @@
                             </span>
                         </p>
                         <p class="control w-100">
-                            <input class="input" name="outer_identifier" required type="text"
+                            <input class="input w-100" name="outer_identifier" required type="text"
                                 placeholder="{{ t('admin.outer-identifier') }}">
                         </p>
                     </div>

From 5f254e9c15f3e6ad21414530c04026530e7a5805 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 13 Aug 2022 07:28:13 +0000
Subject: [PATCH 223/278] update js

---
 static/js/pages/admin/users/upload-scores.js | 18 +++++++++++-------
 1 file changed, 11 insertions(+), 7 deletions(-)

diff --git a/static/js/pages/admin/users/upload-scores.js b/static/js/pages/admin/users/upload-scores.js
index e9b7b71b..7527ed83 100644
--- a/static/js/pages/admin/users/upload-scores.js
+++ b/static/js/pages/admin/users/upload-scores.js
@@ -78,16 +78,20 @@ const { nonReactive, reactive: s, useHook, forceUpdate, transaction } = createSt
 useHook((state) => {
   // const result = document.getElementById('osr-result')
   const file = document.getElementById('form-replay-file-label')
-  if (state.parseSucceed) {
-    // result.classList.remove('is-hidden')
-    file.classList.add('is-success')
-  } else {
-    // result.classList.add('is-hidden')
-    file.classList.add('is-danger')
-  }
+
   if (!state.replayFile) {
     const form = document.getElementById('osr-reader')
     delete form.replay_file.value
+  } else {
+    if (state.parseSucceed) {
+      // result.classList.remove('is-hidden')
+      file.classList.add('is-success')
+      file.classList.remove('is-danger')
+    } else {
+      // result.classList.add('is-hidden')
+      file.classList.add('is-danger')
+      file.classList.remove('is-success')
+    }
   }
 })
 

From 2329c98a01e6b79d61e4f4dedaf5afd387a3caf1 Mon Sep 17 00:00:00 2001
From: DAYGoodTime <ken570015@163.com>
Date: Sat, 13 Aug 2022 08:49:59 +0000
Subject: [PATCH 224/278] translate score_submit page

---
 locales/default/admin/upload-replay/en-GB.yml | 20 ++++++
 locales/default/admin/upload-replay/en-US.yml | 20 ++++++
 locales/default/admin/upload-replay/zh-CN.yml | 20 ++++++
 locales/default/admin/users/en-GB.yml         |  3 +-
 locales/default/admin/users/en-US.yml         |  3 +-
 locales/default/admin/users/zh-CN.yml         |  3 +-
 locales/default/global/en-GB.yml              | 18 +++++-
 locales/default/global/en-US.yml              | 18 +++++-
 locales/default/global/zh-CN.yml              | 17 ++++-
 templates/admin/users/edit.html               |  2 +-
 templates/admin/users/upload-scores.html      | 64 +++++++++----------
 11 files changed, 147 insertions(+), 41 deletions(-)
 create mode 100644 locales/default/admin/upload-replay/en-GB.yml
 create mode 100644 locales/default/admin/upload-replay/en-US.yml
 create mode 100644 locales/default/admin/upload-replay/zh-CN.yml

diff --git a/locales/default/admin/upload-replay/en-GB.yml b/locales/default/admin/upload-replay/en-GB.yml
new file mode 100644
index 00000000..a8769997
--- /dev/null
+++ b/locales/default/admin/upload-replay/en-GB.yml
@@ -0,0 +1,20 @@
+upload-score-for: Upload score for %{name}
+identifier-type: Identifier type
+replay-username: Replay username
+outer_identifier: Outer identifier
+map-md5: map md5
+max-combo: Max combo
+mode: mode
+mods: mods
+n100: number of 100
+n300: number of 300
+n50: number of 50
+ngeki: number of Geki
+nkatu: number of Katu
+nmiss: number of miss
+playtime: replay time
+score: Score
+upload: Upload
+perfect: Is perfect
+osu-replay-file: Osu replay file
+upload-osr-file: Upload osr file
diff --git a/locales/default/admin/upload-replay/en-US.yml b/locales/default/admin/upload-replay/en-US.yml
new file mode 100644
index 00000000..af8375ca
--- /dev/null
+++ b/locales/default/admin/upload-replay/en-US.yml
@@ -0,0 +1,20 @@
+upload-score-for: Upload score for %{name}
+identifier-type: Identifier type
+replay-username: Replay username
+outer_identifier: Outer identifier
+map-md5: map md5
+max-combo: Max combo
+mode: mode
+mods: mods
+n100: number of 100
+n300: number of 100
+n50: number of 50
+ngeki: number of Geki
+nkatu: number of Katu
+nmiss: number of miss
+playtime: replay time
+score: Score
+upload: Upload
+perfect: Is perfect
+osu-replay-file: Osu replay file
+upload-osr-file: Upload osr file
diff --git a/locales/default/admin/upload-replay/zh-CN.yml b/locales/default/admin/upload-replay/zh-CN.yml
new file mode 100644
index 00000000..33ff6569
--- /dev/null
+++ b/locales/default/admin/upload-replay/zh-CN.yml
@@ -0,0 +1,20 @@
+upload-score-for: 上传 %{name} 的成绩
+identifier-type: 身份标识类型
+replay-username: 回放者的用户名
+outer_identifier: 外部成绩的来源身份标识
+map-md5: 谱面的md5
+max-combo: 最大连击数
+mode: 模式
+mods: mods
+n100: 100的个数
+n300: 300的个数
+n50: 50的个数
+ngeki: 激的个数
+nkatu: 喝的个数
+nmiss: miss的个数
+playtime: 回放时长
+score: 分数
+upload: 上传
+perfect: 是否为perfect
+osu-replay-file: osu回放文件
+upload-osr-file: 上传osr文件
diff --git a/locales/default/admin/users/en-GB.yml b/locales/default/admin/users/en-GB.yml
index d0e73517..f0ccdc93 100644
--- a/locales/default/admin/users/en-GB.yml
+++ b/locales/default/admin/users/en-GB.yml
@@ -9,7 +9,7 @@ client-channel: Client channel
 email: Email
 ip: IP
 edit: Edit
-edit-info-of: Edit Info of
+edit-info-of: Edit Info of %{name}
 username: Username
 country: Country
 legality: Legality
@@ -19,3 +19,4 @@ update: Update
 search-by-username-or-email: Search by username or email
 password: Password
 new-password: New Password
+upload-new-score: Upload new socre
diff --git a/locales/default/admin/users/en-US.yml b/locales/default/admin/users/en-US.yml
index d0e73517..f0ccdc93 100644
--- a/locales/default/admin/users/en-US.yml
+++ b/locales/default/admin/users/en-US.yml
@@ -9,7 +9,7 @@ client-channel: Client channel
 email: Email
 ip: IP
 edit: Edit
-edit-info-of: Edit Info of
+edit-info-of: Edit Info of %{name}
 username: Username
 country: Country
 legality: Legality
@@ -19,3 +19,4 @@ update: Update
 search-by-username-or-email: Search by username or email
 password: Password
 new-password: New Password
+upload-new-score: Upload new socre
diff --git a/locales/default/admin/users/zh-CN.yml b/locales/default/admin/users/zh-CN.yml
index c4cabd8c..e4c0ec44 100644
--- a/locales/default/admin/users/zh-CN.yml
+++ b/locales/default/admin/users/zh-CN.yml
@@ -9,7 +9,7 @@ client-channel: 客户端频道
 email: 邮箱
 ip: IP
 edit: 修改
-edit-info-of: '修改该用户的信息:'
+edit-info-of: '修改 %{name} 的信息:'
 username: 用户名
 country: 地区
 legality: 封禁状态
@@ -19,3 +19,4 @@ update: 更新
 search-by-username-or-email: 根据 用户名 或 邮箱 进行搜索
 password: 密码
 new-password: 请输入新密码
+upload-new-score: 上传成绩
diff --git a/locales/default/global/en-GB.yml b/locales/default/global/en-GB.yml
index 0c59dc2e..a4bf639a 100644
--- a/locales/default/global/en-GB.yml
+++ b/locales/default/global/en-GB.yml
@@ -38,8 +38,22 @@ rank:
   s: S
   sh: S
   a: A
-# server literals
 invalid-parameters: Invalid parameters.
 you-are-already-logged-in: You're already logged in!
 you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
-
+grade: Grade
+grades-N: 'N'
+grades-F: F
+grades-D: D
+grades-C: C
+grades-B: B
+grades-A: A
+grades-S: S
+grades-SH: SH
+grades-X: SS
+grades-XH: SSH
+server: Server
+bancho: Bancho
+ppy-sb: ppy-sb
+akatsuki: akatsuki
+server-offline: offline
diff --git a/locales/default/global/en-US.yml b/locales/default/global/en-US.yml
index 0c59dc2e..a4bf639a 100644
--- a/locales/default/global/en-US.yml
+++ b/locales/default/global/en-US.yml
@@ -38,8 +38,22 @@ rank:
   s: S
   sh: S
   a: A
-# server literals
 invalid-parameters: Invalid parameters.
 you-are-already-logged-in: You're already logged in!
 you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
-
+grade: Grade
+grades-N: 'N'
+grades-F: F
+grades-D: D
+grades-C: C
+grades-B: B
+grades-A: A
+grades-S: S
+grades-SH: SH
+grades-X: SS
+grades-XH: SSH
+server: Server
+bancho: Bancho
+ppy-sb: ppy-sb
+akatsuki: akatsuki
+server-offline: offline
diff --git a/locales/default/global/zh-CN.yml b/locales/default/global/zh-CN.yml
index 619b602d..c243a4e8 100644
--- a/locales/default/global/zh-CN.yml
+++ b/locales/default/global/zh-CN.yml
@@ -38,7 +38,22 @@ score: 分数
 total-score: 总分
 ranked-score: 记分总分
 password: 密码
-# server literals
 invalid-parameters: 请输入用户名密码以及邮箱
 you-are-already-logged-in: 你已经登录啦!
 you-must-be-logged-in-to-access-this-page: 你必须登录了才能访问该页面
+grade: 评分
+grades-N: 'N'
+grades-F: F
+grades-D: D
+grades-C: C
+grades-B: B
+grades-A: A
+grades-S: S
+grades-SH: SH
+grades-X: SS
+grades-XH: SSH
+server: 服务器
+bancho: Bancho
+ppy-sb: ppy-sb
+akatsuki: akatsuki
+server-offline: 离线客户端
diff --git a/templates/admin/users/edit.html b/templates/admin/users/edit.html
index 3f587abe..df8e0672 100644
--- a/templates/admin/users/edit.html
+++ b/templates/admin/users/edit.html
@@ -22,7 +22,7 @@
     <div class="is-flex is-align-items-center is-flex-direction-column">
         <article style="min-width: fit-content; width: 40vw;" class="panel is-primary">
             <p class="panel-heading">
-            {{t("admin.users.edit-info-of")}} {{ search_data['name'] }}
+            {{t("admin.users.edit-info-of", name = search_data['name'])}}
             </p>
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index c51831c2..ec64b210 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -49,7 +49,7 @@
             <div class="panel-block columns" >
                 <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-id-card" aria-hidden="true"></i>
-                    {{t("osr-reader.file")}}
+                    {{t("admin.upload-replay.osu-replay-file")}}
                 </div>
                 <div class="column py-0 is-flex is-align-items-center gap-2">
                     <div class="file" id="form-replay-file-label">
@@ -60,7 +60,7 @@
                                     <i class="fas fa-upload"></i>
                                 </span>
                                 <span class="file-label">
-                                    {{t("osr-reader.upload-osr")}}
+                                    {{t("admin.upload-replay.upload-osr-file")}}
                                 </span>
                             </span>
                         </label>
@@ -83,21 +83,21 @@
             <div class="panel-block columns" >
                 <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fab fa-octopus-deploy"></i>
-                    {{t("grades.grade")}}
+                    {{t("global.grade")}}
                 </div>
                 <div class="column py-0">
                     <div class="select w-100">
                         <select name="grade" class="w-100" required>
-                            <option value="N">{{t("grades.N")}}</option>
-                            <option value="F">{{t("grades.F")}}</option>
-                            <option value="D">{{t("grades.D")}}</option>
-                            <option value="C">{{t("grades.C")}}</option>
-                            <option value="B">{{t("grades.B")}}</option>
-                            <option value="A">{{t("grades.A")}}</option>
-                            <option value="S">{{t("grades.S")}}</option>
-                            <option value="SH">{{t("grades.SH")}}</option>
-                            <option value="X">{{t("grades.X")}}</option>
-                            <option value="XH">{{t("grades.XH")}}</option>
+                            <option value="N">{{t("global.grades-N")}}</option>
+                            <option value="F">{{t("global.grades-F")}}</option>
+                            <option value="D">{{t("global.grades-D")}}</option>
+                            <option value="C">{{t("global.grades-C")}}</option>
+                            <option value="B">{{t("global.grades-B")}}</option>
+                            <option value="A">{{t("global.grades-A")}}</option>
+                            <option value="S">{{t("global.grades-S")}}</option>
+                            <option value="SH">{{t("global.grades-SH")}}</option>
+                            <option value="X">{{t("global.grades-X")}}</option>
+                            <option value="XH">{{t("global.grades-XH")}}</option>
                         </select>
                     </div>
                 </div>
@@ -105,15 +105,15 @@
             <div class="panel-block columns" >
                 <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fa-solid fa-server"></i>
-                    {{t("servers.server")}}
+                    {{t("global.server")}}
                 </div>
                 <div class="column py-0">
                     <div class="select w-100">
                         <select name="server" class="w-100" required>
-                            <option value="bancho">{{t("servers.bancho")}}</option>
-                            <option value="ppysb">{{t("servers.ppy-sb")}}</option>
-                            <option value="akatsuki">{{t("servers.akatsuki")}}</option>
-                            <option value="offline">{{t("servers.offline")}}</option>
+                            <option value="bancho">{{t("global.bancho")}}</option>
+                            <option value="ppysb">{{t("global.ppy-sb")}}</option>
+                            <option value="akatsuki">{{t("global.akatsuki")}}</option>
+                            <option value="offline">{{t("global.server-offline")}}</option>
                         </select>
                     </div>
                 </div>
@@ -140,91 +140,91 @@
                         </p>
                         <p class="control w-100">
                             <input class="input w-100" name="outer_identifier" required type="text"
-                                placeholder="{{ t('admin.outer-identifier') }}">
+                                placeholder="{{ t('admin.upload-replay.outer_identifier') }}">
                         </p>
                     </div>
                 </div>
             </div>
             <hr>
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.map_md5") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.map-md5") }}</div>
                 <div class="column py-0">
                     <input type="text" class="input" name="map_md5" required>
                 </div>
             </div>
 
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.max_combo") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.max-combo") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="max_combo" required>
                 </div>
             </div>
 
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.mode") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.mode") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="mode" required>
                 </div>
             </div>
 
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.mods") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.mods") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="mods" required>
                 </div>
             </div>
 
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.n100") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.n100") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="n100" required>
                 </div>
             </div>
 
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.n300") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.n300") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="n300" required>
                 </div>
             </div>
 
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.n50") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.n50") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="n50" required>
                 </div>
             </div>
 
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.ngeki") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.ngeki") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="ngeki" required>
                 </div>
             </div>
 
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.nkatu") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.nkatu") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="nkatu" required>
                 </div>
             </div>
 
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.nmiss") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.nmiss") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="nmiss" required>
                 </div>
             </div>
 
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.perfect") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.perfect") }}</div>
                 <div class="column py-0">
                     <input type="checkbox" class="checkbox" name="perfect">
                 </div>
             </div>
 
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.playtime") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.playtime") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="playtime" required>
                 </div>
@@ -238,7 +238,7 @@
             </div> -->
 
             <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.score") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.score") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="score" required>
                 </div>

From 7988fbb3fac6b6a22d49f40ac487bc82c5785c6f Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 13 Aug 2022 09:13:07 +0000
Subject: [PATCH 225/278] update

---
 .vscode/settings.json                        |  14 +-
 locales/default/global/en-GB.yml             |   4 +-
 locales/default/global/en-US.yml             |   4 +-
 locales/default/global/zh-CN.yml             |   6 +-
 static/js/main.js                            | 199 ++++++++++++-------
 static/js/pages/admin/users/upload-scores.js |  66 +-----
 templates/admin/users/upload-scores.html     |  44 ++--
 7 files changed, 173 insertions(+), 164 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index af55d853..ae3e5f94 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -43,14 +43,14 @@
   "i18n-ally.keystyle": "nested",
   "emeraldwalk.runonsave": {
     "commands": [
-      // {
-      //   "match": ".(yml|yaml)$",
-      //   "cmd": "npm run i18n:compile"
-      // },
       {
-        "match": ".html",
-        "cmd": "npm run i18n:format:templates"
-      }
+        "match": ".(yml|yaml)$",
+        "cmd": "yarn i18n:build"
+      },
+      // {
+      //   "match": ".html$",
+      //   "cmd": "yarn i18n:format:templates"
+      // }
     ]
   },
   "files.associations": {
diff --git a/locales/default/global/en-GB.yml b/locales/default/global/en-GB.yml
index a4bf639a..dbc12ec7 100644
--- a/locales/default/global/en-GB.yml
+++ b/locales/default/global/en-GB.yml
@@ -54,6 +54,6 @@ grades-X: SS
 grades-XH: SSH
 server: Server
 bancho: Bancho
-ppy-sb: ppy-sb
-akatsuki: akatsuki
+ppy-sb: ppy.sb
+akatsuki: Akatsuki
 server-offline: offline
diff --git a/locales/default/global/en-US.yml b/locales/default/global/en-US.yml
index a4bf639a..dbc12ec7 100644
--- a/locales/default/global/en-US.yml
+++ b/locales/default/global/en-US.yml
@@ -54,6 +54,6 @@ grades-X: SS
 grades-XH: SSH
 server: Server
 bancho: Bancho
-ppy-sb: ppy-sb
-akatsuki: akatsuki
+ppy-sb: ppy.sb
+akatsuki: Akatsuki
 server-offline: offline
diff --git a/locales/default/global/zh-CN.yml b/locales/default/global/zh-CN.yml
index c243a4e8..32e5dea7 100644
--- a/locales/default/global/zh-CN.yml
+++ b/locales/default/global/zh-CN.yml
@@ -54,6 +54,6 @@ grades-X: SS
 grades-XH: SSH
 server: 服务器
 bancho: Bancho
-ppy-sb: ppy-sb
-akatsuki: akatsuki
-server-offline: 离线客户端
+ppy-sb: ppy.sb
+akatsuki: Akatsuki
+server-offline: 离线
diff --git a/static/js/main.js b/static/js/main.js
index 128c61ea..b6d56ebf 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -1,75 +1,140 @@
 // sticky header
 $(window).scroll(() => {
-    var header = document.getElementById("navbar");
-    if (!header) return
-    var sticky = header.offsetTop;
+  const header = document.getElementById('navbar')
+  if (!header) return
+  const sticky = header.offsetTop
 
-    if (window.pageYOffset > sticky) {
-        header.classList.add("minimized");
-    } else {
-        header.classList.remove("minimized");
-    }
-});
+  if (window.pageYOffset > sticky) {
+    header.classList.add('minimized')
+  } else {
+    header.classList.remove('minimized')
+  }
+})
+
+// toggle navbar for mobile
+function togglenavbar () {
+  const navbar = document.getElementById('navbar')
+  navbar && navbar.classList.toggle('is-active')
+  const burger = document.getElementById('navbar-burger')
+  burger && burger.classList.toggle('is-active')
+}
 
-//toggle navbar for mobile
-function togglenavbar() {
-    const navbar = document.getElementById('navbar')
-    navbar && navbar.classList.toggle("is-active");
-    const burger = document.getElementById('navbar-burger')
-    burger && burger.classList.toggle("is-active");
+function setStyle (el, obj) {
+  Object.entries(obj).forEach(([k, v]) => {
+    el.style[k] = v
+  })
 }
 
-function setStyle(el, obj) {
-    Object.entries(obj).forEach(([k, v]) => {
-        el.style[k] = v
-    })
+function searchUser () {
+  _testGlobals(
+    { exists: ['domain'] }
+  )
+  const search = document.getElementById('u-search')
+  if (!search) return
+  const value = search.value
+  const content = document.getElementById('u-search-content')
+  content && (content.innerHTML = '')
+  $.get('//osu.' + window.domain + '/search?q=' + value, function (data, status) {
+    if (data != '{}') {
+      content && content.removeAttribute('style')
+      $.each(data, function (e, n) {
+        const result = ({
+          title: n.name,
+          url: '/u/' + n.id,
+          image: '//a.' + window.domain + '/' + n.id
+        })
+        const root = document.createElement('a')
+        root.href = result.url
+        root.className = 'navbar-item'
+        const image = document.createElement('img')
+        image.src = result.image
+        setStyle(image, {
+          width: '3rem',
+          maxHeight: '3rem',
+          backgroundSize: 'cover',
+          borderRadius: '0.5em'
+        })
+        root.appendChild(image)
+        const textSpan = document.createElement('span')
+        setStyle(textSpan, {
+          marginLeft: '5px',
+          fontWeight: 700,
+          fontSize: '1.2em',
+          color: 'rgba(255,255,255,0.9)'
+        })
+        textSpan.innerText = result.title
+        root.appendChild(textSpan)
+        content && content.appendChild(root)
+      })
+    } else {
+      content && setStyle(content, {
+        display: 'none'
+      })
+    }
+  })
 }
 
-function searchUser() {
-    _testGlobals(
-        { exists: ['domain'] }
-    )
-    const search = document.getElementById('u-search')
-    if (!search) return
-    const value = search.value
-    const content = document.getElementById('u-search-content')
-    content && (content.innerHTML = "");
-    $.get('//osu.' + window.domain + '/search?q=' + value, function (data, status) {
-        if (data != '{}') {
-            content && content.removeAttribute('style')
-            $.each(data, function (e, n) {
-                const result = ({
-                    title: n.name,
-                    url: "/u/" + n.id,
-                    image: '//a.' + window.domain + '/' + n.id
-                })
-                const root = document.createElement('a')
-                root.href = result.url
-                root.className = 'navbar-item'
-                const image = document.createElement('img')
-                image.src = result.image
-                setStyle(image, {
-                    width: '3rem',
-                    maxHeight: '3rem',
-                    backgroundSize: 'cover',
-                    borderRadius: '0.5em'
-                })
-                root.appendChild(image)
-                const textSpan = document.createElement('span')
-                setStyle(textSpan, {
-                    marginLeft: '5px',
-                    fontWeight: 700,
-                    fontSize: '1.2em',
-                    color: 'rgba(255,255,255,0.9)'
-                })
-                textSpan.innerText = result.title
-                root.appendChild(textSpan)
-                content && content.appendChild(root)
-            })
-        } else {
-            content && setStyle(content, {
-                display: 'none'
-            })
-        }
-    })
-}
\ No newline at end of file
+function createState (initial) {
+  const isProxy = Symbol('isProxy')
+  const hooks = []
+  const recursiveReactive = (bubbleUp = false) => ({
+    get (target, key) {
+      if (key === isProxy) { return true }
+      return target[key]
+    },
+    set (target, key, value, proxy) {
+      if (
+        value instanceof File ||
+          value instanceof Blob
+      ) {
+        target[key] = value
+      } else if (typeof value === 'object') {
+        target[key] = new Proxy(value, recursiveReactive(true))
+      } else if (Array.isArray(value)) {
+        target[key] = new Proxy(value, recursiveReactive(true))
+      } else target[key] = value
+      if (bubbleUp) {
+        updateState({ bubble: true })
+      }
+    }
+  })
+  const state = new Proxy({}, recursiveReactive())
+  for (const [k, v] of Object.entries(initial)) {
+    state[k] = v
+  }
+  const reactive = new Proxy(state, {
+    get (target, key) {
+      const returnValue = target[key]
+      // if (returnValue && returnValue[isProxy]) {
+      //   setTimeout(updateState, 0)
+      // }
+      return returnValue
+    },
+    set (target, key, value) {
+      target[key] = value
+      updateState()
+    }
+  })
+  function useHook (cb) {
+    hooks.push(cb)
+  }
+  async function updateState ({ bubble = false } = {}) {
+    console.log('update state:', state)
+    for (const hook of hooks) {
+      await hook(reactive)
+    }
+  }
+  function transaction (cb, immediate = true) {
+    cb(state)
+    if (immediate) updateState()
+    else return () => updateState()
+  }
+
+  return {
+    useHook,
+    forceUpdate: updateState,
+    nonReactive: state,
+    reactive,
+    transaction
+  }
+}
diff --git a/static/js/pages/admin/users/upload-scores.js b/static/js/pages/admin/users/upload-scores.js
index 7527ed83..462a0d93 100644
--- a/static/js/pages/admin/users/upload-scores.js
+++ b/static/js/pages/admin/users/upload-scores.js
@@ -1,70 +1,5 @@
 /* eslint-disable no-unused-vars */
 
-function createState (initial) {
-  const isProxy = Symbol('isProxy')
-  const hooks = []
-  const recursiveReactive = (bubbleUp = false) => ({
-    get (target, key) {
-      if (key === isProxy) { return true }
-      return target[key]
-    },
-    set (target, key, value, proxy) {
-      if (
-        value instanceof File ||
-        value instanceof Blob
-      ) {
-        target[key] = value
-      } else if (typeof value === 'object') {
-        target[key] = new Proxy(value, recursiveReactive(true))
-      } else if (Array.isArray(value)) {
-        target[key] = new Proxy(value, recursiveReactive(true))
-      } else target[key] = value
-      if (bubbleUp) {
-        updateState({ bubble: true })
-      }
-    }
-  })
-  const state = new Proxy({}, recursiveReactive())
-  for (const [k, v] of Object.entries(initial)) {
-    state[k] = v
-  }
-  const reactive = new Proxy(state, {
-    get (target, key) {
-      const returnValue = target[key]
-      // if (returnValue && returnValue[isProxy]) {
-      //   setTimeout(updateState, 0)
-      // }
-      return returnValue
-    },
-    set (target, key, value) {
-      target[key] = value
-      updateState()
-    }
-  })
-  function useHook (cb) {
-    hooks.push(cb)
-  }
-  async function updateState ({ bubble = false } = {}) {
-    console.log('update state:', state)
-    for (const hook of hooks) {
-      await hook(reactive)
-    }
-  }
-  function transaction (cb, immediate = true) {
-    cb(state)
-    if (immediate) updateState()
-    else return () => updateState()
-  }
-
-  return {
-    useHook,
-    forceUpdate: updateState,
-    nonReactive: state,
-    reactive,
-    transaction
-  }
-}
-
 const { nonReactive, reactive: s, useHook, forceUpdate, transaction } = createState({
   userId: -1,
   apiKey: undefined,
@@ -122,6 +57,7 @@ useHook(state => {
     if (!form[key]) return
     form[key].value = value
   })
+  form.foreign_score_id.value = state.parsed.replay_id || 0
 })
 
 useHook(state => {
diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index ec64b210..7e06157e 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -46,7 +46,7 @@
             {{t("admin.upload-replay.upload-score-for", name = search_data['name'])}}
         </p>
         <form id="osr-reader" onsubmit="event.preventDefault()">
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-id-card" aria-hidden="true"></i>
                     {{t("admin.upload-replay.osu-replay-file")}}
@@ -80,7 +80,7 @@
                     <input name="userid" type="text" class="input" value="{{ search_data.id }}" required>
                 </div>
             </div> -->
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fab fa-octopus-deploy"></i>
                     {{t("global.grade")}}
@@ -102,7 +102,7 @@
                     </div>
                 </div>
             </div>
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fa-solid fa-server"></i>
                     {{t("global.server")}}
@@ -118,7 +118,15 @@
                     </div>
                 </div>
             </div>
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.foreign-score-id") }}
+                </div>
+                <div class="column py-0">
+                    <input type="number" class="input" name="foreign_score_id" required>
+                </div>
+            </div>
+
+            <!-- <div class="panel-block columns" >
                 <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-user-check"></i>
                     {{t("admin.upload-replay.identifier-type")}}
@@ -144,86 +152,86 @@
                         </p>
                     </div>
                 </div>
-            </div>
+            </div> -->
             <hr>
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.map-md5") }}</div>
                 <div class="column py-0">
                     <input type="text" class="input" name="map_md5" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.max-combo") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="max_combo" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.mode") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="mode" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.mods") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="mods" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.n100") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="n100" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.n300") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="n300" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.n50") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="n50" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.ngeki") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="ngeki" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.nkatu") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="nkatu" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.nmiss") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="nmiss" required>
                 </div>
             </div>
 
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.perfect") }}</div>
                 <div class="column py-0">
                     <input type="checkbox" class="checkbox" name="perfect">
                 </div>
             </div>
 
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.playtime") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="playtime" required>
@@ -237,7 +245,7 @@
                 </div>
             </div> -->
 
-            <div class="panel-block columns" >
+            <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.score") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="score" required>

From bcc5499f5b5e6565c36b572df880ccbfc31bdaec Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 13 Aug 2022 09:29:59 +0000
Subject: [PATCH 226/278] format html template & fix bad link

---
 .vscode/settings.json                    |  8 ++--
 templates/admin/beatmaps.html            | 60 ++++++++++++------------
 templates/admin/restrictions.html        | 18 +++----
 templates/admin/users/edit.html          | 24 +++++-----
 templates/admin/users/index.html         | 22 ++++-----
 templates/admin/users/upload-scores.html | 50 ++++++++++----------
 templates/components/navbar.html         |  2 +-
 templates/settings/sidebar.html          |  2 +-
 utils/i18n/commands/format-html.ts       |  7 +--
 9 files changed, 97 insertions(+), 96 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index ae3e5f94..2d5fff07 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -47,10 +47,10 @@
         "match": ".(yml|yaml)$",
         "cmd": "yarn i18n:build"
       },
-      // {
-      //   "match": ".html$",
-      //   "cmd": "yarn i18n:format:templates"
-      // }
+      {
+        "match": ".html$",
+        "cmd": "yarn i18n:format:templates"
+      }
     ]
   },
   "files.associations": {
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index ede8d087..f127e122 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -54,8 +54,8 @@
             onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
     </div>
     <div class="column is-paddingless flex-vcenter">
-        <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
-        <p class="section-lead">{{t("admin.beatmaps.welcome-to-beatmaps-panel")}}</p>
+        <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
+        <p class="section-lead">{{ t("admin.beatmaps.welcome-to-beatmaps-panel") }}</p>
     </div>
 </div>
 <div class="row row-deck row-cards" style="margin-top: 20px">
@@ -63,53 +63,53 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
         <div class="column is-paddingless pr-3 py-3">
             <div class="card has-text-right">
                 <i class="fa fa-plus"></i>
-                <div class="title">{{t("admin.beatmaps.total-beatmaps")}}</div>
+                <div class="title">{{ t("admin.beatmaps.total-beatmaps") }}</div>
                 <div class="value">{{ counts['total'] }}</div>
-                <div class="stat has-text-left">{{t("admin.beatmaps.thats-a-lot-of-maps")}}</div>
+                <div class="stat has-text-left">{{ t("admin.beatmaps.thats-a-lot-of-maps") }}</div>
             </div>
         </div>
         <div class="column is-paddingless p-3">
             <div class="card has-text-right">
                 <i class="fa fa-bolt"></i>
-                <div class="title">{{t("admin.beatmaps.ranked")}}</div>
+                <div class="title">{{ t("admin.beatmaps.ranked") }}</div>
                 <div class="value">{{ counts['ranked'] }}</div>
-                <div class="stat has-text-left">{{t("admin.beatmaps.these-maps-can-gain-many-pp")}}</div>
+                <div class="stat has-text-left">{{ t("admin.beatmaps.these-maps-can-gain-many-pp") }}</div>
             </div>
         </div>
         <div class="column is-paddingless p-3">
             <div class="card has-text-right">
                 <i class="fa fa-heart"></i>
-                <div class="title">{{t("admin.beatmaps.loved")}}</div>
+                <div class="title">{{ t("admin.beatmaps.loved") }}</div>
                 <div class="value"> {{counts['loved'] }}</div>
-                <div class="stat has-text-left">{{t("admin.beatmaps.we-loved-them-so-much")}}</div>
+                <div class="stat has-text-left">{{ t("admin.beatmaps.we-loved-them-so-much") }}</div>
             </div>
         </div>
         <div class="column is-paddingless pl-3 py-3">
             <div class="card has-text-right">
                 <i class="fa fa-arrows-rotate"></i>
-                <div class="title">{{t("admin.beatmaps.pending")}}</div>
+                <div class="title">{{ t("admin.beatmaps.pending") }}</div>
                 <div class="value">{{ counts['pending'] }}</div>
-                <div class="stat has-text-left">{{t("admin.beatmaps.they-are-also-good-maps")}}</div>
+                <div class="stat has-text-left">{{ t("admin.beatmaps.they-are-also-good-maps") }}</div>
             </div>
         </div>
     </div>
     <div class="p-0 d-flex gap-2 py-3">
-        <input placeholder='{{t("admin.beatmaps.search-by-bid-sid-or-title")}}' id="search-bar" class="input" value="{{ search_word }}">
-        <button onclick="searchMaps()" class="button" style="width: 200px">{{t("admin.beatmaps.search")}}</button>
+        <input placeholder='{{ t("admin.beatmaps.search-by-bid-sid-or-title") }}' id="search-bar" class="input" value="{{ search_word }}">
+        <button onclick="searchMaps()" class="button" style="width: 200px">{{ t("admin.beatmaps.search") }}</button>
     </div>
     <div class="table-responsive py-3">
         <table class="table rounded">
             <thead>
                 <tr class="i-text-no-wrap">
-                    <th class="has-text-centered" style="width: 400px">{{t("admin.beatmaps.beatmap")}}</th>
-                    <th class="has-text-right">{{t("admin.beatmaps.cs-keys")}}</th>
-                    <th class="has-text-right">{{t("admin.beatmaps.ar")}}</th>
-                    <th class="has-text-right">{{t("admin.beatmaps.hp")}}</th>
-                    <th class="has-text-right">{{t("admin.beatmaps.od")}}</th>
-                    <th class="has-text-right">{{t("admin.beatmaps.bpm")}}</th>
-                    <th class="has-text-right">{{t("admin.beatmaps.stars")}}</th>
-                    <th class="has-text-centered">{{t("admin.beatmaps.status")}}</th>
-                    <th class="has-text-centered">{{t("admin.restrictions.action")}}</th>
+                    <th class="has-text-centered" style="width: 400px">{{ t("admin.beatmaps.beatmap") }}</th>
+                    <th class="has-text-right">{{ t("admin.beatmaps.cs-keys") }}</th>
+                    <th class="has-text-right">{{ t("admin.beatmaps.ar") }}</th>
+                    <th class="has-text-right">{{ t("admin.beatmaps.hp") }}</th>
+                    <th class="has-text-right">{{ t("admin.beatmaps.od") }}</th>
+                    <th class="has-text-right">{{ t("admin.beatmaps.bpm") }}</th>
+                    <th class="has-text-right">{{ t("admin.beatmaps.stars") }}</th>
+                    <th class="has-text-centered">{{ t("admin.beatmaps.status") }}</th>
+                    <th class="has-text-centered">{{ t("admin.restrictions.action") }}</th>
                 </tr>
             </thead>
             <tbody>
@@ -161,7 +161,7 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
                         <div class="dropdown is-right" id="i-dropdown-{{ i.map_id }}">
                             <div class="dropdown-trigger">
                                 <button class="button" aria-haspopup="true" aria-controls="dropdown-menu" onclick="document.getElementById('i-dropdown-{{ i.map_id }}').classList.toggle('is-active')">
-                                    <span>{{t("admin.beatmaps.edit-status")}}</span>
+                                    <span>{{ t("admin.beatmaps.edit-status") }}</span>
                                     <span class="icon is-small">
                                         <i class="fas fa-angle-down" aria-hidden="true"></i>
                                     </span>
@@ -169,15 +169,15 @@ <h2 class="section-title">{{t("admin.base.beatmaps")}}</h2>
                             </div>
                             <div class="dropdown-menu" id="dropdown-menu-{{ i.map_id }}" role="menu">
                                 <div class="dropdown-content has-background-primary">
-                                    <a class="dropdown-item {% if i.status == 2 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=2&set=0">{{t("admin.beatmaps.ranked-diff")}}</a>
-                                    <a class="dropdown-item {% if i.status == 5 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=5&set=0">{{t("admin.beatmaps.loved-diff")}}</a>
-                                    <a class="dropdown-item {% if i.status == 3 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=3&set=0">{{t("admin.beatmaps.approved-diff")}}</a>
-                                    <a class="dropdown-item {% if i.status == 0 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=0&set=0">{{t("admin.beatmaps.pending-diff")}}</a>
+                                    <a class="dropdown-item {% if i.status == 2 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=2&set=0">{{ t("admin.beatmaps.ranked-diff") }}</a>
+                                    <a class="dropdown-item {% if i.status == 5 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=5&set=0">{{ t("admin.beatmaps.loved-diff") }}</a>
+                                    <a class="dropdown-item {% if i.status == 3 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=3&set=0">{{ t("admin.beatmaps.approved-diff") }}</a>
+                                    <a class="dropdown-item {% if i.status == 0 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=0&set=0">{{ t("admin.beatmaps.pending-diff") }}</a>
                                     <hr class="dropdown-divider">
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=2&set=1">{{t("admin.beatmaps.ranked-set")}}</a>
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">{{t("admin.beatmaps.loved-set")}}</a>
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">{{t("admin.beatmaps.approved-set")}}</a>
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">{{t("admin.beatmaps.pending-set")}}</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=2&set=1">{{ t("admin.beatmaps.ranked-set") }}</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">{{ t("admin.beatmaps.loved-set") }}</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">{{ t("admin.beatmaps.approved-set") }}</a>
+                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">{{ t("admin.beatmaps.pending-set") }}</a>
                                 </div>
                             </div>
                         </div>
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index 7a2253e2..2248d6cd 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -24,8 +24,8 @@
         onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
     </div>
     <div class="column is-paddingless flex-vcenter">
-      <h2 class="section-title">{{t("admin.base.restrictions")}}</h2>
-      <p class="section-lead">{{t("admin.restrictions.welcome-to-restrictions-panel")}}</p>
+      <h2 class="section-title">{{ t("admin.base.restrictions") }}</h2>
+      <p class="section-lead">{{ t("admin.restrictions.welcome-to-restrictions-panel") }}</p>
     </div>
 </div>
 <div class="row row-deck row-cards" style="margin-top: 20px">
@@ -35,11 +35,11 @@ <h2 class="section-title">{{t("admin.base.restrictions")}}</h2>
                 <table class="table table-vcenter text-nowrap datatable rounded">
                     <thead>
                         <tr>
-                            <th class="has-text-right">{{t("admin.users.id")}}</th>
-                            <th>{{t("admin.users.flag-or-username")}}</th>
-                            <th class="has-text-centered">{{t("admin.restrictions.details")}}</th>
-                            <th class="has-text-centered">{{t("admin.restrictions.date")}}</th>
-                            <th class="has-text-centered">{{t("admin.restrictions.action")}}</th>
+                            <th class="has-text-right">{{ t("admin.users.id") }}</th>
+                            <th>{{ t("admin.users.flag-or-username") }}</th>
+                            <th class="has-text-centered">{{ t("admin.restrictions.details") }}</th>
+                            <th class="has-text-centered">{{ t("admin.restrictions.date") }}</th>
+                            <th class="has-text-centered">{{ t("admin.restrictions.action") }}</th>
                         </tr>
                     </thead>
                     <tbody>
@@ -61,8 +61,8 @@ <h2 class="section-title">{{t("admin.base.restrictions")}}</h2>
                                 {% endif %}
                             </td>
                             <td>
-                                <a class="btn text-nowrap" href="/admin/users/edit/{{ i.id }}">
-                                    <i class="far fa-edit" aria-hidden="true"></i> {{t("admin.users.edit")}}
+                                <a class="btn text-nowrap" href="/admin/user/{{ i.id }}/edit">
+                                    <i class="far fa-edit" aria-hidden="true"></i> {{ t("admin.users.edit") }}
                                 </a>
                             </td>
                         </tr>
diff --git a/templates/admin/users/edit.html b/templates/admin/users/edit.html
index df8e0672..2bd25451 100644
--- a/templates/admin/users/edit.html
+++ b/templates/admin/users/edit.html
@@ -22,12 +22,12 @@
     <div class="is-flex is-align-items-center is-flex-direction-column">
         <article style="min-width: fit-content; width: 40vw;" class="panel is-primary">
             <p class="panel-heading">
-            {{t("admin.users.edit-info-of", name = search_data['name'])}}
+            {{ t("admin.users.edit-info-of", name = search_data['name']) }}
             </p>
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-id-card" aria-hidden="true"></i>
-                    {{t("admin.users.username")}}
+                    {{ t("admin.users.username") }}
                 </div>
                 <div class="column">
                     <input name="edit-username" type="text" class="input" value="{{ search_data.name }}">
@@ -36,7 +36,7 @@
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-envelope" aria-hidden="true"></i>
-                    {{t("admin.users.email")}}
+                    {{ t("admin.users.email") }}
                 </div>
                 <div class="column">
                     <input name="edit-email" type="text" class="input" value="{{ search_data.email }}">
@@ -45,7 +45,7 @@
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-globe-americas" aria-hidden="true"></i>
-                    {{t("admin.users.country")}}
+                    {{ t("admin.users.country") }}
                 </div>
                 <div class="column is-flex gap-2 is-align-items-center">
                     <img id="country-preview" src="/static/images/flags/{{ search_data.country | upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">
@@ -59,35 +59,35 @@
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-key" aria-hidden="true"></i>
-                    {{t("admin.users.password")}}
+                    {{ t("admin.users.password") }}
                 </div>
                 <div class="column">
-                    <input name="password" type="text" class="input" placeholder='{{t("admin.users.new-password")}}'>
+                    <input name="password" type="text" class="input" placeholder='{{ t("admin.users.new-password") }}'>
                 </div>
             </div>
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-ban"  aria-hidden="true"></i>
-                    {{t("admin.users.legality")}}
+                    {{ t("admin.users.legality") }}
                 </div>
                 <div class="column">
                     <div class="select w-100">
                         <select name="legality" class="w-100">
-                            <option value="unrestricted">{{t("admin.users.unrestricted")}}</option>
+                            <option value="unrestricted">{{ t("admin.users.unrestricted") }}</option>
                             {% if search_data.priv == 2 %}
-                            <option value="restricted" selected>{{t("admin.users.restricted")}}</option>
+                            <option value="restricted" selected>{{ t("admin.users.restricted") }}</option>
                             {% endif %}
                             {% if search_data.priv != 2 %}
-                            <option value="restricted">{{t("admin.users.restricted")}}</option>
+                            <option value="restricted">{{ t("admin.users.restricted") }}</option>
                             {% endif %}
                         </select>
                     </div>
                 </div>
             </div>
             <div class="panel-block pb-4">
-                <a href="./upload-scores" style="margin-right: 1em;" class="button is-info">{{t("admin.users.upload-new-score")}}</a>
+                <a href="./upload-scores" style="margin-right: 1em;" class="button is-info">{{ t("admin.users.upload-new-score") }}</a>
                 <div style="margin-left: auto;"></div>
-                <button type="submit" form="edit-user" style="margin-right: 1em; width: 100px;" class="button is-primary">{{t("admin.users.update")}}</button>
+                <button type="submit" form="edit-user" style="margin-right: 1em; width: 100px;" class="button is-primary">{{ t("admin.users.update") }}</button>
             </div>
         </article>
     </div>
diff --git a/templates/admin/users/index.html b/templates/admin/users/index.html
index 210da02f..a6e88098 100644
--- a/templates/admin/users/index.html
+++ b/templates/admin/users/index.html
@@ -34,23 +34,23 @@ <h2 class="section-title">{{ t("admin.base.users") }}</h2>
 <div class="card" style="margin-top: 20px">
     <div class="columns">
         <div class="column px-3 pb-2 pt-4 d-flex gap-2">
-            <input id="search-bar" class="input" v-model.trim="search" placeholder='{{t("admin.users.search-by-username-or-email")}}'
+            <input id="search-bar" class="input" v-model.trim="search" placeholder='{{ t("admin.users.search-by-username-or-email") }}'
                 value="{{ search_value }}">
-            <a class="button is-primary" onclick="searchUsers()">{{t("admin.users.search")}}</a>
+            <a class="button is-primary" onclick="searchUsers()">{{ t("admin.users.search") }}</a>
         </div>
     </div>
     <div class="table-responsive">
         <table class="table card-table table-vcenter text-nowrap datatable rounded">
             <thead>
                 <tr>
-                    <th class="has-text-right">{{t("admin.users.id")}}</th>
-                    <th>{{t("admin.users.flag-or-username")}}</th>
-                    <th class="has-text-centered">{{t("admin.users.privilege")}}</th>
-                    <th class="has-text-centered">{{t("admin.users.last-login")}}</th>
-                    <th class="has-text-centered">{{t("admin.users.joined-at")}}</th>
-                    <th class="has-text-centered">{{t("admin.users.client-channel")}}</th>
-                    <th class="has-text-centered">{{t("admin.users.email")}}</th>
-                    <th class="has-text-centered">{{t("admin.users.ip")}}</th>
+                    <th class="has-text-right">{{ t("admin.users.id") }}</th>
+                    <th>{{ t("admin.users.flag-or-username") }}</th>
+                    <th class="has-text-centered">{{ t("admin.users.privilege") }}</th>
+                    <th class="has-text-centered">{{ t("admin.users.last-login") }}</th>
+                    <th class="has-text-centered">{{ t("admin.users.joined-at") }}</th>
+                    <th class="has-text-centered">{{ t("admin.users.client-channel") }}</th>
+                    <th class="has-text-centered">{{ t("admin.users.email") }}</th>
+                    <th class="has-text-centered">{{ t("admin.users.ip") }}</th>
                     <th class="has-text-centered"></th>
                 </tr>
             </thead>
@@ -97,7 +97,7 @@ <h2 class="section-title">{{ t("admin.base.users") }}</h2>
                     </td>
                     <td class="has-text-centered">
                         <a class="btn text-nowrap" href="/admin/user/{{ i.id }}/edit">
-                            <i class="far fa-edit" aria-hidden="true"></i> {{t("admin.users.edit")}}
+                            <i class="far fa-edit" aria-hidden="true"></i> {{ t("admin.users.edit") }}
                         </a>
                     </td>
                 </tr>
diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index 7e06157e..c2b30730 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -43,13 +43,13 @@
 <div class="is-flex is-align-items-center is-flex-direction-column pt-4">
     <article style="min-width: fit-content; width: 60vw;" class="panel is-primary">
         <p class="panel-heading">
-            {{t("admin.upload-replay.upload-score-for", name = search_data['name'])}}
+            {{ t("admin.upload-replay.upload-score-for", name = search_data['name']) }}
         </p>
         <form id="osr-reader" onsubmit="event.preventDefault()">
             <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-id-card" aria-hidden="true"></i>
-                    {{t("admin.upload-replay.osu-replay-file")}}
+                    {{ t("admin.upload-replay.osu-replay-file") }}
                 </div>
                 <div class="column py-0 is-flex is-align-items-center gap-2">
                     <div class="file" id="form-replay-file-label">
@@ -60,7 +60,7 @@
                                     <i class="fas fa-upload"></i>
                                 </span>
                                 <span class="file-label">
-                                    {{t("admin.upload-replay.upload-osr-file")}}
+                                    {{ t("admin.upload-replay.upload-osr-file") }}
                                 </span>
                             </span>
                         </label>
@@ -74,7 +74,7 @@
             <!-- <div class="panel-block columns is-hidden" >
                 <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-id-card" aria-hidden="true"></i>
-                    {{t("admin.users.id")}}
+                    {{ t("admin.users.id") }}
                 </div>
                 <div class="column py-0">
                     <input name="userid" type="text" class="input" value="{{ search_data.id }}" required>
@@ -83,21 +83,21 @@
             <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fab fa-octopus-deploy"></i>
-                    {{t("global.grade")}}
+                    {{ t("global.grade") }}
                 </div>
                 <div class="column py-0">
                     <div class="select w-100">
                         <select name="grade" class="w-100" required>
-                            <option value="N">{{t("global.grades-N")}}</option>
-                            <option value="F">{{t("global.grades-F")}}</option>
-                            <option value="D">{{t("global.grades-D")}}</option>
-                            <option value="C">{{t("global.grades-C")}}</option>
-                            <option value="B">{{t("global.grades-B")}}</option>
-                            <option value="A">{{t("global.grades-A")}}</option>
-                            <option value="S">{{t("global.grades-S")}}</option>
-                            <option value="SH">{{t("global.grades-SH")}}</option>
-                            <option value="X">{{t("global.grades-X")}}</option>
-                            <option value="XH">{{t("global.grades-XH")}}</option>
+                            <option value="N">{{ t("global.grades-N") }}</option>
+                            <option value="F">{{ t("global.grades-F") }}</option>
+                            <option value="D">{{ t("global.grades-D") }}</option>
+                            <option value="C">{{ t("global.grades-C") }}</option>
+                            <option value="B">{{ t("global.grades-B") }}</option>
+                            <option value="A">{{ t("global.grades-A") }}</option>
+                            <option value="S">{{ t("global.grades-S") }}</option>
+                            <option value="SH">{{ t("global.grades-SH") }}</option>
+                            <option value="X">{{ t("global.grades-X") }}</option>
+                            <option value="XH">{{ t("global.grades-XH") }}</option>
                         </select>
                     </div>
                 </div>
@@ -105,15 +105,15 @@
             <div class="panel-block columns">
                 <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fa-solid fa-server"></i>
-                    {{t("global.server")}}
+                    {{ t("global.server") }}
                 </div>
                 <div class="column py-0">
                     <div class="select w-100">
                         <select name="server" class="w-100" required>
-                            <option value="bancho">{{t("global.bancho")}}</option>
-                            <option value="ppysb">{{t("global.ppy-sb")}}</option>
-                            <option value="akatsuki">{{t("global.akatsuki")}}</option>
-                            <option value="offline">{{t("global.server-offline")}}</option>
+                            <option value="bancho">{{ t("global.bancho") }}</option>
+                            <option value="ppysb">{{ t("global.ppy-sb") }}</option>
+                            <option value="akatsuki">{{ t("global.akatsuki") }}</option>
+                            <option value="offline">{{ t("global.server-offline") }}</option>
                         </select>
                     </div>
                 </div>
@@ -129,7 +129,7 @@
             <!-- <div class="panel-block columns" >
                 <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
                     <i class="fas fa-user-check"></i>
-                    {{t("admin.upload-replay.identifier-type")}}
+                    {{ t("admin.upload-replay.identifier-type") }}
                 </div>
                 <div class="column py-0">
                     <div class="field has-addons w-100 pt-3">
@@ -137,11 +137,11 @@
                             <span class="select">
                                 <select name="identifier_type" required>
                                     <option value="replay_username">
-                                        {{t("admin.upload-replay.identifier-types.replay_username")}}</option>
+                                        {{ t("admin.upload-replay.identifier-types.replay_username") }}</option>
                                     <option value="server_userid">
-                                        {{t("admin.upload-replay.identifier-types.server_userid")}}
+                                        {{ t("admin.upload-replay.identifier-types.server_userid") }}
                                     </option>
-                                    <option value="replay_id">{{t("admin.upload-replay.identifier-types.replay_id")}}
+                                    <option value="replay_id">{{ t("admin.upload-replay.identifier-types.replay_id") }}
                                     </option>
                                 </select>
                             </span>
@@ -262,7 +262,7 @@
             <div class="panel-block pb-4">
                 <div style="margin-left: auto;"></div>
                 <button type="submit" form="submit-replay"
-                    class="button is-primary">{{t("admin.upload-replay.upload")}}</button>
+                    class="button is-primary">{{ t("admin.upload-replay.upload") }}</button>
                 <div style="margin-right: 1em;"></div>
             </div>
         </form>
diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index f33cd91a..95caa20e 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -45,7 +45,7 @@
         <div class="navbar-end">
             <div class="navbar-item has-dropdown is-hoverable" style="align-items: center;">
                 <div class="navbar-search">
-                    <input autocomplete="off" type="text" placeholder='{{t("navbar.looking-for-someone")}}' id="u-search" oninput="searchUser()">
+                    <input autocomplete="off" type="text" placeholder='{{ t("navbar.looking-for-someone") }}' id="u-search" oninput="searchUser()">
                 </div>
                 <div id="u-search-content" class="navbar-dropdown" style="display: none;">
                 </div>
diff --git a/templates/settings/sidebar.html b/templates/settings/sidebar.html
index 84ff8497..5166de1f 100644
--- a/templates/settings/sidebar.html
+++ b/templates/settings/sidebar.html
@@ -21,7 +21,7 @@
             <i class="fas fa-air-freshener"></i><span class="single-menu--text"> {{ t('settings.customisation') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/aboutme">
-            <i class="fas fa-air-freshener"></i><span class="single-menu--text">{{t("settings.about-me")}}</span>
+            <i class="fas fa-air-freshener"></i><span class="single-menu--text">{{ t("settings.about-me") }}</span>
         </a>
     </div>
 </div>
diff --git a/utils/i18n/commands/format-html.ts b/utils/i18n/commands/format-html.ts
index f3631d80..2f176382 100644
--- a/utils/i18n/commands/format-html.ts
+++ b/utils/i18n/commands/format-html.ts
@@ -11,9 +11,10 @@ const { Spinner } = clui
 
 const doWork = async (match: string): Promise<void> => {
   try {
-    const template = await fs.readFile(match, { encoding: 'utf8' })
-    const wb = template.replace(/\{\{\s?t\('(.*)'\s?(,\s?(.+)\s?)?\)\s?\}\}/gmu, '{{ t(\'$1\'$2) }}')
-    await fs.writeFile(match, wb, 'utf8')
+    let template = await fs.readFile(match, { encoding: 'utf8' })
+    template = template.replace(/\{\{\s?t\('(.*)'\s?(,\s?(.+)\s?)?\)\s?\}\}/gmu, '{{ t(\'$1\'$2) }}')
+    template = template.replace(/\{\{\s?t\("(.*)"\s?(,\s?(.+)\s?)?\)\s?\}\}/gmu, '{{ t("$1"$2) }}')
+    await fs.writeFile(match, template, 'utf8')
   } catch (error) {
     console.error(error)
   }

From 00332f5316452d9244395fef943e921dd43b82c9 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 13 Aug 2022 09:41:33 +0000
Subject: [PATCH 227/278] remove N grade

---
 templates/admin/users/upload-scores.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index c2b30730..7a0b2411 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -88,7 +88,7 @@
                 <div class="column py-0">
                     <div class="select w-100">
                         <select name="grade" class="w-100" required>
-                            <option value="N">{{ t("global.grades-N") }}</option>
+                            <!-- <option value="N">{{ t("global.grades-N") }}</option> -->
                             <option value="F">{{ t("global.grades-F") }}</option>
                             <option value="D">{{ t("global.grades-D") }}</option>
                             <option value="C">{{ t("global.grades-C") }}</option>

From 700ae5d2c14baace484b2e20e6891e8237c0ac72 Mon Sep 17 00:00:00 2001
From: DAYGoodTime <ken570015@163.com>
Date: Sat, 13 Aug 2022 09:43:42 +0000
Subject: [PATCH 228/278] patch new translation key

---
 locales/default/admin/upload-replay/en-GB.yml | 1 +
 locales/default/admin/upload-replay/en-US.yml | 1 +
 locales/default/admin/upload-replay/zh-CN.yml | 1 +
 locales/default/settings/en-GB.yml            | 3 +--
 locales/default/settings/en-US.yml            | 1 -
 locales/default/settings/zh-CN.yml            | 2 +-
 templates/settings/custom.html                | 2 +-
 templates/settings/sidebar.html               | 2 +-
 8 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/locales/default/admin/upload-replay/en-GB.yml b/locales/default/admin/upload-replay/en-GB.yml
index a8769997..2644b3a6 100644
--- a/locales/default/admin/upload-replay/en-GB.yml
+++ b/locales/default/admin/upload-replay/en-GB.yml
@@ -18,3 +18,4 @@ upload: Upload
 perfect: Is perfect
 osu-replay-file: Osu replay file
 upload-osr-file: Upload osr file
+foreign-score-id: Foreign score id
diff --git a/locales/default/admin/upload-replay/en-US.yml b/locales/default/admin/upload-replay/en-US.yml
index af8375ca..d4e26a69 100644
--- a/locales/default/admin/upload-replay/en-US.yml
+++ b/locales/default/admin/upload-replay/en-US.yml
@@ -18,3 +18,4 @@ upload: Upload
 perfect: Is perfect
 osu-replay-file: Osu replay file
 upload-osr-file: Upload osr file
+foreign-score-id: Foreign score id
diff --git a/locales/default/admin/upload-replay/zh-CN.yml b/locales/default/admin/upload-replay/zh-CN.yml
index 33ff6569..0c9b28be 100644
--- a/locales/default/admin/upload-replay/zh-CN.yml
+++ b/locales/default/admin/upload-replay/zh-CN.yml
@@ -18,3 +18,4 @@ upload: 上传
 perfect: 是否为perfect
 osu-replay-file: osu回放文件
 upload-osr-file: 上传osr文件
+foreign-score-id: 外部来源的成绩id
diff --git a/locales/default/settings/en-GB.yml b/locales/default/settings/en-GB.yml
index 2d08283d..fd09d891 100644
--- a/locales/default/settings/en-GB.yml
+++ b/locales/default/settings/en-GB.yml
@@ -5,7 +5,7 @@ avatar-description: >-
 choose-file: Choose file
 save: Save
 preview: Preview
-customisation: Customisation
+customization: Customisation
 banner: Banner
 banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
 profile-background: Profile Background
@@ -21,5 +21,4 @@ settings: Settings
 bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, or .PNG file!
 change-succeed: Your %{something} has been successfully changed!
 no-image-was-selected: No image was selected!
-customization: Customization
 about-me: About Me
diff --git a/locales/default/settings/en-US.yml b/locales/default/settings/en-US.yml
index 3875fa68..ffe62a83 100644
--- a/locales/default/settings/en-US.yml
+++ b/locales/default/settings/en-US.yml
@@ -5,7 +5,6 @@ avatar-description: >-
 choose-file: Choose file
 save: Save
 preview: Preview
-customisation: Customisation
 banner: Banner
 banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
 profile-background: Profile Background
diff --git a/locales/default/settings/zh-CN.yml b/locales/default/settings/zh-CN.yml
index 19485c77..515636ce 100644
--- a/locales/default/settings/zh-CN.yml
+++ b/locales/default/settings/zh-CN.yml
@@ -3,7 +3,7 @@ avatar-description: 我们建议至少上传分辨率为 512x512 (或者长宽
 choose-file: 选择一张图片
 save: 保存
 preview: 预览
-customisation: 个性化
+customization: 个性化
 banner: 背景横幅
 banner-description: 建议上传分辨率为 1440x262 的 GIF, PNG, JPG, JPEG 等四种格式的图片
 profile-background: 资料背景
diff --git a/templates/settings/custom.html b/templates/settings/custom.html
index f88f9063..d2a32377 100644
--- a/templates/settings/custom.html
+++ b/templates/settings/custom.html
@@ -9,7 +9,7 @@
   <div class="block-content right" id="settings-content">
     <div class="single-right-block">
       <div class="right-block-header">
-          {{ t('settings.customisation') }}
+          {{ t('settings.customization') }}
       </div>
       <div class="right-block-content">
         <div class="flex avatar-flex">
diff --git a/templates/settings/sidebar.html b/templates/settings/sidebar.html
index 5166de1f..f31b4ab9 100644
--- a/templates/settings/sidebar.html
+++ b/templates/settings/sidebar.html
@@ -18,7 +18,7 @@
             <i class="fas fa-lock"></i><span class="single-menu--text"> {{ t('global.password') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/custom">
-            <i class="fas fa-air-freshener"></i><span class="single-menu--text"> {{ t('settings.customisation') }} </span>
+            <i class="fas fa-air-freshener"></i><span class="single-menu--text"> {{ t('settings.customization') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/aboutme">
             <i class="fas fa-air-freshener"></i><span class="single-menu--text">{{ t("settings.about-me") }}</span>

From 09019aabd4b9da75d21695ea07893f4fb7a0a3d4 Mon Sep 17 00:00:00 2001
From: TrueRou/usr/local/bin/python <chenbohan911@163.com>
Date: Sun, 14 Aug 2022 04:07:40 +0000
Subject: [PATCH 229/278] bump version (1.4.0)

---
 objects/glob.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/objects/glob.py b/objects/glob.py
index 0cfa91cd..ff56bd2d 100644
--- a/objects/glob.py
+++ b/objects/glob.py
@@ -20,7 +20,7 @@
 http: 'ClientSession'
 version: 'Version'
 app = Quart(__name__, template_folder=f'{os.getcwd()}/templates', static_folder=f'{os.getcwd()}/static')
-version = Version(1, 3, 7)
+version = Version(1, 4, 0)
 
 cache = {
     'bcrypt': {},

From d6f32e397899ced31fee3dc330de304768b6e1ed Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 14 Aug 2022 06:53:37 +0000
Subject: [PATCH 230/278] remove config, rename 'using' to 'useLocales'

---
 .gitignore                    | 4 ++--
 config.js => config.sample.js | 2 +-
 utils/i18n/config.ts          | 4 ++--
 3 files changed, 5 insertions(+), 5 deletions(-)
 rename config.js => config.sample.js (75%)

diff --git a/.gitignore b/.gitignore
index 4ca1059b..bf49449a 100644
--- a/.gitignore
+++ b/.gitignore
@@ -149,7 +149,7 @@ yarn.lock
 
 .vscode/launch.json
 
-# custom language pack
-locales/**/*.custom.yml
+# js utils config
+config.js
 # compiled locales
 .locales
\ No newline at end of file
diff --git a/config.js b/config.sample.js
similarity index 75%
rename from config.js
rename to config.sample.js
index deee6277..4f3327f7 100644
--- a/config.js
+++ b/config.sample.js
@@ -1,4 +1,4 @@
-export const using = [
+export const useLocales = [
   'locales/default', // default locales
   ['locales/ppy.sb', {
     only: 'home'
diff --git a/utils/i18n/config.ts b/utils/i18n/config.ts
index 526449a6..7b38e118 100644
--- a/utils/i18n/config.ts
+++ b/utils/i18n/config.ts
@@ -3,7 +3,7 @@
 import { join } from 'path'
 import { merge } from 'lodash'
 
-import { using } from '../../config.js'
+import { useLocales } from '../../config.js'
 
 export const compiledFileNameSchema = ['namespace', 'locale', 'extension'] as Array<'namespace' | 'locale' | 'extension'>
 export const compiledFileSchema = ['locale', 'entries']
@@ -19,7 +19,7 @@ export type LocalePathConfig =
     }>]
 
 // eslint-disable-next-line array-callback-return
-export const paths = (using as LocalePathConfig[]).map((p) => {
+export const paths = (useLocales as LocalePathConfig[]).map((p) => {
   if (typeof p === 'string') {
     return {
       path: join(__dirname, '../../', p),

From becdde9124035d6e58f7e4458cad79d8229e087e Mon Sep 17 00:00:00 2001
From: DAYGoodTime <ken570015@163.com>
Date: Sun, 14 Aug 2022 15:32:22 +0000
Subject: [PATCH 231/278] patch missing translation and reset some key

---
 locales/default/global/en-GB.yml           |  8 ++++----
 locales/default/global/en-US.yml           |  8 ++++----
 locales/default/global/zh-CN.yml           |  8 ++++----
 locales/default/profile/en-GB.yml          |  2 ++
 locales/default/profile/en-US.yml          |  2 ++
 locales/default/profile/zh-CN.yml          |  2 ++
 locales/default/settings/en-GB.yml         |  3 +++
 locales/default/settings/en-US.yml         |  3 +++
 locales/default/settings/profile/en-GB.yml |  2 +-
 locales/default/settings/zh-CN.yml         |  3 +++
 templates/home.html                        |  8 ++++----
 templates/profile.html                     |  4 ++--
 templates/settings/aboutme.html            | 12 ++++++------
 templates/settings/avatar.html             | 10 +++++-----
 templates/settings/custom.html             |  8 ++++----
 templates/settings/password.html           |  8 ++++----
 templates/settings/profile.html            | 10 +++++-----
 17 files changed, 58 insertions(+), 43 deletions(-)

diff --git a/locales/default/global/en-GB.yml b/locales/default/global/en-GB.yml
index dbc12ec7..ddbcd319 100644
--- a/locales/default/global/en-GB.yml
+++ b/locales/default/global/en-GB.yml
@@ -7,10 +7,10 @@ login: Login
 profile: Profile
 register: Register
 password: Password
-warning: Warning
-notice: Notice
-error: uh oh! Be careful!
-success: Hey! Listen!
+bannertype-error: Warning
+bannertype-success: Notice
+bannertext-error: uh oh! Be careful!
+bannertext-success: Hey! Listen!
 verify: Verify
 pp: pp
 accuracy: Accuracy
diff --git a/locales/default/global/en-US.yml b/locales/default/global/en-US.yml
index dbc12ec7..ddbcd319 100644
--- a/locales/default/global/en-US.yml
+++ b/locales/default/global/en-US.yml
@@ -7,10 +7,10 @@ login: Login
 profile: Profile
 register: Register
 password: Password
-warning: Warning
-notice: Notice
-error: uh oh! Be careful!
-success: Hey! Listen!
+bannertype-error: Warning
+bannertype-success: Notice
+bannertext-error: uh oh! Be careful!
+bannertext-success: Hey! Listen!
 verify: Verify
 pp: pp
 accuracy: Accuracy
diff --git a/locales/default/global/zh-CN.yml b/locales/default/global/zh-CN.yml
index 32e5dea7..3ea3f672 100644
--- a/locales/default/global/zh-CN.yml
+++ b/locales/default/global/zh-CN.yml
@@ -6,10 +6,10 @@ leaderboard: 排行榜
 login: 登录
 profile: 用户信息
 register: 注册
-notice: Notice
-warning: 注意
-error: uh oh! Be careful!
-success: Hey! Listen!
+bannertype-success: 操作成功
+bannertype-error: 出错了
+bannertext-error: 下次注意点
+bannertext-success: 暂时没什么问题
 verify: 验证
 acc: Acc
 accuracy: 准确度
diff --git a/locales/default/profile/en-GB.yml b/locales/default/profile/en-GB.yml
index 171763f2..84089a11 100644
--- a/locales/default/profile/en-GB.yml
+++ b/locales/default/profile/en-GB.yml
@@ -10,3 +10,5 @@ by: by
 global-rank: Global Rank
 country-rank: Country Rank
 name-aka: name aka
+about-me-title: About me
+rank-title: Rank
diff --git a/locales/default/profile/en-US.yml b/locales/default/profile/en-US.yml
index 0459c1d1..70d998b1 100644
--- a/locales/default/profile/en-US.yml
+++ b/locales/default/profile/en-US.yml
@@ -10,3 +10,5 @@ by: by
 country-rank: Country Rank
 global-rank: Global Rank
 name-aka: name aka
+about-me-title: About me
+rank-title: Rank
diff --git a/locales/default/profile/zh-CN.yml b/locales/default/profile/zh-CN.yml
index d03d3290..bbf9ed23 100644
--- a/locales/default/profile/zh-CN.yml
+++ b/locales/default/profile/zh-CN.yml
@@ -10,3 +10,5 @@ by: 作者
 country-rank: 国内排名
 global-rank: 全球排名
 name-aka: 别名
+about-me-title: 个人介绍
+rank-title: 排名情况
diff --git a/locales/default/settings/en-GB.yml b/locales/default/settings/en-GB.yml
index fd09d891..f01cd416 100644
--- a/locales/default/settings/en-GB.yml
+++ b/locales/default/settings/en-GB.yml
@@ -22,3 +22,6 @@ bad-image-extension: The %{something} you select must be either a .JPG, .JPEG, o
 change-succeed: Your %{something} has been successfully changed!
 no-image-was-selected: No image was selected!
 about-me: About Me
+about-me-title: About Me
+avatar-title: Upload avatar
+api-key: API Key
diff --git a/locales/default/settings/en-US.yml b/locales/default/settings/en-US.yml
index ffe62a83..1d6d73c7 100644
--- a/locales/default/settings/en-US.yml
+++ b/locales/default/settings/en-US.yml
@@ -23,3 +23,6 @@ change-succeed: Your %{something} has been successfully changed!
 no-image-was-selected: No image was selected!
 customization: Customization
 about-me: About Me
+about-me-title: About Me
+avatar-title: Upload avatar
+api-key: API Key
diff --git a/locales/default/settings/profile/en-GB.yml b/locales/default/settings/profile/en-GB.yml
index 111f48b6..c8fc0d11 100644
--- a/locales/default/settings/profile/en-GB.yml
+++ b/locales/default/settings/profile/en-GB.yml
@@ -5,4 +5,4 @@ new-username-cannot-contains-both-dash-and-space: Your new username may contain
 new-username-disallowed: Your new username isn't allowed; pick another.
 new-username-already-taken-by-others: Your new username already taken by another user.
 new-email-is-invalid: Your new email syntax is invalid.
-succeed-please-login-again: Your username/email have been changed! Please login again.
+succeed-please-login-again: Your username/email have been changed! Please login again.
\ No newline at end of file
diff --git a/locales/default/settings/zh-CN.yml b/locales/default/settings/zh-CN.yml
index 515636ce..a8a351fb 100644
--- a/locales/default/settings/zh-CN.yml
+++ b/locales/default/settings/zh-CN.yml
@@ -21,3 +21,6 @@ bad-image-extension: 你选择的%{something}必须是 .jpg .jpeg .png 这三种
 change-succeed: 你的 %{something}已经修改成功!
 no-image-was-selected: 请选择一张图片
 about-me: 个人介绍
+about-me-title: 编辑个人介绍
+avatar-title: 上传头像
+api-key: API 秘钥
diff --git a/templates/home.html b/templates/home.html
index b3f57553..5c799b15 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -15,16 +15,16 @@
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-          {{ t('global.warning') }}
+          {{ t('global.bannertype-error') }}
           {% elif status=='success' %}
-          {{ t('global.notice') }}
+          {{ t('global.bannertype-success') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          {{ t('global.error') }}
+          {{ t('global.bannertext-error') }}
           {% elif status=='success' %}
-          {{ t('global.success') }}
+          {{ t('global.bannertext-success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/profile.html b/templates/profile.html
index 99dcc9e9..1dc93011 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -6,7 +6,7 @@
 <div class="log-block">
     <div class="header">
         <div class="title">
-            <i class="fas fa-address-book"></i> About me
+            <i class="fas fa-address-book"></i> {{ t("profile.about-me-title") }}
         </div>
     </div>
     <div class="stats-block rank-block" style="padding: 12.5px;">
@@ -341,7 +341,7 @@ <h1 class="title">
                 </div> -->
                 <div class="header" v-if='data.stats.out[modegulag].rank != 0'>
                     <div class="title">
-                        <i class="fas fa-user-friends"></i> Rank
+                        <i class="fas fa-user-friends"></i> {{ t("profile.rank-title") }}
                     </div>
                 </div>
                 <div class="stats-block rank-block" v-if='data.stats.out[modegulag].rank != 0'>
diff --git a/templates/settings/aboutme.html b/templates/settings/aboutme.html
index 77c8b84e..4852be51 100644
--- a/templates/settings/aboutme.html
+++ b/templates/settings/aboutme.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} {{ t('global.password') }} {% endblock %}
+{% block title %} {{ t('settings.about-me') }} {% endblock %}
 
 {% block content %}
 <link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ appVersion() }} ">
@@ -9,7 +9,7 @@
   <div class="block-content right" id="settings-content">
     <div id="general" class="single-right-block">
       <div class="right-block-header">
-          About Me
+          {{ t("settings.about-me-title") }}
       </div>
       <form style=" margin-left: 20px; margin-right: 20px;" action="/settings/aboutme" method="post" class="right-block-content">
         <textarea name="userpage_content" class="input" style="max-width: 800px; min-height: 300px;">{{ userpage_content }}</textarea>
@@ -26,16 +26,16 @@
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-            {{ t('global.warning') }}
+            {{ t('global.bannertype-error') }}
           {% elif status=='success' %}
-            {{ t('global.notice') }}
+            {{ t('global.bannertype-success') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-            {{ t('global.error') }}
+            {{ t('global.bannertext-error') }}
           {% elif status=='success' %}
-            {{ t('global.success') }}
+            {{ t('global.bannertext-success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/avatar.html b/templates/settings/avatar.html
index f07b45c9..16536458 100644
--- a/templates/settings/avatar.html
+++ b/templates/settings/avatar.html
@@ -15,7 +15,7 @@
         <div class="flex avatar-flex">
           <div class="column">
             <div class="single-block-content avatar-block-content">
-              <h4 class="mb-4">{{ t('settings.avatar') }}</h4>
+              <h4 class="mb-4">{{ t('settings.avatar-title') }}</h4>
               <div class="subtitle">{{ t('settings.avatar-description') }}</div>
               <form id="upload-profile" action="/settings/avatar" method="post" enctype="multipart/form-data">
                 <div class="buttons margin-top" id="selection">
@@ -77,16 +77,16 @@ <h4 class="mb-4">{{ t('settings.preview') }}</h4>
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-            {{ t('global.warning') }}
+            {{ t('global.bannertype-error') }}
           {% elif status=='success' %}
-            {{ t('global.notice') }}
+            {{ t('global.bannertype-success') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-            {{ t('global.error') }}
+            {{ t('global.bannertext-error') }}
           {% elif status=='success' %}
-            {{ t('global.success') }}
+            {{ t('global.bannertype-success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/custom.html b/templates/settings/custom.html
index d2a32377..0f5ad976 100644
--- a/templates/settings/custom.html
+++ b/templates/settings/custom.html
@@ -109,16 +109,16 @@ <h4 class="mb-4">{{ t('settings.preview') }}</h4>
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-            {{ t('global.warning') }}
+            {{ t('global.bannertype-error') }}
           {% elif status=='success' %}
-            {{ t('global.notice') }}
+            {{ t('global.bannertype-success') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          {{ t('global.error') }}
+          {{ t('global.bannertext-error') }}
           {% elif status=='success' %}
-          {{ t('global.success') }}
+          {{ t('global.bannertype-success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/password.html b/templates/settings/password.html
index adf7ab35..911efbc2 100644
--- a/templates/settings/password.html
+++ b/templates/settings/password.html
@@ -74,16 +74,16 @@
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-            {{ t('global.warning') }}
+            {{ t('global.bannertype-error') }}
           {% elif status=='success' %}
-            {{ t('global.notice') }}
+            {{ t('global.bannertype-success') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          {{ t('global.error') }}
+          {{ t('global.bannertext-error') }}
           {% elif status=='success' %}
-            {{ t('global.success') }}
+            {{ t('global.bannertype-success') }}
           {% endif %}
         </div>
       </div>
diff --git a/templates/settings/profile.html b/templates/settings/profile.html
index 4cb38797..12e9c38c 100644
--- a/templates/settings/profile.html
+++ b/templates/settings/profile.html
@@ -48,7 +48,7 @@
         <div class="single-block-content">
           <div class="block-content--left">
             <div class="field-label is-normal">
-              <label class="label">API Key</label>
+              <label class="label">{{ t("settings.api-key") }}</label>
             </div>
           </div>
           <div class="block-content--right">
@@ -75,16 +75,16 @@
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-            {{ t('global.warning') }}
+            {{ t('global.bannertype-error') }}
           {% elif status=='success' %}
-            {{ t('global.notice') }}
+            {{ t('global.bannertype-success') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
-          {{ t('global.error') }}
+          {{ t('global.bannertext-error') }}
           {% elif status=='success' %}
-            {{ t('global.success') }}
+            {{ t('global.bannertype-success') }}
           {% endif %}
         </div>
       </div>

From 7d6d159a378e65b78a5c21f5d1ca8f0b20cf51fc Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Tue, 16 Aug 2022 12:29:28 +0000
Subject: [PATCH 232/278] style update

---
 static/css/pages/admin/style.css | 2 +-
 static/css/style.css             | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/static/css/pages/admin/style.css b/static/css/pages/admin/style.css
index 4725366d..1c92aea0 100644
--- a/static/css/pages/admin/style.css
+++ b/static/css/pages/admin/style.css
@@ -1,5 +1,5 @@
 .admin-con {
-    margin-top: 53px!important
+    margin-top: 30px!important
 }
 
 .sidebar {
diff --git a/static/css/style.css b/static/css/style.css
index a0da46aa..6f8494bb 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -275,6 +275,7 @@ a.foot-link {
   width: 100%;
   transition: 0.2s ease;
   min-height: 0rem;
+  backdrop-filter: blur(5px);
 }
 
 .navbar-logo {

From 297201e10f80b316889152cd6f6de4df2e261c80 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Tue, 16 Aug 2022 12:35:46 +0000
Subject: [PATCH 233/278] add error report

---
 utils/i18n/config.ts | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/utils/i18n/config.ts b/utils/i18n/config.ts
index 7b38e118..4c86d2c6 100644
--- a/utils/i18n/config.ts
+++ b/utils/i18n/config.ts
@@ -3,8 +3,17 @@
 import { join } from 'path'
 import { merge } from 'lodash'
 
-import { useLocales } from '../../config.js'
+// import { useLocales } from '../../config.js'
+let useLocales
 
+try {
+  // eslint-disable-next-line @typescript-eslint/no-var-requires
+  const { useLocales: _useLocales } = require('../../config.js')
+  useLocales = _useLocales
+} catch (error) {
+  console.error('check if you created config.js')
+  process.exit(1)
+}
 export const compiledFileNameSchema = ['namespace', 'locale', 'extension'] as Array<'namespace' | 'locale' | 'extension'>
 export const compiledFileSchema = ['locale', 'entries']
 export const compiled = join(__dirname, '../../.locales')

From 091611074feaa5dd17aa431dce563fb258142f5f Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 25 Aug 2022 05:55:07 +0000
Subject: [PATCH 234/278] eslint

---
 .eslintrc.js                                 |  22 +-
 package.json                                 |   2 +
 static/js/_runtime-check.js                  |   6 +-
 static/js/main.js                            |   4 +
 static/js/pages/admin/beatmaps.js            |  13 +-
 static/js/pages/admin/dashboard.js           |  67 +-
 static/js/pages/admin/users.js               |  13 +-
 static/js/pages/admin/users/upload-scores.js |   1 +
 static/js/pages/leaderboard.js               | 163 ++--
 static/js/pages/profile.js                   | 764 +++++++++----------
 10 files changed, 543 insertions(+), 512 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 9d42242d..7d2a7dfc 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -1,6 +1,24 @@
+const globals = {
+  _testGlobals: 'readonly'
+}
+;`togglenavbar,
+searchUser,
+searchMaps,
+searchUsers,
+createState`.split(',').forEach(name => {
+    globals[name] = true
+  })
 module.exports = {
-  extends: 'standard-with-typescript',
+  extends: [
+    'plugin:jquery/deprecated',
+    'plugin:vue/recommended',
+    'standard-with-typescript'
+  ],
   parserOptions: {
     project: './tsconfig.json'
-  }
+  },
+  plugins: [
+    'jquery'
+  ],
+  globals
 }
diff --git a/package.json b/package.json
index c60c9f2f..d07c9cc0 100644
--- a/package.json
+++ b/package.json
@@ -33,8 +33,10 @@
     "eslint": "^8.0.1",
     "eslint-config-standard-with-typescript": "^22.0.0",
     "eslint-plugin-import": "^2.25.2",
+    "eslint-plugin-jquery": "^1.5.1",
     "eslint-plugin-n": "^15.0.0",
     "eslint-plugin-promise": "^6.0.0",
+    "eslint-plugin-vue": "^9.4.0",
     "glob": "^8.0.3",
     "js-yaml": "^4.1.0",
     "nodemon": "^2.0.16",
diff --git a/static/js/_runtime-check.js b/static/js/_runtime-check.js
index 10d5f3c1..8e5914ad 100644
--- a/static/js/_runtime-check.js
+++ b/static/js/_runtime-check.js
@@ -1,7 +1,9 @@
+/* eslint-disable no-unused-vars */
+
 // runtime check
-function _testGlobals({ exists = [] } = {}) {
+function _testGlobals ({ exists = [] } = {}) {
   const _scope = globalThis || window
   const result = exists.every(item => _scope[item] !== undefined)
 
   if (!result) throw new Error('runtime check failed: ')
-}
\ No newline at end of file
+}
diff --git a/static/js/main.js b/static/js/main.js
index b6d56ebf..cf63950e 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -1,3 +1,6 @@
+/* eslint-disable no-unused-vars */
+/* eslint-env jquery, browser */
+
 // sticky header
 $(window).scroll(() => {
   const header = document.getElementById('navbar')
@@ -26,6 +29,7 @@ function setStyle (el, obj) {
 }
 
 function searchUser () {
+  // eslint-disable-next-line no-undef
   _testGlobals(
     { exists: ['domain'] }
   )
diff --git a/static/js/pages/admin/beatmaps.js b/static/js/pages/admin/beatmaps.js
index fda6fe21..a4bddfe2 100644
--- a/static/js/pages/admin/beatmaps.js
+++ b/static/js/pages/admin/beatmaps.js
@@ -1,6 +1,7 @@
-function searchMaps() {
-    const search = document.getElementById('search-bar')
-    if (!search) return
-    if (search.value == '') window.location.href = '/admin/beatmaps'
-    else window.location.href = '/admin/beatmaps/search/' + search.value
-}
\ No newline at end of file
+// eslint-disable-next-line no-unused-vars
+function searchMaps () {
+  const search = document.getElementById('search-bar')
+  if (!search) return
+  if (search.value === '') window.location.href = '/admin/beatmaps'
+  else window.location.href = '/admin/beatmaps/search/' + search.value
+}
diff --git a/static/js/pages/admin/dashboard.js b/static/js/pages/admin/dashboard.js
index 8235b552..4fe2f080 100644
--- a/static/js/pages/admin/dashboard.js
+++ b/static/js/pages/admin/dashboard.js
@@ -1,39 +1,40 @@
 _testGlobals(
-    { exists: ['domain'] }
+  { exists: ['domain'] }
 )
 
+// eslint-disable-next-line no-undef, no-new
 new Vue({
-    el: "#dashboard",
-    delimiters: ["<%", "%>"],
-    data() {
-        return {
-            online_users: 0,
-        }
-    },
-    created() {
-        var vm = this;
-        vm.GetOnlineUsers()
-    },
-    methods: {
-        GetOnlineUsers() {
-            var vm = this;
-            vm.$axios.get(`//api.${window.domain}/get_player_count`)
-                .then(function (response) {
-                    vm.online_users = response.data.counts.online;
-                });
-        },
-        addCommas(nStr) {
-            nStr += '';
-            var x = nStr.split('.');
-            var x1 = x[0];
-            var x2 = x.length > 1 ? '.' + x[1] : '';
-            var rgx = /(\d+)(\d{3})/;
-            while (rgx.test(x1)) {
-                x1 = x1.replace(rgx, '$1' + ',' + '$2');
-            }
-            return x1 + x2;
-        }
+  el: '#dashboard',
+  delimiters: ['<%', '%>'],
+  data () {
+    return {
+      online_users: 0
+    }
+  },
+  computed: {
+  },
+  created () {
+    const vm = this
+    vm.GetOnlineUsers()
+  },
+  methods: {
+    GetOnlineUsers () {
+      const vm = this
+      vm.$axios.get(`//api.${window.domain}/get_player_count`)
+        .then(function (response) {
+          vm.online_users = response.data.counts.online
+        })
     },
-    computed: {
+    addCommas (nStr) {
+      nStr += ''
+      const x = nStr.split('.')
+      let x1 = x[0]
+      const x2 = x.length > 1 ? '.' + x[1] : ''
+      const rgx = /(\d+)(\d{3})/
+      while (rgx.test(x1)) {
+        x1 = x1.replace(rgx, '$1' + ',' + '$2')
+      }
+      return x1 + x2
     }
-});
+  }
+})
diff --git a/static/js/pages/admin/users.js b/static/js/pages/admin/users.js
index 93ee41d1..b36bf49d 100644
--- a/static/js/pages/admin/users.js
+++ b/static/js/pages/admin/users.js
@@ -1,6 +1,7 @@
-function searchUsers() {
-    const search = document.getElementById('search-bar')
-    if (!search) return
-    if (search.value == '') window.location.href = '/admin/users'
-    else window.location.href = '/admin/users/search/' + search.value
-}
\ No newline at end of file
+// eslint-disable-next-line no-unused-vars
+function searchUsers () {
+  const search = document.getElementById('search-bar')
+  if (!search) return
+  if (search.value === '') window.location.href = '/admin/users'
+  else window.location.href = '/admin/users/search/' + search.value
+}
diff --git a/static/js/pages/admin/users/upload-scores.js b/static/js/pages/admin/users/upload-scores.js
index 462a0d93..b9ade2c7 100644
--- a/static/js/pages/admin/users/upload-scores.js
+++ b/static/js/pages/admin/users/upload-scores.js
@@ -1,3 +1,4 @@
+/* globals createState */
 /* eslint-disable no-unused-vars */
 
 const { nonReactive, reactive: s, useHook, forceUpdate, transaction } = createState({
diff --git a/static/js/pages/leaderboard.js b/static/js/pages/leaderboard.js
index e7c5d0dd..51172080 100644
--- a/static/js/pages/leaderboard.js
+++ b/static/js/pages/leaderboard.js
@@ -1,88 +1,89 @@
+
+// eslint-disable-next-line no-undef
 _testGlobals({ exists: ['flags', 'mode', 'mods', 'sort', 'domain'] })
 
+// eslint-disable-next-line no-new, no-undef
 new Vue({
-    el: "#app",
-    delimiters: ["<%", "%>"],
-    data() {
-        return {
-            flags: window.flags,
-            boards: {},
-            mode: window.mode || 'std',
-            mods: window.mods || 'vn',
-            sort: window.sort || 'pp',
-            load: false,
-            no_player: false, // soon ^TM
-        };
+  el: '#app',
+  delimiters: ['<%', '%>'],
+  data () {
+    return {
+      flags: window.flags,
+      boards: {},
+      mode: window.mode || 'std',
+      mods: window.mods || 'vn',
+      sort: window.sort || 'pp',
+      load: false,
+      no_player: false // soon ^TM
+    }
+  },
+  created () {
+    this.LoadData(window.mode, window.mods, window.sort)
+    this.LoadLeaderboard(this.sort, this.mode, this.mods)
+  },
+  methods: {
+    secondsToDhm (seconds) {
+      seconds = Number(seconds)
+      const dDisplay = `${Math.floor(seconds / (3600 * 24))}d `
+      const hDisplay = `${Math.floor(seconds % (3600 * 24) / 3600)}h `
+      const mDisplay = `${Math.floor(seconds % 3600 / 60)}m `
+      return dDisplay + hDisplay + mDisplay
     },
-    created() {
-        this.LoadData(window.mode, window.mods, window.sort);
-        this.LoadLeaderboard(this.sort, this.mode, this.mods);
+    LoadData (mode, mods, sort) {
+      this.mode = mode
+      this.mods = mods
+      this.sort = sort
     },
-    methods: {
-        secondsToDhm(seconds) {
-            seconds = Number(seconds);
-            var dDisplay = `${Math.floor(seconds / (3600 * 24))}d `;
-            var hDisplay = `${Math.floor(seconds % (3600 * 24) / 3600)}h `;
-            var mDisplay = `${Math.floor(seconds % 3600 / 60)}m `;
-            return dDisplay + hDisplay + mDisplay;
-        },
-        LoadData(mode, mods, sort) {
-            this.mode = mode
-            this.mods = mods
-            this.sort = sort
-        },
-        LoadLeaderboard(sort, mode, mods) {
-            if (window.event)
-                window.event.preventDefault();
+    LoadLeaderboard (sort, mode, mods) {
+      if (window.event) { window.event.preventDefault() }
 
-            window.history.replaceState('', document.title, `/leaderboard/${this.mode}/${this.sort}/${this.mods}`);
-            this.$set(this, 'mode', mode);
-            this.$set(this, 'mods', mods);
-            this.$set(this, 'sort', sort);
-            this.$set(this, 'load', true);
-            this.$axios.get(`//api.${window.domain}/get_leaderboard`, {
-                params: {
-                    mode: this.StrtoGulagInt(),
-                    sort: this.sort
-                }
-            }).then(res => {
-                this.boards = res.data.leaderboard;
-                this.$set(this, 'load', false);
-            });
-        },
-        scoreFormat(score) {
-            var addCommas = this.addCommas;
-            if (score > 1000 * 1000) {
-                if (score > 1000 * 1000 * 1000)
-                    return `${addCommas((score / 1000000000).toFixed(2))} billion`;
-                return `${addCommas((score / 1000000).toFixed(2))} million`;
-            }
-            return addCommas(score);
-        },
-        addCommas(nStr) {
-            nStr += '';
-            var x = nStr.split('.');
-            var x1 = x[0];
-            var x2 = x.length > 1 ? '.' + x[1] : '';
-            var rgx = /(\d+)(\d{3})/;
-            while (rgx.test(x1)) {
-                x1 = x1.replace(rgx, '$1' + ',' + '$2');
-            }
-            return x1 + x2;
-        },
-        StrtoGulagInt() {
-            switch (this.mode + "|" + this.mods) {
-                case 'std|vn': return 0;
-                case 'taiko|vn': return 1;
-                case 'catch|vn': return 2;
-                case 'mania|vn': return 3;
-                case 'std|rx': return 4;
-                case 'taiko|rx': return 5;
-                case 'catch|rx': return 6;
-                case 'std|ap': return 8;
-                default: return -1;
-            }
-        },
+      window.history.replaceState('', document.title, `/leaderboard/${this.mode}/${this.sort}/${this.mods}`)
+      this.$set(this, 'mode', mode)
+      this.$set(this, 'mods', mods)
+      this.$set(this, 'sort', sort)
+      this.$set(this, 'load', true)
+      this.$axios.get(`//api.${window.domain}/get_leaderboard`, {
+        params: {
+          mode: this.StrtoGulagInt(),
+          sort: this.sort
+        }
+      }).then(res => {
+        this.boards = res.data.leaderboard
+        this.$set(this, 'load', false)
+      })
+    },
+    scoreFormat (score) {
+      const addCommas = this.addCommas
+      if (score > 1000 * 1000) {
+        if (score > 1000 * 1000 * 1000) { return `${addCommas((score / 1000000000).toFixed(2))} billion` }
+        return `${addCommas((score / 1000000).toFixed(2))} million`
+      }
+      return addCommas(score)
+    },
+    addCommas (nStr) {
+      nStr += ''
+      const x = nStr.split('.')
+      let x1 = x[0]
+      const x2 = x.length > 1 ? '.' + x[1] : ''
+      const rgx = /(\d+)(\d{3})/
+      while (rgx.test(x1)) {
+        x1 = x1.replace(rgx, '$1' + ',' + '$2')
+      }
+      return x1 + x2
     },
-    computed: {}
-});
+    StrtoGulagInt () {
+      switch (this.mode + '|' + this.mods) {
+        case 'std|vn': return 0
+        case 'taiko|vn': return 1
+        case 'catch|vn': return 2
+        case 'mania|vn': return 3
+        case 'std|rx': return 4
+        case 'taiko|rx': return 5
+        case 'catch|rx': return 6
+        case 'std|ap': return 8
+        default: return -1
+      }
+    }
+  },
+  computed: {}
+})
diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 42383368..82f83431 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -1,394 +1,394 @@
-// @ts-check
-// @ts-ignore window._testGlobals
+/* eslint-env browser */
+// eslint-disable-next-line no-undef
 _testGlobals(
-    { exists: ['mode', 'mods', 'userid', 'domain'] }
+  { exists: ['mode', 'mods', 'userid', 'domain'] }
 )
-// @ts-ignore window.Vue
+
+// eslint-disable-next-line no-new, no-undef
 new Vue({
-    el: "#app",
-    delimiters: ["<%", "%>"],
-    data() {
-        return {
-            data: {
-                stats: {
-                    out: [{}],
-                    load: true
-                },
-                grades: {},
-                scores: {
-                    recent: {
-                        out: [],
-                        load: true,
-                        more: {
-                            limit: 5,
-                            full: true
-                        }
-                    },
-                    best: {
-                        out: [],
-                        load: true,
-                        more: {
-                            limit: 5,
-                            full: true
-                        }
-                    }
-                },
-                maps: {
-                    most: {
-                        out: [],
-                        load: true,
-                        more: {
-                            limit: 5,
-                            full: true
-                        }
-                    }
-                },
-                status: {}
-            },
-            mode: window.mode,
-            mods: window.mods,
-            modegulag: 0,
-            userid: window.userid,
-            getScoreMods: (() => {
-                const None = 0;
-                const NoFail = 1;
-                const Easy = 2;
-                const NoVideo = 4;
-                const Hidden = 8;
-                const HardRock = 16;
-                const SuddenDeath = 32;
-                const DoubleTime = 64;
-                const Relax = 128;
-                const HalfTime = 256;
-                const Nightcore = 512;
-                const Flashlight = 1024;
-                const Autoplay = 2048;
-                const SpunOut = 4096;
-                const Relax2 = 8192;
-                const Perfect = 16384;
-                const Key4 = 32768;
-                const Key5 = 65536;
-                const Key6 = 131072;
-                const Key7 = 262144;
-                const Key8 = 524288;
-                const keyMod = 1015808;
-                const FadeIn = 1048576;
-                const Random = 2097152;
-                const LastMod = 4194304;
-                const Key9 = 16777216;
-                const Key10 = 33554432;
-                const Key1 = 67108864;
-                const Key3 = 134217728;
-                const Key2 = 268435456;
-            
-                return function getScoreMods(m) {
-                    let r = '';
-                    let hasNightcore = false;
-                    if (m & NoFail) {
-                        r += 'NF';
-                    }
-                    if (m & Easy) {
-                        r += 'EZ';
-                    }
-                    if (m & NoVideo) {
-                        r += 'NV';
-                    }
-                    if (m & Hidden) {
-                        r += 'HD';
-                    }
-                    if (m & HardRock) {
-                        r += 'HR';
-                    }
-                    if (m & SuddenDeath) {
-                        r += 'SD';
-                    }
-                    if (m & Nightcore) {
-                        r += 'NC';
-                        hasNightcore = true;
-                    }
-                    if (!hasNightcore && (m & DoubleTime)) {
-                        r += 'DT';
-                    }
-                    if (m & Relax) {
-                        r += 'RX';
-                    }
-                    if (m & HalfTime) {
-                        r += 'HT';
-                    }
-                    if (m & Flashlight) {
-                        r += 'FL';
-                    }
-                    if (m & Autoplay) {
-                        r += 'AP';
-                    }
-                    if (m & SpunOut) {
-                        r += 'SO';
-                    }
-                    if (m & Relax2) {
-                        r += 'AP';
-                    }
-                    if (m & Perfect) {
-                        r += 'PF';
-                    }
-                    if (m & Key4) {
-                        r += '4K';
-                    }
-                    if (m & Key5) {
-                        r += '5K';
-                    }
-                    if (m & Key6) {
-                        r += '6K';
-                    }
-                    if (m & Key7) {
-                        r += '7K';
-                    }
-                    if (m & Key8) {
-                        r += '8K';
-                    }
-                    if (m & keyMod) {
-                        r += '';
-                    }
-                    if (m & FadeIn) {
-                        r += 'FD';
-                    }
-                    if (m & Random) {
-                        r += 'RD';
-                    }
-                    if (m & LastMod) {
-                        r += 'CN';
-                    }
-                    if (m & Key9) {
-                        r += '9K';
-                    }
-                    if (m & Key10) {
-                        r += '10K';
-                    }
-                    if (m & Key1) {
-                        r += '1K';
-                    }
-                    if (m & Key3) {
-                        r += '3K';
-                    }
-                    if (m & Key2) {
-                        r += '2K';
-                    }
-                    if (r.length > 0) {
-                        return r.slice();
-                    } else {
-                        return 'NM';
-                    }
-                }
-            })()
-        };
-    },
-    created() {
-        // starting a page
-        this.modegulag = this.StrtoGulagInt();
-        this.LoadProfileData();
-        this.LoadAllofdata({ animation: false });
-        this.LoadUserStatus({ animation: false });
-    },
-    methods: {
-        LoadAllofdata(opt) {
-            this.LoadMostBeatmaps(opt);
-            this.LoadScores('best', opt);
-            this.LoadScores('recent', opt);
-        },
-        LoadProfileData() {
-            this.$set(this.data.stats, 'load', true);
-            this.$axios.get(`//api.${window.domain}/get_player_info`, {
-                params: {
-                    id: this.userid,
-                    scope: 'all'
-                }
-            })
-                .then(res => {
-                    this.$set(this.data.stats, 'out', res.data.player.stats);
-                    this.data.stats.load = false;
-                });
+  el: '#app',
+  delimiters: ['<%', '%>'],
+  data () {
+    return {
+      data: {
+        stats: {
+          out: [{}],
+          load: true
         },
-        async LoadScores(sort, { animation = true } = {}) {
-            this.$set(this.data.scores[`${sort}`], 'load', true);
-            await this.$axios.get(`//api.${window.domain}/get_player_scores`, {
-                params: {
-                    id: this.userid,
-                    mode: this.StrtoGulagInt(),
-                    scope: sort,
-                    limit: this.data.scores[`${sort}`].more.limit
-                }
-            })
-                .then(res => {
-                    this.data.scores[`${sort}`].out = res.data.scores;
-                    this.data.scores[`${sort}`].more.full = this.data.scores[`${sort}`].out.length != this.data.scores[`${sort}`].more.limit;
-                });
-            const toShow = this.$refs.scores && this.$refs.scores.filter(el => !el.classList.contains('show')) || [];
-            // animation
-            if (!animation) {
-                toShow.forEach(el => el.classList.add('show'))
-                this.data.scores[`${sort}`].load = false
-            } else {
-                this.data.scores[`${sort}`].load = false
-                toShow.forEach((el, index) => {
-                    setTimeout(() => {
-                        el.classList.add('show')
-                    }, index * 30)
-                })
+        grades: {},
+        scores: {
+          recent: {
+            out: [],
+            load: true,
+            more: {
+              limit: 5,
+              full: true
             }
-        },
-        async LoadMostBeatmaps({ animation = true } = {}) {
-            this.$set(this.data.maps.most, 'load', true);
-            await this.$axios.get(`//api.${window.domain}/get_player_most_played`, {
-                params: {
-                    id: this.userid,
-                    mode: this.StrtoGulagInt(),
-                    limit: this.data.maps.most.more.limit
-                }
-            })
-                .then(res => {
-                    this.data.maps.most.out = res.data.maps;
-                    this.data.maps.most.more.full = this.data.maps.most.out.length != this.data.maps.most.more.limit;
-                });
-            const toShow = this.$refs.mostPlayed && this.$refs.mostPlayed.filter(el => !el.classList.contains('show')) || [];
-            // animation
-            if (!animation) {
-                toShow.forEach(el => el.classList.add('show'))
-                this.data.maps.most.load = false;
-            } else {
-                this.data.maps.most.load = false;
-                toShow.forEach((el, index) => {
-                    setTimeout(() => {
-                        el.classList.add('show')
-                    }, index * 20)
-                })
+          },
+          best: {
+            out: [],
+            load: true,
+            more: {
+              limit: 5,
+              full: true
             }
+          }
         },
-        LoadUserStatus() {
-            this.$axios.get(`//api.${window.domain}/get_player_status`, {
-                params: {
-                    id: this.userid
-                }
-            })
-                .then(res => {
-                    this.$set(this.data, 'status', res.data.player_status)
-                })
-                .catch(function (error) {
-                    clearTimeout(window.loop);
-                    console.log(error);
-                });
-            window.loop = setTimeout(this.LoadUserStatus, 5000);
+        maps: {
+          most: {
+            out: [],
+            load: true,
+            more: {
+              limit: 5,
+              full: true
+            }
+          }
         },
-        ChangeModeMods(mode, mods) {
-            if (window.event)
-                window.event.preventDefault();
+        status: {}
+      },
+      mode: window.mode,
+      // @ts-ignore
+      mods: window.mods,
+      modegulag: 0,
+      userid: window.userid,
+      getScoreMods: (() => {
+        const NoFail = 1
+        const Easy = 2
+        const NoVideo = 4
+        const Hidden = 8
+        const HardRock = 16
+        const SuddenDeath = 32
+        const DoubleTime = 64
+        const Relax = 128
+        const HalfTime = 256
+        const Nightcore = 512
+        const Flashlight = 1024
+        const Autoplay = 2048
+        const SpunOut = 4096
+        const Relax2 = 8192
+        const Perfect = 16384
+        const Key4 = 32768
+        const Key5 = 65536
+        const Key6 = 131072
+        const Key7 = 262144
+        const Key8 = 524288
+        const keyMod = 1015808
+        const FadeIn = 1048576
+        const Random = 2097152
+        const LastMod = 4194304
+        const Key9 = 16777216
+        const Key10 = 33554432
+        const Key1 = 67108864
+        const Key3 = 134217728
+        const Key2 = 268435456
 
-            this.mode = mode;
-            this.mods = mods;
+        return function getScoreMods (m) {
+          let r = ''
+          let hasNightcore = false
+          if (m & NoFail) {
+            r += 'NF'
+          }
+          if (m & Easy) {
+            r += 'EZ'
+          }
+          if (m & NoVideo) {
+            r += 'NV'
+          }
+          if (m & Hidden) {
+            r += 'HD'
+          }
+          if (m & HardRock) {
+            r += 'HR'
+          }
+          if (m & SuddenDeath) {
+            r += 'SD'
+          }
+          if (m & Nightcore) {
+            r += 'NC'
+            hasNightcore = true
+          }
+          if (!hasNightcore && (m & DoubleTime)) {
+            r += 'DT'
+          }
+          if (m & Relax) {
+            r += 'RX'
+          }
+          if (m & HalfTime) {
+            r += 'HT'
+          }
+          if (m & Flashlight) {
+            r += 'FL'
+          }
+          if (m & Autoplay) {
+            r += 'AP'
+          }
+          if (m & SpunOut) {
+            r += 'SO'
+          }
+          if (m & Relax2) {
+            r += 'AP'
+          }
+          if (m & Perfect) {
+            r += 'PF'
+          }
+          if (m & Key4) {
+            r += '4K'
+          }
+          if (m & Key5) {
+            r += '5K'
+          }
+          if (m & Key6) {
+            r += '6K'
+          }
+          if (m & Key7) {
+            r += '7K'
+          }
+          if (m & Key8) {
+            r += '8K'
+          }
+          if (m & keyMod) {
+            r += ''
+          }
+          if (m & FadeIn) {
+            r += 'FD'
+          }
+          if (m & Random) {
+            r += 'RD'
+          }
+          if (m & LastMod) {
+            r += 'CN'
+          }
+          if (m & Key9) {
+            r += '9K'
+          }
+          if (m & Key10) {
+            r += '10K'
+          }
+          if (m & Key1) {
+            r += '1K'
+          }
+          if (m & Key3) {
+            r += '3K'
+          }
+          if (m & Key2) {
+            r += '2K'
+          }
+          if (r.length > 0) {
+            return r.slice()
+          } else {
+            return 'NM'
+          }
+        }
+      })()
+    }
+  },
+  computed: {},
+  created () {
+    // starting a page
+    this.modegulag = this.StrtoGulagInt()
+    this.LoadProfileData()
+    this.LoadAllofdata({ animation: false })
+    this.LoadUserStatus({ animation: false })
+  },
+  methods: {
+    LoadAllofdata (opt) {
+      this.LoadMostBeatmaps(opt)
+      this.LoadScores('best', opt)
+      this.LoadScores('recent', opt)
+    },
+    LoadProfileData () {
+      this.$set(this.data.stats, 'load', true)
+      this.$axios.get(`//api.${window.domain}/get_player_info`, {
+        params: {
+          id: this.userid,
+          scope: 'all'
+        }
+      })
+        .then(res => {
+          this.$set(this.data.stats, 'out', res.data.player.stats)
+          this.data.stats.load = false
+        })
+    },
+    async LoadScores (sort, { animation = true } = {}) {
+      this.$set(this.data.scores[`${sort}`], 'load', true)
+      await this.$axios.get(`//api.${window.domain}/get_player_scores`, {
+        params: {
+          id: this.userid,
+          mode: this.StrtoGulagInt(),
+          scope: sort,
+          limit: this.data.scores[`${sort}`].more.limit
+        }
+      })
+        .then(res => {
+          this.data.scores[`${sort}`].out = res.data.scores
+          // eslint-disable-next-line eqeqeq
+          this.data.scores[`${sort}`].more.full = this.data.scores[`${sort}`].out.length != this.data.scores[`${sort}`].more.limit
+        })
+      const toShow = (this.$refs.scores && this.$refs.scores.filter(el => !el.classList.contains('show'))) || []
+      // animation
+      if (!animation) {
+        toShow.forEach(el => el.classList.add('show'))
+        this.data.scores[`${sort}`].load = false
+      } else {
+        this.data.scores[`${sort}`].load = false
+        toShow.forEach((el, index) => {
+          setTimeout(() => {
+            el.classList.add('show')
+          }, index * 30)
+        })
+      }
+    },
+    async LoadMostBeatmaps ({ animation = true } = {}) {
+      this.$set(this.data.maps.most, 'load', true)
+      await this.$axios.get(`//api.${window.domain}/get_player_most_played`, {
+        params: {
+          id: this.userid,
+          mode: this.StrtoGulagInt(),
+          limit: this.data.maps.most.more.limit
+        }
+      })
+        .then(res => {
+          this.data.maps.most.out = res.data.maps
+          this.data.maps.most.more.full = this.data.maps.most.out.length !== this.data.maps.most.more.limit
+        })
+      const toShow = (this.$refs.mostPlayed && this.$refs.mostPlayed.filter(el => !el.classList.contains('show'))) || []
+      // animation
+      if (!animation) {
+        toShow.forEach(el => el.classList.add('show'))
+        this.data.maps.most.load = false
+      } else {
+        this.data.maps.most.load = false
+        toShow.forEach((el, index) => {
+          setTimeout(() => {
+            el.classList.add('show')
+          }, index * 20)
+        })
+      }
+    },
+    LoadUserStatus () {
+      this.$axios.get(`//api.${window.domain}/get_player_status`, {
+        params: {
+          id: this.userid
+        }
+      })
+        .then(res => {
+          this.$set(this.data, 'status', res.data.player_status)
+        })
+        .catch(function (error) {
+          clearTimeout(window.loop)
+          console.log(error)
+        })
+      window.loop = setTimeout(this.LoadUserStatus, 5000)
+    },
+    ChangeModeMods (mode, mods) {
+      if (window.event) { window.event.preventDefault() }
 
-            this.modegulag = this.StrtoGulagInt();
-            this.data.scores.recent.more.limit = 5
-            this.data.scores.best.more.limit = 5
-            this.data.maps.most.more.limit = 6
-            this.LoadAllofdata();
-        },
-        AddLimit(which) {
-            if (window.event)
-                window.event.preventDefault();
+      this.mode = mode
+      this.mods = mods
 
-            if (which == 'bestscore') {
-                this.data.scores.best.more.limit += 5;
-                this.LoadScores('best');
-            } else if (which == 'recentscore') {
-                this.data.scores.recent.more.limit += 5;
-                this.LoadScores('recent');
-            } else if (which == 'mostplay') {
-                this.data.maps.most.more.limit += 4;
-                this.LoadMostBeatmaps();
-            }
-        },
-        actionIntToStr(d) {
-            switch (d.action) {
-                case 0:
-                    return 'Idle: 🔍 Song Select';
-                case 1:
-                    return '🌙 AFK';
-                case 2:
-                    return `Playing: 🎶 ${d.info_text}`;
-                case 3:
-                    return `Editing: 🔨 ${d.info_text}`;
-                case 4:
-                    return `Modding: 🔨 ${d.info_text}`;
-                case 5:
-                    return 'In Multiplayer: Song Select';
-                case 6:
-                    return `Watching: 👓 ${d.info_text}`;
-                // 7 not used
-                case 8:
-                    return `Testing: 🎾 ${d.info_text}`;
-                case 9:
-                    return `Submitting: 🧼 ${d.info_text}`;
-                // 10 paused, never used
-                case 11:
-                    return 'Idle: 🏢 In multiplayer lobby';
-                case 12:
-                    return `In Multiplayer: Playing 🌍 ${d.info_text} 🎶`;
-                case 13:
-                    return 'Idle: 🔍 Searching for beatmaps in osu!direct';
-                default:
-                    return 'Unknown: 🚔 not yet implemented!';
-            }
-        },
-        addCommas(nStr) {
-            nStr += '';
-            const x = nStr.split('.');
-            let x1 = x[0];
-            const x2 = x.length > 1 ? '.' + x[1] : '';
-            const rgx = /(\d+)(\d{3})/;
-            while (rgx.test(x1)) {
-                x1 = x1.replace(rgx, '$1' + ',' + '$2');
-            }
-            return x1 + x2;
-        },
-        secondsToDhm(seconds) {
-            seconds = Number(seconds);
-            const dDisplay = `${Math.floor(seconds / (3600 * 24))}d `;
-            const hDisplay = `${Math.floor(seconds % (3600 * 24) / 3600)}h `;
-            const mDisplay = `${Math.floor(seconds % 3600 / 60)}m `;
-            return dDisplay + hDisplay + mDisplay;
-        },
-        StrtoGulagInt() {
-            switch (this.mode + "|" + this.mods) {
-                case 'std|vn':
-                    return 0;
-                case 'taiko|vn':
-                    return 1;
-                case 'catch|vn':
-                    return 2;
-                case 'mania|vn':
-                    return 3;
-                case 'std|rx':
-                    return 4;
-                case 'taiko|rx':
-                    return 5;
-                case 'catch|rx':
-                    return 6;
-                case 'std|ap':
-                    return 8;
-                default:
-                    return -1;
-            }
-        },
-        StrtoModeInt() {
-            switch (this.mode) {
-                case 'std':
-                    return 0;
-                case 'taiko':
-                    return 1;
-                case 'catch':
-                    return 2;
-                case 'mania':
-                    return 3;
-            }
-        },
+      this.modegulag = this.StrtoGulagInt()
+      this.data.scores.recent.more.limit = 5
+      this.data.scores.best.more.limit = 5
+      this.data.maps.most.more.limit = 6
+      this.LoadAllofdata()
+    },
+    AddLimit (which) {
+      if (window.event) { window.event.preventDefault() }
+
+      if (which === 'bestscore') {
+        this.data.scores.best.more.limit += 5
+        this.LoadScores('best')
+      } else if (which === 'recentscore') {
+        this.data.scores.recent.more.limit += 5
+        this.LoadScores('recent')
+      } else if (which === 'mostplay') {
+        this.data.maps.most.more.limit += 4
+        this.LoadMostBeatmaps()
+      }
+    },
+    actionIntToStr (d) {
+      switch (d.action) {
+        case 0:
+          return 'Idle: 🔍 Song Select'
+        case 1:
+          return '🌙 AFK'
+        case 2:
+          return `Playing: 🎶 ${d.info_text}`
+        case 3:
+          return `Editing: 🔨 ${d.info_text}`
+        case 4:
+          return `Modding: 🔨 ${d.info_text}`
+        case 5:
+          return 'In Multiplayer: Song Select'
+        case 6:
+          return `Watching: 👓 ${d.info_text}`
+          // 7 not used
+        case 8:
+          return `Testing: 🎾 ${d.info_text}`
+        case 9:
+          return `Submitting: 🧼 ${d.info_text}`
+          // 10 paused, never used
+        case 11:
+          return 'Idle: 🏢 In multiplayer lobby'
+        case 12:
+          return `In Multiplayer: Playing 🌍 ${d.info_text} 🎶`
+        case 13:
+          return 'Idle: 🔍 Searching for beatmaps in osu!direct'
+        default:
+          return 'Unknown: 🚔 not yet implemented!'
+      }
+    },
+    addCommas (nStr) {
+      nStr += ''
+      const x = nStr.split('.')
+      let x1 = x[0]
+      const x2 = x.length > 1 ? '.' + x[1] : ''
+      const rgx = /(\d+)(\d{3})/
+      while (rgx.test(x1)) {
+        x1 = x1.replace(rgx, '$1' + ',' + '$2')
+      }
+      return x1 + x2
+    },
+    secondsToDhm (seconds) {
+      seconds = Number(seconds)
+      const dDisplay = `${Math.floor(seconds / (3600 * 24))}d `
+      const hDisplay = `${Math.floor(seconds % (3600 * 24) / 3600)}h `
+      const mDisplay = `${Math.floor(seconds % 3600 / 60)}m `
+      return dDisplay + hDisplay + mDisplay
+    },
+    StrtoGulagInt () {
+      switch (this.mode + '|' + this.mods) {
+        case 'std|vn':
+          return 0
+        case 'taiko|vn':
+          return 1
+        case 'catch|vn':
+          return 2
+        case 'mania|vn':
+          return 3
+        case 'std|rx':
+          return 4
+        case 'taiko|rx':
+          return 5
+        case 'catch|rx':
+          return 6
+        case 'std|ap':
+          return 8
+        default:
+          return -1
+      }
     },
-    computed: {}
-});
\ No newline at end of file
+    StrtoModeInt () {
+      switch (this.mode) {
+        case 'std':
+          return 0
+        case 'taiko':
+          return 1
+        case 'catch':
+          return 2
+        case 'mania':
+          return 3
+      }
+    }
+  }
+})

From 3a9da38237655fe3a6db17f769303129836a8fab Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 25 Aug 2022 08:23:54 +0000
Subject: [PATCH 235/278] switch to fetch

---
 static/js/main.js              | 75 +++++++++++++++++-----------------
 static/js/pages/leaderboard.js |  4 +-
 2 files changed, 40 insertions(+), 39 deletions(-)

diff --git a/static/js/main.js b/static/js/main.js
index cf63950e..0d77f3ca 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -28,7 +28,7 @@ function setStyle (el, obj) {
   })
 }
 
-function searchUser () {
+async function searchUser () {
   // eslint-disable-next-line no-undef
   _testGlobals(
     { exists: ['domain'] }
@@ -38,44 +38,45 @@ function searchUser () {
   const value = search.value
   const content = document.getElementById('u-search-content')
   content && (content.innerHTML = '')
-  $.get('//osu.' + window.domain + '/search?q=' + value, function (data, status) {
-    if (data != '{}') {
-      content && content.removeAttribute('style')
-      $.each(data, function (e, n) {
-        const result = ({
-          title: n.name,
-          url: '/u/' + n.id,
-          image: '//a.' + window.domain + '/' + n.id
-        })
-        const root = document.createElement('a')
-        root.href = result.url
-        root.className = 'navbar-item'
-        const image = document.createElement('img')
-        image.src = result.image
-        setStyle(image, {
-          width: '3rem',
-          maxHeight: '3rem',
-          backgroundSize: 'cover',
-          borderRadius: '0.5em'
-        })
-        root.appendChild(image)
-        const textSpan = document.createElement('span')
-        setStyle(textSpan, {
-          marginLeft: '5px',
-          fontWeight: 700,
-          fontSize: '1.2em',
-          color: 'rgba(255,255,255,0.9)'
-        })
-        textSpan.innerText = result.title
-        root.appendChild(textSpan)
-        content && content.appendChild(root)
+  const data = await fetch(`//osu.${window.domain}/search?q=${value}`).then(res => res.json())
+  // TODO it's.... too much for me to handle..
+  // eslint-disable-next-line eqeqeq
+  if (data != '{}') {
+    content && content.removeAttribute('style')
+    data.forEach(n => {
+      const result = ({
+        title: n.name,
+        url: '/u/' + n.id,
+        image: '//a.' + window.domain + '/' + n.id
       })
-    } else {
-      content && setStyle(content, {
-        display: 'none'
+      const root = document.createElement('a')
+      root.href = result.url
+      root.className = 'navbar-item'
+      const image = document.createElement('img')
+      image.src = result.image
+      setStyle(image, {
+        width: '3rem',
+        maxHeight: '3rem',
+        backgroundSize: 'cover',
+        borderRadius: '0.5em'
       })
-    }
-  })
+      root.appendChild(image)
+      const textSpan = document.createElement('span')
+      setStyle(textSpan, {
+        marginLeft: '5px',
+        fontWeight: 700,
+        fontSize: '1.2em',
+        color: 'rgba(255,255,255,0.9)'
+      })
+      textSpan.innerText = result.title
+      root.appendChild(textSpan)
+      content && content.appendChild(root)
+    })
+  } else {
+    content && setStyle(content, {
+      display: 'none'
+    })
+  }
 }
 
 function createState (initial) {
diff --git a/static/js/pages/leaderboard.js b/static/js/pages/leaderboard.js
index 51172080..ed8bb64b 100644
--- a/static/js/pages/leaderboard.js
+++ b/static/js/pages/leaderboard.js
@@ -17,6 +17,7 @@ new Vue({
       no_player: false // soon ^TM
     }
   },
+  computed: {},
   created () {
     this.LoadData(window.mode, window.mods, window.sort)
     this.LoadLeaderboard(this.sort, this.mode, this.mods)
@@ -84,6 +85,5 @@ new Vue({
         default: return -1
       }
     }
-  },
-  computed: {}
+  }
 })

From 01ba127563e849ebd892282ff8461b7661688008 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 25 Aug 2022 08:47:26 +0000
Subject: [PATCH 236/278] lint

---
 static/js/assets/vue-flags.js | 504 +++++++++++++++++-----------------
 1 file changed, 252 insertions(+), 252 deletions(-)

diff --git a/static/js/assets/vue-flags.js b/static/js/assets/vue-flags.js
index 98e2c92c..9db6bf94 100644
--- a/static/js/assets/vue-flags.js
+++ b/static/js/assets/vue-flags.js
@@ -1,254 +1,254 @@
 window.flags = {
-	'BD' : 'Bangladesh',
-	'BE' : 'Belgium',
-	'BF' : 'Burkina Faso',
-	'BG' : 'Bulgaria',
-	'BA' : 'Bosnia and Herzegovina',
-	'BB' : 'Barbados',
-	'WF' : 'Wallis and Futuna',
-	'BL' : 'Saint Barthelemy',
-	'BM' : 'Bermuda',
-	'BN' : 'Brunei',
-	'BO' : 'Bolivia',
-	'BH' : 'Bahrain',
-	'BI' : 'Burundi',
-	'BJ' : 'Benin',
-	'BT' : 'Bhutan',
-	'JM' : 'Jamaica',
-	'BV' : 'Bouvet Island',
-	'BW' : 'Botswana',
-	'WS' : 'Samoa',
-	'BQ' : 'Bonaire, Saint Eustatius and Saba',
-	'BR' : 'Brazil',
-	'BS' : 'Bahamas',
-	'JE' : 'Jersey',
-	'BY' : 'Belarus',
-	'BZ' : 'Belize',
-	'RU' : 'Russia',
-	'ussr' : "USSR",
-	'RW' : 'Rwanda',
-	'RS' : 'Serbia',
-	'TL' : 'East Timor',
-	'RE' : 'Reunion',
-	'TM' : 'Turkmenistan',
-	'TJ' : 'Tajikistan',
-	'RO' : 'Romania',
-	'TK' : 'Tokelau',
-	'GW' : 'Guinea-Bissau',
-	'GU' : 'Guam',
-	'GT' : 'Guatemala',
-	'GS' : 'South Georgia and the South Sandwich Islands',
-	'GR' : 'Greece',
-	'GQ' : 'Equatorial Guinea',
-	'GP' : 'Guadeloupe',
-	'JP' : 'Japan',
-	'GY' : 'Guyana',
-	'GG' : 'Guernsey',
-	'GF' : 'French Guiana',
-	'GE' : 'Georgia',
-	'GD' : 'Grenada',
-	'GB' : 'United Kingdom',
-	'GA' : 'Gabon',
-	'SV' : 'El Salvador',
-	'GN' : 'Guinea',
-	'GM' : 'Gambia',
-	'GL' : 'Greenland',
-	'GI' : 'Gibraltar',
-	'GH' : 'Ghana',
-	'OM' : 'Oman',
-	'TN' : 'Tunisia',
-	'JO' : 'Jordan',
-	'HR' : 'Croatia',
-	'HT' : 'Haiti',
-	'HU' : 'Hungary',
-	'HK' : 'Hong Kong',
-	'HN' : 'Honduras',
-	'HM' : 'Heard Island and McDonald Islands',
-	'VE' : 'Venezuela',
-	'PR' : 'Puerto Rico',
-	'PS' : 'Palestinian Territory',
-	'PW' : 'Palau',
-	'PT' : 'Portugal',
-	'SJ' : 'Svalbard and Jan Mayen',
-	'PY' : 'Paraguay',
-	'IQ' : 'Iraq',
-	'PA' : 'Panama',
-	'PF' : 'French Polynesia',
-	'PG' : 'Papua New Guinea',
-	'PE' : 'Peru',
-	'PK' : 'Pakistan',
-	'PH' : 'Philippines',
-	'PN' : 'Pitcairn',
-	'PL' : 'Poland',
-	'PM' : 'Saint Pierre and Miquelon',
-	'ZM' : 'Zambia',
-	'EH' : 'Western Sahara',
-	'EE' : 'Estonia',
-	'EG' : 'Egypt',
-	'ZA' : 'South Africa',
-	'EC' : 'Ecuador',
-	'IT' : 'Italy',
-	'VN' : 'Vietnam',
-	'SB' : 'Solomon Islands',
-	'ET' : 'Ethiopia',
-	'SO' : 'Somalia',
-	'ZW' : 'Zimbabwe',
-	'SA' : 'Saudi Arabia',
-	'ES' : 'Spain',
-	'ER' : 'Eritrea',
-	'ME' : 'Montenegro',
-	'MD' : 'Moldova',
-	'MG' : 'Madagascar',
-	'MF' : 'Saint Martin',
-	'MA' : 'Morocco',
-	'MC' : 'Monaco',
-	'UZ' : 'Uzbekistan',
-	'MM' : 'Myanmar',
-	'ML' : 'Mali',
-	'MO' : 'Macao',
-	'MN' : 'Mongolia',
-	'MH' : 'Marshall Islands',
-	'MK' : 'Macedonia',
-	'MU' : 'Mauritius',
-	'MT' : 'Malta',
-	'MW' : 'Malawi',
-	'MV' : 'Maldives',
-	'MQ' : 'Martinique',
-	'MP' : 'Northern Mariana Islands',
-	'MS' : 'Montserrat',
-	'MR' : 'Mauritania',
-	'IM' : 'Isle of Man',
-	'UG' : 'Uganda',
-	'TZ' : 'Tanzania',
-	'MY' : 'Malaysia',
-	'MX' : 'Mexico',
-	'IL' : 'Israel',
-	'FR' : 'France',
-	'IO' : 'British Indian Ocean Territory',
-	'SH' : 'Saint Helena',
-	'FI' : 'Finland',
-	'FJ' : 'Fiji',
-	'FK' : 'Falkland Islands',
-	'FM' : 'Micronesia',
-	'FO' : 'Faroe Islands',
-	'NI' : 'Nicaragua',
-	'NL' : 'Netherlands',
-	'NO' : 'Norway',
-	'NA' : 'Namibia',
-	'VU' : 'Vanuatu',
-	'NC' : 'New Caledonia',
-	'NE' : 'Niger',
-	'NF' : 'Norfolk Island',
-	'NG' : 'Nigeria',
-	'NZ' : 'New Zealand',
-	'NP' : 'Nepal',
-	'NR' : 'Nauru',
-	'NU' : 'Niue',
-	'CK' : 'Cook Islands',
-	'XK' : 'Kosovo',
-	'CI' : 'Ivory Coast',
-	'CH' : 'Switzerland',
-	'CO' : 'Colombia',
-	'CN' : 'China',
-	'CM' : 'Cameroon',
-	'CL' : 'Chile',
-	'CC' : 'Cocos Islands',
-	'CA' : 'Canada',
-	'CG' : 'Republic of the Congo',
-	'CF' : 'Central African Republic',
-	'CD' : 'Democratic Republic of the Congo',
-	'CZ' : 'Czech',
-	'CY' : 'Cyprus',
-	'CX' : 'Christmas Island',
-	'CR' : 'Costa Rica',
-	'CW' : 'Curacao',
-	'CV' : 'Cape Verde',
-	'CU' : 'Cuba',
-	'SZ' : 'Swaziland',
-	'SY' : 'Syria',
-	'SX' : 'Sint Maarten',
-	'KG' : 'Kyrgyzstan',
-	'KE' : 'Kenya',
-	'SS' : 'South Sudan',
-	'SR' : 'Suriname',
-	'KI' : 'Kiribati',
-	'KH' : 'Cambodia',
-	'KN' : 'Saint Kitts and Nevis',
-	'KM' : 'Comoros',
-	'ST' : 'Sao Tome and Principe',
-	'SK' : 'Slovakia',
-	'KR' : 'Korea',
-	'SI' : 'Slovenia',
-	'KP' : 'North Korea',
-	'KW' : 'Kuwait',
-	'SN' : 'Senegal',
-	'SM' : 'San Marino',
-	'SL' : 'Sierra Leone',
-	'SC' : 'Seychelles',
-	'KZ' : 'Kazakhstan',
-	'KY' : 'Cayman Islands',
-	'SG' : 'Singapore',
-	'SE' : 'Sweden',
-	'SD' : 'Sudan',
-	'DO' : 'Dominican Republic',
-	'DM' : 'Dominica',
-	'DJ' : 'Djibouti',
-	'DK' : 'Denmark',
-	'VG' : 'British Virgin Islands',
-	'DE' : 'Germany',
-	'YE' : 'Yemen',
-	'DZ' : 'Algeria',
-	'US' : 'United States',
-	'UY' : 'Uruguay',
-	'YT' : 'Mayotte',
-	'UM' : 'United States Minor Outlying Islands',
-	'LB' : 'Lebanon',
-	'LC' : 'Saint Lucia',
-	'LA' : 'Laos',
-	'TV' : 'Tuvalu',
-	'TW' : 'Taiwan',
-	'TT' : 'Trinidad and Tobago',
-	'TR' : 'Turkey',
-	'LK' : 'Sri Lanka',
-	'LI' : 'Liechtenstein',
-	'LV' : 'Latvia',
-	'TO' : 'Tonga',
-	'LT' : 'Lithuania',
-	'LU' : 'Luxembourg',
-	'LR' : 'Liberia',
-	'LS' : 'Lesotho',
-	'TH' : 'Thailand',
-	'TF' : 'French Southern Territories',
-	'TG' : 'Togo',
-	'TD' : 'Chad',
-	'TC' : 'Turks and Caicos Islands',
-	'LY' : 'Libya',
-	'VA' : 'Vatican',
-	'VC' : 'Saint Vincent and the Grenadines',
-	'AE' : 'United Arab Emirates',
-	'AD' : 'Andorra',
-	'AG' : 'Antigua and Barbuda',
-	'AF' : 'Afghanistan',
-	'AI' : 'Anguilla',
-	'VI' : 'U.S. Virgin Islands',
-	'IS' : 'Iceland',
-	'IR' : 'Iran',
-	'AM' : 'Armenia',
-	'AL' : 'Albania',
-	'AO' : 'Angola',
-	'AQ' : 'Antarctica',
-	'AS' : 'American Samoa',
-	'AR' : 'Argentina',
-	'AU' : 'Australia',
-	'AT' : 'Austria',
-	'AW' : 'Aruba',
-	'IN' : 'India',
-	'AX' : 'Aland Islands',
-	'AZ' : 'Azerbaijan',
-	'IE' : 'Ireland',
-	'ID' : 'Indonesia',
-	'UA' : 'Ukraine',
-	'QA' : 'Qatar',
-	'MZ' : 'Mozambique',
-	'XX' : 'Unknown',
+  BD: 'Bangladesh',
+  BE: 'Belgium',
+  BF: 'Burkina Faso',
+  BG: 'Bulgaria',
+  BA: 'Bosnia and Herzegovina',
+  BB: 'Barbados',
+  WF: 'Wallis and Futuna',
+  BL: 'Saint Barthelemy',
+  BM: 'Bermuda',
+  BN: 'Brunei',
+  BO: 'Bolivia',
+  BH: 'Bahrain',
+  BI: 'Burundi',
+  BJ: 'Benin',
+  BT: 'Bhutan',
+  JM: 'Jamaica',
+  BV: 'Bouvet Island',
+  BW: 'Botswana',
+  WS: 'Samoa',
+  BQ: 'Bonaire, Saint Eustatius and Saba',
+  BR: 'Brazil',
+  BS: 'Bahamas',
+  JE: 'Jersey',
+  BY: 'Belarus',
+  BZ: 'Belize',
+  RU: 'Russia',
+  ussr: 'USSR',
+  RW: 'Rwanda',
+  RS: 'Serbia',
+  TL: 'East Timor',
+  RE: 'Reunion',
+  TM: 'Turkmenistan',
+  TJ: 'Tajikistan',
+  RO: 'Romania',
+  TK: 'Tokelau',
+  GW: 'Guinea-Bissau',
+  GU: 'Guam',
+  GT: 'Guatemala',
+  GS: 'South Georgia and the South Sandwich Islands',
+  GR: 'Greece',
+  GQ: 'Equatorial Guinea',
+  GP: 'Guadeloupe',
+  JP: 'Japan',
+  GY: 'Guyana',
+  GG: 'Guernsey',
+  GF: 'French Guiana',
+  GE: 'Georgia',
+  GD: 'Grenada',
+  GB: 'United Kingdom',
+  GA: 'Gabon',
+  SV: 'El Salvador',
+  GN: 'Guinea',
+  GM: 'Gambia',
+  GL: 'Greenland',
+  GI: 'Gibraltar',
+  GH: 'Ghana',
+  OM: 'Oman',
+  TN: 'Tunisia',
+  JO: 'Jordan',
+  HR: 'Croatia',
+  HT: 'Haiti',
+  HU: 'Hungary',
+  HK: 'Hong Kong',
+  HN: 'Honduras',
+  HM: 'Heard Island and McDonald Islands',
+  VE: 'Venezuela',
+  PR: 'Puerto Rico',
+  PS: 'Palestinian Territory',
+  PW: 'Palau',
+  PT: 'Portugal',
+  SJ: 'Svalbard and Jan Mayen',
+  PY: 'Paraguay',
+  IQ: 'Iraq',
+  PA: 'Panama',
+  PF: 'French Polynesia',
+  PG: 'Papua New Guinea',
+  PE: 'Peru',
+  PK: 'Pakistan',
+  PH: 'Philippines',
+  PN: 'Pitcairn',
+  PL: 'Poland',
+  PM: 'Saint Pierre and Miquelon',
+  ZM: 'Zambia',
+  EH: 'Western Sahara',
+  EE: 'Estonia',
+  EG: 'Egypt',
+  ZA: 'South Africa',
+  EC: 'Ecuador',
+  IT: 'Italy',
+  VN: 'Vietnam',
+  SB: 'Solomon Islands',
+  ET: 'Ethiopia',
+  SO: 'Somalia',
+  ZW: 'Zimbabwe',
+  SA: 'Saudi Arabia',
+  ES: 'Spain',
+  ER: 'Eritrea',
+  ME: 'Montenegro',
+  MD: 'Moldova',
+  MG: 'Madagascar',
+  MF: 'Saint Martin',
+  MA: 'Morocco',
+  MC: 'Monaco',
+  UZ: 'Uzbekistan',
+  MM: 'Myanmar',
+  ML: 'Mali',
+  MO: 'Macao',
+  MN: 'Mongolia',
+  MH: 'Marshall Islands',
+  MK: 'Macedonia',
+  MU: 'Mauritius',
+  MT: 'Malta',
+  MW: 'Malawi',
+  MV: 'Maldives',
+  MQ: 'Martinique',
+  MP: 'Northern Mariana Islands',
+  MS: 'Montserrat',
+  MR: 'Mauritania',
+  IM: 'Isle of Man',
+  UG: 'Uganda',
+  TZ: 'Tanzania',
+  MY: 'Malaysia',
+  MX: 'Mexico',
+  IL: 'Israel',
+  FR: 'France',
+  IO: 'British Indian Ocean Territory',
+  SH: 'Saint Helena',
+  FI: 'Finland',
+  FJ: 'Fiji',
+  FK: 'Falkland Islands',
+  FM: 'Micronesia',
+  FO: 'Faroe Islands',
+  NI: 'Nicaragua',
+  NL: 'Netherlands',
+  NO: 'Norway',
+  NA: 'Namibia',
+  VU: 'Vanuatu',
+  NC: 'New Caledonia',
+  NE: 'Niger',
+  NF: 'Norfolk Island',
+  NG: 'Nigeria',
+  NZ: 'New Zealand',
+  NP: 'Nepal',
+  NR: 'Nauru',
+  NU: 'Niue',
+  CK: 'Cook Islands',
+  XK: 'Kosovo',
+  CI: 'Ivory Coast',
+  CH: 'Switzerland',
+  CO: 'Colombia',
+  CN: 'China',
+  CM: 'Cameroon',
+  CL: 'Chile',
+  CC: 'Cocos Islands',
+  CA: 'Canada',
+  CG: 'Republic of the Congo',
+  CF: 'Central African Republic',
+  CD: 'Democratic Republic of the Congo',
+  CZ: 'Czech',
+  CY: 'Cyprus',
+  CX: 'Christmas Island',
+  CR: 'Costa Rica',
+  CW: 'Curacao',
+  CV: 'Cape Verde',
+  CU: 'Cuba',
+  SZ: 'Swaziland',
+  SY: 'Syria',
+  SX: 'Sint Maarten',
+  KG: 'Kyrgyzstan',
+  KE: 'Kenya',
+  SS: 'South Sudan',
+  SR: 'Suriname',
+  KI: 'Kiribati',
+  KH: 'Cambodia',
+  KN: 'Saint Kitts and Nevis',
+  KM: 'Comoros',
+  ST: 'Sao Tome and Principe',
+  SK: 'Slovakia',
+  KR: 'Korea',
+  SI: 'Slovenia',
+  KP: 'North Korea',
+  KW: 'Kuwait',
+  SN: 'Senegal',
+  SM: 'San Marino',
+  SL: 'Sierra Leone',
+  SC: 'Seychelles',
+  KZ: 'Kazakhstan',
+  KY: 'Cayman Islands',
+  SG: 'Singapore',
+  SE: 'Sweden',
+  SD: 'Sudan',
+  DO: 'Dominican Republic',
+  DM: 'Dominica',
+  DJ: 'Djibouti',
+  DK: 'Denmark',
+  VG: 'British Virgin Islands',
+  DE: 'Germany',
+  YE: 'Yemen',
+  DZ: 'Algeria',
+  US: 'United States',
+  UY: 'Uruguay',
+  YT: 'Mayotte',
+  UM: 'United States Minor Outlying Islands',
+  LB: 'Lebanon',
+  LC: 'Saint Lucia',
+  LA: 'Laos',
+  TV: 'Tuvalu',
+  TW: 'Taiwan',
+  TT: 'Trinidad and Tobago',
+  TR: 'Turkey',
+  LK: 'Sri Lanka',
+  LI: 'Liechtenstein',
+  LV: 'Latvia',
+  TO: 'Tonga',
+  LT: 'Lithuania',
+  LU: 'Luxembourg',
+  LR: 'Liberia',
+  LS: 'Lesotho',
+  TH: 'Thailand',
+  TF: 'French Southern Territories',
+  TG: 'Togo',
+  TD: 'Chad',
+  TC: 'Turks and Caicos Islands',
+  LY: 'Libya',
+  VA: 'Vatican',
+  VC: 'Saint Vincent and the Grenadines',
+  AE: 'United Arab Emirates',
+  AD: 'Andorra',
+  AG: 'Antigua and Barbuda',
+  AF: 'Afghanistan',
+  AI: 'Anguilla',
+  VI: 'U.S. Virgin Islands',
+  IS: 'Iceland',
+  IR: 'Iran',
+  AM: 'Armenia',
+  AL: 'Albania',
+  AO: 'Angola',
+  AQ: 'Antarctica',
+  AS: 'American Samoa',
+  AR: 'Argentina',
+  AU: 'Australia',
+  AT: 'Austria',
+  AW: 'Aruba',
+  IN: 'India',
+  AX: 'Aland Islands',
+  AZ: 'Azerbaijan',
+  IE: 'Ireland',
+  ID: 'Indonesia',
+  UA: 'Ukraine',
+  QA: 'Qatar',
+  MZ: 'Mozambique',
+  XX: 'Unknown'
 }

From d7c62d9e612d54e0a93aa04c6628e71477a35f93 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 25 Aug 2022 08:54:29 +0000
Subject: [PATCH 237/278] use state manager

---
 static/js/_runtime-check.js |   5 +-
 static/js/pages/profile.js  | 740 ++++++++++++++++++------------------
 templates/profile.html      |  16 +-
 3 files changed, 384 insertions(+), 377 deletions(-)

diff --git a/static/js/_runtime-check.js b/static/js/_runtime-check.js
index 8e5914ad..ecd5c46d 100644
--- a/static/js/_runtime-check.js
+++ b/static/js/_runtime-check.js
@@ -1,9 +1,8 @@
 /* eslint-disable no-unused-vars */
 
 // runtime check
-function _testGlobals ({ exists = [] } = {}) {
-  const _scope = globalThis || window
-  const result = exists.every(item => _scope[item] !== undefined)
+function _testGlobals ({ exists = [] } = {}, scope = globalThis || window) {
+  const result = exists.every(item => scope[item] !== undefined)
 
   if (!result) throw new Error('runtime check failed: ')
 }
diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 82f83431..1fb5a89d 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -1,394 +1,394 @@
 /* eslint-env browser */
-// eslint-disable-next-line no-undef
-_testGlobals(
-  { exists: ['mode', 'mods', 'userid', 'domain'] }
-)
 
-// eslint-disable-next-line no-new, no-undef
-new Vue({
-  el: '#app',
-  delimiters: ['<%', '%>'],
-  data () {
-    return {
-      data: {
-        stats: {
-          out: [{}],
-          load: true
-        },
-        grades: {},
-        scores: {
-          recent: {
-            out: [],
-            load: true,
-            more: {
-              limit: 5,
-              full: true
-            }
+window.addEventListener('load', () => {
+  const s = window._state.reactive
+  // eslint-disable-next-line no-new, no-undef
+  new Vue({
+    el: '#app',
+    delimiters: ['<%', '%>'],
+    data () {
+      return {
+        loop: undefined,
+        data: {
+          stats: {
+            out: [{}],
+            load: true
           },
-          best: {
-            out: [],
-            load: true,
-            more: {
-              limit: 5,
-              full: true
+          grades: {},
+          scores: {
+            recent: {
+              out: [],
+              load: true,
+              more: {
+                limit: 5,
+                full: true
+              }
+            },
+            best: {
+              out: [],
+              load: true,
+              more: {
+                limit: 5,
+                full: true
+              }
             }
-          }
-        },
-        maps: {
-          most: {
-            out: [],
-            load: true,
-            more: {
-              limit: 5,
-              full: true
+          },
+          maps: {
+            most: {
+              out: [],
+              load: true,
+              more: {
+                limit: 5,
+                full: true
+              }
             }
-          }
+          },
+          status: {}
         },
-        status: {}
-      },
-      mode: window.mode,
-      // @ts-ignore
-      mods: window.mods,
-      modegulag: 0,
-      userid: window.userid,
-      getScoreMods: (() => {
-        const NoFail = 1
-        const Easy = 2
-        const NoVideo = 4
-        const Hidden = 8
-        const HardRock = 16
-        const SuddenDeath = 32
-        const DoubleTime = 64
-        const Relax = 128
-        const HalfTime = 256
-        const Nightcore = 512
-        const Flashlight = 1024
-        const Autoplay = 2048
-        const SpunOut = 4096
-        const Relax2 = 8192
-        const Perfect = 16384
-        const Key4 = 32768
-        const Key5 = 65536
-        const Key6 = 131072
-        const Key7 = 262144
-        const Key8 = 524288
-        const keyMod = 1015808
-        const FadeIn = 1048576
-        const Random = 2097152
-        const LastMod = 4194304
-        const Key9 = 16777216
-        const Key10 = 33554432
-        const Key1 = 67108864
-        const Key3 = 134217728
-        const Key2 = 268435456
+        mode: s.mode,
+        // @ts-ignore
+        mods: s.mods,
+        modegulag: 0,
+        userid: s.userid,
+        getScoreMods: (() => {
+          const NoFail = 1
+          const Easy = 2
+          const NoVideo = 4
+          const Hidden = 8
+          const HardRock = 16
+          const SuddenDeath = 32
+          const DoubleTime = 64
+          const Relax = 128
+          const HalfTime = 256
+          const Nightcore = 512
+          const Flashlight = 1024
+          const Autoplay = 2048
+          const SpunOut = 4096
+          const Relax2 = 8192
+          const Perfect = 16384
+          const Key4 = 32768
+          const Key5 = 65536
+          const Key6 = 131072
+          const Key7 = 262144
+          const Key8 = 524288
+          const keyMod = 1015808
+          const FadeIn = 1048576
+          const Random = 2097152
+          const LastMod = 4194304
+          const Key9 = 16777216
+          const Key10 = 33554432
+          const Key1 = 67108864
+          const Key3 = 134217728
+          const Key2 = 268435456
 
-        return function getScoreMods (m) {
-          let r = ''
-          let hasNightcore = false
-          if (m & NoFail) {
-            r += 'NF'
-          }
-          if (m & Easy) {
-            r += 'EZ'
-          }
-          if (m & NoVideo) {
-            r += 'NV'
-          }
-          if (m & Hidden) {
-            r += 'HD'
-          }
-          if (m & HardRock) {
-            r += 'HR'
-          }
-          if (m & SuddenDeath) {
-            r += 'SD'
-          }
-          if (m & Nightcore) {
-            r += 'NC'
-            hasNightcore = true
-          }
-          if (!hasNightcore && (m & DoubleTime)) {
-            r += 'DT'
-          }
-          if (m & Relax) {
-            r += 'RX'
-          }
-          if (m & HalfTime) {
-            r += 'HT'
-          }
-          if (m & Flashlight) {
-            r += 'FL'
-          }
-          if (m & Autoplay) {
-            r += 'AP'
-          }
-          if (m & SpunOut) {
-            r += 'SO'
-          }
-          if (m & Relax2) {
-            r += 'AP'
-          }
-          if (m & Perfect) {
-            r += 'PF'
-          }
-          if (m & Key4) {
-            r += '4K'
-          }
-          if (m & Key5) {
-            r += '5K'
-          }
-          if (m & Key6) {
-            r += '6K'
-          }
-          if (m & Key7) {
-            r += '7K'
-          }
-          if (m & Key8) {
-            r += '8K'
-          }
-          if (m & keyMod) {
-            r += ''
-          }
-          if (m & FadeIn) {
-            r += 'FD'
-          }
-          if (m & Random) {
-            r += 'RD'
-          }
-          if (m & LastMod) {
-            r += 'CN'
-          }
-          if (m & Key9) {
-            r += '9K'
-          }
-          if (m & Key10) {
-            r += '10K'
-          }
-          if (m & Key1) {
-            r += '1K'
-          }
-          if (m & Key3) {
-            r += '3K'
-          }
-          if (m & Key2) {
-            r += '2K'
-          }
-          if (r.length > 0) {
-            return r.slice()
-          } else {
-            return 'NM'
+          return function getScoreMods (m) {
+            let r = ''
+            let hasNightcore = false
+            if (m & NoFail) {
+              r += 'NF'
+            }
+            if (m & Easy) {
+              r += 'EZ'
+            }
+            if (m & NoVideo) {
+              r += 'NV'
+            }
+            if (m & Hidden) {
+              r += 'HD'
+            }
+            if (m & HardRock) {
+              r += 'HR'
+            }
+            if (m & SuddenDeath) {
+              r += 'SD'
+            }
+            if (m & Nightcore) {
+              r += 'NC'
+              hasNightcore = true
+            }
+            if (!hasNightcore && (m & DoubleTime)) {
+              r += 'DT'
+            }
+            if (m & Relax) {
+              r += 'RX'
+            }
+            if (m & HalfTime) {
+              r += 'HT'
+            }
+            if (m & Flashlight) {
+              r += 'FL'
+            }
+            if (m & Autoplay) {
+              r += 'AP'
+            }
+            if (m & SpunOut) {
+              r += 'SO'
+            }
+            if (m & Relax2) {
+              r += 'AP'
+            }
+            if (m & Perfect) {
+              r += 'PF'
+            }
+            if (m & Key4) {
+              r += '4K'
+            }
+            if (m & Key5) {
+              r += '5K'
+            }
+            if (m & Key6) {
+              r += '6K'
+            }
+            if (m & Key7) {
+              r += '7K'
+            }
+            if (m & Key8) {
+              r += '8K'
+            }
+            if (m & keyMod) {
+              r += ''
+            }
+            if (m & FadeIn) {
+              r += 'FD'
+            }
+            if (m & Random) {
+              r += 'RD'
+            }
+            if (m & LastMod) {
+              r += 'CN'
+            }
+            if (m & Key9) {
+              r += '9K'
+            }
+            if (m & Key10) {
+              r += '10K'
+            }
+            if (m & Key1) {
+              r += '1K'
+            }
+            if (m & Key3) {
+              r += '3K'
+            }
+            if (m & Key2) {
+              r += '2K'
+            }
+            if (r.length > 0) {
+              return r.slice()
+            } else {
+              return 'NM'
+            }
           }
-        }
-      })()
-    }
-  },
-  computed: {},
-  created () {
-    // starting a page
-    this.modegulag = this.StrtoGulagInt()
-    this.LoadProfileData()
-    this.LoadAllofdata({ animation: false })
-    this.LoadUserStatus({ animation: false })
-  },
-  methods: {
-    LoadAllofdata (opt) {
-      this.LoadMostBeatmaps(opt)
-      this.LoadScores('best', opt)
-      this.LoadScores('recent', opt)
+        })()
+      }
     },
-    LoadProfileData () {
-      this.$set(this.data.stats, 'load', true)
-      this.$axios.get(`//api.${window.domain}/get_player_info`, {
-        params: {
-          id: this.userid,
-          scope: 'all'
-        }
-      })
-        .then(res => {
-          this.$set(this.data.stats, 'out', res.data.player.stats)
-          this.data.stats.load = false
-        })
+    computed: {},
+    created () {
+    // starting a page
+      this.modegulag = this.StrtoGulagInt()
+      this.LoadProfileData()
+      this.LoadAllofdata({ animation: false })
+      this.LoadUserStatus({ animation: false })
     },
-    async LoadScores (sort, { animation = true } = {}) {
-      this.$set(this.data.scores[`${sort}`], 'load', true)
-      await this.$axios.get(`//api.${window.domain}/get_player_scores`, {
-        params: {
-          id: this.userid,
-          mode: this.StrtoGulagInt(),
-          scope: sort,
-          limit: this.data.scores[`${sort}`].more.limit
-        }
-      })
-        .then(res => {
-          this.data.scores[`${sort}`].out = res.data.scores
-          // eslint-disable-next-line eqeqeq
-          this.data.scores[`${sort}`].more.full = this.data.scores[`${sort}`].out.length != this.data.scores[`${sort}`].more.limit
+    methods: {
+      LoadAllofdata (opt) {
+        this.LoadMostBeatmaps(opt)
+        this.LoadScores('best', opt)
+        this.LoadScores('recent', opt)
+      },
+      LoadProfileData () {
+        this.$set(this.data.stats, 'load', true)
+        this.$axios.get(`//api.${s.domain}/get_player_info`, {
+          params: {
+            id: this.userid,
+            scope: 'all'
+          }
         })
-      const toShow = (this.$refs.scores && this.$refs.scores.filter(el => !el.classList.contains('show'))) || []
-      // animation
-      if (!animation) {
-        toShow.forEach(el => el.classList.add('show'))
-        this.data.scores[`${sort}`].load = false
-      } else {
-        this.data.scores[`${sort}`].load = false
-        toShow.forEach((el, index) => {
-          setTimeout(() => {
-            el.classList.add('show')
-          }, index * 30)
+          .then(res => {
+            this.$set(this.data.stats, 'out', res.data.player.stats)
+            this.data.stats.load = false
+          })
+      },
+      async LoadScores (sort, { animation = true } = {}) {
+        this.$set(this.data.scores[`${sort}`], 'load', true)
+        await this.$axios.get(`//api.${s.domain}/get_player_scores`, {
+          params: {
+            id: this.userid,
+            mode: this.StrtoGulagInt(),
+            scope: sort,
+            limit: this.data.scores[`${sort}`].more.limit
+          }
         })
-      }
-    },
-    async LoadMostBeatmaps ({ animation = true } = {}) {
-      this.$set(this.data.maps.most, 'load', true)
-      await this.$axios.get(`//api.${window.domain}/get_player_most_played`, {
-        params: {
-          id: this.userid,
-          mode: this.StrtoGulagInt(),
-          limit: this.data.maps.most.more.limit
+          .then(res => {
+            this.data.scores[`${sort}`].out = res.data.scores
+            // eslint-disable-next-line eqeqeq
+            this.data.scores[`${sort}`].more.full = this.data.scores[`${sort}`].out.length != this.data.scores[`${sort}`].more.limit
+          })
+        const toShow = (this.$refs.scores && this.$refs.scores.filter(el => !el.classList.contains('show'))) || []
+        // animation
+        if (!animation) {
+          toShow.forEach(el => el.classList.add('show'))
+          this.data.scores[`${sort}`].load = false
+        } else {
+          this.data.scores[`${sort}`].load = false
+          toShow.forEach((el, index) => {
+            setTimeout(() => {
+              el.classList.add('show')
+            }, index * 30)
+          })
         }
-      })
-        .then(res => {
-          this.data.maps.most.out = res.data.maps
-          this.data.maps.most.more.full = this.data.maps.most.out.length !== this.data.maps.most.more.limit
-        })
-      const toShow = (this.$refs.mostPlayed && this.$refs.mostPlayed.filter(el => !el.classList.contains('show'))) || []
-      // animation
-      if (!animation) {
-        toShow.forEach(el => el.classList.add('show'))
-        this.data.maps.most.load = false
-      } else {
-        this.data.maps.most.load = false
-        toShow.forEach((el, index) => {
-          setTimeout(() => {
-            el.classList.add('show')
-          }, index * 20)
+      },
+      async LoadMostBeatmaps ({ animation = true } = {}) {
+        this.$set(this.data.maps.most, 'load', true)
+        await this.$axios.get(`//api.${s.domain}/get_player_most_played`, {
+          params: {
+            id: this.userid,
+            mode: this.StrtoGulagInt(),
+            limit: this.data.maps.most.more.limit
+          }
         })
-      }
-    },
-    LoadUserStatus () {
-      this.$axios.get(`//api.${window.domain}/get_player_status`, {
-        params: {
-          id: this.userid
+          .then(res => {
+            this.data.maps.most.out = res.data.maps
+            this.data.maps.most.more.full = this.data.maps.most.out.length !== this.data.maps.most.more.limit
+          })
+        const toShow = (this.$refs.mostPlayed && this.$refs.mostPlayed.filter(el => !el.classList.contains('show'))) || []
+        // animation
+        if (!animation) {
+          toShow.forEach(el => el.classList.add('show'))
+          this.data.maps.most.load = false
+        } else {
+          this.data.maps.most.load = false
+          toShow.forEach((el, index) => {
+            setTimeout(() => {
+              el.classList.add('show')
+            }, index * 20)
+          })
         }
-      })
-        .then(res => {
-          this.$set(this.data, 'status', res.data.player_status)
-        })
-        .catch(function (error) {
-          clearTimeout(window.loop)
-          console.log(error)
+      },
+      LoadUserStatus () {
+        this.$axios.get(`//api.${s.domain}/get_player_status`, {
+          params: {
+            id: this.userid
+          }
         })
-      window.loop = setTimeout(this.LoadUserStatus, 5000)
-    },
-    ChangeModeMods (mode, mods) {
-      if (window.event) { window.event.preventDefault() }
+          .then(res => {
+            this.$set(this.data, 'status', res.data.player_status)
+          })
+          .catch(function (error) {
+            clearTimeout(this.loop)
+            console.log(error)
+          })
+        this.loop = setTimeout(this.LoadUserStatus, 5000)
+      },
+      ChangeModeMods (mode, mods) {
+        if (s.event) { s.event.preventDefault() }
 
-      this.mode = mode
-      this.mods = mods
+        this.mode = mode
+        this.mods = mods
 
-      this.modegulag = this.StrtoGulagInt()
-      this.data.scores.recent.more.limit = 5
-      this.data.scores.best.more.limit = 5
-      this.data.maps.most.more.limit = 6
-      this.LoadAllofdata()
-    },
-    AddLimit (which) {
-      if (window.event) { window.event.preventDefault() }
+        this.modegulag = this.StrtoGulagInt()
+        this.data.scores.recent.more.limit = 5
+        this.data.scores.best.more.limit = 5
+        this.data.maps.most.more.limit = 6
+        this.LoadAllofdata()
+      },
+      AddLimit (which) {
+        if (s.event) { s.event.preventDefault() }
 
-      if (which === 'bestscore') {
-        this.data.scores.best.more.limit += 5
-        this.LoadScores('best')
-      } else if (which === 'recentscore') {
-        this.data.scores.recent.more.limit += 5
-        this.LoadScores('recent')
-      } else if (which === 'mostplay') {
-        this.data.maps.most.more.limit += 4
-        this.LoadMostBeatmaps()
-      }
-    },
-    actionIntToStr (d) {
-      switch (d.action) {
-        case 0:
-          return 'Idle: 🔍 Song Select'
-        case 1:
-          return '🌙 AFK'
-        case 2:
-          return `Playing: 🎶 ${d.info_text}`
-        case 3:
-          return `Editing: 🔨 ${d.info_text}`
-        case 4:
-          return `Modding: 🔨 ${d.info_text}`
-        case 5:
-          return 'In Multiplayer: Song Select'
-        case 6:
-          return `Watching: 👓 ${d.info_text}`
+        if (which === 'bestscore') {
+          this.data.scores.best.more.limit += 5
+          this.LoadScores('best')
+        } else if (which === 'recentscore') {
+          this.data.scores.recent.more.limit += 5
+          this.LoadScores('recent')
+        } else if (which === 'mostplay') {
+          this.data.maps.most.more.limit += 4
+          this.LoadMostBeatmaps()
+        }
+      },
+      actionIntToStr (d) {
+        switch (d.action) {
+          case 0:
+            return 'Idle: 🔍 Song Select'
+          case 1:
+            return '🌙 AFK'
+          case 2:
+            return `Playing: 🎶 ${d.info_text}`
+          case 3:
+            return `Editing: 🔨 ${d.info_text}`
+          case 4:
+            return `Modding: 🔨 ${d.info_text}`
+          case 5:
+            return 'In Multiplayer: Song Select'
+          case 6:
+            return `Watching: 👓 ${d.info_text}`
           // 7 not used
-        case 8:
-          return `Testing: 🎾 ${d.info_text}`
-        case 9:
-          return `Submitting: 🧼 ${d.info_text}`
+          case 8:
+            return `Testing: 🎾 ${d.info_text}`
+          case 9:
+            return `Submitting: 🧼 ${d.info_text}`
           // 10 paused, never used
-        case 11:
-          return 'Idle: 🏢 In multiplayer lobby'
-        case 12:
-          return `In Multiplayer: Playing 🌍 ${d.info_text} 🎶`
-        case 13:
-          return 'Idle: 🔍 Searching for beatmaps in osu!direct'
-        default:
-          return 'Unknown: 🚔 not yet implemented!'
-      }
-    },
-    addCommas (nStr) {
-      nStr += ''
-      const x = nStr.split('.')
-      let x1 = x[0]
-      const x2 = x.length > 1 ? '.' + x[1] : ''
-      const rgx = /(\d+)(\d{3})/
-      while (rgx.test(x1)) {
-        x1 = x1.replace(rgx, '$1' + ',' + '$2')
-      }
-      return x1 + x2
-    },
-    secondsToDhm (seconds) {
-      seconds = Number(seconds)
-      const dDisplay = `${Math.floor(seconds / (3600 * 24))}d `
-      const hDisplay = `${Math.floor(seconds % (3600 * 24) / 3600)}h `
-      const mDisplay = `${Math.floor(seconds % 3600 / 60)}m `
-      return dDisplay + hDisplay + mDisplay
-    },
-    StrtoGulagInt () {
-      switch (this.mode + '|' + this.mods) {
-        case 'std|vn':
-          return 0
-        case 'taiko|vn':
-          return 1
-        case 'catch|vn':
-          return 2
-        case 'mania|vn':
-          return 3
-        case 'std|rx':
-          return 4
-        case 'taiko|rx':
-          return 5
-        case 'catch|rx':
-          return 6
-        case 'std|ap':
-          return 8
-        default:
-          return -1
-      }
-    },
-    StrtoModeInt () {
-      switch (this.mode) {
-        case 'std':
-          return 0
-        case 'taiko':
-          return 1
-        case 'catch':
-          return 2
-        case 'mania':
-          return 3
+          case 11:
+            return 'Idle: 🏢 In multiplayer lobby'
+          case 12:
+            return `In Multiplayer: Playing 🌍 ${d.info_text} 🎶`
+          case 13:
+            return 'Idle: 🔍 Searching for beatmaps in osu!direct'
+          default:
+            return 'Unknown: 🚔 not yet implemented!'
+        }
+      },
+      addCommas (nStr) {
+        nStr += ''
+        const x = nStr.split('.')
+        let x1 = x[0]
+        const x2 = x.length > 1 ? '.' + x[1] : ''
+        const rgx = /(\d+)(\d{3})/
+        while (rgx.test(x1)) {
+          x1 = x1.replace(rgx, '$1' + ',' + '$2')
+        }
+        return x1 + x2
+      },
+      secondsToDhm (seconds) {
+        seconds = Number(seconds)
+        const dDisplay = `${Math.floor(seconds / (3600 * 24))}d `
+        const hDisplay = `${Math.floor(seconds % (3600 * 24) / 3600)}h `
+        const mDisplay = `${Math.floor(seconds % 3600 / 60)}m `
+        return dDisplay + hDisplay + mDisplay
+      },
+      StrtoGulagInt () {
+        switch (this.mode + '|' + this.mods) {
+          case 'std|vn':
+            return 0
+          case 'taiko|vn':
+            return 1
+          case 'catch|vn':
+            return 2
+          case 'mania|vn':
+            return 3
+          case 'std|rx':
+            return 4
+          case 'taiko|rx':
+            return 5
+          case 'catch|rx':
+            return 6
+          case 'std|ap':
+            return 8
+          default:
+            return -1
+        }
+      },
+      StrtoModeInt () {
+        switch (this.mode) {
+          case 'std':
+            return 0
+          case 'taiko':
+            return 1
+          case 'catch':
+            return 2
+          case 'mania':
+            return 3
+        }
       }
     }
-  }
+  })
 })
diff --git a/templates/profile.html b/templates/profile.html
index 1dc93011..4f8b8850 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -150,10 +150,18 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
 <link rel="stylesheet" href="/static/css/pages/profile.css?v={{ appVersion() }} ">
 
 <script>
-    window.userid = Number("{{ user['id'] }}"); //For text editor doesn't dizzy lmao
-    window.mode = '{{ mode }}';
-    window.mods = '{{ mods }}';
-    window.domain = "{{ domain() }}";
+    window.addEventListener('load', () => {
+        window._state = createState({
+            userid: Number("{{ user['id'] }}"), //For text editor doesn't dizzy lmao
+            mode: `{{ mode }}`,
+            mods: `{{ mods }}`,
+            domain: "{{ domain() }}"
+        })
+    })
+    // window.userid = Number("{{ user['id'] }}"); //For text editor doesn't dizzy lmao
+    // window.mode = '{{ mode }}';
+    // window.mods = '{{ mods }}';
+    // window.domain = "{{ domain() }}";
 </script>
 <style>
     .rounded-sm {

From f78cefddfeb700b27a6cb93d0e71603d2851bf86 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 25 Aug 2022 08:58:34 +0000
Subject: [PATCH 238/278] check globals

---
 static/js/pages/profile.js | 11 ++++++++++-
 templates/profile.html     |  4 ----
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 1fb5a89d..a5a54380 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -1,7 +1,16 @@
 /* eslint-env browser */
 
 window.addEventListener('load', () => {
-  const s = window._state.reactive
+  const s = window._state?.reactive
+  if (!s) {
+    throw new Error('unable to locate states')
+  }
+
+  // eslint-disable-next-line no-undef
+  _testGlobals(
+    { exists: ['mode', 'mods', 'userid', 'domain'] },
+    s
+  )
   // eslint-disable-next-line no-new, no-undef
   new Vue({
     el: '#app',
diff --git a/templates/profile.html b/templates/profile.html
index 4f8b8850..5a281867 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -158,10 +158,6 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
             domain: "{{ domain() }}"
         })
     })
-    // window.userid = Number("{{ user['id'] }}"); //For text editor doesn't dizzy lmao
-    // window.mode = '{{ mode }}';
-    // window.mods = '{{ mods }}';
-    // window.domain = "{{ domain() }}";
 </script>
 <style>
     .rounded-sm {

From f4af391782ed71906c22a82ee8158c72b63c30ee Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 25 Aug 2022 09:03:11 +0000
Subject: [PATCH 239/278] use dot access

---
 templates/admin/users/upload-scores.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index 7a0b2411..1862fbe3 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -25,7 +25,7 @@
 <script>
     document.addEventListener('DOMContentLoaded', () => {
         transaction(state => {
-            state.apiKey = "{{ session['user_data']['api_key'] }}"
+            state.apiKey = "{{ session.user_data['api_key'] }}"
             state.userId = parseInt('{{ search_data.id }}')
         }, false)
     })

From ab2ef83a91b9786c739e84630c621b60071258fb Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 25 Aug 2022 09:03:26 +0000
Subject: [PATCH 240/278] format

---
 templates/admin/beatmaps.html | 61 ++++++++++++++++++++++++++---------
 1 file changed, 45 insertions(+), 16 deletions(-)

diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index f127e122..284f9072 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -24,19 +24,24 @@
     .i-text-no-wrap * {
         white-space: nowrap;
     }
+
     .my-auto {
         vertical-align: middle !important;
     }
+
     .progress {
         position: fixed;
         margin-top: -30px;
         width: 85%;
         z-index: 1;
     }
+
     .shadow {
-        filter: drop-shadow(0 0 0.5rem rgba(0,0,0,0.2));
+        filter: drop-shadow(0 0 0.5rem rgba(0, 0, 0, 0.2));
     }
-    .card .title, .card .stat {
+
+    .card .title,
+    .card .stat {
         font-size: 12px
     }
 </style>
@@ -44,9 +49,13 @@
 {% block title %} Beatmaps {% endblock %}
 
 {% block content %}
-<script>
-    window.api_key = '{{ session.user_data['api_key'] }}'
-</script>
+{# <script>
+    window.addEventListener('load', () => {
+        window._state = createState({
+            api_key: "{{ session.user_data['api_key'] }}"
+        })
+    })
+</script> #}
 <progress id="progress_bar" class="progress is-small is-primary" max="100" style="display: none;"></progress>
 <div class="columns is-marginless">
     <div class="column is-paddingless is-avatar">
@@ -94,7 +103,8 @@ <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
         </div>
     </div>
     <div class="p-0 d-flex gap-2 py-3">
-        <input placeholder='{{ t("admin.beatmaps.search-by-bid-sid-or-title") }}' id="search-bar" class="input" value="{{ search_word }}">
+        <input placeholder='{{ t("admin.beatmaps.search-by-bid-sid-or-title") }}' id="search-bar" class="input"
+            value="{{ search_word }}">
         <button onclick="searchMaps()" class="button" style="width: 200px">{{ t("admin.beatmaps.search") }}</button>
     </div>
     <div class="table-responsive py-3">
@@ -118,7 +128,9 @@ <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
                     <td style="width: 400px">
                         <div class="card p-0 m-0 shadow"
                             style="background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size: cover; height: 100px; width: 400px;">
-                            <div class="card-body rounded-sm h-100 p-4" style="background-color: rgba(0, 0, 0, 0.8);cursor:pointer; " onclick="window.open('https://osu.ppy.sh/beatmapsets/{{ i.set_id }}')">
+                            <div class="card-body rounded-sm h-100 p-4"
+                                style="background-color: rgba(0, 0, 0, 0.8);cursor:pointer; "
+                                onclick="window.open('https://osu.ppy.sh/beatmapsets/{{ i.set_id }}')">
                                 <a class="play-detail__title">{{ i.title }}
                                     <small style="display: inline;">by {{ i.creator }}</small>
                                 </a>
@@ -160,7 +172,8 @@ <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
                     <td class="!bigger_td my-auto has-text-centered">
                         <div class="dropdown is-right" id="i-dropdown-{{ i.map_id }}">
                             <div class="dropdown-trigger">
-                                <button class="button" aria-haspopup="true" aria-controls="dropdown-menu" onclick="document.getElementById('i-dropdown-{{ i.map_id }}').classList.toggle('is-active')">
+                                <button class="button" aria-haspopup="true" aria-controls="dropdown-menu"
+                                    onclick="document.getElementById('i-dropdown-{{ i.map_id }}').classList.toggle('is-active')">
                                     <span>{{ t("admin.beatmaps.edit-status") }}</span>
                                     <span class="icon is-small">
                                         <i class="fas fa-angle-down" aria-hidden="true"></i>
@@ -169,15 +182,31 @@ <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
                             </div>
                             <div class="dropdown-menu" id="dropdown-menu-{{ i.map_id }}" role="menu">
                                 <div class="dropdown-content has-background-primary">
-                                    <a class="dropdown-item {% if i.status == 2 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=2&set=0">{{ t("admin.beatmaps.ranked-diff") }}</a>
-                                    <a class="dropdown-item {% if i.status == 5 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=5&set=0">{{ t("admin.beatmaps.loved-diff") }}</a>
-                                    <a class="dropdown-item {% if i.status == 3 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=3&set=0">{{ t("admin.beatmaps.approved-diff") }}</a>
-                                    <a class="dropdown-item {% if i.status == 0 %} is-disabled {% endif %}" href="/admin/beatmaps/edit/{{ i.map_id }}?status=0&set=0">{{ t("admin.beatmaps.pending-diff") }}</a>
+                                    <a class="dropdown-item {% if i.status == 2 %} is-disabled {% endif %}"
+                                        href="/admin/beatmaps/edit/{{ i.map_id }}?status=2&set=0">{{
+                                        t("admin.beatmaps.ranked-diff") }}</a>
+                                    <a class="dropdown-item {% if i.status == 5 %} is-disabled {% endif %}"
+                                        href="/admin/beatmaps/edit/{{ i.map_id }}?status=5&set=0">{{
+                                        t("admin.beatmaps.loved-diff") }}</a>
+                                    <a class="dropdown-item {% if i.status == 3 %} is-disabled {% endif %}"
+                                        href="/admin/beatmaps/edit/{{ i.map_id }}?status=3&set=0">{{
+                                        t("admin.beatmaps.approved-diff") }}</a>
+                                    <a class="dropdown-item {% if i.status == 0 %} is-disabled {% endif %}"
+                                        href="/admin/beatmaps/edit/{{ i.map_id }}?status=0&set=0">{{
+                                        t("admin.beatmaps.pending-diff") }}</a>
                                     <hr class="dropdown-divider">
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=2&set=1">{{ t("admin.beatmaps.ranked-set") }}</a>
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">{{ t("admin.beatmaps.loved-set") }}</a>
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">{{ t("admin.beatmaps.approved-set") }}</a>
-                                    <a class="dropdown-item" href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">{{ t("admin.beatmaps.pending-set") }}</a>
+                                    <a class="dropdown-item"
+                                        href="/admin/beatmaps/edit/{{ i.set_id }}?status=2&set=1">{{
+                                        t("admin.beatmaps.ranked-set") }}</a>
+                                    <a class="dropdown-item"
+                                        href="/admin/beatmaps/edit/{{ i.set_id }}?status=5&set=1">{{
+                                        t("admin.beatmaps.loved-set") }}</a>
+                                    <a class="dropdown-item"
+                                        href="/admin/beatmaps/edit/{{ i.set_id }}?status=3&set=1">{{
+                                        t("admin.beatmaps.approved-set") }}</a>
+                                    <a class="dropdown-item"
+                                        href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">{{
+                                        t("admin.beatmaps.pending-set") }}</a>
                                 </div>
                             </div>
                         </div>

From fba384f5e1211969c61b158c85674d0b0e489747 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 27 Aug 2022 07:03:21 +0000
Subject: [PATCH 241/278] remove rounded border

---
 static/css/style.css | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/static/css/style.css b/static/css/style.css
index 6f8494bb..f72cb802 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -428,7 +428,8 @@ a.foot-link {
   flex-direction: column;
   text-align: center;
   position: relative;
-  border-radius: 10px;
+  border-radius: 0;
+  /* border-radius: 10px; */
 }
 
 .noti-banner {

From 6cf6f8e2faeee6860c2b3ed77132b05a97524924 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 27 Aug 2022 07:24:36 +0000
Subject: [PATCH 242/278] back to cloudflare cdn for now.  Goal is remove jq
 requirement

---
 templates/admin/base.html | 2 +-
 templates/base.html       | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/templates/admin/base.html b/templates/admin/base.html
index deb59c9a..1464e3b0 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -21,7 +21,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <!-- jquery -->
-  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>=
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js" crossorigin="anonymous"></script>
 
   <!-- bulma -->
   <link rel="stylesheet" href="/static/css/bulma.css?v={{ appVersion() }} " />
diff --git a/templates/base.html b/templates/base.html
index 68b2c254..c01283ab 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -21,7 +21,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <!-- JQuery -->
-  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js" crossorigin="anonymous"></script>
 
   <!-- Bulma -->
   <link rel="stylesheet" href="/static/css/bulma.css?v={{ appVersion() }} " />

From 565ae5496d74654bc4cba35a18bbd2dacffb8546 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 27 Aug 2022 07:40:26 +0000
Subject: [PATCH 243/278] switch to self-hosted

---
 static/js/assets/jquery-min.js | 2 ++
 templates/admin/base.html      | 2 +-
 templates/base.html            | 2 +-
 3 files changed, 4 insertions(+), 2 deletions(-)
 create mode 100644 static/js/assets/jquery-min.js

diff --git a/static/js/assets/jquery-min.js b/static/js/assets/jquery-min.js
new file mode 100644
index 00000000..9b173199
--- /dev/null
+++ b/static/js/assets/jquery-min.js
@@ -0,0 +1,2 @@
+/*! jQuery v3.6.1 | (c) OpenJS Foundation and other contributors | jquery.org/license */
+!function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=e.document?t(e,!0):function(e){if(!e.document)throw new Error("jQuery requires a window with a document");return t(e)}:t(e)}("undefined"!=typeof window?window:this,function(C,e){"use strict";var t=[],r=Object.getPrototypeOf,s=t.slice,g=t.flat?function(e){return t.flat.call(e)}:function(e){return t.concat.apply([],e)},u=t.push,i=t.indexOf,n={},o=n.toString,y=n.hasOwnProperty,a=y.toString,l=a.call(Object),v={},m=function(e){return"function"==typeof e&&"number"!=typeof e.nodeType&&"function"!=typeof e.item},x=function(e){return null!=e&&e===e.window},E=C.document,c={type:!0,src:!0,nonce:!0,noModule:!0};function b(e,t,n){var r,i,o=(n=n||E).createElement("script");if(o.text=e,t)for(r in c)(i=t[r]||t.getAttribute&&t.getAttribute(r))&&o.setAttribute(r,i);n.head.appendChild(o).parentNode.removeChild(o)}function w(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?n[o.call(e)]||"object":typeof e}var f="3.6.1",S=function(e,t){return new S.fn.init(e,t)};function p(e){var t=!!e&&"length"in e&&e.length,n=w(e);return!m(e)&&!x(e)&&("array"===n||0===t||"number"==typeof t&&0<t&&t-1 in e)}S.fn=S.prototype={jquery:f,constructor:S,length:0,toArray:function(){return s.call(this)},get:function(e){return null==e?s.call(this):e<0?this[e+this.length]:this[e]},pushStack:function(e){var t=S.merge(this.constructor(),e);return t.prevObject=this,t},each:function(e){return S.each(this,e)},map:function(n){return this.pushStack(S.map(this,function(e,t){return n.call(e,t,e)}))},slice:function(){return this.pushStack(s.apply(this,arguments))},first:function(){return this.eq(0)},last:function(){return this.eq(-1)},even:function(){return this.pushStack(S.grep(this,function(e,t){return(t+1)%2}))},odd:function(){return this.pushStack(S.grep(this,function(e,t){return t%2}))},eq:function(e){var t=this.length,n=+e+(e<0?t:0);return this.pushStack(0<=n&&n<t?[this[n]]:[])},end:function(){return this.prevObject||this.constructor()},push:u,sort:t.sort,splice:t.splice},S.extend=S.fn.extend=function(){var e,t,n,r,i,o,a=arguments[0]||{},s=1,u=arguments.length,l=!1;for("boolean"==typeof a&&(l=a,a=arguments[s]||{},s++),"object"==typeof a||m(a)||(a={}),s===u&&(a=this,s--);s<u;s++)if(null!=(e=arguments[s]))for(t in e)r=e[t],"__proto__"!==t&&a!==r&&(l&&r&&(S.isPlainObject(r)||(i=Array.isArray(r)))?(n=a[t],o=i&&!Array.isArray(n)?[]:i||S.isPlainObject(n)?n:{},i=!1,a[t]=S.extend(l,o,r)):void 0!==r&&(a[t]=r));return a},S.extend({expando:"jQuery"+(f+Math.random()).replace(/\D/g,""),isReady:!0,error:function(e){throw new Error(e)},noop:function(){},isPlainObject:function(e){var t,n;return!(!e||"[object Object]"!==o.call(e))&&(!(t=r(e))||"function"==typeof(n=y.call(t,"constructor")&&t.constructor)&&a.call(n)===l)},isEmptyObject:function(e){var t;for(t in e)return!1;return!0},globalEval:function(e,t,n){b(e,{nonce:t&&t.nonce},n)},each:function(e,t){var n,r=0;if(p(e)){for(n=e.length;r<n;r++)if(!1===t.call(e[r],r,e[r]))break}else for(r in e)if(!1===t.call(e[r],r,e[r]))break;return e},makeArray:function(e,t){var n=t||[];return null!=e&&(p(Object(e))?S.merge(n,"string"==typeof e?[e]:e):u.call(n,e)),n},inArray:function(e,t,n){return null==t?-1:i.call(t,e,n)},merge:function(e,t){for(var n=+t.length,r=0,i=e.length;r<n;r++)e[i++]=t[r];return e.length=i,e},grep:function(e,t,n){for(var r=[],i=0,o=e.length,a=!n;i<o;i++)!t(e[i],i)!==a&&r.push(e[i]);return r},map:function(e,t,n){var r,i,o=0,a=[];if(p(e))for(r=e.length;o<r;o++)null!=(i=t(e[o],o,n))&&a.push(i);else for(o in e)null!=(i=t(e[o],o,n))&&a.push(i);return g(a)},guid:1,support:v}),"function"==typeof Symbol&&(S.fn[Symbol.iterator]=t[Symbol.iterator]),S.each("Boolean Number String Function Array Date RegExp Object Error Symbol".split(" "),function(e,t){n["[object "+t+"]"]=t.toLowerCase()});var d=function(n){var e,d,b,o,i,h,f,g,w,u,l,T,C,a,E,y,s,c,v,S="sizzle"+1*new Date,p=n.document,k=0,r=0,m=ue(),x=ue(),A=ue(),N=ue(),j=function(e,t){return e===t&&(l=!0),0},D={}.hasOwnProperty,t=[],q=t.pop,L=t.push,H=t.push,O=t.slice,P=function(e,t){for(var n=0,r=e.length;n<r;n++)if(e[n]===t)return n;return-1},R="checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",M="[\\x20\\t\\r\\n\\f]",I="(?:\\\\[\\da-fA-F]{1,6}"+M+"?|\\\\[^\\r\\n\\f]|[\\w-]|[^\0-\\x7f])+",W="\\["+M+"*("+I+")(?:"+M+"*([*^$|!~]?=)"+M+"*(?:'((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\"|("+I+"))|)"+M+"*\\]",F=":("+I+")(?:\\((('((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\")|((?:\\\\.|[^\\\\()[\\]]|"+W+")*)|.*)\\)|)",$=new RegExp(M+"+","g"),B=new RegExp("^"+M+"+|((?:^|[^\\\\])(?:\\\\.)*)"+M+"+$","g"),_=new RegExp("^"+M+"*,"+M+"*"),z=new RegExp("^"+M+"*([>+~]|"+M+")"+M+"*"),U=new RegExp(M+"|>"),X=new RegExp(F),V=new RegExp("^"+I+"$"),G={ID:new RegExp("^#("+I+")"),CLASS:new RegExp("^\\.("+I+")"),TAG:new RegExp("^("+I+"|[*])"),ATTR:new RegExp("^"+W),PSEUDO:new RegExp("^"+F),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+M+"*(even|odd|(([+-]|)(\\d*)n|)"+M+"*(?:([+-]|)"+M+"*(\\d+)|))"+M+"*\\)|)","i"),bool:new RegExp("^(?:"+R+")$","i"),needsContext:new RegExp("^"+M+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+M+"*((?:-\\d)?\\d*)"+M+"*\\)|)(?=[^-]|$)","i")},Y=/HTML$/i,Q=/^(?:input|select|textarea|button)$/i,J=/^h\d$/i,K=/^[^{]+\{\s*\[native \w/,Z=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,ee=/[+~]/,te=new RegExp("\\\\[\\da-fA-F]{1,6}"+M+"?|\\\\([^\\r\\n\\f])","g"),ne=function(e,t){var n="0x"+e.slice(1)-65536;return t||(n<0?String.fromCharCode(n+65536):String.fromCharCode(n>>10|55296,1023&n|56320))},re=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,ie=function(e,t){return t?"\0"===e?"\ufffd":e.slice(0,-1)+"\\"+e.charCodeAt(e.length-1).toString(16)+" ":"\\"+e},oe=function(){T()},ae=be(function(e){return!0===e.disabled&&"fieldset"===e.nodeName.toLowerCase()},{dir:"parentNode",next:"legend"});try{H.apply(t=O.call(p.childNodes),p.childNodes),t[p.childNodes.length].nodeType}catch(e){H={apply:t.length?function(e,t){L.apply(e,O.call(t))}:function(e,t){var n=e.length,r=0;while(e[n++]=t[r++]);e.length=n-1}}}function se(t,e,n,r){var i,o,a,s,u,l,c,f=e&&e.ownerDocument,p=e?e.nodeType:9;if(n=n||[],"string"!=typeof t||!t||1!==p&&9!==p&&11!==p)return n;if(!r&&(T(e),e=e||C,E)){if(11!==p&&(u=Z.exec(t)))if(i=u[1]){if(9===p){if(!(a=e.getElementById(i)))return n;if(a.id===i)return n.push(a),n}else if(f&&(a=f.getElementById(i))&&v(e,a)&&a.id===i)return n.push(a),n}else{if(u[2])return H.apply(n,e.getElementsByTagName(t)),n;if((i=u[3])&&d.getElementsByClassName&&e.getElementsByClassName)return H.apply(n,e.getElementsByClassName(i)),n}if(d.qsa&&!N[t+" "]&&(!y||!y.test(t))&&(1!==p||"object"!==e.nodeName.toLowerCase())){if(c=t,f=e,1===p&&(U.test(t)||z.test(t))){(f=ee.test(t)&&ve(e.parentNode)||e)===e&&d.scope||((s=e.getAttribute("id"))?s=s.replace(re,ie):e.setAttribute("id",s=S)),o=(l=h(t)).length;while(o--)l[o]=(s?"#"+s:":scope")+" "+xe(l[o]);c=l.join(",")}try{return H.apply(n,f.querySelectorAll(c)),n}catch(e){N(t,!0)}finally{s===S&&e.removeAttribute("id")}}}return g(t.replace(B,"$1"),e,n,r)}function ue(){var r=[];return function e(t,n){return r.push(t+" ")>b.cacheLength&&delete e[r.shift()],e[t+" "]=n}}function le(e){return e[S]=!0,e}function ce(e){var t=C.createElement("fieldset");try{return!!e(t)}catch(e){return!1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null}}function fe(e,t){var n=e.split("|"),r=n.length;while(r--)b.attrHandle[n[r]]=t}function pe(e,t){var n=t&&e,r=n&&1===e.nodeType&&1===t.nodeType&&e.sourceIndex-t.sourceIndex;if(r)return r;if(n)while(n=n.nextSibling)if(n===t)return-1;return e?1:-1}function de(t){return function(e){return"input"===e.nodeName.toLowerCase()&&e.type===t}}function he(n){return function(e){var t=e.nodeName.toLowerCase();return("input"===t||"button"===t)&&e.type===n}}function ge(t){return function(e){return"form"in e?e.parentNode&&!1===e.disabled?"label"in e?"label"in e.parentNode?e.parentNode.disabled===t:e.disabled===t:e.isDisabled===t||e.isDisabled!==!t&&ae(e)===t:e.disabled===t:"label"in e&&e.disabled===t}}function ye(a){return le(function(o){return o=+o,le(function(e,t){var n,r=a([],e.length,o),i=r.length;while(i--)e[n=r[i]]&&(e[n]=!(t[n]=e[n]))})})}function ve(e){return e&&"undefined"!=typeof e.getElementsByTagName&&e}for(e in d=se.support={},i=se.isXML=function(e){var t=e&&e.namespaceURI,n=e&&(e.ownerDocument||e).documentElement;return!Y.test(t||n&&n.nodeName||"HTML")},T=se.setDocument=function(e){var t,n,r=e?e.ownerDocument||e:p;return r!=C&&9===r.nodeType&&r.documentElement&&(a=(C=r).documentElement,E=!i(C),p!=C&&(n=C.defaultView)&&n.top!==n&&(n.addEventListener?n.addEventListener("unload",oe,!1):n.attachEvent&&n.attachEvent("onunload",oe)),d.scope=ce(function(e){return a.appendChild(e).appendChild(C.createElement("div")),"undefined"!=typeof e.querySelectorAll&&!e.querySelectorAll(":scope fieldset div").length}),d.attributes=ce(function(e){return e.className="i",!e.getAttribute("className")}),d.getElementsByTagName=ce(function(e){return e.appendChild(C.createComment("")),!e.getElementsByTagName("*").length}),d.getElementsByClassName=K.test(C.getElementsByClassName),d.getById=ce(function(e){return a.appendChild(e).id=S,!C.getElementsByName||!C.getElementsByName(S).length}),d.getById?(b.filter.ID=function(e){var t=e.replace(te,ne);return function(e){return e.getAttribute("id")===t}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n=t.getElementById(e);return n?[n]:[]}}):(b.filter.ID=function(e){var n=e.replace(te,ne);return function(e){var t="undefined"!=typeof e.getAttributeNode&&e.getAttributeNode("id");return t&&t.value===n}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n,r,i,o=t.getElementById(e);if(o){if((n=o.getAttributeNode("id"))&&n.value===e)return[o];i=t.getElementsByName(e),r=0;while(o=i[r++])if((n=o.getAttributeNode("id"))&&n.value===e)return[o]}return[]}}),b.find.TAG=d.getElementsByTagName?function(e,t){return"undefined"!=typeof t.getElementsByTagName?t.getElementsByTagName(e):d.qsa?t.querySelectorAll(e):void 0}:function(e,t){var n,r=[],i=0,o=t.getElementsByTagName(e);if("*"===e){while(n=o[i++])1===n.nodeType&&r.push(n);return r}return o},b.find.CLASS=d.getElementsByClassName&&function(e,t){if("undefined"!=typeof t.getElementsByClassName&&E)return t.getElementsByClassName(e)},s=[],y=[],(d.qsa=K.test(C.querySelectorAll))&&(ce(function(e){var t;a.appendChild(e).innerHTML="<a id='"+S+"'></a><select id='"+S+"-\r\\' msallowcapture=''><option selected=''></option></select>",e.querySelectorAll("[msallowcapture^='']").length&&y.push("[*^$]="+M+"*(?:''|\"\")"),e.querySelectorAll("[selected]").length||y.push("\\["+M+"*(?:value|"+R+")"),e.querySelectorAll("[id~="+S+"-]").length||y.push("~="),(t=C.createElement("input")).setAttribute("name",""),e.appendChild(t),e.querySelectorAll("[name='']").length||y.push("\\["+M+"*name"+M+"*="+M+"*(?:''|\"\")"),e.querySelectorAll(":checked").length||y.push(":checked"),e.querySelectorAll("a#"+S+"+*").length||y.push(".#.+[+~]"),e.querySelectorAll("\\\f"),y.push("[\\r\\n\\f]")}),ce(function(e){e.innerHTML="<a href='' disabled='disabled'></a><select disabled='disabled'><option/></select>";var t=C.createElement("input");t.setAttribute("type","hidden"),e.appendChild(t).setAttribute("name","D"),e.querySelectorAll("[name=d]").length&&y.push("name"+M+"*[*^$|!~]?="),2!==e.querySelectorAll(":enabled").length&&y.push(":enabled",":disabled"),a.appendChild(e).disabled=!0,2!==e.querySelectorAll(":disabled").length&&y.push(":enabled",":disabled"),e.querySelectorAll("*,:x"),y.push(",.*:")})),(d.matchesSelector=K.test(c=a.matches||a.webkitMatchesSelector||a.mozMatchesSelector||a.oMatchesSelector||a.msMatchesSelector))&&ce(function(e){d.disconnectedMatch=c.call(e,"*"),c.call(e,"[s!='']:x"),s.push("!=",F)}),y=y.length&&new RegExp(y.join("|")),s=s.length&&new RegExp(s.join("|")),t=K.test(a.compareDocumentPosition),v=t||K.test(a.contains)?function(e,t){var n=9===e.nodeType?e.documentElement:e,r=t&&t.parentNode;return e===r||!(!r||1!==r.nodeType||!(n.contains?n.contains(r):e.compareDocumentPosition&&16&e.compareDocumentPosition(r)))}:function(e,t){if(t)while(t=t.parentNode)if(t===e)return!0;return!1},j=t?function(e,t){if(e===t)return l=!0,0;var n=!e.compareDocumentPosition-!t.compareDocumentPosition;return n||(1&(n=(e.ownerDocument||e)==(t.ownerDocument||t)?e.compareDocumentPosition(t):1)||!d.sortDetached&&t.compareDocumentPosition(e)===n?e==C||e.ownerDocument==p&&v(p,e)?-1:t==C||t.ownerDocument==p&&v(p,t)?1:u?P(u,e)-P(u,t):0:4&n?-1:1)}:function(e,t){if(e===t)return l=!0,0;var n,r=0,i=e.parentNode,o=t.parentNode,a=[e],s=[t];if(!i||!o)return e==C?-1:t==C?1:i?-1:o?1:u?P(u,e)-P(u,t):0;if(i===o)return pe(e,t);n=e;while(n=n.parentNode)a.unshift(n);n=t;while(n=n.parentNode)s.unshift(n);while(a[r]===s[r])r++;return r?pe(a[r],s[r]):a[r]==p?-1:s[r]==p?1:0}),C},se.matches=function(e,t){return se(e,null,null,t)},se.matchesSelector=function(e,t){if(T(e),d.matchesSelector&&E&&!N[t+" "]&&(!s||!s.test(t))&&(!y||!y.test(t)))try{var n=c.call(e,t);if(n||d.disconnectedMatch||e.document&&11!==e.document.nodeType)return n}catch(e){N(t,!0)}return 0<se(t,C,null,[e]).length},se.contains=function(e,t){return(e.ownerDocument||e)!=C&&T(e),v(e,t)},se.attr=function(e,t){(e.ownerDocument||e)!=C&&T(e);var n=b.attrHandle[t.toLowerCase()],r=n&&D.call(b.attrHandle,t.toLowerCase())?n(e,t,!E):void 0;return void 0!==r?r:d.attributes||!E?e.getAttribute(t):(r=e.getAttributeNode(t))&&r.specified?r.value:null},se.escape=function(e){return(e+"").replace(re,ie)},se.error=function(e){throw new Error("Syntax error, unrecognized expression: "+e)},se.uniqueSort=function(e){var t,n=[],r=0,i=0;if(l=!d.detectDuplicates,u=!d.sortStable&&e.slice(0),e.sort(j),l){while(t=e[i++])t===e[i]&&(r=n.push(i));while(r--)e.splice(n[r],1)}return u=null,e},o=se.getText=function(e){var t,n="",r=0,i=e.nodeType;if(i){if(1===i||9===i||11===i){if("string"==typeof e.textContent)return e.textContent;for(e=e.firstChild;e;e=e.nextSibling)n+=o(e)}else if(3===i||4===i)return e.nodeValue}else while(t=e[r++])n+=o(t);return n},(b=se.selectors={cacheLength:50,createPseudo:le,match:G,attrHandle:{},find:{},relative:{">":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(e){return e[1]=e[1].replace(te,ne),e[3]=(e[3]||e[4]||e[5]||"").replace(te,ne),"~="===e[2]&&(e[3]=" "+e[3]+" "),e.slice(0,4)},CHILD:function(e){return e[1]=e[1].toLowerCase(),"nth"===e[1].slice(0,3)?(e[3]||se.error(e[0]),e[4]=+(e[4]?e[5]+(e[6]||1):2*("even"===e[3]||"odd"===e[3])),e[5]=+(e[7]+e[8]||"odd"===e[3])):e[3]&&se.error(e[0]),e},PSEUDO:function(e){var t,n=!e[6]&&e[2];return G.CHILD.test(e[0])?null:(e[3]?e[2]=e[4]||e[5]||"":n&&X.test(n)&&(t=h(n,!0))&&(t=n.indexOf(")",n.length-t)-n.length)&&(e[0]=e[0].slice(0,t),e[2]=n.slice(0,t)),e.slice(0,3))}},filter:{TAG:function(e){var t=e.replace(te,ne).toLowerCase();return"*"===e?function(){return!0}:function(e){return e.nodeName&&e.nodeName.toLowerCase()===t}},CLASS:function(e){var t=m[e+" "];return t||(t=new RegExp("(^|"+M+")"+e+"("+M+"|$)"))&&m(e,function(e){return t.test("string"==typeof e.className&&e.className||"undefined"!=typeof e.getAttribute&&e.getAttribute("class")||"")})},ATTR:function(n,r,i){return function(e){var t=se.attr(e,n);return null==t?"!="===r:!r||(t+="","="===r?t===i:"!="===r?t!==i:"^="===r?i&&0===t.indexOf(i):"*="===r?i&&-1<t.indexOf(i):"$="===r?i&&t.slice(-i.length)===i:"~="===r?-1<(" "+t.replace($," ")+" ").indexOf(i):"|="===r&&(t===i||t.slice(0,i.length+1)===i+"-"))}},CHILD:function(h,e,t,g,y){var v="nth"!==h.slice(0,3),m="last"!==h.slice(-4),x="of-type"===e;return 1===g&&0===y?function(e){return!!e.parentNode}:function(e,t,n){var r,i,o,a,s,u,l=v!==m?"nextSibling":"previousSibling",c=e.parentNode,f=x&&e.nodeName.toLowerCase(),p=!n&&!x,d=!1;if(c){if(v){while(l){a=e;while(a=a[l])if(x?a.nodeName.toLowerCase()===f:1===a.nodeType)return!1;u=l="only"===h&&!u&&"nextSibling"}return!0}if(u=[m?c.firstChild:c.lastChild],m&&p){d=(s=(r=(i=(o=(a=c)[S]||(a[S]={}))[a.uniqueID]||(o[a.uniqueID]={}))[h]||[])[0]===k&&r[1])&&r[2],a=s&&c.childNodes[s];while(a=++s&&a&&a[l]||(d=s=0)||u.pop())if(1===a.nodeType&&++d&&a===e){i[h]=[k,s,d];break}}else if(p&&(d=s=(r=(i=(o=(a=e)[S]||(a[S]={}))[a.uniqueID]||(o[a.uniqueID]={}))[h]||[])[0]===k&&r[1]),!1===d)while(a=++s&&a&&a[l]||(d=s=0)||u.pop())if((x?a.nodeName.toLowerCase()===f:1===a.nodeType)&&++d&&(p&&((i=(o=a[S]||(a[S]={}))[a.uniqueID]||(o[a.uniqueID]={}))[h]=[k,d]),a===e))break;return(d-=y)===g||d%g==0&&0<=d/g}}},PSEUDO:function(e,o){var t,a=b.pseudos[e]||b.setFilters[e.toLowerCase()]||se.error("unsupported pseudo: "+e);return a[S]?a(o):1<a.length?(t=[e,e,"",o],b.setFilters.hasOwnProperty(e.toLowerCase())?le(function(e,t){var n,r=a(e,o),i=r.length;while(i--)e[n=P(e,r[i])]=!(t[n]=r[i])}):function(e){return a(e,0,t)}):a}},pseudos:{not:le(function(e){var r=[],i=[],s=f(e.replace(B,"$1"));return s[S]?le(function(e,t,n,r){var i,o=s(e,null,r,[]),a=e.length;while(a--)(i=o[a])&&(e[a]=!(t[a]=i))}):function(e,t,n){return r[0]=e,s(r,null,n,i),r[0]=null,!i.pop()}}),has:le(function(t){return function(e){return 0<se(t,e).length}}),contains:le(function(t){return t=t.replace(te,ne),function(e){return-1<(e.textContent||o(e)).indexOf(t)}}),lang:le(function(n){return V.test(n||"")||se.error("unsupported lang: "+n),n=n.replace(te,ne).toLowerCase(),function(e){var t;do{if(t=E?e.lang:e.getAttribute("xml:lang")||e.getAttribute("lang"))return(t=t.toLowerCase())===n||0===t.indexOf(n+"-")}while((e=e.parentNode)&&1===e.nodeType);return!1}}),target:function(e){var t=n.location&&n.location.hash;return t&&t.slice(1)===e.id},root:function(e){return e===a},focus:function(e){return e===C.activeElement&&(!C.hasFocus||C.hasFocus())&&!!(e.type||e.href||~e.tabIndex)},enabled:ge(!1),disabled:ge(!0),checked:function(e){var t=e.nodeName.toLowerCase();return"input"===t&&!!e.checked||"option"===t&&!!e.selected},selected:function(e){return e.parentNode&&e.parentNode.selectedIndex,!0===e.selected},empty:function(e){for(e=e.firstChild;e;e=e.nextSibling)if(e.nodeType<6)return!1;return!0},parent:function(e){return!b.pseudos.empty(e)},header:function(e){return J.test(e.nodeName)},input:function(e){return Q.test(e.nodeName)},button:function(e){var t=e.nodeName.toLowerCase();return"input"===t&&"button"===e.type||"button"===t},text:function(e){var t;return"input"===e.nodeName.toLowerCase()&&"text"===e.type&&(null==(t=e.getAttribute("type"))||"text"===t.toLowerCase())},first:ye(function(){return[0]}),last:ye(function(e,t){return[t-1]}),eq:ye(function(e,t,n){return[n<0?n+t:n]}),even:ye(function(e,t){for(var n=0;n<t;n+=2)e.push(n);return e}),odd:ye(function(e,t){for(var n=1;n<t;n+=2)e.push(n);return e}),lt:ye(function(e,t,n){for(var r=n<0?n+t:t<n?t:n;0<=--r;)e.push(r);return e}),gt:ye(function(e,t,n){for(var r=n<0?n+t:n;++r<t;)e.push(r);return e})}}).pseudos.nth=b.pseudos.eq,{radio:!0,checkbox:!0,file:!0,password:!0,image:!0})b.pseudos[e]=de(e);for(e in{submit:!0,reset:!0})b.pseudos[e]=he(e);function me(){}function xe(e){for(var t=0,n=e.length,r="";t<n;t++)r+=e[t].value;return r}function be(s,e,t){var u=e.dir,l=e.next,c=l||u,f=t&&"parentNode"===c,p=r++;return e.first?function(e,t,n){while(e=e[u])if(1===e.nodeType||f)return s(e,t,n);return!1}:function(e,t,n){var r,i,o,a=[k,p];if(n){while(e=e[u])if((1===e.nodeType||f)&&s(e,t,n))return!0}else while(e=e[u])if(1===e.nodeType||f)if(i=(o=e[S]||(e[S]={}))[e.uniqueID]||(o[e.uniqueID]={}),l&&l===e.nodeName.toLowerCase())e=e[u]||e;else{if((r=i[c])&&r[0]===k&&r[1]===p)return a[2]=r[2];if((i[c]=a)[2]=s(e,t,n))return!0}return!1}}function we(i){return 1<i.length?function(e,t,n){var r=i.length;while(r--)if(!i[r](e,t,n))return!1;return!0}:i[0]}function Te(e,t,n,r,i){for(var o,a=[],s=0,u=e.length,l=null!=t;s<u;s++)(o=e[s])&&(n&&!n(o,r,i)||(a.push(o),l&&t.push(s)));return a}function Ce(d,h,g,y,v,e){return y&&!y[S]&&(y=Ce(y)),v&&!v[S]&&(v=Ce(v,e)),le(function(e,t,n,r){var i,o,a,s=[],u=[],l=t.length,c=e||function(e,t,n){for(var r=0,i=t.length;r<i;r++)se(e,t[r],n);return n}(h||"*",n.nodeType?[n]:n,[]),f=!d||!e&&h?c:Te(c,s,d,n,r),p=g?v||(e?d:l||y)?[]:t:f;if(g&&g(f,p,n,r),y){i=Te(p,u),y(i,[],n,r),o=i.length;while(o--)(a=i[o])&&(p[u[o]]=!(f[u[o]]=a))}if(e){if(v||d){if(v){i=[],o=p.length;while(o--)(a=p[o])&&i.push(f[o]=a);v(null,p=[],i,r)}o=p.length;while(o--)(a=p[o])&&-1<(i=v?P(e,a):s[o])&&(e[i]=!(t[i]=a))}}else p=Te(p===t?p.splice(l,p.length):p),v?v(null,t,p,r):H.apply(t,p)})}function Ee(e){for(var i,t,n,r=e.length,o=b.relative[e[0].type],a=o||b.relative[" "],s=o?1:0,u=be(function(e){return e===i},a,!0),l=be(function(e){return-1<P(i,e)},a,!0),c=[function(e,t,n){var r=!o&&(n||t!==w)||((i=t).nodeType?u(e,t,n):l(e,t,n));return i=null,r}];s<r;s++)if(t=b.relative[e[s].type])c=[be(we(c),t)];else{if((t=b.filter[e[s].type].apply(null,e[s].matches))[S]){for(n=++s;n<r;n++)if(b.relative[e[n].type])break;return Ce(1<s&&we(c),1<s&&xe(e.slice(0,s-1).concat({value:" "===e[s-2].type?"*":""})).replace(B,"$1"),t,s<n&&Ee(e.slice(s,n)),n<r&&Ee(e=e.slice(n)),n<r&&xe(e))}c.push(t)}return we(c)}return me.prototype=b.filters=b.pseudos,b.setFilters=new me,h=se.tokenize=function(e,t){var n,r,i,o,a,s,u,l=x[e+" "];if(l)return t?0:l.slice(0);a=e,s=[],u=b.preFilter;while(a){for(o in n&&!(r=_.exec(a))||(r&&(a=a.slice(r[0].length)||a),s.push(i=[])),n=!1,(r=z.exec(a))&&(n=r.shift(),i.push({value:n,type:r[0].replace(B," ")}),a=a.slice(n.length)),b.filter)!(r=G[o].exec(a))||u[o]&&!(r=u[o](r))||(n=r.shift(),i.push({value:n,type:o,matches:r}),a=a.slice(n.length));if(!n)break}return t?a.length:a?se.error(e):x(e,s).slice(0)},f=se.compile=function(e,t){var n,y,v,m,x,r,i=[],o=[],a=A[e+" "];if(!a){t||(t=h(e)),n=t.length;while(n--)(a=Ee(t[n]))[S]?i.push(a):o.push(a);(a=A(e,(y=o,m=0<(v=i).length,x=0<y.length,r=function(e,t,n,r,i){var o,a,s,u=0,l="0",c=e&&[],f=[],p=w,d=e||x&&b.find.TAG("*",i),h=k+=null==p?1:Math.random()||.1,g=d.length;for(i&&(w=t==C||t||i);l!==g&&null!=(o=d[l]);l++){if(x&&o){a=0,t||o.ownerDocument==C||(T(o),n=!E);while(s=y[a++])if(s(o,t||C,n)){r.push(o);break}i&&(k=h)}m&&((o=!s&&o)&&u--,e&&c.push(o))}if(u+=l,m&&l!==u){a=0;while(s=v[a++])s(c,f,t,n);if(e){if(0<u)while(l--)c[l]||f[l]||(f[l]=q.call(r));f=Te(f)}H.apply(r,f),i&&!e&&0<f.length&&1<u+v.length&&se.uniqueSort(r)}return i&&(k=h,w=p),c},m?le(r):r))).selector=e}return a},g=se.select=function(e,t,n,r){var i,o,a,s,u,l="function"==typeof e&&e,c=!r&&h(e=l.selector||e);if(n=n||[],1===c.length){if(2<(o=c[0]=c[0].slice(0)).length&&"ID"===(a=o[0]).type&&9===t.nodeType&&E&&b.relative[o[1].type]){if(!(t=(b.find.ID(a.matches[0].replace(te,ne),t)||[])[0]))return n;l&&(t=t.parentNode),e=e.slice(o.shift().value.length)}i=G.needsContext.test(e)?0:o.length;while(i--){if(a=o[i],b.relative[s=a.type])break;if((u=b.find[s])&&(r=u(a.matches[0].replace(te,ne),ee.test(o[0].type)&&ve(t.parentNode)||t))){if(o.splice(i,1),!(e=r.length&&xe(o)))return H.apply(n,r),n;break}}}return(l||f(e,c))(r,t,!E,n,!t||ee.test(e)&&ve(t.parentNode)||t),n},d.sortStable=S.split("").sort(j).join("")===S,d.detectDuplicates=!!l,T(),d.sortDetached=ce(function(e){return 1&e.compareDocumentPosition(C.createElement("fieldset"))}),ce(function(e){return e.innerHTML="<a href='#'></a>","#"===e.firstChild.getAttribute("href")})||fe("type|href|height|width",function(e,t,n){if(!n)return e.getAttribute(t,"type"===t.toLowerCase()?1:2)}),d.attributes&&ce(function(e){return e.innerHTML="<input/>",e.firstChild.setAttribute("value",""),""===e.firstChild.getAttribute("value")})||fe("value",function(e,t,n){if(!n&&"input"===e.nodeName.toLowerCase())return e.defaultValue}),ce(function(e){return null==e.getAttribute("disabled")})||fe(R,function(e,t,n){var r;if(!n)return!0===e[t]?t.toLowerCase():(r=e.getAttributeNode(t))&&r.specified?r.value:null}),se}(C);S.find=d,S.expr=d.selectors,S.expr[":"]=S.expr.pseudos,S.uniqueSort=S.unique=d.uniqueSort,S.text=d.getText,S.isXMLDoc=d.isXML,S.contains=d.contains,S.escapeSelector=d.escape;var h=function(e,t,n){var r=[],i=void 0!==n;while((e=e[t])&&9!==e.nodeType)if(1===e.nodeType){if(i&&S(e).is(n))break;r.push(e)}return r},T=function(e,t){for(var n=[];e;e=e.nextSibling)1===e.nodeType&&e!==t&&n.push(e);return n},k=S.expr.match.needsContext;function A(e,t){return e.nodeName&&e.nodeName.toLowerCase()===t.toLowerCase()}var N=/^<([a-z][^\/\0>:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i;function j(e,n,r){return m(n)?S.grep(e,function(e,t){return!!n.call(e,t,e)!==r}):n.nodeType?S.grep(e,function(e){return e===n!==r}):"string"!=typeof n?S.grep(e,function(e){return-1<i.call(n,e)!==r}):S.filter(n,e,r)}S.filter=function(e,t,n){var r=t[0];return n&&(e=":not("+e+")"),1===t.length&&1===r.nodeType?S.find.matchesSelector(r,e)?[r]:[]:S.find.matches(e,S.grep(t,function(e){return 1===e.nodeType}))},S.fn.extend({find:function(e){var t,n,r=this.length,i=this;if("string"!=typeof e)return this.pushStack(S(e).filter(function(){for(t=0;t<r;t++)if(S.contains(i[t],this))return!0}));for(n=this.pushStack([]),t=0;t<r;t++)S.find(e,i[t],n);return 1<r?S.uniqueSort(n):n},filter:function(e){return this.pushStack(j(this,e||[],!1))},not:function(e){return this.pushStack(j(this,e||[],!0))},is:function(e){return!!j(this,"string"==typeof e&&k.test(e)?S(e):e||[],!1).length}});var D,q=/^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]+))$/;(S.fn.init=function(e,t,n){var r,i;if(!e)return this;if(n=n||D,"string"==typeof e){if(!(r="<"===e[0]&&">"===e[e.length-1]&&3<=e.length?[null,e,null]:q.exec(e))||!r[1]&&t)return!t||t.jquery?(t||n).find(e):this.constructor(t).find(e);if(r[1]){if(t=t instanceof S?t[0]:t,S.merge(this,S.parseHTML(r[1],t&&t.nodeType?t.ownerDocument||t:E,!0)),N.test(r[1])&&S.isPlainObject(t))for(r in t)m(this[r])?this[r](t[r]):this.attr(r,t[r]);return this}return(i=E.getElementById(r[2]))&&(this[0]=i,this.length=1),this}return e.nodeType?(this[0]=e,this.length=1,this):m(e)?void 0!==n.ready?n.ready(e):e(S):S.makeArray(e,this)}).prototype=S.fn,D=S(E);var L=/^(?:parents|prev(?:Until|All))/,H={children:!0,contents:!0,next:!0,prev:!0};function O(e,t){while((e=e[t])&&1!==e.nodeType);return e}S.fn.extend({has:function(e){var t=S(e,this),n=t.length;return this.filter(function(){for(var e=0;e<n;e++)if(S.contains(this,t[e]))return!0})},closest:function(e,t){var n,r=0,i=this.length,o=[],a="string"!=typeof e&&S(e);if(!k.test(e))for(;r<i;r++)for(n=this[r];n&&n!==t;n=n.parentNode)if(n.nodeType<11&&(a?-1<a.index(n):1===n.nodeType&&S.find.matchesSelector(n,e))){o.push(n);break}return this.pushStack(1<o.length?S.uniqueSort(o):o)},index:function(e){return e?"string"==typeof e?i.call(S(e),this[0]):i.call(this,e.jquery?e[0]:e):this[0]&&this[0].parentNode?this.first().prevAll().length:-1},add:function(e,t){return this.pushStack(S.uniqueSort(S.merge(this.get(),S(e,t))))},addBack:function(e){return this.add(null==e?this.prevObject:this.prevObject.filter(e))}}),S.each({parent:function(e){var t=e.parentNode;return t&&11!==t.nodeType?t:null},parents:function(e){return h(e,"parentNode")},parentsUntil:function(e,t,n){return h(e,"parentNode",n)},next:function(e){return O(e,"nextSibling")},prev:function(e){return O(e,"previousSibling")},nextAll:function(e){return h(e,"nextSibling")},prevAll:function(e){return h(e,"previousSibling")},nextUntil:function(e,t,n){return h(e,"nextSibling",n)},prevUntil:function(e,t,n){return h(e,"previousSibling",n)},siblings:function(e){return T((e.parentNode||{}).firstChild,e)},children:function(e){return T(e.firstChild)},contents:function(e){return null!=e.contentDocument&&r(e.contentDocument)?e.contentDocument:(A(e,"template")&&(e=e.content||e),S.merge([],e.childNodes))}},function(r,i){S.fn[r]=function(e,t){var n=S.map(this,i,e);return"Until"!==r.slice(-5)&&(t=e),t&&"string"==typeof t&&(n=S.filter(t,n)),1<this.length&&(H[r]||S.uniqueSort(n),L.test(r)&&n.reverse()),this.pushStack(n)}});var P=/[^\x20\t\r\n\f]+/g;function R(e){return e}function M(e){throw e}function I(e,t,n,r){var i;try{e&&m(i=e.promise)?i.call(e).done(t).fail(n):e&&m(i=e.then)?i.call(e,t,n):t.apply(void 0,[e].slice(r))}catch(e){n.apply(void 0,[e])}}S.Callbacks=function(r){var e,n;r="string"==typeof r?(e=r,n={},S.each(e.match(P)||[],function(e,t){n[t]=!0}),n):S.extend({},r);var i,t,o,a,s=[],u=[],l=-1,c=function(){for(a=a||r.once,o=i=!0;u.length;l=-1){t=u.shift();while(++l<s.length)!1===s[l].apply(t[0],t[1])&&r.stopOnFalse&&(l=s.length,t=!1)}r.memory||(t=!1),i=!1,a&&(s=t?[]:"")},f={add:function(){return s&&(t&&!i&&(l=s.length-1,u.push(t)),function n(e){S.each(e,function(e,t){m(t)?r.unique&&f.has(t)||s.push(t):t&&t.length&&"string"!==w(t)&&n(t)})}(arguments),t&&!i&&c()),this},remove:function(){return S.each(arguments,function(e,t){var n;while(-1<(n=S.inArray(t,s,n)))s.splice(n,1),n<=l&&l--}),this},has:function(e){return e?-1<S.inArray(e,s):0<s.length},empty:function(){return s&&(s=[]),this},disable:function(){return a=u=[],s=t="",this},disabled:function(){return!s},lock:function(){return a=u=[],t||i||(s=t=""),this},locked:function(){return!!a},fireWith:function(e,t){return a||(t=[e,(t=t||[]).slice?t.slice():t],u.push(t),i||c()),this},fire:function(){return f.fireWith(this,arguments),this},fired:function(){return!!o}};return f},S.extend({Deferred:function(e){var o=[["notify","progress",S.Callbacks("memory"),S.Callbacks("memory"),2],["resolve","done",S.Callbacks("once memory"),S.Callbacks("once memory"),0,"resolved"],["reject","fail",S.Callbacks("once memory"),S.Callbacks("once memory"),1,"rejected"]],i="pending",a={state:function(){return i},always:function(){return s.done(arguments).fail(arguments),this},"catch":function(e){return a.then(null,e)},pipe:function(){var i=arguments;return S.Deferred(function(r){S.each(o,function(e,t){var n=m(i[t[4]])&&i[t[4]];s[t[1]](function(){var e=n&&n.apply(this,arguments);e&&m(e.promise)?e.promise().progress(r.notify).done(r.resolve).fail(r.reject):r[t[0]+"With"](this,n?[e]:arguments)})}),i=null}).promise()},then:function(t,n,r){var u=0;function l(i,o,a,s){return function(){var n=this,r=arguments,e=function(){var e,t;if(!(i<u)){if((e=a.apply(n,r))===o.promise())throw new TypeError("Thenable self-resolution");t=e&&("object"==typeof e||"function"==typeof e)&&e.then,m(t)?s?t.call(e,l(u,o,R,s),l(u,o,M,s)):(u++,t.call(e,l(u,o,R,s),l(u,o,M,s),l(u,o,R,o.notifyWith))):(a!==R&&(n=void 0,r=[e]),(s||o.resolveWith)(n,r))}},t=s?e:function(){try{e()}catch(e){S.Deferred.exceptionHook&&S.Deferred.exceptionHook(e,t.stackTrace),u<=i+1&&(a!==M&&(n=void 0,r=[e]),o.rejectWith(n,r))}};i?t():(S.Deferred.getStackHook&&(t.stackTrace=S.Deferred.getStackHook()),C.setTimeout(t))}}return S.Deferred(function(e){o[0][3].add(l(0,e,m(r)?r:R,e.notifyWith)),o[1][3].add(l(0,e,m(t)?t:R)),o[2][3].add(l(0,e,m(n)?n:M))}).promise()},promise:function(e){return null!=e?S.extend(e,a):a}},s={};return S.each(o,function(e,t){var n=t[2],r=t[5];a[t[1]]=n.add,r&&n.add(function(){i=r},o[3-e][2].disable,o[3-e][3].disable,o[0][2].lock,o[0][3].lock),n.add(t[3].fire),s[t[0]]=function(){return s[t[0]+"With"](this===s?void 0:this,arguments),this},s[t[0]+"With"]=n.fireWith}),a.promise(s),e&&e.call(s,s),s},when:function(e){var n=arguments.length,t=n,r=Array(t),i=s.call(arguments),o=S.Deferred(),a=function(t){return function(e){r[t]=this,i[t]=1<arguments.length?s.call(arguments):e,--n||o.resolveWith(r,i)}};if(n<=1&&(I(e,o.done(a(t)).resolve,o.reject,!n),"pending"===o.state()||m(i[t]&&i[t].then)))return o.then();while(t--)I(i[t],a(t),o.reject);return o.promise()}});var W=/^(Eval|Internal|Range|Reference|Syntax|Type|URI)Error$/;S.Deferred.exceptionHook=function(e,t){C.console&&C.console.warn&&e&&W.test(e.name)&&C.console.warn("jQuery.Deferred exception: "+e.message,e.stack,t)},S.readyException=function(e){C.setTimeout(function(){throw e})};var F=S.Deferred();function $(){E.removeEventListener("DOMContentLoaded",$),C.removeEventListener("load",$),S.ready()}S.fn.ready=function(e){return F.then(e)["catch"](function(e){S.readyException(e)}),this},S.extend({isReady:!1,readyWait:1,ready:function(e){(!0===e?--S.readyWait:S.isReady)||(S.isReady=!0)!==e&&0<--S.readyWait||F.resolveWith(E,[S])}}),S.ready.then=F.then,"complete"===E.readyState||"loading"!==E.readyState&&!E.documentElement.doScroll?C.setTimeout(S.ready):(E.addEventListener("DOMContentLoaded",$),C.addEventListener("load",$));var B=function(e,t,n,r,i,o,a){var s=0,u=e.length,l=null==n;if("object"===w(n))for(s in i=!0,n)B(e,t,s,n[s],!0,o,a);else if(void 0!==r&&(i=!0,m(r)||(a=!0),l&&(a?(t.call(e,r),t=null):(l=t,t=function(e,t,n){return l.call(S(e),n)})),t))for(;s<u;s++)t(e[s],n,a?r:r.call(e[s],s,t(e[s],n)));return i?e:l?t.call(e):u?t(e[0],n):o},_=/^-ms-/,z=/-([a-z])/g;function U(e,t){return t.toUpperCase()}function X(e){return e.replace(_,"ms-").replace(z,U)}var V=function(e){return 1===e.nodeType||9===e.nodeType||!+e.nodeType};function G(){this.expando=S.expando+G.uid++}G.uid=1,G.prototype={cache:function(e){var t=e[this.expando];return t||(t={},V(e)&&(e.nodeType?e[this.expando]=t:Object.defineProperty(e,this.expando,{value:t,configurable:!0}))),t},set:function(e,t,n){var r,i=this.cache(e);if("string"==typeof t)i[X(t)]=n;else for(r in t)i[X(r)]=t[r];return i},get:function(e,t){return void 0===t?this.cache(e):e[this.expando]&&e[this.expando][X(t)]},access:function(e,t,n){return void 0===t||t&&"string"==typeof t&&void 0===n?this.get(e,t):(this.set(e,t,n),void 0!==n?n:t)},remove:function(e,t){var n,r=e[this.expando];if(void 0!==r){if(void 0!==t){n=(t=Array.isArray(t)?t.map(X):(t=X(t))in r?[t]:t.match(P)||[]).length;while(n--)delete r[t[n]]}(void 0===t||S.isEmptyObject(r))&&(e.nodeType?e[this.expando]=void 0:delete e[this.expando])}},hasData:function(e){var t=e[this.expando];return void 0!==t&&!S.isEmptyObject(t)}};var Y=new G,Q=new G,J=/^(?:\{[\w\W]*\}|\[[\w\W]*\])$/,K=/[A-Z]/g;function Z(e,t,n){var r,i;if(void 0===n&&1===e.nodeType)if(r="data-"+t.replace(K,"-$&").toLowerCase(),"string"==typeof(n=e.getAttribute(r))){try{n="true"===(i=n)||"false"!==i&&("null"===i?null:i===+i+""?+i:J.test(i)?JSON.parse(i):i)}catch(e){}Q.set(e,t,n)}else n=void 0;return n}S.extend({hasData:function(e){return Q.hasData(e)||Y.hasData(e)},data:function(e,t,n){return Q.access(e,t,n)},removeData:function(e,t){Q.remove(e,t)},_data:function(e,t,n){return Y.access(e,t,n)},_removeData:function(e,t){Y.remove(e,t)}}),S.fn.extend({data:function(n,e){var t,r,i,o=this[0],a=o&&o.attributes;if(void 0===n){if(this.length&&(i=Q.get(o),1===o.nodeType&&!Y.get(o,"hasDataAttrs"))){t=a.length;while(t--)a[t]&&0===(r=a[t].name).indexOf("data-")&&(r=X(r.slice(5)),Z(o,r,i[r]));Y.set(o,"hasDataAttrs",!0)}return i}return"object"==typeof n?this.each(function(){Q.set(this,n)}):B(this,function(e){var t;if(o&&void 0===e)return void 0!==(t=Q.get(o,n))?t:void 0!==(t=Z(o,n))?t:void 0;this.each(function(){Q.set(this,n,e)})},null,e,1<arguments.length,null,!0)},removeData:function(e){return this.each(function(){Q.remove(this,e)})}}),S.extend({queue:function(e,t,n){var r;if(e)return t=(t||"fx")+"queue",r=Y.get(e,t),n&&(!r||Array.isArray(n)?r=Y.access(e,t,S.makeArray(n)):r.push(n)),r||[]},dequeue:function(e,t){t=t||"fx";var n=S.queue(e,t),r=n.length,i=n.shift(),o=S._queueHooks(e,t);"inprogress"===i&&(i=n.shift(),r--),i&&("fx"===t&&n.unshift("inprogress"),delete o.stop,i.call(e,function(){S.dequeue(e,t)},o)),!r&&o&&o.empty.fire()},_queueHooks:function(e,t){var n=t+"queueHooks";return Y.get(e,n)||Y.access(e,n,{empty:S.Callbacks("once memory").add(function(){Y.remove(e,[t+"queue",n])})})}}),S.fn.extend({queue:function(t,n){var e=2;return"string"!=typeof t&&(n=t,t="fx",e--),arguments.length<e?S.queue(this[0],t):void 0===n?this:this.each(function(){var e=S.queue(this,t,n);S._queueHooks(this,t),"fx"===t&&"inprogress"!==e[0]&&S.dequeue(this,t)})},dequeue:function(e){return this.each(function(){S.dequeue(this,e)})},clearQueue:function(e){return this.queue(e||"fx",[])},promise:function(e,t){var n,r=1,i=S.Deferred(),o=this,a=this.length,s=function(){--r||i.resolveWith(o,[o])};"string"!=typeof e&&(t=e,e=void 0),e=e||"fx";while(a--)(n=Y.get(o[a],e+"queueHooks"))&&n.empty&&(r++,n.empty.add(s));return s(),i.promise(t)}});var ee=/[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/.source,te=new RegExp("^(?:([+-])=|)("+ee+")([a-z%]*)$","i"),ne=["Top","Right","Bottom","Left"],re=E.documentElement,ie=function(e){return S.contains(e.ownerDocument,e)},oe={composed:!0};re.getRootNode&&(ie=function(e){return S.contains(e.ownerDocument,e)||e.getRootNode(oe)===e.ownerDocument});var ae=function(e,t){return"none"===(e=t||e).style.display||""===e.style.display&&ie(e)&&"none"===S.css(e,"display")};function se(e,t,n,r){var i,o,a=20,s=r?function(){return r.cur()}:function(){return S.css(e,t,"")},u=s(),l=n&&n[3]||(S.cssNumber[t]?"":"px"),c=e.nodeType&&(S.cssNumber[t]||"px"!==l&&+u)&&te.exec(S.css(e,t));if(c&&c[3]!==l){u/=2,l=l||c[3],c=+u||1;while(a--)S.style(e,t,c+l),(1-o)*(1-(o=s()/u||.5))<=0&&(a=0),c/=o;c*=2,S.style(e,t,c+l),n=n||[]}return n&&(c=+c||+u||0,i=n[1]?c+(n[1]+1)*n[2]:+n[2],r&&(r.unit=l,r.start=c,r.end=i)),i}var ue={};function le(e,t){for(var n,r,i,o,a,s,u,l=[],c=0,f=e.length;c<f;c++)(r=e[c]).style&&(n=r.style.display,t?("none"===n&&(l[c]=Y.get(r,"display")||null,l[c]||(r.style.display="")),""===r.style.display&&ae(r)&&(l[c]=(u=a=o=void 0,a=(i=r).ownerDocument,s=i.nodeName,(u=ue[s])||(o=a.body.appendChild(a.createElement(s)),u=S.css(o,"display"),o.parentNode.removeChild(o),"none"===u&&(u="block"),ue[s]=u)))):"none"!==n&&(l[c]="none",Y.set(r,"display",n)));for(c=0;c<f;c++)null!=l[c]&&(e[c].style.display=l[c]);return e}S.fn.extend({show:function(){return le(this,!0)},hide:function(){return le(this)},toggle:function(e){return"boolean"==typeof e?e?this.show():this.hide():this.each(function(){ae(this)?S(this).show():S(this).hide()})}});var ce,fe,pe=/^(?:checkbox|radio)$/i,de=/<([a-z][^\/\0>\x20\t\r\n\f]*)/i,he=/^$|^module$|\/(?:java|ecma)script/i;ce=E.createDocumentFragment().appendChild(E.createElement("div")),(fe=E.createElement("input")).setAttribute("type","radio"),fe.setAttribute("checked","checked"),fe.setAttribute("name","t"),ce.appendChild(fe),v.checkClone=ce.cloneNode(!0).cloneNode(!0).lastChild.checked,ce.innerHTML="<textarea>x</textarea>",v.noCloneChecked=!!ce.cloneNode(!0).lastChild.defaultValue,ce.innerHTML="<option></option>",v.option=!!ce.lastChild;var ge={thead:[1,"<table>","</table>"],col:[2,"<table><colgroup>","</colgroup></table>"],tr:[2,"<table><tbody>","</tbody></table>"],td:[3,"<table><tbody><tr>","</tr></tbody></table>"],_default:[0,"",""]};function ye(e,t){var n;return n="undefined"!=typeof e.getElementsByTagName?e.getElementsByTagName(t||"*"):"undefined"!=typeof e.querySelectorAll?e.querySelectorAll(t||"*"):[],void 0===t||t&&A(e,t)?S.merge([e],n):n}function ve(e,t){for(var n=0,r=e.length;n<r;n++)Y.set(e[n],"globalEval",!t||Y.get(t[n],"globalEval"))}ge.tbody=ge.tfoot=ge.colgroup=ge.caption=ge.thead,ge.th=ge.td,v.option||(ge.optgroup=ge.option=[1,"<select multiple='multiple'>","</select>"]);var me=/<|&#?\w+;/;function xe(e,t,n,r,i){for(var o,a,s,u,l,c,f=t.createDocumentFragment(),p=[],d=0,h=e.length;d<h;d++)if((o=e[d])||0===o)if("object"===w(o))S.merge(p,o.nodeType?[o]:o);else if(me.test(o)){a=a||f.appendChild(t.createElement("div")),s=(de.exec(o)||["",""])[1].toLowerCase(),u=ge[s]||ge._default,a.innerHTML=u[1]+S.htmlPrefilter(o)+u[2],c=u[0];while(c--)a=a.lastChild;S.merge(p,a.childNodes),(a=f.firstChild).textContent=""}else p.push(t.createTextNode(o));f.textContent="",d=0;while(o=p[d++])if(r&&-1<S.inArray(o,r))i&&i.push(o);else if(l=ie(o),a=ye(f.appendChild(o),"script"),l&&ve(a),n){c=0;while(o=a[c++])he.test(o.type||"")&&n.push(o)}return f}var be=/^([^.]*)(?:\.(.+)|)/;function we(){return!0}function Te(){return!1}function Ce(e,t){return e===function(){try{return E.activeElement}catch(e){}}()==("focus"===t)}function Ee(e,t,n,r,i,o){var a,s;if("object"==typeof t){for(s in"string"!=typeof n&&(r=r||n,n=void 0),t)Ee(e,s,n,r,t[s],o);return e}if(null==r&&null==i?(i=n,r=n=void 0):null==i&&("string"==typeof n?(i=r,r=void 0):(i=r,r=n,n=void 0)),!1===i)i=Te;else if(!i)return e;return 1===o&&(a=i,(i=function(e){return S().off(e),a.apply(this,arguments)}).guid=a.guid||(a.guid=S.guid++)),e.each(function(){S.event.add(this,t,i,r,n)})}function Se(e,i,o){o?(Y.set(e,i,!1),S.event.add(e,i,{namespace:!1,handler:function(e){var t,n,r=Y.get(this,i);if(1&e.isTrigger&&this[i]){if(r.length)(S.event.special[i]||{}).delegateType&&e.stopPropagation();else if(r=s.call(arguments),Y.set(this,i,r),t=o(this,i),this[i](),r!==(n=Y.get(this,i))||t?Y.set(this,i,!1):n={},r!==n)return e.stopImmediatePropagation(),e.preventDefault(),n&&n.value}else r.length&&(Y.set(this,i,{value:S.event.trigger(S.extend(r[0],S.Event.prototype),r.slice(1),this)}),e.stopImmediatePropagation())}})):void 0===Y.get(e,i)&&S.event.add(e,i,we)}S.event={global:{},add:function(t,e,n,r,i){var o,a,s,u,l,c,f,p,d,h,g,y=Y.get(t);if(V(t)){n.handler&&(n=(o=n).handler,i=o.selector),i&&S.find.matchesSelector(re,i),n.guid||(n.guid=S.guid++),(u=y.events)||(u=y.events=Object.create(null)),(a=y.handle)||(a=y.handle=function(e){return"undefined"!=typeof S&&S.event.triggered!==e.type?S.event.dispatch.apply(t,arguments):void 0}),l=(e=(e||"").match(P)||[""]).length;while(l--)d=g=(s=be.exec(e[l])||[])[1],h=(s[2]||"").split(".").sort(),d&&(f=S.event.special[d]||{},d=(i?f.delegateType:f.bindType)||d,f=S.event.special[d]||{},c=S.extend({type:d,origType:g,data:r,handler:n,guid:n.guid,selector:i,needsContext:i&&S.expr.match.needsContext.test(i),namespace:h.join(".")},o),(p=u[d])||((p=u[d]=[]).delegateCount=0,f.setup&&!1!==f.setup.call(t,r,h,a)||t.addEventListener&&t.addEventListener(d,a)),f.add&&(f.add.call(t,c),c.handler.guid||(c.handler.guid=n.guid)),i?p.splice(p.delegateCount++,0,c):p.push(c),S.event.global[d]=!0)}},remove:function(e,t,n,r,i){var o,a,s,u,l,c,f,p,d,h,g,y=Y.hasData(e)&&Y.get(e);if(y&&(u=y.events)){l=(t=(t||"").match(P)||[""]).length;while(l--)if(d=g=(s=be.exec(t[l])||[])[1],h=(s[2]||"").split(".").sort(),d){f=S.event.special[d]||{},p=u[d=(r?f.delegateType:f.bindType)||d]||[],s=s[2]&&new RegExp("(^|\\.)"+h.join("\\.(?:.*\\.|)")+"(\\.|$)"),a=o=p.length;while(o--)c=p[o],!i&&g!==c.origType||n&&n.guid!==c.guid||s&&!s.test(c.namespace)||r&&r!==c.selector&&("**"!==r||!c.selector)||(p.splice(o,1),c.selector&&p.delegateCount--,f.remove&&f.remove.call(e,c));a&&!p.length&&(f.teardown&&!1!==f.teardown.call(e,h,y.handle)||S.removeEvent(e,d,y.handle),delete u[d])}else for(d in u)S.event.remove(e,d+t[l],n,r,!0);S.isEmptyObject(u)&&Y.remove(e,"handle events")}},dispatch:function(e){var t,n,r,i,o,a,s=new Array(arguments.length),u=S.event.fix(e),l=(Y.get(this,"events")||Object.create(null))[u.type]||[],c=S.event.special[u.type]||{};for(s[0]=u,t=1;t<arguments.length;t++)s[t]=arguments[t];if(u.delegateTarget=this,!c.preDispatch||!1!==c.preDispatch.call(this,u)){a=S.event.handlers.call(this,u,l),t=0;while((i=a[t++])&&!u.isPropagationStopped()){u.currentTarget=i.elem,n=0;while((o=i.handlers[n++])&&!u.isImmediatePropagationStopped())u.rnamespace&&!1!==o.namespace&&!u.rnamespace.test(o.namespace)||(u.handleObj=o,u.data=o.data,void 0!==(r=((S.event.special[o.origType]||{}).handle||o.handler).apply(i.elem,s))&&!1===(u.result=r)&&(u.preventDefault(),u.stopPropagation()))}return c.postDispatch&&c.postDispatch.call(this,u),u.result}},handlers:function(e,t){var n,r,i,o,a,s=[],u=t.delegateCount,l=e.target;if(u&&l.nodeType&&!("click"===e.type&&1<=e.button))for(;l!==this;l=l.parentNode||this)if(1===l.nodeType&&("click"!==e.type||!0!==l.disabled)){for(o=[],a={},n=0;n<u;n++)void 0===a[i=(r=t[n]).selector+" "]&&(a[i]=r.needsContext?-1<S(i,this).index(l):S.find(i,this,null,[l]).length),a[i]&&o.push(r);o.length&&s.push({elem:l,handlers:o})}return l=this,u<t.length&&s.push({elem:l,handlers:t.slice(u)}),s},addProp:function(t,e){Object.defineProperty(S.Event.prototype,t,{enumerable:!0,configurable:!0,get:m(e)?function(){if(this.originalEvent)return e(this.originalEvent)}:function(){if(this.originalEvent)return this.originalEvent[t]},set:function(e){Object.defineProperty(this,t,{enumerable:!0,configurable:!0,writable:!0,value:e})}})},fix:function(e){return e[S.expando]?e:new S.Event(e)},special:{load:{noBubble:!0},click:{setup:function(e){var t=this||e;return pe.test(t.type)&&t.click&&A(t,"input")&&Se(t,"click",we),!1},trigger:function(e){var t=this||e;return pe.test(t.type)&&t.click&&A(t,"input")&&Se(t,"click"),!0},_default:function(e){var t=e.target;return pe.test(t.type)&&t.click&&A(t,"input")&&Y.get(t,"click")||A(t,"a")}},beforeunload:{postDispatch:function(e){void 0!==e.result&&e.originalEvent&&(e.originalEvent.returnValue=e.result)}}}},S.removeEvent=function(e,t,n){e.removeEventListener&&e.removeEventListener(t,n)},S.Event=function(e,t){if(!(this instanceof S.Event))return new S.Event(e,t);e&&e.type?(this.originalEvent=e,this.type=e.type,this.isDefaultPrevented=e.defaultPrevented||void 0===e.defaultPrevented&&!1===e.returnValue?we:Te,this.target=e.target&&3===e.target.nodeType?e.target.parentNode:e.target,this.currentTarget=e.currentTarget,this.relatedTarget=e.relatedTarget):this.type=e,t&&S.extend(this,t),this.timeStamp=e&&e.timeStamp||Date.now(),this[S.expando]=!0},S.Event.prototype={constructor:S.Event,isDefaultPrevented:Te,isPropagationStopped:Te,isImmediatePropagationStopped:Te,isSimulated:!1,preventDefault:function(){var e=this.originalEvent;this.isDefaultPrevented=we,e&&!this.isSimulated&&e.preventDefault()},stopPropagation:function(){var e=this.originalEvent;this.isPropagationStopped=we,e&&!this.isSimulated&&e.stopPropagation()},stopImmediatePropagation:function(){var e=this.originalEvent;this.isImmediatePropagationStopped=we,e&&!this.isSimulated&&e.stopImmediatePropagation(),this.stopPropagation()}},S.each({altKey:!0,bubbles:!0,cancelable:!0,changedTouches:!0,ctrlKey:!0,detail:!0,eventPhase:!0,metaKey:!0,pageX:!0,pageY:!0,shiftKey:!0,view:!0,"char":!0,code:!0,charCode:!0,key:!0,keyCode:!0,button:!0,buttons:!0,clientX:!0,clientY:!0,offsetX:!0,offsetY:!0,pointerId:!0,pointerType:!0,screenX:!0,screenY:!0,targetTouches:!0,toElement:!0,touches:!0,which:!0},S.event.addProp),S.each({focus:"focusin",blur:"focusout"},function(t,e){S.event.special[t]={setup:function(){return Se(this,t,Ce),!1},trigger:function(){return Se(this,t),!0},_default:function(e){return Y.get(e.target,t)},delegateType:e}}),S.each({mouseenter:"mouseover",mouseleave:"mouseout",pointerenter:"pointerover",pointerleave:"pointerout"},function(e,i){S.event.special[e]={delegateType:i,bindType:i,handle:function(e){var t,n=e.relatedTarget,r=e.handleObj;return n&&(n===this||S.contains(this,n))||(e.type=r.origType,t=r.handler.apply(this,arguments),e.type=i),t}}}),S.fn.extend({on:function(e,t,n,r){return Ee(this,e,t,n,r)},one:function(e,t,n,r){return Ee(this,e,t,n,r,1)},off:function(e,t,n){var r,i;if(e&&e.preventDefault&&e.handleObj)return r=e.handleObj,S(e.delegateTarget).off(r.namespace?r.origType+"."+r.namespace:r.origType,r.selector,r.handler),this;if("object"==typeof e){for(i in e)this.off(i,t,e[i]);return this}return!1!==t&&"function"!=typeof t||(n=t,t=void 0),!1===n&&(n=Te),this.each(function(){S.event.remove(this,e,n,t)})}});var ke=/<script|<style|<link/i,Ae=/checked\s*(?:[^=]|=\s*.checked.)/i,Ne=/^\s*<!\[CDATA\[|\]\]>\s*$/g;function je(e,t){return A(e,"table")&&A(11!==t.nodeType?t:t.firstChild,"tr")&&S(e).children("tbody")[0]||e}function De(e){return e.type=(null!==e.getAttribute("type"))+"/"+e.type,e}function qe(e){return"true/"===(e.type||"").slice(0,5)?e.type=e.type.slice(5):e.removeAttribute("type"),e}function Le(e,t){var n,r,i,o,a,s;if(1===t.nodeType){if(Y.hasData(e)&&(s=Y.get(e).events))for(i in Y.remove(t,"handle events"),s)for(n=0,r=s[i].length;n<r;n++)S.event.add(t,i,s[i][n]);Q.hasData(e)&&(o=Q.access(e),a=S.extend({},o),Q.set(t,a))}}function He(n,r,i,o){r=g(r);var e,t,a,s,u,l,c=0,f=n.length,p=f-1,d=r[0],h=m(d);if(h||1<f&&"string"==typeof d&&!v.checkClone&&Ae.test(d))return n.each(function(e){var t=n.eq(e);h&&(r[0]=d.call(this,e,t.html())),He(t,r,i,o)});if(f&&(t=(e=xe(r,n[0].ownerDocument,!1,n,o)).firstChild,1===e.childNodes.length&&(e=t),t||o)){for(s=(a=S.map(ye(e,"script"),De)).length;c<f;c++)u=e,c!==p&&(u=S.clone(u,!0,!0),s&&S.merge(a,ye(u,"script"))),i.call(n[c],u,c);if(s)for(l=a[a.length-1].ownerDocument,S.map(a,qe),c=0;c<s;c++)u=a[c],he.test(u.type||"")&&!Y.access(u,"globalEval")&&S.contains(l,u)&&(u.src&&"module"!==(u.type||"").toLowerCase()?S._evalUrl&&!u.noModule&&S._evalUrl(u.src,{nonce:u.nonce||u.getAttribute("nonce")},l):b(u.textContent.replace(Ne,""),u,l))}return n}function Oe(e,t,n){for(var r,i=t?S.filter(t,e):e,o=0;null!=(r=i[o]);o++)n||1!==r.nodeType||S.cleanData(ye(r)),r.parentNode&&(n&&ie(r)&&ve(ye(r,"script")),r.parentNode.removeChild(r));return e}S.extend({htmlPrefilter:function(e){return e},clone:function(e,t,n){var r,i,o,a,s,u,l,c=e.cloneNode(!0),f=ie(e);if(!(v.noCloneChecked||1!==e.nodeType&&11!==e.nodeType||S.isXMLDoc(e)))for(a=ye(c),r=0,i=(o=ye(e)).length;r<i;r++)s=o[r],u=a[r],void 0,"input"===(l=u.nodeName.toLowerCase())&&pe.test(s.type)?u.checked=s.checked:"input"!==l&&"textarea"!==l||(u.defaultValue=s.defaultValue);if(t)if(n)for(o=o||ye(e),a=a||ye(c),r=0,i=o.length;r<i;r++)Le(o[r],a[r]);else Le(e,c);return 0<(a=ye(c,"script")).length&&ve(a,!f&&ye(e,"script")),c},cleanData:function(e){for(var t,n,r,i=S.event.special,o=0;void 0!==(n=e[o]);o++)if(V(n)){if(t=n[Y.expando]){if(t.events)for(r in t.events)i[r]?S.event.remove(n,r):S.removeEvent(n,r,t.handle);n[Y.expando]=void 0}n[Q.expando]&&(n[Q.expando]=void 0)}}}),S.fn.extend({detach:function(e){return Oe(this,e,!0)},remove:function(e){return Oe(this,e)},text:function(e){return B(this,function(e){return void 0===e?S.text(this):this.empty().each(function(){1!==this.nodeType&&11!==this.nodeType&&9!==this.nodeType||(this.textContent=e)})},null,e,arguments.length)},append:function(){return He(this,arguments,function(e){1!==this.nodeType&&11!==this.nodeType&&9!==this.nodeType||je(this,e).appendChild(e)})},prepend:function(){return He(this,arguments,function(e){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var t=je(this,e);t.insertBefore(e,t.firstChild)}})},before:function(){return He(this,arguments,function(e){this.parentNode&&this.parentNode.insertBefore(e,this)})},after:function(){return He(this,arguments,function(e){this.parentNode&&this.parentNode.insertBefore(e,this.nextSibling)})},empty:function(){for(var e,t=0;null!=(e=this[t]);t++)1===e.nodeType&&(S.cleanData(ye(e,!1)),e.textContent="");return this},clone:function(e,t){return e=null!=e&&e,t=null==t?e:t,this.map(function(){return S.clone(this,e,t)})},html:function(e){return B(this,function(e){var t=this[0]||{},n=0,r=this.length;if(void 0===e&&1===t.nodeType)return t.innerHTML;if("string"==typeof e&&!ke.test(e)&&!ge[(de.exec(e)||["",""])[1].toLowerCase()]){e=S.htmlPrefilter(e);try{for(;n<r;n++)1===(t=this[n]||{}).nodeType&&(S.cleanData(ye(t,!1)),t.innerHTML=e);t=0}catch(e){}}t&&this.empty().append(e)},null,e,arguments.length)},replaceWith:function(){var n=[];return He(this,arguments,function(e){var t=this.parentNode;S.inArray(this,n)<0&&(S.cleanData(ye(this)),t&&t.replaceChild(e,this))},n)}}),S.each({appendTo:"append",prependTo:"prepend",insertBefore:"before",insertAfter:"after",replaceAll:"replaceWith"},function(e,a){S.fn[e]=function(e){for(var t,n=[],r=S(e),i=r.length-1,o=0;o<=i;o++)t=o===i?this:this.clone(!0),S(r[o])[a](t),u.apply(n,t.get());return this.pushStack(n)}});var Pe=new RegExp("^("+ee+")(?!px)[a-z%]+$","i"),Re=/^--/,Me=function(e){var t=e.ownerDocument.defaultView;return t&&t.opener||(t=C),t.getComputedStyle(e)},Ie=function(e,t,n){var r,i,o={};for(i in t)o[i]=e.style[i],e.style[i]=t[i];for(i in r=n.call(e),t)e.style[i]=o[i];return r},We=new RegExp(ne.join("|"),"i"),Fe="[\\x20\\t\\r\\n\\f]",$e=new RegExp("^"+Fe+"+|((?:^|[^\\\\])(?:\\\\.)*)"+Fe+"+$","g");function Be(e,t,n){var r,i,o,a,s=Re.test(t),u=e.style;return(n=n||Me(e))&&(a=n.getPropertyValue(t)||n[t],s&&(a=a.replace($e,"$1")),""!==a||ie(e)||(a=S.style(e,t)),!v.pixelBoxStyles()&&Pe.test(a)&&We.test(t)&&(r=u.width,i=u.minWidth,o=u.maxWidth,u.minWidth=u.maxWidth=u.width=a,a=n.width,u.width=r,u.minWidth=i,u.maxWidth=o)),void 0!==a?a+"":a}function _e(e,t){return{get:function(){if(!e())return(this.get=t).apply(this,arguments);delete this.get}}}!function(){function e(){if(l){u.style.cssText="position:absolute;left:-11111px;width:60px;margin-top:1px;padding:0;border:0",l.style.cssText="position:relative;display:block;box-sizing:border-box;overflow:scroll;margin:auto;border:1px;padding:1px;width:60%;top:1%",re.appendChild(u).appendChild(l);var e=C.getComputedStyle(l);n="1%"!==e.top,s=12===t(e.marginLeft),l.style.right="60%",o=36===t(e.right),r=36===t(e.width),l.style.position="absolute",i=12===t(l.offsetWidth/3),re.removeChild(u),l=null}}function t(e){return Math.round(parseFloat(e))}var n,r,i,o,a,s,u=E.createElement("div"),l=E.createElement("div");l.style&&(l.style.backgroundClip="content-box",l.cloneNode(!0).style.backgroundClip="",v.clearCloneStyle="content-box"===l.style.backgroundClip,S.extend(v,{boxSizingReliable:function(){return e(),r},pixelBoxStyles:function(){return e(),o},pixelPosition:function(){return e(),n},reliableMarginLeft:function(){return e(),s},scrollboxSize:function(){return e(),i},reliableTrDimensions:function(){var e,t,n,r;return null==a&&(e=E.createElement("table"),t=E.createElement("tr"),n=E.createElement("div"),e.style.cssText="position:absolute;left:-11111px;border-collapse:separate",t.style.cssText="border:1px solid",t.style.height="1px",n.style.height="9px",n.style.display="block",re.appendChild(e).appendChild(t).appendChild(n),r=C.getComputedStyle(t),a=parseInt(r.height,10)+parseInt(r.borderTopWidth,10)+parseInt(r.borderBottomWidth,10)===t.offsetHeight,re.removeChild(e)),a}}))}();var ze=["Webkit","Moz","ms"],Ue=E.createElement("div").style,Xe={};function Ve(e){var t=S.cssProps[e]||Xe[e];return t||(e in Ue?e:Xe[e]=function(e){var t=e[0].toUpperCase()+e.slice(1),n=ze.length;while(n--)if((e=ze[n]+t)in Ue)return e}(e)||e)}var Ge=/^(none|table(?!-c[ea]).+)/,Ye={position:"absolute",visibility:"hidden",display:"block"},Qe={letterSpacing:"0",fontWeight:"400"};function Je(e,t,n){var r=te.exec(t);return r?Math.max(0,r[2]-(n||0))+(r[3]||"px"):t}function Ke(e,t,n,r,i,o){var a="width"===t?1:0,s=0,u=0;if(n===(r?"border":"content"))return 0;for(;a<4;a+=2)"margin"===n&&(u+=S.css(e,n+ne[a],!0,i)),r?("content"===n&&(u-=S.css(e,"padding"+ne[a],!0,i)),"margin"!==n&&(u-=S.css(e,"border"+ne[a]+"Width",!0,i))):(u+=S.css(e,"padding"+ne[a],!0,i),"padding"!==n?u+=S.css(e,"border"+ne[a]+"Width",!0,i):s+=S.css(e,"border"+ne[a]+"Width",!0,i));return!r&&0<=o&&(u+=Math.max(0,Math.ceil(e["offset"+t[0].toUpperCase()+t.slice(1)]-o-u-s-.5))||0),u}function Ze(e,t,n){var r=Me(e),i=(!v.boxSizingReliable()||n)&&"border-box"===S.css(e,"boxSizing",!1,r),o=i,a=Be(e,t,r),s="offset"+t[0].toUpperCase()+t.slice(1);if(Pe.test(a)){if(!n)return a;a="auto"}return(!v.boxSizingReliable()&&i||!v.reliableTrDimensions()&&A(e,"tr")||"auto"===a||!parseFloat(a)&&"inline"===S.css(e,"display",!1,r))&&e.getClientRects().length&&(i="border-box"===S.css(e,"boxSizing",!1,r),(o=s in e)&&(a=e[s])),(a=parseFloat(a)||0)+Ke(e,t,n||(i?"border":"content"),o,r,a)+"px"}function et(e,t,n,r,i){return new et.prototype.init(e,t,n,r,i)}S.extend({cssHooks:{opacity:{get:function(e,t){if(t){var n=Be(e,"opacity");return""===n?"1":n}}}},cssNumber:{animationIterationCount:!0,columnCount:!0,fillOpacity:!0,flexGrow:!0,flexShrink:!0,fontWeight:!0,gridArea:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnStart:!0,gridRow:!0,gridRowEnd:!0,gridRowStart:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,widows:!0,zIndex:!0,zoom:!0},cssProps:{},style:function(e,t,n,r){if(e&&3!==e.nodeType&&8!==e.nodeType&&e.style){var i,o,a,s=X(t),u=Re.test(t),l=e.style;if(u||(t=Ve(s)),a=S.cssHooks[t]||S.cssHooks[s],void 0===n)return a&&"get"in a&&void 0!==(i=a.get(e,!1,r))?i:l[t];"string"===(o=typeof n)&&(i=te.exec(n))&&i[1]&&(n=se(e,t,i),o="number"),null!=n&&n==n&&("number"!==o||u||(n+=i&&i[3]||(S.cssNumber[s]?"":"px")),v.clearCloneStyle||""!==n||0!==t.indexOf("background")||(l[t]="inherit"),a&&"set"in a&&void 0===(n=a.set(e,n,r))||(u?l.setProperty(t,n):l[t]=n))}},css:function(e,t,n,r){var i,o,a,s=X(t);return Re.test(t)||(t=Ve(s)),(a=S.cssHooks[t]||S.cssHooks[s])&&"get"in a&&(i=a.get(e,!0,n)),void 0===i&&(i=Be(e,t,r)),"normal"===i&&t in Qe&&(i=Qe[t]),""===n||n?(o=parseFloat(i),!0===n||isFinite(o)?o||0:i):i}}),S.each(["height","width"],function(e,u){S.cssHooks[u]={get:function(e,t,n){if(t)return!Ge.test(S.css(e,"display"))||e.getClientRects().length&&e.getBoundingClientRect().width?Ze(e,u,n):Ie(e,Ye,function(){return Ze(e,u,n)})},set:function(e,t,n){var r,i=Me(e),o=!v.scrollboxSize()&&"absolute"===i.position,a=(o||n)&&"border-box"===S.css(e,"boxSizing",!1,i),s=n?Ke(e,u,n,a,i):0;return a&&o&&(s-=Math.ceil(e["offset"+u[0].toUpperCase()+u.slice(1)]-parseFloat(i[u])-Ke(e,u,"border",!1,i)-.5)),s&&(r=te.exec(t))&&"px"!==(r[3]||"px")&&(e.style[u]=t,t=S.css(e,u)),Je(0,t,s)}}}),S.cssHooks.marginLeft=_e(v.reliableMarginLeft,function(e,t){if(t)return(parseFloat(Be(e,"marginLeft"))||e.getBoundingClientRect().left-Ie(e,{marginLeft:0},function(){return e.getBoundingClientRect().left}))+"px"}),S.each({margin:"",padding:"",border:"Width"},function(i,o){S.cssHooks[i+o]={expand:function(e){for(var t=0,n={},r="string"==typeof e?e.split(" "):[e];t<4;t++)n[i+ne[t]+o]=r[t]||r[t-2]||r[0];return n}},"margin"!==i&&(S.cssHooks[i+o].set=Je)}),S.fn.extend({css:function(e,t){return B(this,function(e,t,n){var r,i,o={},a=0;if(Array.isArray(t)){for(r=Me(e),i=t.length;a<i;a++)o[t[a]]=S.css(e,t[a],!1,r);return o}return void 0!==n?S.style(e,t,n):S.css(e,t)},e,t,1<arguments.length)}}),((S.Tween=et).prototype={constructor:et,init:function(e,t,n,r,i,o){this.elem=e,this.prop=n,this.easing=i||S.easing._default,this.options=t,this.start=this.now=this.cur(),this.end=r,this.unit=o||(S.cssNumber[n]?"":"px")},cur:function(){var e=et.propHooks[this.prop];return e&&e.get?e.get(this):et.propHooks._default.get(this)},run:function(e){var t,n=et.propHooks[this.prop];return this.options.duration?this.pos=t=S.easing[this.easing](e,this.options.duration*e,0,1,this.options.duration):this.pos=t=e,this.now=(this.end-this.start)*t+this.start,this.options.step&&this.options.step.call(this.elem,this.now,this),n&&n.set?n.set(this):et.propHooks._default.set(this),this}}).init.prototype=et.prototype,(et.propHooks={_default:{get:function(e){var t;return 1!==e.elem.nodeType||null!=e.elem[e.prop]&&null==e.elem.style[e.prop]?e.elem[e.prop]:(t=S.css(e.elem,e.prop,""))&&"auto"!==t?t:0},set:function(e){S.fx.step[e.prop]?S.fx.step[e.prop](e):1!==e.elem.nodeType||!S.cssHooks[e.prop]&&null==e.elem.style[Ve(e.prop)]?e.elem[e.prop]=e.now:S.style(e.elem,e.prop,e.now+e.unit)}}}).scrollTop=et.propHooks.scrollLeft={set:function(e){e.elem.nodeType&&e.elem.parentNode&&(e.elem[e.prop]=e.now)}},S.easing={linear:function(e){return e},swing:function(e){return.5-Math.cos(e*Math.PI)/2},_default:"swing"},S.fx=et.prototype.init,S.fx.step={};var tt,nt,rt,it,ot=/^(?:toggle|show|hide)$/,at=/queueHooks$/;function st(){nt&&(!1===E.hidden&&C.requestAnimationFrame?C.requestAnimationFrame(st):C.setTimeout(st,S.fx.interval),S.fx.tick())}function ut(){return C.setTimeout(function(){tt=void 0}),tt=Date.now()}function lt(e,t){var n,r=0,i={height:e};for(t=t?1:0;r<4;r+=2-t)i["margin"+(n=ne[r])]=i["padding"+n]=e;return t&&(i.opacity=i.width=e),i}function ct(e,t,n){for(var r,i=(ft.tweeners[t]||[]).concat(ft.tweeners["*"]),o=0,a=i.length;o<a;o++)if(r=i[o].call(n,t,e))return r}function ft(o,e,t){var n,a,r=0,i=ft.prefilters.length,s=S.Deferred().always(function(){delete u.elem}),u=function(){if(a)return!1;for(var e=tt||ut(),t=Math.max(0,l.startTime+l.duration-e),n=1-(t/l.duration||0),r=0,i=l.tweens.length;r<i;r++)l.tweens[r].run(n);return s.notifyWith(o,[l,n,t]),n<1&&i?t:(i||s.notifyWith(o,[l,1,0]),s.resolveWith(o,[l]),!1)},l=s.promise({elem:o,props:S.extend({},e),opts:S.extend(!0,{specialEasing:{},easing:S.easing._default},t),originalProperties:e,originalOptions:t,startTime:tt||ut(),duration:t.duration,tweens:[],createTween:function(e,t){var n=S.Tween(o,l.opts,e,t,l.opts.specialEasing[e]||l.opts.easing);return l.tweens.push(n),n},stop:function(e){var t=0,n=e?l.tweens.length:0;if(a)return this;for(a=!0;t<n;t++)l.tweens[t].run(1);return e?(s.notifyWith(o,[l,1,0]),s.resolveWith(o,[l,e])):s.rejectWith(o,[l,e]),this}}),c=l.props;for(!function(e,t){var n,r,i,o,a;for(n in e)if(i=t[r=X(n)],o=e[n],Array.isArray(o)&&(i=o[1],o=e[n]=o[0]),n!==r&&(e[r]=o,delete e[n]),(a=S.cssHooks[r])&&"expand"in a)for(n in o=a.expand(o),delete e[r],o)n in e||(e[n]=o[n],t[n]=i);else t[r]=i}(c,l.opts.specialEasing);r<i;r++)if(n=ft.prefilters[r].call(l,o,c,l.opts))return m(n.stop)&&(S._queueHooks(l.elem,l.opts.queue).stop=n.stop.bind(n)),n;return S.map(c,ct,l),m(l.opts.start)&&l.opts.start.call(o,l),l.progress(l.opts.progress).done(l.opts.done,l.opts.complete).fail(l.opts.fail).always(l.opts.always),S.fx.timer(S.extend(u,{elem:o,anim:l,queue:l.opts.queue})),l}S.Animation=S.extend(ft,{tweeners:{"*":[function(e,t){var n=this.createTween(e,t);return se(n.elem,e,te.exec(t),n),n}]},tweener:function(e,t){m(e)?(t=e,e=["*"]):e=e.match(P);for(var n,r=0,i=e.length;r<i;r++)n=e[r],ft.tweeners[n]=ft.tweeners[n]||[],ft.tweeners[n].unshift(t)},prefilters:[function(e,t,n){var r,i,o,a,s,u,l,c,f="width"in t||"height"in t,p=this,d={},h=e.style,g=e.nodeType&&ae(e),y=Y.get(e,"fxshow");for(r in n.queue||(null==(a=S._queueHooks(e,"fx")).unqueued&&(a.unqueued=0,s=a.empty.fire,a.empty.fire=function(){a.unqueued||s()}),a.unqueued++,p.always(function(){p.always(function(){a.unqueued--,S.queue(e,"fx").length||a.empty.fire()})})),t)if(i=t[r],ot.test(i)){if(delete t[r],o=o||"toggle"===i,i===(g?"hide":"show")){if("show"!==i||!y||void 0===y[r])continue;g=!0}d[r]=y&&y[r]||S.style(e,r)}if((u=!S.isEmptyObject(t))||!S.isEmptyObject(d))for(r in f&&1===e.nodeType&&(n.overflow=[h.overflow,h.overflowX,h.overflowY],null==(l=y&&y.display)&&(l=Y.get(e,"display")),"none"===(c=S.css(e,"display"))&&(l?c=l:(le([e],!0),l=e.style.display||l,c=S.css(e,"display"),le([e]))),("inline"===c||"inline-block"===c&&null!=l)&&"none"===S.css(e,"float")&&(u||(p.done(function(){h.display=l}),null==l&&(c=h.display,l="none"===c?"":c)),h.display="inline-block")),n.overflow&&(h.overflow="hidden",p.always(function(){h.overflow=n.overflow[0],h.overflowX=n.overflow[1],h.overflowY=n.overflow[2]})),u=!1,d)u||(y?"hidden"in y&&(g=y.hidden):y=Y.access(e,"fxshow",{display:l}),o&&(y.hidden=!g),g&&le([e],!0),p.done(function(){for(r in g||le([e]),Y.remove(e,"fxshow"),d)S.style(e,r,d[r])})),u=ct(g?y[r]:0,r,p),r in y||(y[r]=u.start,g&&(u.end=u.start,u.start=0))}],prefilter:function(e,t){t?ft.prefilters.unshift(e):ft.prefilters.push(e)}}),S.speed=function(e,t,n){var r=e&&"object"==typeof e?S.extend({},e):{complete:n||!n&&t||m(e)&&e,duration:e,easing:n&&t||t&&!m(t)&&t};return S.fx.off?r.duration=0:"number"!=typeof r.duration&&(r.duration in S.fx.speeds?r.duration=S.fx.speeds[r.duration]:r.duration=S.fx.speeds._default),null!=r.queue&&!0!==r.queue||(r.queue="fx"),r.old=r.complete,r.complete=function(){m(r.old)&&r.old.call(this),r.queue&&S.dequeue(this,r.queue)},r},S.fn.extend({fadeTo:function(e,t,n,r){return this.filter(ae).css("opacity",0).show().end().animate({opacity:t},e,n,r)},animate:function(t,e,n,r){var i=S.isEmptyObject(t),o=S.speed(e,n,r),a=function(){var e=ft(this,S.extend({},t),o);(i||Y.get(this,"finish"))&&e.stop(!0)};return a.finish=a,i||!1===o.queue?this.each(a):this.queue(o.queue,a)},stop:function(i,e,o){var a=function(e){var t=e.stop;delete e.stop,t(o)};return"string"!=typeof i&&(o=e,e=i,i=void 0),e&&this.queue(i||"fx",[]),this.each(function(){var e=!0,t=null!=i&&i+"queueHooks",n=S.timers,r=Y.get(this);if(t)r[t]&&r[t].stop&&a(r[t]);else for(t in r)r[t]&&r[t].stop&&at.test(t)&&a(r[t]);for(t=n.length;t--;)n[t].elem!==this||null!=i&&n[t].queue!==i||(n[t].anim.stop(o),e=!1,n.splice(t,1));!e&&o||S.dequeue(this,i)})},finish:function(a){return!1!==a&&(a=a||"fx"),this.each(function(){var e,t=Y.get(this),n=t[a+"queue"],r=t[a+"queueHooks"],i=S.timers,o=n?n.length:0;for(t.finish=!0,S.queue(this,a,[]),r&&r.stop&&r.stop.call(this,!0),e=i.length;e--;)i[e].elem===this&&i[e].queue===a&&(i[e].anim.stop(!0),i.splice(e,1));for(e=0;e<o;e++)n[e]&&n[e].finish&&n[e].finish.call(this);delete t.finish})}}),S.each(["toggle","show","hide"],function(e,r){var i=S.fn[r];S.fn[r]=function(e,t,n){return null==e||"boolean"==typeof e?i.apply(this,arguments):this.animate(lt(r,!0),e,t,n)}}),S.each({slideDown:lt("show"),slideUp:lt("hide"),slideToggle:lt("toggle"),fadeIn:{opacity:"show"},fadeOut:{opacity:"hide"},fadeToggle:{opacity:"toggle"}},function(e,r){S.fn[e]=function(e,t,n){return this.animate(r,e,t,n)}}),S.timers=[],S.fx.tick=function(){var e,t=0,n=S.timers;for(tt=Date.now();t<n.length;t++)(e=n[t])()||n[t]!==e||n.splice(t--,1);n.length||S.fx.stop(),tt=void 0},S.fx.timer=function(e){S.timers.push(e),S.fx.start()},S.fx.interval=13,S.fx.start=function(){nt||(nt=!0,st())},S.fx.stop=function(){nt=null},S.fx.speeds={slow:600,fast:200,_default:400},S.fn.delay=function(r,e){return r=S.fx&&S.fx.speeds[r]||r,e=e||"fx",this.queue(e,function(e,t){var n=C.setTimeout(e,r);t.stop=function(){C.clearTimeout(n)}})},rt=E.createElement("input"),it=E.createElement("select").appendChild(E.createElement("option")),rt.type="checkbox",v.checkOn=""!==rt.value,v.optSelected=it.selected,(rt=E.createElement("input")).value="t",rt.type="radio",v.radioValue="t"===rt.value;var pt,dt=S.expr.attrHandle;S.fn.extend({attr:function(e,t){return B(this,S.attr,e,t,1<arguments.length)},removeAttr:function(e){return this.each(function(){S.removeAttr(this,e)})}}),S.extend({attr:function(e,t,n){var r,i,o=e.nodeType;if(3!==o&&8!==o&&2!==o)return"undefined"==typeof e.getAttribute?S.prop(e,t,n):(1===o&&S.isXMLDoc(e)||(i=S.attrHooks[t.toLowerCase()]||(S.expr.match.bool.test(t)?pt:void 0)),void 0!==n?null===n?void S.removeAttr(e,t):i&&"set"in i&&void 0!==(r=i.set(e,n,t))?r:(e.setAttribute(t,n+""),n):i&&"get"in i&&null!==(r=i.get(e,t))?r:null==(r=S.find.attr(e,t))?void 0:r)},attrHooks:{type:{set:function(e,t){if(!v.radioValue&&"radio"===t&&A(e,"input")){var n=e.value;return e.setAttribute("type",t),n&&(e.value=n),t}}}},removeAttr:function(e,t){var n,r=0,i=t&&t.match(P);if(i&&1===e.nodeType)while(n=i[r++])e.removeAttribute(n)}}),pt={set:function(e,t,n){return!1===t?S.removeAttr(e,n):e.setAttribute(n,n),n}},S.each(S.expr.match.bool.source.match(/\w+/g),function(e,t){var a=dt[t]||S.find.attr;dt[t]=function(e,t,n){var r,i,o=t.toLowerCase();return n||(i=dt[o],dt[o]=r,r=null!=a(e,t,n)?o:null,dt[o]=i),r}});var ht=/^(?:input|select|textarea|button)$/i,gt=/^(?:a|area)$/i;function yt(e){return(e.match(P)||[]).join(" ")}function vt(e){return e.getAttribute&&e.getAttribute("class")||""}function mt(e){return Array.isArray(e)?e:"string"==typeof e&&e.match(P)||[]}S.fn.extend({prop:function(e,t){return B(this,S.prop,e,t,1<arguments.length)},removeProp:function(e){return this.each(function(){delete this[S.propFix[e]||e]})}}),S.extend({prop:function(e,t,n){var r,i,o=e.nodeType;if(3!==o&&8!==o&&2!==o)return 1===o&&S.isXMLDoc(e)||(t=S.propFix[t]||t,i=S.propHooks[t]),void 0!==n?i&&"set"in i&&void 0!==(r=i.set(e,n,t))?r:e[t]=n:i&&"get"in i&&null!==(r=i.get(e,t))?r:e[t]},propHooks:{tabIndex:{get:function(e){var t=S.find.attr(e,"tabindex");return t?parseInt(t,10):ht.test(e.nodeName)||gt.test(e.nodeName)&&e.href?0:-1}}},propFix:{"for":"htmlFor","class":"className"}}),v.optSelected||(S.propHooks.selected={get:function(e){var t=e.parentNode;return t&&t.parentNode&&t.parentNode.selectedIndex,null},set:function(e){var t=e.parentNode;t&&(t.selectedIndex,t.parentNode&&t.parentNode.selectedIndex)}}),S.each(["tabIndex","readOnly","maxLength","cellSpacing","cellPadding","rowSpan","colSpan","useMap","frameBorder","contentEditable"],function(){S.propFix[this.toLowerCase()]=this}),S.fn.extend({addClass:function(t){var e,n,r,i,o,a;return m(t)?this.each(function(e){S(this).addClass(t.call(this,e,vt(this)))}):(e=mt(t)).length?this.each(function(){if(r=vt(this),n=1===this.nodeType&&" "+yt(r)+" "){for(o=0;o<e.length;o++)i=e[o],n.indexOf(" "+i+" ")<0&&(n+=i+" ");a=yt(n),r!==a&&this.setAttribute("class",a)}}):this},removeClass:function(t){var e,n,r,i,o,a;return m(t)?this.each(function(e){S(this).removeClass(t.call(this,e,vt(this)))}):arguments.length?(e=mt(t)).length?this.each(function(){if(r=vt(this),n=1===this.nodeType&&" "+yt(r)+" "){for(o=0;o<e.length;o++){i=e[o];while(-1<n.indexOf(" "+i+" "))n=n.replace(" "+i+" "," ")}a=yt(n),r!==a&&this.setAttribute("class",a)}}):this:this.attr("class","")},toggleClass:function(t,n){var e,r,i,o,a=typeof t,s="string"===a||Array.isArray(t);return m(t)?this.each(function(e){S(this).toggleClass(t.call(this,e,vt(this),n),n)}):"boolean"==typeof n&&s?n?this.addClass(t):this.removeClass(t):(e=mt(t),this.each(function(){if(s)for(o=S(this),i=0;i<e.length;i++)r=e[i],o.hasClass(r)?o.removeClass(r):o.addClass(r);else void 0!==t&&"boolean"!==a||((r=vt(this))&&Y.set(this,"__className__",r),this.setAttribute&&this.setAttribute("class",r||!1===t?"":Y.get(this,"__className__")||""))}))},hasClass:function(e){var t,n,r=0;t=" "+e+" ";while(n=this[r++])if(1===n.nodeType&&-1<(" "+yt(vt(n))+" ").indexOf(t))return!0;return!1}});var xt=/\r/g;S.fn.extend({val:function(n){var r,e,i,t=this[0];return arguments.length?(i=m(n),this.each(function(e){var t;1===this.nodeType&&(null==(t=i?n.call(this,e,S(this).val()):n)?t="":"number"==typeof t?t+="":Array.isArray(t)&&(t=S.map(t,function(e){return null==e?"":e+""})),(r=S.valHooks[this.type]||S.valHooks[this.nodeName.toLowerCase()])&&"set"in r&&void 0!==r.set(this,t,"value")||(this.value=t))})):t?(r=S.valHooks[t.type]||S.valHooks[t.nodeName.toLowerCase()])&&"get"in r&&void 0!==(e=r.get(t,"value"))?e:"string"==typeof(e=t.value)?e.replace(xt,""):null==e?"":e:void 0}}),S.extend({valHooks:{option:{get:function(e){var t=S.find.attr(e,"value");return null!=t?t:yt(S.text(e))}},select:{get:function(e){var t,n,r,i=e.options,o=e.selectedIndex,a="select-one"===e.type,s=a?null:[],u=a?o+1:i.length;for(r=o<0?u:a?o:0;r<u;r++)if(((n=i[r]).selected||r===o)&&!n.disabled&&(!n.parentNode.disabled||!A(n.parentNode,"optgroup"))){if(t=S(n).val(),a)return t;s.push(t)}return s},set:function(e,t){var n,r,i=e.options,o=S.makeArray(t),a=i.length;while(a--)((r=i[a]).selected=-1<S.inArray(S.valHooks.option.get(r),o))&&(n=!0);return n||(e.selectedIndex=-1),o}}}}),S.each(["radio","checkbox"],function(){S.valHooks[this]={set:function(e,t){if(Array.isArray(t))return e.checked=-1<S.inArray(S(e).val(),t)}},v.checkOn||(S.valHooks[this].get=function(e){return null===e.getAttribute("value")?"on":e.value})}),v.focusin="onfocusin"in C;var bt=/^(?:focusinfocus|focusoutblur)$/,wt=function(e){e.stopPropagation()};S.extend(S.event,{trigger:function(e,t,n,r){var i,o,a,s,u,l,c,f,p=[n||E],d=y.call(e,"type")?e.type:e,h=y.call(e,"namespace")?e.namespace.split("."):[];if(o=f=a=n=n||E,3!==n.nodeType&&8!==n.nodeType&&!bt.test(d+S.event.triggered)&&(-1<d.indexOf(".")&&(d=(h=d.split(".")).shift(),h.sort()),u=d.indexOf(":")<0&&"on"+d,(e=e[S.expando]?e:new S.Event(d,"object"==typeof e&&e)).isTrigger=r?2:3,e.namespace=h.join("."),e.rnamespace=e.namespace?new RegExp("(^|\\.)"+h.join("\\.(?:.*\\.|)")+"(\\.|$)"):null,e.result=void 0,e.target||(e.target=n),t=null==t?[e]:S.makeArray(t,[e]),c=S.event.special[d]||{},r||!c.trigger||!1!==c.trigger.apply(n,t))){if(!r&&!c.noBubble&&!x(n)){for(s=c.delegateType||d,bt.test(s+d)||(o=o.parentNode);o;o=o.parentNode)p.push(o),a=o;a===(n.ownerDocument||E)&&p.push(a.defaultView||a.parentWindow||C)}i=0;while((o=p[i++])&&!e.isPropagationStopped())f=o,e.type=1<i?s:c.bindType||d,(l=(Y.get(o,"events")||Object.create(null))[e.type]&&Y.get(o,"handle"))&&l.apply(o,t),(l=u&&o[u])&&l.apply&&V(o)&&(e.result=l.apply(o,t),!1===e.result&&e.preventDefault());return e.type=d,r||e.isDefaultPrevented()||c._default&&!1!==c._default.apply(p.pop(),t)||!V(n)||u&&m(n[d])&&!x(n)&&((a=n[u])&&(n[u]=null),S.event.triggered=d,e.isPropagationStopped()&&f.addEventListener(d,wt),n[d](),e.isPropagationStopped()&&f.removeEventListener(d,wt),S.event.triggered=void 0,a&&(n[u]=a)),e.result}},simulate:function(e,t,n){var r=S.extend(new S.Event,n,{type:e,isSimulated:!0});S.event.trigger(r,null,t)}}),S.fn.extend({trigger:function(e,t){return this.each(function(){S.event.trigger(e,t,this)})},triggerHandler:function(e,t){var n=this[0];if(n)return S.event.trigger(e,t,n,!0)}}),v.focusin||S.each({focus:"focusin",blur:"focusout"},function(n,r){var i=function(e){S.event.simulate(r,e.target,S.event.fix(e))};S.event.special[r]={setup:function(){var e=this.ownerDocument||this.document||this,t=Y.access(e,r);t||e.addEventListener(n,i,!0),Y.access(e,r,(t||0)+1)},teardown:function(){var e=this.ownerDocument||this.document||this,t=Y.access(e,r)-1;t?Y.access(e,r,t):(e.removeEventListener(n,i,!0),Y.remove(e,r))}}});var Tt=C.location,Ct={guid:Date.now()},Et=/\?/;S.parseXML=function(e){var t,n;if(!e||"string"!=typeof e)return null;try{t=(new C.DOMParser).parseFromString(e,"text/xml")}catch(e){}return n=t&&t.getElementsByTagName("parsererror")[0],t&&!n||S.error("Invalid XML: "+(n?S.map(n.childNodes,function(e){return e.textContent}).join("\n"):e)),t};var St=/\[\]$/,kt=/\r?\n/g,At=/^(?:submit|button|image|reset|file)$/i,Nt=/^(?:input|select|textarea|keygen)/i;function jt(n,e,r,i){var t;if(Array.isArray(e))S.each(e,function(e,t){r||St.test(n)?i(n,t):jt(n+"["+("object"==typeof t&&null!=t?e:"")+"]",t,r,i)});else if(r||"object"!==w(e))i(n,e);else for(t in e)jt(n+"["+t+"]",e[t],r,i)}S.param=function(e,t){var n,r=[],i=function(e,t){var n=m(t)?t():t;r[r.length]=encodeURIComponent(e)+"="+encodeURIComponent(null==n?"":n)};if(null==e)return"";if(Array.isArray(e)||e.jquery&&!S.isPlainObject(e))S.each(e,function(){i(this.name,this.value)});else for(n in e)jt(n,e[n],t,i);return r.join("&")},S.fn.extend({serialize:function(){return S.param(this.serializeArray())},serializeArray:function(){return this.map(function(){var e=S.prop(this,"elements");return e?S.makeArray(e):this}).filter(function(){var e=this.type;return this.name&&!S(this).is(":disabled")&&Nt.test(this.nodeName)&&!At.test(e)&&(this.checked||!pe.test(e))}).map(function(e,t){var n=S(this).val();return null==n?null:Array.isArray(n)?S.map(n,function(e){return{name:t.name,value:e.replace(kt,"\r\n")}}):{name:t.name,value:n.replace(kt,"\r\n")}}).get()}});var Dt=/%20/g,qt=/#.*$/,Lt=/([?&])_=[^&]*/,Ht=/^(.*?):[ \t]*([^\r\n]*)$/gm,Ot=/^(?:GET|HEAD)$/,Pt=/^\/\//,Rt={},Mt={},It="*/".concat("*"),Wt=E.createElement("a");function Ft(o){return function(e,t){"string"!=typeof e&&(t=e,e="*");var n,r=0,i=e.toLowerCase().match(P)||[];if(m(t))while(n=i[r++])"+"===n[0]?(n=n.slice(1)||"*",(o[n]=o[n]||[]).unshift(t)):(o[n]=o[n]||[]).push(t)}}function $t(t,i,o,a){var s={},u=t===Mt;function l(e){var r;return s[e]=!0,S.each(t[e]||[],function(e,t){var n=t(i,o,a);return"string"!=typeof n||u||s[n]?u?!(r=n):void 0:(i.dataTypes.unshift(n),l(n),!1)}),r}return l(i.dataTypes[0])||!s["*"]&&l("*")}function Bt(e,t){var n,r,i=S.ajaxSettings.flatOptions||{};for(n in t)void 0!==t[n]&&((i[n]?e:r||(r={}))[n]=t[n]);return r&&S.extend(!0,e,r),e}Wt.href=Tt.href,S.extend({active:0,lastModified:{},etag:{},ajaxSettings:{url:Tt.href,type:"GET",isLocal:/^(?:about|app|app-storage|.+-extension|file|res|widget):$/.test(Tt.protocol),global:!0,processData:!0,async:!0,contentType:"application/x-www-form-urlencoded; charset=UTF-8",accepts:{"*":It,text:"text/plain",html:"text/html",xml:"application/xml, text/xml",json:"application/json, text/javascript"},contents:{xml:/\bxml\b/,html:/\bhtml/,json:/\bjson\b/},responseFields:{xml:"responseXML",text:"responseText",json:"responseJSON"},converters:{"* text":String,"text html":!0,"text json":JSON.parse,"text xml":S.parseXML},flatOptions:{url:!0,context:!0}},ajaxSetup:function(e,t){return t?Bt(Bt(e,S.ajaxSettings),t):Bt(S.ajaxSettings,e)},ajaxPrefilter:Ft(Rt),ajaxTransport:Ft(Mt),ajax:function(e,t){"object"==typeof e&&(t=e,e=void 0),t=t||{};var c,f,p,n,d,r,h,g,i,o,y=S.ajaxSetup({},t),v=y.context||y,m=y.context&&(v.nodeType||v.jquery)?S(v):S.event,x=S.Deferred(),b=S.Callbacks("once memory"),w=y.statusCode||{},a={},s={},u="canceled",T={readyState:0,getResponseHeader:function(e){var t;if(h){if(!n){n={};while(t=Ht.exec(p))n[t[1].toLowerCase()+" "]=(n[t[1].toLowerCase()+" "]||[]).concat(t[2])}t=n[e.toLowerCase()+" "]}return null==t?null:t.join(", ")},getAllResponseHeaders:function(){return h?p:null},setRequestHeader:function(e,t){return null==h&&(e=s[e.toLowerCase()]=s[e.toLowerCase()]||e,a[e]=t),this},overrideMimeType:function(e){return null==h&&(y.mimeType=e),this},statusCode:function(e){var t;if(e)if(h)T.always(e[T.status]);else for(t in e)w[t]=[w[t],e[t]];return this},abort:function(e){var t=e||u;return c&&c.abort(t),l(0,t),this}};if(x.promise(T),y.url=((e||y.url||Tt.href)+"").replace(Pt,Tt.protocol+"//"),y.type=t.method||t.type||y.method||y.type,y.dataTypes=(y.dataType||"*").toLowerCase().match(P)||[""],null==y.crossDomain){r=E.createElement("a");try{r.href=y.url,r.href=r.href,y.crossDomain=Wt.protocol+"//"+Wt.host!=r.protocol+"//"+r.host}catch(e){y.crossDomain=!0}}if(y.data&&y.processData&&"string"!=typeof y.data&&(y.data=S.param(y.data,y.traditional)),$t(Rt,y,t,T),h)return T;for(i in(g=S.event&&y.global)&&0==S.active++&&S.event.trigger("ajaxStart"),y.type=y.type.toUpperCase(),y.hasContent=!Ot.test(y.type),f=y.url.replace(qt,""),y.hasContent?y.data&&y.processData&&0===(y.contentType||"").indexOf("application/x-www-form-urlencoded")&&(y.data=y.data.replace(Dt,"+")):(o=y.url.slice(f.length),y.data&&(y.processData||"string"==typeof y.data)&&(f+=(Et.test(f)?"&":"?")+y.data,delete y.data),!1===y.cache&&(f=f.replace(Lt,"$1"),o=(Et.test(f)?"&":"?")+"_="+Ct.guid+++o),y.url=f+o),y.ifModified&&(S.lastModified[f]&&T.setRequestHeader("If-Modified-Since",S.lastModified[f]),S.etag[f]&&T.setRequestHeader("If-None-Match",S.etag[f])),(y.data&&y.hasContent&&!1!==y.contentType||t.contentType)&&T.setRequestHeader("Content-Type",y.contentType),T.setRequestHeader("Accept",y.dataTypes[0]&&y.accepts[y.dataTypes[0]]?y.accepts[y.dataTypes[0]]+("*"!==y.dataTypes[0]?", "+It+"; q=0.01":""):y.accepts["*"]),y.headers)T.setRequestHeader(i,y.headers[i]);if(y.beforeSend&&(!1===y.beforeSend.call(v,T,y)||h))return T.abort();if(u="abort",b.add(y.complete),T.done(y.success),T.fail(y.error),c=$t(Mt,y,t,T)){if(T.readyState=1,g&&m.trigger("ajaxSend",[T,y]),h)return T;y.async&&0<y.timeout&&(d=C.setTimeout(function(){T.abort("timeout")},y.timeout));try{h=!1,c.send(a,l)}catch(e){if(h)throw e;l(-1,e)}}else l(-1,"No Transport");function l(e,t,n,r){var i,o,a,s,u,l=t;h||(h=!0,d&&C.clearTimeout(d),c=void 0,p=r||"",T.readyState=0<e?4:0,i=200<=e&&e<300||304===e,n&&(s=function(e,t,n){var r,i,o,a,s=e.contents,u=e.dataTypes;while("*"===u[0])u.shift(),void 0===r&&(r=e.mimeType||t.getResponseHeader("Content-Type"));if(r)for(i in s)if(s[i]&&s[i].test(r)){u.unshift(i);break}if(u[0]in n)o=u[0];else{for(i in n){if(!u[0]||e.converters[i+" "+u[0]]){o=i;break}a||(a=i)}o=o||a}if(o)return o!==u[0]&&u.unshift(o),n[o]}(y,T,n)),!i&&-1<S.inArray("script",y.dataTypes)&&S.inArray("json",y.dataTypes)<0&&(y.converters["text script"]=function(){}),s=function(e,t,n,r){var i,o,a,s,u,l={},c=e.dataTypes.slice();if(c[1])for(a in e.converters)l[a.toLowerCase()]=e.converters[a];o=c.shift();while(o)if(e.responseFields[o]&&(n[e.responseFields[o]]=t),!u&&r&&e.dataFilter&&(t=e.dataFilter(t,e.dataType)),u=o,o=c.shift())if("*"===o)o=u;else if("*"!==u&&u!==o){if(!(a=l[u+" "+o]||l["* "+o]))for(i in l)if((s=i.split(" "))[1]===o&&(a=l[u+" "+s[0]]||l["* "+s[0]])){!0===a?a=l[i]:!0!==l[i]&&(o=s[0],c.unshift(s[1]));break}if(!0!==a)if(a&&e["throws"])t=a(t);else try{t=a(t)}catch(e){return{state:"parsererror",error:a?e:"No conversion from "+u+" to "+o}}}return{state:"success",data:t}}(y,s,T,i),i?(y.ifModified&&((u=T.getResponseHeader("Last-Modified"))&&(S.lastModified[f]=u),(u=T.getResponseHeader("etag"))&&(S.etag[f]=u)),204===e||"HEAD"===y.type?l="nocontent":304===e?l="notmodified":(l=s.state,o=s.data,i=!(a=s.error))):(a=l,!e&&l||(l="error",e<0&&(e=0))),T.status=e,T.statusText=(t||l)+"",i?x.resolveWith(v,[o,l,T]):x.rejectWith(v,[T,l,a]),T.statusCode(w),w=void 0,g&&m.trigger(i?"ajaxSuccess":"ajaxError",[T,y,i?o:a]),b.fireWith(v,[T,l]),g&&(m.trigger("ajaxComplete",[T,y]),--S.active||S.event.trigger("ajaxStop")))}return T},getJSON:function(e,t,n){return S.get(e,t,n,"json")},getScript:function(e,t){return S.get(e,void 0,t,"script")}}),S.each(["get","post"],function(e,i){S[i]=function(e,t,n,r){return m(t)&&(r=r||n,n=t,t=void 0),S.ajax(S.extend({url:e,type:i,dataType:r,data:t,success:n},S.isPlainObject(e)&&e))}}),S.ajaxPrefilter(function(e){var t;for(t in e.headers)"content-type"===t.toLowerCase()&&(e.contentType=e.headers[t]||"")}),S._evalUrl=function(e,t,n){return S.ajax({url:e,type:"GET",dataType:"script",cache:!0,async:!1,global:!1,converters:{"text script":function(){}},dataFilter:function(e){S.globalEval(e,t,n)}})},S.fn.extend({wrapAll:function(e){var t;return this[0]&&(m(e)&&(e=e.call(this[0])),t=S(e,this[0].ownerDocument).eq(0).clone(!0),this[0].parentNode&&t.insertBefore(this[0]),t.map(function(){var e=this;while(e.firstElementChild)e=e.firstElementChild;return e}).append(this)),this},wrapInner:function(n){return m(n)?this.each(function(e){S(this).wrapInner(n.call(this,e))}):this.each(function(){var e=S(this),t=e.contents();t.length?t.wrapAll(n):e.append(n)})},wrap:function(t){var n=m(t);return this.each(function(e){S(this).wrapAll(n?t.call(this,e):t)})},unwrap:function(e){return this.parent(e).not("body").each(function(){S(this).replaceWith(this.childNodes)}),this}}),S.expr.pseudos.hidden=function(e){return!S.expr.pseudos.visible(e)},S.expr.pseudos.visible=function(e){return!!(e.offsetWidth||e.offsetHeight||e.getClientRects().length)},S.ajaxSettings.xhr=function(){try{return new C.XMLHttpRequest}catch(e){}};var _t={0:200,1223:204},zt=S.ajaxSettings.xhr();v.cors=!!zt&&"withCredentials"in zt,v.ajax=zt=!!zt,S.ajaxTransport(function(i){var o,a;if(v.cors||zt&&!i.crossDomain)return{send:function(e,t){var n,r=i.xhr();if(r.open(i.type,i.url,i.async,i.username,i.password),i.xhrFields)for(n in i.xhrFields)r[n]=i.xhrFields[n];for(n in i.mimeType&&r.overrideMimeType&&r.overrideMimeType(i.mimeType),i.crossDomain||e["X-Requested-With"]||(e["X-Requested-With"]="XMLHttpRequest"),e)r.setRequestHeader(n,e[n]);o=function(e){return function(){o&&(o=a=r.onload=r.onerror=r.onabort=r.ontimeout=r.onreadystatechange=null,"abort"===e?r.abort():"error"===e?"number"!=typeof r.status?t(0,"error"):t(r.status,r.statusText):t(_t[r.status]||r.status,r.statusText,"text"!==(r.responseType||"text")||"string"!=typeof r.responseText?{binary:r.response}:{text:r.responseText},r.getAllResponseHeaders()))}},r.onload=o(),a=r.onerror=r.ontimeout=o("error"),void 0!==r.onabort?r.onabort=a:r.onreadystatechange=function(){4===r.readyState&&C.setTimeout(function(){o&&a()})},o=o("abort");try{r.send(i.hasContent&&i.data||null)}catch(e){if(o)throw e}},abort:function(){o&&o()}}}),S.ajaxPrefilter(function(e){e.crossDomain&&(e.contents.script=!1)}),S.ajaxSetup({accepts:{script:"text/javascript, application/javascript, application/ecmascript, application/x-ecmascript"},contents:{script:/\b(?:java|ecma)script\b/},converters:{"text script":function(e){return S.globalEval(e),e}}}),S.ajaxPrefilter("script",function(e){void 0===e.cache&&(e.cache=!1),e.crossDomain&&(e.type="GET")}),S.ajaxTransport("script",function(n){var r,i;if(n.crossDomain||n.scriptAttrs)return{send:function(e,t){r=S("<script>").attr(n.scriptAttrs||{}).prop({charset:n.scriptCharset,src:n.url}).on("load error",i=function(e){r.remove(),i=null,e&&t("error"===e.type?404:200,e.type)}),E.head.appendChild(r[0])},abort:function(){i&&i()}}});var Ut,Xt=[],Vt=/(=)\?(?=&|$)|\?\?/;S.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=Xt.pop()||S.expando+"_"+Ct.guid++;return this[e]=!0,e}}),S.ajaxPrefilter("json jsonp",function(e,t,n){var r,i,o,a=!1!==e.jsonp&&(Vt.test(e.url)?"url":"string"==typeof e.data&&0===(e.contentType||"").indexOf("application/x-www-form-urlencoded")&&Vt.test(e.data)&&"data");if(a||"jsonp"===e.dataTypes[0])return r=e.jsonpCallback=m(e.jsonpCallback)?e.jsonpCallback():e.jsonpCallback,a?e[a]=e[a].replace(Vt,"$1"+r):!1!==e.jsonp&&(e.url+=(Et.test(e.url)?"&":"?")+e.jsonp+"="+r),e.converters["script json"]=function(){return o||S.error(r+" was not called"),o[0]},e.dataTypes[0]="json",i=C[r],C[r]=function(){o=arguments},n.always(function(){void 0===i?S(C).removeProp(r):C[r]=i,e[r]&&(e.jsonpCallback=t.jsonpCallback,Xt.push(r)),o&&m(i)&&i(o[0]),o=i=void 0}),"script"}),v.createHTMLDocument=((Ut=E.implementation.createHTMLDocument("").body).innerHTML="<form></form><form></form>",2===Ut.childNodes.length),S.parseHTML=function(e,t,n){return"string"!=typeof e?[]:("boolean"==typeof t&&(n=t,t=!1),t||(v.createHTMLDocument?((r=(t=E.implementation.createHTMLDocument("")).createElement("base")).href=E.location.href,t.head.appendChild(r)):t=E),o=!n&&[],(i=N.exec(e))?[t.createElement(i[1])]:(i=xe([e],t,o),o&&o.length&&S(o).remove(),S.merge([],i.childNodes)));var r,i,o},S.fn.load=function(e,t,n){var r,i,o,a=this,s=e.indexOf(" ");return-1<s&&(r=yt(e.slice(s)),e=e.slice(0,s)),m(t)?(n=t,t=void 0):t&&"object"==typeof t&&(i="POST"),0<a.length&&S.ajax({url:e,type:i||"GET",dataType:"html",data:t}).done(function(e){o=arguments,a.html(r?S("<div>").append(S.parseHTML(e)).find(r):e)}).always(n&&function(e,t){a.each(function(){n.apply(this,o||[e.responseText,t,e])})}),this},S.expr.pseudos.animated=function(t){return S.grep(S.timers,function(e){return t===e.elem}).length},S.offset={setOffset:function(e,t,n){var r,i,o,a,s,u,l=S.css(e,"position"),c=S(e),f={};"static"===l&&(e.style.position="relative"),s=c.offset(),o=S.css(e,"top"),u=S.css(e,"left"),("absolute"===l||"fixed"===l)&&-1<(o+u).indexOf("auto")?(a=(r=c.position()).top,i=r.left):(a=parseFloat(o)||0,i=parseFloat(u)||0),m(t)&&(t=t.call(e,n,S.extend({},s))),null!=t.top&&(f.top=t.top-s.top+a),null!=t.left&&(f.left=t.left-s.left+i),"using"in t?t.using.call(e,f):c.css(f)}},S.fn.extend({offset:function(t){if(arguments.length)return void 0===t?this:this.each(function(e){S.offset.setOffset(this,t,e)});var e,n,r=this[0];return r?r.getClientRects().length?(e=r.getBoundingClientRect(),n=r.ownerDocument.defaultView,{top:e.top+n.pageYOffset,left:e.left+n.pageXOffset}):{top:0,left:0}:void 0},position:function(){if(this[0]){var e,t,n,r=this[0],i={top:0,left:0};if("fixed"===S.css(r,"position"))t=r.getBoundingClientRect();else{t=this.offset(),n=r.ownerDocument,e=r.offsetParent||n.documentElement;while(e&&(e===n.body||e===n.documentElement)&&"static"===S.css(e,"position"))e=e.parentNode;e&&e!==r&&1===e.nodeType&&((i=S(e).offset()).top+=S.css(e,"borderTopWidth",!0),i.left+=S.css(e,"borderLeftWidth",!0))}return{top:t.top-i.top-S.css(r,"marginTop",!0),left:t.left-i.left-S.css(r,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){var e=this.offsetParent;while(e&&"static"===S.css(e,"position"))e=e.offsetParent;return e||re})}}),S.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(t,i){var o="pageYOffset"===i;S.fn[t]=function(e){return B(this,function(e,t,n){var r;if(x(e)?r=e:9===e.nodeType&&(r=e.defaultView),void 0===n)return r?r[i]:e[t];r?r.scrollTo(o?r.pageXOffset:n,o?n:r.pageYOffset):e[t]=n},t,e,arguments.length)}}),S.each(["top","left"],function(e,n){S.cssHooks[n]=_e(v.pixelPosition,function(e,t){if(t)return t=Be(e,n),Pe.test(t)?S(e).position()[n]+"px":t})}),S.each({Height:"height",Width:"width"},function(a,s){S.each({padding:"inner"+a,content:s,"":"outer"+a},function(r,o){S.fn[o]=function(e,t){var n=arguments.length&&(r||"boolean"!=typeof e),i=r||(!0===e||!0===t?"margin":"border");return B(this,function(e,t,n){var r;return x(e)?0===o.indexOf("outer")?e["inner"+a]:e.document.documentElement["client"+a]:9===e.nodeType?(r=e.documentElement,Math.max(e.body["scroll"+a],r["scroll"+a],e.body["offset"+a],r["offset"+a],r["client"+a])):void 0===n?S.css(e,t,i):S.style(e,t,n,i)},s,n?e:void 0,n)}})}),S.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(e,t){S.fn[t]=function(e){return this.on(t,e)}}),S.fn.extend({bind:function(e,t,n){return this.on(e,null,t,n)},unbind:function(e,t){return this.off(e,null,t)},delegate:function(e,t,n,r){return this.on(t,e,n,r)},undelegate:function(e,t,n){return 1===arguments.length?this.off(e,"**"):this.off(t,e||"**",n)},hover:function(e,t){return this.mouseenter(e).mouseleave(t||e)}}),S.each("blur focus focusin focusout resize scroll click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup contextmenu".split(" "),function(e,n){S.fn[n]=function(e,t){return 0<arguments.length?this.on(n,null,e,t):this.trigger(n)}});var Gt=/^[\s\uFEFF\xA0]+|([^\s\uFEFF\xA0])[\s\uFEFF\xA0]+$/g;S.proxy=function(e,t){var n,r,i;if("string"==typeof t&&(n=e[t],t=e,e=n),m(e))return r=s.call(arguments,2),(i=function(){return e.apply(t||this,r.concat(s.call(arguments)))}).guid=e.guid=e.guid||S.guid++,i},S.holdReady=function(e){e?S.readyWait++:S.ready(!0)},S.isArray=Array.isArray,S.parseJSON=JSON.parse,S.nodeName=A,S.isFunction=m,S.isWindow=x,S.camelCase=X,S.type=w,S.now=Date.now,S.isNumeric=function(e){var t=S.type(e);return("number"===t||"string"===t)&&!isNaN(e-parseFloat(e))},S.trim=function(e){return null==e?"":(e+"").replace(Gt,"$1")},"function"==typeof define&&define.amd&&define("jquery",[],function(){return S});var Yt=C.jQuery,Qt=C.$;return S.noConflict=function(e){return C.$===S&&(C.$=Qt),e&&C.jQuery===S&&(C.jQuery=Yt),S},"undefined"==typeof e&&(C.jQuery=C.$=S),S});
\ No newline at end of file
diff --git a/templates/admin/base.html b/templates/admin/base.html
index 1464e3b0..0665f247 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -21,7 +21,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <!-- jquery -->
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js" crossorigin="anonymous"></script>
+  <script src="/static/js/assets/jquery-min.js"></script>
 
   <!-- bulma -->
   <link rel="stylesheet" href="/static/css/bulma.css?v={{ appVersion() }} " />
diff --git a/templates/base.html b/templates/base.html
index c01283ab..96168af7 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -21,7 +21,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <!-- JQuery -->
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js" crossorigin="anonymous"></script>
+  <script src="/static/js/assets/jquery-min.js"></script>
 
   <!-- Bulma -->
   <link rel="stylesheet" href="/static/css/bulma.css?v={{ appVersion() }} " />

From d52d919162288a6a465dabaa856471b1784e061a Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 29 Aug 2022 05:06:14 +0000
Subject: [PATCH 244/278] update css

---
 static/css/pages/admin/style.css | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/static/css/pages/admin/style.css b/static/css/pages/admin/style.css
index 1c92aea0..ce770703 100644
--- a/static/css/pages/admin/style.css
+++ b/static/css/pages/admin/style.css
@@ -1,7 +1,3 @@
-.admin-con {
-    margin-top: 30px!important
-}
-
 .sidebar {
     background: hsl(var(--main), 10%, 15%);
     width: 230px;
@@ -176,7 +172,8 @@
 }
 
 .admin-con {
-    flex-grow: 1
+    flex-grow: 1;
+    margin-top: 50px !important;
 }
 
 li {

From 4c5c8ab804e6ec9400b2130ba9f3ad7092061f0c Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 29 Aug 2022 05:17:57 +0000
Subject: [PATCH 245/278] give dangerous priv access to bn panel

---
 blueprints/admin.py | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 72fb997b..78033d89 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -130,7 +130,7 @@ async def users_update(id:int):
         return redirect('/admin/users')
 
 @admin.route('/beatmaps')
-@priv_check(priv=Privileges.Nominator)
+@priv_check(priv = Privileges.Nominator | Privileges.Dangerous)
 async def beatmaps():
     query = await glob.db.fetch(
         'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
@@ -156,7 +156,7 @@ async def beatmaps():
     return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps)
 
 @admin.route('/beatmaps/search/<q>')
-@priv_check(priv=Privileges.Nominator)
+@priv_check(priv = Privileges.Nominator | Privileges.Dangerous)
 async def beatmaps_search(q: str):
     query = await glob.db.fetch(
         'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
@@ -182,7 +182,7 @@ async def beatmaps_search(q: str):
     return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps, search_word=q)
 
 @admin.route('/beatmaps/edit/<id>')
-@priv_check(priv=Privileges.Nominator)
+@priv_check(priv = Privileges.Nominator | Privileges.Dangerous)
 async def beatmaps_edit(id:int): 
     status = request.args.get('status', type=int)
     is_set = request.args.get('set', type=int) == 1

From d339b75c285cd54659a7fe4cd2c4e8446a504219 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Tue, 30 Aug 2022 09:07:31 +0000
Subject: [PATCH 246/278] render list of privs

---
 objects/glob.py                          |  9 +++++----
 templates/admin/users/index.html         | 17 ++++++++++++++---
 templates/admin/users/upload-scores.html |  4 ++--
 3 files changed, 21 insertions(+), 9 deletions(-)

diff --git a/objects/glob.py b/objects/glob.py
index ff56bd2d..b906351d 100644
--- a/objects/glob.py
+++ b/objects/glob.py
@@ -52,12 +52,12 @@ def appVersion() -> str:
 # Not Verified -> Disclaimed
 # Not Unrestricted -> Restricted
 @app.template_global()
-def decode_priv(target_priv: int) -> str:
+def format_priv(target_priv: int) -> set:
     priv_list = [priv.name for priv in Privileges if target_priv & priv and bin(priv).count("1") == 1][::-1]
     if 'Unrestricted' not in priv_list:
-        return 'Restricted'
+        return ['Restricted']
     if 'Verified' not in priv_list:
-        return 'Disclaimed'
+        return ['Disclaimed']
     if set(['Verified', 'Unrestricted']).issubset(priv_list):
         priv_list.remove('Verified')
         priv_list.remove('Unrestricted')
@@ -73,7 +73,8 @@ def decode_priv(target_priv: int) -> str:
         priv_list.append('Donator')
     if 'Normal' in priv_list and len(priv_list) != 1:
         priv_list.remove('Normal')
-    return ', '.join(priv_list)
+    # return ', '.join(priv_list)
+    return priv_list
 
 @app.template_global()
 def captchaKey() -> str:
diff --git a/templates/admin/users/index.html b/templates/admin/users/index.html
index a6e88098..02a53e24 100644
--- a/templates/admin/users/index.html
+++ b/templates/admin/users/index.html
@@ -63,7 +63,18 @@ <h2 class="section-title">{{ t("admin.base.users") }}</h2>
                             style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">
                         <a class='ml-2' href="/u/{{ i.id }}">{{ i.name }}</a>
                     </td>
-                    <td class="has-text-centered">{{ decode_priv(i.priv) }}</td>
+                    <td class="has-text-centered">
+                        {% for priv in (format_priv(i.priv)) %}
+                        <div class="tag
+                        {% if priv == 'Normal' %} is-disabled
+                        {% elif priv == 'Restricted' %} is-danger
+                        {% elif priv == 'Disclaimed' %} is-warning
+                        {% elif priv == 'Stuff' %} is-info
+                        {% elif priv == 'Nominator' %} is-success
+                        {% else %} is-primary
+                        {% endif %}
+                        ">{{ priv }}</div>
+                        {% endfor %}</td>
                     <td class="has-text-centered">
                     {% if i.last_login %}{{ i.last_login }}
                     {% else %} -
@@ -73,9 +84,9 @@ <h2 class="section-title">{{ t("admin.base.users") }}</h2>
                     <td class="has-text-centered">
                     {% if i.osu_stream %}
                         <div class="tag
-                        {% if i.osu_stream == 'stable' %} is-primary
+                        {% if i.osu_stream == 'stable' %} is-disabled
                         {% elif i.osu_stream == 'beta' %} is-info
-                        {% elif i.osu_stream == 'cuttingedge' %} is-light
+                        {% elif i.osu_stream == 'cuttingedge' %} is-primary
                         {% elif i.osu_stream == 'tourney' %} is-dark
                         {% elif i.osu_stream == 'fallback' %} is-warning
                         {% else %} is-danger
diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index 1862fbe3..1934b2e4 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -25,8 +25,8 @@
 <script>
     document.addEventListener('DOMContentLoaded', () => {
         transaction(state => {
-            state.apiKey = "{{ session.user_data['api_key'] }}"
-            state.userId = parseInt('{{ search_data.id }}')
+            state.apiKey = `{{ session.user_data['api_key'] }}`
+            state.userId = parseInt({{ search_data.id }})
         }, false)
     })
 </script>

From 6b134ab162ae1f30b80a28cfa80e65164f03f838 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 1 Sep 2022 09:00:56 +0000
Subject: [PATCH 247/278] remove 'TODO', add admin panel

---
 templates/components/navbar.html | 57 +++++++++++++++++++++++++++-----
 1 file changed, 49 insertions(+), 8 deletions(-)

diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index 95caa20e..cf8139fa 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -24,28 +24,69 @@
                 {{ t('navbar.leaderboards') }}
             </a>
 
+
+            {% if session.authenticated and session.user_data['is_staff'] %}
             <div class="navbar-item has-dropdown is-hoverable">
-                <a class="navbar-link">
-                    {{ t('navbar.information') }}
+                <a class="navbar-link" href="/admin">
+                    {{ t('navbar.admin') }}
                 </a>
                 <div class="navbar-dropdown">
-                    <a class="navbar-item">
-                        {{ t('navbar.todo') }}
+                    <a class="navbar-item" href="/admin/dashboard">
+                        {{ t('admin.base.dashboard') }}
+                    </a>
+                    <a class="navbar-item" href="/admin/users">
+                        {{ t("admin.base.users") }}
+                    </a>
+                    <a class="navbar-item" href="/admin/restrictions">
+                        {{ t("admin.base.restrictions") }}
                     </a>
+                    <a class="navbar-item" href="/admin/beatmaps">
+                        {{ t("admin.base.beatmaps") }}
+                    </a>
+                    {# <li class="nav-item">
+                        <a class="nav-link" href="/admin/dashboard">
+                            <span class="icon"><i class="fa fa-home"></i></span>
+                            <span class="name">
+                                {{ t('admin.base.dashboard') }}</span>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="/admin/users">
+                            <span class="icon"><i class="fa fa-user"></i></span>
+                            <span class="name">{{ t("admin.base.users") }}</span></a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="/admin/restrictions">
+                            <span class="icon">
+                                <i class="fa fa-ban"></i>
+                            </span>
+                            <span class="name">{{ t("admin.base.restrictions") }}
+                            </span>
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="/admin/beatmaps">
+                            <span class="icon">
+                                <i class="fa fa-map"></i>
+                            </span>
+                            <span class="name">{{ t("admin.base.beatmaps") }}</span>
+                        </a>
+                    </li> #}
                 </div>
             </div>
 
-            {% if session.authenticated and session.user_data['is_staff'] %}
-            <a class=" navbar-item" href="/admin">
+
+            {# <a class=" navbar-item" href="/admin">
                 {{ t('navbar.admin') }}
-            </a>
+            </a> #}
             {% endif %}
         </div>
 
         <div class="navbar-end">
             <div class="navbar-item has-dropdown is-hoverable" style="align-items: center;">
                 <div class="navbar-search">
-                    <input autocomplete="off" type="text" placeholder='{{ t("navbar.looking-for-someone") }}' id="u-search" oninput="searchUser()">
+                    <input autocomplete="off" type="text" placeholder='{{ t("navbar.looking-for-someone") }}'
+                        id="u-search" oninput="searchUser()">
                 </div>
                 <div id="u-search-content" class="navbar-dropdown" style="display: none;">
                 </div>

From 0964df0632400ffb8270e3666ff9928b3272c7c2 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 1 Sep 2022 09:01:14 +0000
Subject: [PATCH 248/278] fixup

---
 templates/components/navbar.html | 34 --------------------------------
 1 file changed, 34 deletions(-)

diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index cf8139fa..5eaddf9d 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -43,42 +43,8 @@
                     <a class="navbar-item" href="/admin/beatmaps">
                         {{ t("admin.base.beatmaps") }}
                     </a>
-                    {# <li class="nav-item">
-                        <a class="nav-link" href="/admin/dashboard">
-                            <span class="icon"><i class="fa fa-home"></i></span>
-                            <span class="name">
-                                {{ t('admin.base.dashboard') }}</span>
-                        </a>
-                    </li>
-                    <li class="nav-item">
-                        <a class="nav-link" href="/admin/users">
-                            <span class="icon"><i class="fa fa-user"></i></span>
-                            <span class="name">{{ t("admin.base.users") }}</span></a>
-                    </li>
-                    <li class="nav-item">
-                        <a class="nav-link" href="/admin/restrictions">
-                            <span class="icon">
-                                <i class="fa fa-ban"></i>
-                            </span>
-                            <span class="name">{{ t("admin.base.restrictions") }}
-                            </span>
-                        </a>
-                    </li>
-                    <li class="nav-item">
-                        <a class="nav-link" href="/admin/beatmaps">
-                            <span class="icon">
-                                <i class="fa fa-map"></i>
-                            </span>
-                            <span class="name">{{ t("admin.base.beatmaps") }}</span>
-                        </a>
-                    </li> #}
                 </div>
             </div>
-
-
-            {# <a class=" navbar-item" href="/admin">
-                {{ t('navbar.admin') }}
-            </a> #}
             {% endif %}
         </div>
 

From d62a2590af862c1949b3a9a7c6711023e65486d1 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 3 Sep 2022 16:17:48 +0000
Subject: [PATCH 249/278] JSON formatter

---
 .vscode/settings.json                    |   2 +-
 objects/glob.py                          |   7 +-
 templates/admin/beatmaps.html            |   4 +-
 templates/admin/home.html                |   2 +-
 templates/admin/users/upload-scores.html |   4 +-
 templates/components/navbar.html         |   2 +-
 templates/leaderboard.html               | 210 +++++++++++------------
 templates/profile.html                   |   8 +-
 templates/settings/avatar.html           |   6 +-
 templates/settings/custom.html           |  12 +-
 10 files changed, 131 insertions(+), 126 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 2d5fff07..7ad106fa 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -54,6 +54,6 @@
     ]
   },
   "files.associations": {
-    "*.html": "html"
+    "*.html": "jinja-html"
   }
 }
diff --git a/objects/glob.py b/objects/glob.py
index b906351d..c8fca014 100644
--- a/objects/glob.py
+++ b/objects/glob.py
@@ -8,6 +8,7 @@
 import i18n
 import markdown2
 import html
+import json
 from aiohttp import ClientSession
 from cmyui.mysql import AsyncSQLPool
 from cmyui.version import Version
@@ -100,4 +101,8 @@ def render_markdown(md: str) -> str:
 
 @app.template_global()
 def decode_map_status(status: int) -> str:
-    return RankedStatus(status).name
\ No newline at end of file
+    return RankedStatus(status).name
+
+@app.template_filter('JSON')
+def JSON(anyting) -> str:
+    return app.jinja_env.filters['safe'](json.dumps(anyting))
\ No newline at end of file
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 284f9072..010041d8 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -52,7 +52,7 @@
 {# <script>
     window.addEventListener('load', () => {
         window._state = createState({
-            api_key: "{{ session.user_data['api_key'] }}"
+            api_key: {{ session.user_data['api_key'] | JSON }}
         })
     })
 </script> #}
@@ -233,7 +233,7 @@ <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
 </style>
 <script>$(document).ready(function () {
         $(".dropdown .buttond").click(function () {
-            var dropdown = $(this).parents('.dropdown');
+            const dropdown = $(this).parents('.dropdown');
             dropdown.toggleClass('is-active');
             dropdown.focusout(function () {
                 $(this).removeClass('is-active');
diff --git a/templates/admin/home.html b/templates/admin/home.html
index 52b13777..647cb12d 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -5,7 +5,7 @@
 <script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
 <script>
-    window.domain = "{{ domain() }}";
+    window.domain = {{ domain() | JSON }};
 </script>
 <style>
     .card .title, .card .stat {
diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index 1934b2e4..aeb8716c 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -25,8 +25,8 @@
 <script>
     document.addEventListener('DOMContentLoaded', () => {
         transaction(state => {
-            state.apiKey = `{{ session.user_data['api_key'] }}`
-            state.userId = parseInt({{ search_data.id }})
+            state.apiKey = {{ session.user_data['api_key'] | JSON }}
+            state.userId = {{ search_data.id | JSON }}
         }, false)
     })
 </script>
diff --git a/templates/components/navbar.html b/templates/components/navbar.html
index 5eaddf9d..84af767f 100644
--- a/templates/components/navbar.html
+++ b/templates/components/navbar.html
@@ -1,5 +1,5 @@
 <script type="text/javascript">
-    window.domain = '{{ domain() }}'
+    window.domain = {{ domain() | JSON }}
 </script>
 <nav id="navbar" class="navbar is-primary">
     <div class="navbar-brand">
diff --git a/templates/leaderboard.html b/templates/leaderboard.html
index 117395ad..0bb907eb 100644
--- a/templates/leaderboard.html
+++ b/templates/leaderboard.html
@@ -6,10 +6,10 @@
 <script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
 
 <script>
-    globalThis.mode = "{{ mode }}";
-    globalThis.mods = "{{ mods }}";
-    globalThis.sort = "{{ sort }}";
-    globalThis.domain = "{{ domain() }}";
+  globalThis.mode = {{ mode | JSON }};
+  globalThis.mods = {{ mods | JSON }};
+  globalThis.sort = {{ sort | JSON }};
+  globalThis.domain = {{ domain() | JSON }};
 </script>
 
 <link rel="stylesheet" href="/static/css/pages/leaderboard.css?v={{ appVersion() }} ">
@@ -17,110 +17,110 @@
 
 {% block content %}
 <div id="app" :class="(load ? 'load' : '')">
-    <div class="leaderboard-banner main-banner">
-        <div class="main-selector">
-            <a class="mode-select" :class="{ 'active': mode === 'std' }" @click="LoadLeaderboard(sort, 'std', mods)">
-                <i class="mode-icon mode-osu"></i><span class="modetext"> {{ t('global.mode.osu') }}</span>
-            </a>
-            <a class="mode-select" :class="{ 'active': mode === 'taiko', 'disabled': mods === 'ap' }"
-                @click="LoadLeaderboard(sort, 'taiko', mods)">
-                <i class="mode-icon mode-taiko"></i><span class="modetext"> {{ t('global.mode.taiko') }}</span>
-            </a>
-            <a class="mode-select" :class="{ 'active': mode === 'catch', 'disabled': mods === 'ap' }"
-                @click="LoadLeaderboard(sort, 'catch', mods)">
-                <i class="mode-icon mode-catch"></i><span class="modetext"> {{ t('global.mode.catch') }}</span>
-            </a>
-            <a class="mode-select" :class="{ 'active': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
-                @click="LoadLeaderboard(sort, 'mania', mods)">
-                <i class="mode-icon mode-mania"></i><span class="modetext"> {{ t('global.mode.mania') }}</span>
-            </a>
-        </div>
-        <div class="banner-text">{{ t('leaderboard.leaderboard') }}</div>
-        <div class="selector">
-            <div class="left">
-                <a class="simple-banner-switch" :class="{ 'active': sort === 'pp' }"
-                    @click="LoadLeaderboard('pp', mode, mods, '')">{{ t('global.pp').upper() }}</a>
-                <a class="simple-banner-switch" :class="{ 'active': sort === 'rscore' }"
-                    @click="LoadLeaderboard('rscore', mode, mods, '')">{{ t('global.score') }}</a>
-                <a class="simple-banner-switch" :class="{ 'active': sort === 'acc' }"
-                    @click="LoadLeaderboard('acc', mode, mods, '')">{{ t('global.acc') }}</a>
-                <a class="simple-banner-switch" :class="{ 'active': sort === 'plays' }"
-                    @click="LoadLeaderboard('plays', mode, mods, '')">{{ t('global.playcount') }}</a>
-                <a class="simple-banner-switch" :class="{ 'active': sort === 'playtime' }"
-                    @click="LoadLeaderboard('playtime', mode, mods, '')">{{ t('global.playtime') }}</a>
-            </div>
-            <div class="right">
-                <a class="simple-banner-switch" :class=" { 'active': mods === 'vn' }"
-                    @click="LoadLeaderboard(sort, mode, 'vn')">{{ t('global.mode.vanilla') }}</a>
-                <a class="simple-banner-switch" :class=" { 'active': mods === 'rx', 'disabled': mode === 'mania' }"
-                    @click="LoadLeaderboard(sort, mode, 'rx')">{{ t('global.mode.relax') }}</a>
-                <a class="simple-banner-switch"
-                    :class=" { 'active': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
-                    @click="LoadLeaderboard(sort, mode, 'ap')">{{ t('global.mode.autopilot') }}</a>
-            </div>
-        </div>
+  <div class="leaderboard-banner main-banner">
+    <div class="main-selector">
+      <a class="mode-select" :class="{ 'active': mode === 'std' }" @click="LoadLeaderboard(sort, 'std', mods)">
+        <i class="mode-icon mode-osu"></i><span class="modetext"> {{ t('global.mode.osu') }}</span>
+      </a>
+      <a class="mode-select" :class="{ 'active': mode === 'taiko', 'disabled': mods === 'ap' }"
+        @click="LoadLeaderboard(sort, 'taiko', mods)">
+        <i class="mode-icon mode-taiko"></i><span class="modetext"> {{ t('global.mode.taiko') }}</span>
+      </a>
+      <a class="mode-select" :class="{ 'active': mode === 'catch', 'disabled': mods === 'ap' }"
+        @click="LoadLeaderboard(sort, 'catch', mods)">
+        <i class="mode-icon mode-catch"></i><span class="modetext"> {{ t('global.mode.catch') }}</span>
+      </a>
+      <a class="mode-select" :class="{ 'active': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
+        @click="LoadLeaderboard(sort, 'mania', mods)">
+        <i class="mode-icon mode-mania"></i><span class="modetext"> {{ t('global.mode.mania') }}</span>
+      </a>
+    </div>
+    <div class="banner-text">{{ t('leaderboard.leaderboard') }}</div>
+    <div class="selector">
+      <div class="left">
+        <a class="simple-banner-switch" :class="{ 'active': sort === 'pp' }"
+          @click="LoadLeaderboard('pp', mode, mods, '')">{{ t('global.pp').upper() }}</a>
+        <a class="simple-banner-switch" :class="{ 'active': sort === 'rscore' }"
+          @click="LoadLeaderboard('rscore', mode, mods, '')">{{ t('global.score') }}</a>
+        <a class="simple-banner-switch" :class="{ 'active': sort === 'acc' }"
+          @click="LoadLeaderboard('acc', mode, mods, '')">{{ t('global.acc') }}</a>
+        <a class="simple-banner-switch" :class="{ 'active': sort === 'plays' }"
+          @click="LoadLeaderboard('plays', mode, mods, '')">{{ t('global.playcount') }}</a>
+        <a class="simple-banner-switch" :class="{ 'active': sort === 'playtime' }"
+          @click="LoadLeaderboard('playtime', mode, mods, '')">{{ t('global.playtime') }}</a>
+      </div>
+      <div class="right">
+        <a class="simple-banner-switch" :class=" { 'active': mods === 'vn' }"
+          @click="LoadLeaderboard(sort, mode, 'vn')">{{ t('global.mode.vanilla') }}</a>
+        <a class="simple-banner-switch" :class=" { 'active': mods === 'rx', 'disabled': mode === 'mania' }"
+          @click="LoadLeaderboard(sort, mode, 'rx')">{{ t('global.mode.relax') }}</a>
+        <a class="simple-banner-switch"
+          :class=" { 'active': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
+          @click="LoadLeaderboard(sort, mode, 'ap')">{{ t('global.mode.autopilot') }}</a>
+      </div>
     </div>
-    <div class="main-block">
-        <div class="leaderboard-main-bg table-responsive">
-            <div v-if="boards.length != undefined && boards.length != 0">
-                <table class="leaderboard-table table-responsive">
-                    <thead>
-                        <tr>
-                            <th class="t-heading"> </th>
-                            <th class="t-heading t-heading--main"></th>
-                            <th v-if="sort == 'pp' || sort == 'rscore'" class="t-heading table--selected">
-                                <% (sort=='pp' ? "{{ t('global.pp').upper() }}" : "" ) %>
-                                    <% (sort=='rscore' ? "{{ t('global.score') }}" : "" ) %>
-                            </th>
-                            <th class="t-heading"> {{ t('global.accuracy') }} </th>
-                            <th class="t-heading"> {{ t('global.playcount') }} </th>
-                            <th class="t-heading"> {{ t('global.max-combo') }} </th>
-                            <th class="t-heading"> {{ t('global.playtime') }}</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        <tr v-for="(user, index) in boards" class="leaderboard-column">
-                            <td class="column-player-rank">#<% index + 1 %>
-                            </td>
-                            <td class="column-player-name has-text-left">
-                                <a :title="flags[user.country.toUpperCase()]"
-                                    :style="'background-image: url(/static/images/flags/' + user.country.toUpperCase() + '.png)'"
-                                    class="player-flag">
-                                    <div class="flag-dropdown">
-                                        <% flags[user.country.toUpperCase()] %>
-                                    </div>
-                                </a>
-                                <a :href="'/u/'+user.player_id">
-                                    <% user.name %>
-                                </a>
-                            </td>
-                            <td v-if="sort == 'pp' || sort == 'rscore'" class="has-text-right pr-3">
-                                <% (sort=='pp' ? addCommas(user.pp) : "" ) %>
-                                    <% (sort=='rscore' ? scoreFormat(user.rscore) : "" ) %>
-                            </td>
-                            <td class="has-text-right pr-3">
-                                <% user.acc.toFixed(2) %>%
-                            </td>
-                            <td class="has-text-right pr-3">
-                                <% addCommas(user.plays) %>
-                            </td>
-                            <td class="has-text-right pr-3">
-                                <% addCommas(user.max_combo) %>
-                            </td>
-                            <td class="has-text-right pr-3">
-                                <% secondsToDhm(user.playtime) %>
-                            </td>
-                        </tr>
-                    </tbody>
-                </table>
-            </div>
-            <div v-else>
-                <div class="text-center">
-                    {{ t('leaderboard.there-are-no-players-to-display') }}
-                </div>
-            </div>
+  </div>
+  <div class="main-block">
+    <div class="leaderboard-main-bg table-responsive">
+      <div v-if="boards.length != undefined && boards.length != 0">
+        <table class="leaderboard-table table-responsive">
+          <thead>
+            <tr>
+              <th class="t-heading"> </th>
+              <th class="t-heading t-heading--main"></th>
+              <th v-if="sort == 'pp' || sort == 'rscore'" class="t-heading table--selected">
+                <% (sort=='pp' ? {{ t('global.pp').upper() | JSON }} : "" ) %>
+                  <% (sort=='rscore' ? {{ t('global.score') | JSON }} : "" ) %>
+              </th>
+              <th class="t-heading"> {{ t('global.accuracy') }} </th>
+              <th class="t-heading"> {{ t('global.playcount') }} </th>
+              <th class="t-heading"> {{ t('global.max-combo') }} </th>
+              <th class="t-heading"> {{ t('global.playtime') }}</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr v-for="(user, index) in boards" class="leaderboard-column">
+              <td class="column-player-rank">#<% index + 1 %>
+              </td>
+              <td class="column-player-name has-text-left">
+                <a :title="flags[user.country.toUpperCase()]"
+                  :style="'background-image: url(/static/images/flags/' + user.country.toUpperCase() + '.png)'"
+                  class="player-flag">
+                  <div class="flag-dropdown">
+                    <% flags[user.country.toUpperCase()] %>
+                  </div>
+                </a>
+                <a :href="'/u/'+user.player_id">
+                  <% user.name %>
+                </a>
+              </td>
+              <td v-if="sort == 'pp' || sort == 'rscore'" class="has-text-right pr-3">
+                <% (sort=='pp' ? addCommas(user.pp) : "" ) %>
+                  <% (sort=='rscore' ? scoreFormat(user.rscore) : "" ) %>
+              </td>
+              <td class="has-text-right pr-3">
+                <% user.acc.toFixed(2) %>%
+              </td>
+              <td class="has-text-right pr-3">
+                <% addCommas(user.plays) %>
+              </td>
+              <td class="has-text-right pr-3">
+                <% addCommas(user.max_combo) %>
+              </td>
+              <td class="has-text-right pr-3">
+                <% secondsToDhm(user.playtime) %>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+      <div v-else>
+        <div class="text-center">
+          {{ t('leaderboard.there-are-no-players-to-display') }}
         </div>
+      </div>
     </div>
+  </div>
 </div>
 
 <script src="/static/js/assets/vue-flags.js?v={{ appVersion() }} "></script>
diff --git a/templates/profile.html b/templates/profile.html
index 5a281867..8cd21fa4 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -152,10 +152,10 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
 <script>
     window.addEventListener('load', () => {
         window._state = createState({
-            userid: Number("{{ user['id'] }}"), //For text editor doesn't dizzy lmao
-            mode: `{{ mode }}`,
-            mods: `{{ mods }}`,
-            domain: "{{ domain() }}"
+            userid: {{ user['id'] | JSON }}
+            mode: {{ mode | JSON }},
+            mods: {{ mods | JSON }},
+            domain: {{ domain() | JSON }}
         })
     })
 </script>
diff --git a/templates/settings/avatar.html b/templates/settings/avatar.html
index 16536458..4c4c9ac5 100644
--- a/templates/settings/avatar.html
+++ b/templates/settings/avatar.html
@@ -57,12 +57,12 @@ <h4 class="mb-4">{{ t('settings.preview') }}</h4>
   <script>
     $("#file")
       .change(function (e) {
-        var f = e.target.files;
+        const f = e.target.files;
         if (f.length < 1) {
           return;
         }
-        var u = window.URL.createObjectURL(f[0]);
-        var i = $("#avatar-img")[0];
+        const u = window.URL.createObjectURL(f[0]);
+        const i = $("#avatar-img")[0];
         i.src = u;
         $('#avatar-img').attr('src', i.src)
       });
diff --git a/templates/settings/custom.html b/templates/settings/custom.html
index 0f5ad976..fb38fceb 100644
--- a/templates/settings/custom.html
+++ b/templates/settings/custom.html
@@ -77,24 +77,24 @@ <h4 class="mb-4">{{ t('settings.preview') }}</h4>
   <script>
     $("#file-bg")
       .change(function (e) {
-        var f = e.target.files;
+        const f = e.target.files;
         if (f.length < 1) {
           return;
         }
-        var u = window.URL.createObjectURL(f[0]);
-        var i = $("body")[0];
+        const u = window.URL.createObjectURL(f[0]);
+        const i = $("body")[0];
         i.src = u;
         $('body').css({'background': `linear-gradient(hsl(var(--main), 25%, 25%, 20%), hsl(var(--main), 10%, 10%)), url(${i.src})`, 'background-size': 'cover'})
       });
 
       $("#file-bn")
       .change(function (e) {
-        var f = e.target.files;
+        const f = e.target.files;
         if (f.length < 1) {
           return;
         }
-        var u = window.URL.createObjectURL(f[0]);
-        var i = $(".top-block")[0];
+        const u = window.URL.createObjectURL(f[0]);
+        const i = $(".top-block")[0];
         i.src = u;
         $('.top-block').css({'background': `linear-gradient(hsl(var(--main), 25%, 25%, 20%), hsl(var(--main), 25%, 25%, 60%)), url(${i.src})`, 'background-size': 'cover'})
       });

From f0e7ea3e9de8a9c14147620ca89c94470144486b Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 3 Sep 2022 16:30:00 +0000
Subject: [PATCH 250/278] remove unnecessarily javascript

---
 templates/admin/beatmaps.html | 44 ++++++++++++++++++++++-------------
 1 file changed, 28 insertions(+), 16 deletions(-)

diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 010041d8..18f23dab 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -49,13 +49,18 @@
 {% block title %} Beatmaps {% endblock %}
 
 {% block content %}
-{# <script>
+{# TODO I found api_key not used in this page so I commented out this injection
+uncomment if it's needed in the future
+#}
+{#
+<script>
     window.addEventListener('load', () => {
         window._state = createState({
             api_key: {{ session.user_data['api_key'] | JSON }}
         })
     })
-</script> #}
+</script>
+#}
 <progress id="progress_bar" class="progress is-small is-primary" max="100" style="display: none;"></progress>
 <div class="columns is-marginless">
     <div class="column is-paddingless is-avatar">
@@ -128,17 +133,21 @@ <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
                     <td style="width: 400px">
                         <div class="card p-0 m-0 shadow"
                             style="background-image: url(https://assets.ppy.sh/beatmaps/{{ i.set_id }}/covers/cover.jpg); background-size: cover; height: 100px; width: 400px;">
-                            <div class="card-body rounded-sm h-100 p-4"
-                                style="background-color: rgba(0, 0, 0, 0.8);cursor:pointer; "
-                                onclick="window.open('https://osu.ppy.sh/beatmapsets/{{ i.set_id }}')">
-                                <a class="play-detail__title">{{ i.title }}
-                                    <small style="display: inline;">by {{ i.creator }}</small>
-                                </a>
-                                <span style="color: #ea0; font-size: 14px; display: block;">{{ i.diff_name }}</span>
-                                <div style="font-size: 14px; position: absolute;bottom: 1em; right: 1em; opacity: 0.7;">
-                                    bid: <span style="color: #ea0;">{{ i.map_id }}</span>
+                            <a href="https://osu.ppy.sh/beatmapsets/{{ i.set_id }}">
+                                <div 
+                                    class="card-body rounded-sm h-100 p-4"
+                                    style="background-color: rgba(0, 0, 0, 0.8);cursor:pointer;"
+                                >
+                                    <div class="play-detail__title">{{ i.title }}
+                                        <small style="display: inline;">by {{ i.creator }}</small>
+                                    </div>
+                                    <span style="color: #ea0; font-size: 14px; display: block;">{{ i.diff_name }}</span>
+                                    <div
+                                        style="font-size: 14px; position: absolute;bottom: 1em; right: 1em; opacity: 0.7;">
+                                        bid: <span style="color: #ea0;">{{ i.map_id }}</span>
+                                    </div>
                                 </div>
-                            </div>
+                            </a>
                         </div>
                     </td>
                     <td class="!bigger_td my-auto has-text-right">
@@ -230,8 +239,13 @@ <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
         align-self: flex-start;
         max-width: 100%;
     }
+    /* mimic <a> tag behavior */
+    .play-detail__title:hover {
+        color: hsl(var(--main), 90%, 90%);
+    }
 </style>
-<script>$(document).ready(function () {
+<script>
+    $(document).ready(function () {
         $(".dropdown .buttond").click(function () {
             const dropdown = $(this).parents('.dropdown');
             dropdown.toggleClass('is-active');
@@ -240,13 +254,11 @@ <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
             });
         });
     });
-</script>
-<script>
     $("#search-bar").keydown(function (e) {
         if (e.keyCode == 13) {
             searchMaps()
         }
     });  
 </script>
-<script src="/static/js/pages/admin/beatmaps.js?v={{ appVersion() }} " crossorigin="anonymous"></script>
+<script src="/static/js/pages/admin/beatmaps.js?v={{ appVersion() }} "></script>
 {% endblock %}
\ No newline at end of file

From 700091e08850356c9c4874b7dab45fbbcd5f49d9 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 3 Sep 2022 16:43:01 +0000
Subject: [PATCH 251/278] responsive table

---
 static/css/style.css      | 8 ++++++++
 templates/admin/base.html | 4 ++--
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/static/css/style.css b/static/css/style.css
index f72cb802..c16ee52e 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -5,6 +5,10 @@
   src: url(/static/fonts/extra.ttf) format("truetype")
 }
 
+html {
+  overflow: auto;
+}
+
 body * {
   font-family: Quicksand, Noto Sans SC, -apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Helvetica, Arial, PingFang SC, Hiragino Sans GB, Microsoft YaHei, SimSun, sans-serif
 }
@@ -861,4 +865,8 @@ body::-webkit-scrollbar-thumb {
   -webkit-transition: box-shadow 0.1s ease, border-color 0.1s ease;
   transition: box-shadow 0.1s ease, border-color 0.1s ease;
   box-shadow: none;
+}
+
+.table-responsive {
+  overflow-x: scroll;
 }
\ No newline at end of file
diff --git a/templates/admin/base.html b/templates/admin/base.html
index 0665f247..c6ea4dae 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -44,7 +44,7 @@
   <!-- content -->
   <div class="content admin-con">
     <div class="columns is-marginless is-paddingless">
-      <div class="colmun">
+      {# <div class="colmun">
         <div class="sidebar">
           <div id="style-3" class="sidebar-wrapper">
             <div class="logo"><a class="simple-text logo-normal">{{ t('admin.base.admin-panel', appName = appName())
@@ -62,7 +62,7 @@
             </ul>
           </div>
         </div>
-      </div>
+      </div> #}
       <div class="column content" style="min-height: 1000px;">
         <section class="section">
           {% block content %}

From 3394bdc90d40ccd50f3957c3e95d534fe6ee9838 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 3 Sep 2022 16:50:09 +0000
Subject: [PATCH 252/278] no need to show admin avatar & responsive design

---
 templates/admin/beatmaps.html     | 8 ++------
 templates/admin/home.html         | 8 ++------
 templates/admin/restrictions.html | 4 ----
 templates/admin/users/index.html  | 4 ----
 4 files changed, 4 insertions(+), 20 deletions(-)

diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index 18f23dab..ce092d1c 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -63,10 +63,6 @@
 #}
 <progress id="progress_bar" class="progress is-small is-primary" max="100" style="display: none;"></progress>
 <div class="columns is-marginless">
-    <div class="column is-paddingless is-avatar">
-        <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
-            onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
-    </div>
     <div class="column is-paddingless flex-vcenter">
         <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
         <p class="section-lead">{{ t("admin.beatmaps.welcome-to-beatmaps-panel") }}</p>
@@ -74,7 +70,7 @@ <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
 </div>
 <div class="row row-deck row-cards" style="margin-top: 20px">
     <div class="columns is-marginless is-paddingless">
-        <div class="column is-paddingless pr-3 py-3">
+        <div class="column is-paddingless p-3">
             <div class="card has-text-right">
                 <i class="fa fa-plus"></i>
                 <div class="title">{{ t("admin.beatmaps.total-beatmaps") }}</div>
@@ -98,7 +94,7 @@ <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
                 <div class="stat has-text-left">{{ t("admin.beatmaps.we-loved-them-so-much") }}</div>
             </div>
         </div>
-        <div class="column is-paddingless pl-3 py-3">
+        <div class="column is-paddingless p-3">
             <div class="card has-text-right">
                 <i class="fa fa-arrows-rotate"></i>
                 <div class="title">{{ t("admin.beatmaps.pending") }}</div>
diff --git a/templates/admin/home.html b/templates/admin/home.html
index 647cb12d..3b079606 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -17,10 +17,6 @@
 {% block content %}
 
 <div class="columns is-marginless">
-    <div class="column is-paddingless is-avatar">
-      <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
-        onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
-    </div>
     <div class="column is-paddingless flex-vcenter">
       <h2 class="section-title">{{ t('admin.base.dashboard') }}</h2>
       <p class="section-lead">{{ t('admin.base.welcome-to-admin-panel', appName = appName()) }}</p>
@@ -28,7 +24,7 @@ <h2 class="section-title">{{ t('admin.base.dashboard') }}</h2>
 </div>
 <div class="dashboard" id="dashboard">
     <div class="columns is-marginless is-paddingless">
-        <div class="column is-paddingless pr-3 py-3">
+        <div class="column is-paddingless p-3">
             <div class="card">
                 <div class="title">{{ t('admin.home.total-users') }}</div>
                 <i class="fa fa-users"></i>
@@ -54,7 +50,7 @@ <h2 class="section-title">{{ t('admin.base.dashboard') }}</h2>
                 <div class="stat">{{ t('admin.home.latest-and-greatest-welcome') }}</div>
             </div>
         </div>
-        <div class="column is-paddingless pl-3 py-3">
+        <div class="column is-paddingless p-3">
             <div class="card">
                 <div class="title">{{ t('admin.home.total-banned') }}</div>
                 <i class="fa fa-calendar"></i>
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index 2248d6cd..714ce8d4 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -19,10 +19,6 @@
 
 {% block content %}
 <div class="columns is-marginless">
-    <div class="column is-paddingless is-avatar">
-      <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
-        onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
-    </div>
     <div class="column is-paddingless flex-vcenter">
       <h2 class="section-title">{{ t("admin.base.restrictions") }}</h2>
       <p class="section-lead">{{ t("admin.restrictions.welcome-to-restrictions-panel") }}</p>
diff --git a/templates/admin/users/index.html b/templates/admin/users/index.html
index 02a53e24..d5245d8e 100644
--- a/templates/admin/users/index.html
+++ b/templates/admin/users/index.html
@@ -22,10 +22,6 @@
 
 {% block content %}
 <div class="columns is-marginless">
-    <div class="column is-paddingless is-avatar">
-        <img src="https://a.{{ domain() }}/{{ session.user_data['id'] }}"
-            onError="this.src='/static/images/avatar_notwork.png';" class="header-avatar">
-    </div>
     <div class="column is-paddingless flex-vcenter">
         <h2 class="section-title">{{ t("admin.base.users") }}</h2>
         <p class="section-lead">{{ t("admin.users.welcome-to-users-panel") }}</p>

From ac16627689d5598573b31aacb6dc480cb7e33b7e Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 3 Sep 2022 17:40:36 +0000
Subject: [PATCH 253/278] format css, increase load more step size, fix full,
 fix css

---
 static/css/pages/admin/style.css | 660 +++++++++++++++++--------------
 static/css/pages/profile.css     |  15 +-
 static/js/pages/profile.js       | 129 +++---
 templates/admin/home.html        |   4 -
 templates/profile.html           |   4 +-
 5 files changed, 448 insertions(+), 364 deletions(-)

diff --git a/static/css/pages/admin/style.css b/static/css/pages/admin/style.css
index ce770703..eb596e98 100644
--- a/static/css/pages/admin/style.css
+++ b/static/css/pages/admin/style.css
@@ -1,515 +1,563 @@
 .sidebar {
-    background: hsl(var(--main), 10%, 15%);
-    width: 230px;
-    top: 0;
-    left: 0;
-    z-index: 1;
-    background-size: cover;
-    background-position: 50%;
-    display: block;
-    transition: .5s cubic-bezier(.685, .0473, .346, 1);
+  background: hsl(var(--main), 10%, 15%);
+  width: 230px;
+  top: 0;
+  left: 0;
+  z-index: 1;
+  background-size: cover;
+  background-position: 50%;
+  display: block;
+  transition: 0.5s cubic-bezier(0.685, 0.0473, 0.346, 1);
 }
 
 .sidebar .sidebar-wrapper {
-    width: 100%;
-    min-height: 100%;
-    max-height: calc(100vh - 705px);
-    z-index: 4;
-    position: relative;
-    overflow: auto;
-}
-
-.sidebar .sidebar-wrapper>.nav [data-toggle=collapse]~div>ul>li>a .sidebar-normal {
-    margin: 0;
-    position: relative;
-    -webkit-transform: translateX(0);
-    transform: translateX(0);
-    opacity: 1;
-    white-space: nowrap;
-    display: block;
-    line-height: 23px;
-    z-index: 1;
-    color: hsla(0, 0%, 100%, .8)
-}
-
-.sidebar .sidebar-wrapper>.nav [data-toggle=collapse]~div>ul>li>a i {
-    font-size: 17px;
-    line-height: 20px;
-    width: 26px
-}
-
-.sidebar .sidebar-wrapper [data-toggle=collapse]~div>ul>li:hover>a .sidebar-normal {
-    color: #fff
+  width: 100%;
+  min-height: 100%;
+  max-height: calc(100vh - 705px);
+  z-index: 4;
+  position: relative;
+  overflow: auto;
+}
+
+.sidebar
+  .sidebar-wrapper
+  > .nav
+  [data-toggle="collapse"]
+  ~ div
+  > ul
+  > li
+  > a
+  .sidebar-normal {
+  margin: 0;
+  position: relative;
+  -webkit-transform: translateX(0);
+  transform: translateX(0);
+  opacity: 1;
+  white-space: nowrap;
+  display: block;
+  line-height: 23px;
+  z-index: 1;
+  color: hsla(0, 0%, 100%, 0.8);
+}
+
+.sidebar
+  .sidebar-wrapper
+  > .nav
+  [data-toggle="collapse"]
+  ~ div
+  > ul
+  > li
+  > a
+  i {
+  font-size: 17px;
+  line-height: 20px;
+  width: 26px;
+}
+
+.sidebar
+  .sidebar-wrapper
+  [data-toggle="collapse"]
+  ~ div
+  > ul
+  > li:hover
+  > a
+  .sidebar-normal {
+  color: #fff;
 }
 
 .sidebar .nav {
-    margin-top: 20px;
-    display: block;
-    margin-left: 0
+  margin-top: 20px;
+  display: block;
+  margin-left: 0;
 }
 
-.sidebar .nav li>a+div .nav {
-    margin-top: 5px
+.sidebar .nav li > a + div .nav {
+  margin-top: 5px;
 }
 
-.sidebar .nav li>a+div .nav li>a {
-    margin-top: 0;
-    padding: 0.5em 0.5em
+.sidebar .nav li > a + div .nav li > a {
+  margin-top: 0;
+  padding: 0.5em 0.5em;
 }
 
-.sidebar .nav li>a {
-    margin: 10px 15px 0;
-    border-radius: 10px;
-    color: #fff;
-    display: block;
-    position: relative;
-    cursor: pointer;
-    padding: 10px 15px;
-    line-height: 1.625rem;
-    text-align: left
+.sidebar .nav li > a {
+  margin: 10px 15px 0;
+  border-radius: 10px;
+  color: #fff;
+  display: block;
+  position: relative;
+  cursor: pointer;
+  padding: 10px 15px;
+  line-height: 1.625rem;
+  text-align: left;
 }
 
-.sidebar .nav li:first-child>a {
-    margin: 0 15px
+.sidebar .nav li:first-child > a {
+  margin: 0 15px;
 }
 
-.sidebar .nav li:focus:not(.active)>a i, .sidebar .nav li:focus:not(.active)>a p, .sidebar .nav li:hover:not(.active)>a i, .sidebar .nav li:hover:not(.active)>a p {
-    color: #fff
+.sidebar .nav li:focus:not(.active) > a i,
+.sidebar .nav li:focus:not(.active) > a p,
+.sidebar .nav li:hover:not(.active) > a i,
+.sidebar .nav li:hover:not(.active) > a p {
+  color: #fff;
 }
 
-.sidebar .nav li>a:hover {
-    background: #ff939314;
-    transform: translateY(-2px)
+.sidebar .nav li > a:hover {
+  background: #ff939314;
+  transform: translateY(-2px);
 }
 
 .sidebar .nav p {
-    margin: 0;
-    font-weight: 600;
-    color: hsla(0, 0%, 100%, .8);
-    line-height: 30px;
-    position: relative;
-    display: block;
-    height: auto;
-    white-space: nowrap
+  margin: 0;
+  font-weight: 600;
+  color: hsla(0, 0%, 100%, 0.8);
+  line-height: 30px;
+  position: relative;
+  display: block;
+  height: auto;
+  white-space: nowrap;
 }
 
 .sidebar .nav i {
-    font-size: 20px;
-    float: left;
-    margin-right: 12px;
-    line-height: 30px;
-    width: 34px;
-    text-align: center;
-    color: hsla(0, 0%, 100%, .8);
-    position: relative
+  font-size: 20px;
+  float: left;
+  margin-right: 12px;
+  line-height: 30px;
+  width: 34px;
+  text-align: center;
+  color: hsla(0, 0%, 100%, 0.8);
+  position: relative;
 }
 
 .sidebar .logo {
-    position: relative;
-    padding: .5rem .7rem;
-    z-index: 4;
-    background: hsl(var(--main),37%,50%);
+  position: relative;
+  padding: 0.5rem 0.7rem;
+  z-index: 4;
+  background: hsl(var(--main), 37%, 50%);
 }
 
 .sidebar .logo a.logo-normal {
-    display: block;
-    opacity: 1;
-    -webkit-transform: translateZ(0);
-    transform: translateZ(0)
+  display: block;
+  opacity: 1;
+  -webkit-transform: translateZ(0);
+  transform: translateZ(0);
 }
 
 .sidebar .logo p {
-    float: left;
-    font-size: 20px;
-    margin: 10px 10px;
-    color: #fff;
-    line-height: 20px;
-    font-family: Helvetica Neue, Helvetica, Arial, sans-serif
+  float: left;
+  font-size: 20px;
+  margin: 10px 10px;
+  color: #fff;
+  line-height: 20px;
+  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
 }
 
 .sidebar .logo .simple-text {
-    text-transform: uppercase;
-    padding: .5rem 0;
-    display: block;
-    white-space: nowrap;
-    color: #fff;
-    text-decoration: none;
-    font-weight: 500;
-    line-height: 30px;
-    overflow: hidden;
-    text-align: center
+  text-transform: uppercase;
+  padding: 0.5rem 0;
+  display: block;
+  white-space: nowrap;
+  color: #fff;
+  text-decoration: none;
+  font-weight: 500;
+  line-height: 30px;
+  overflow: hidden;
+  text-align: center;
 }
 
 .sidebar .user {
-    padding-bottom: 20px;
-    margin: 20px auto 0;
-    position: relative
+  padding-bottom: 20px;
+  margin: 20px auto 0;
+  position: relative;
 }
 
 .sidebar .user:after {
-    content: "";
-    position: absolute;
-    bottom: 0;
-    right: 15px;
-    height: 1px;
-    width: calc(100% - 30px);
-    background: hsla(0, 0%, 100%, .5)
+  content: "";
+  position: absolute;
+  bottom: 0;
+  right: 15px;
+  height: 1px;
+  width: calc(100% - 30px);
+  background: hsla(0, 0%, 100%, 0.5);
 }
 
 .sidebar .user a {
-    color: #fff;
-    text-decoration: none;
-    padding: .5rem 15px;
-    white-space: nowrap
+  color: #fff;
+  text-decoration: none;
+  padding: 0.5rem 15px;
+  white-space: nowrap;
 }
 
 .footer {
-    margin-top: 0
+  margin-top: 0;
 }
 
 .content:not(:last-child) {
-    margin: 0
+  margin: 0;
 }
 
 .admin-con {
-    flex-grow: 1;
-    margin-top: 50px !important;
+  flex-grow: 1;
+  margin-top: 50px !important;
 }
 
 li {
-    list-style-type: none;
-    margin: 0;
-    padding: 0
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
 }
 
 .nav-link .icon {
-    font-size: 16px;
-    padding-right: 18px
+  font-size: 16px;
+  padding-right: 18px;
 }
 
 .nav-link .name {
-    font-size: 14px;
-    font-weight: 500
+  font-size: 14px;
+  font-weight: 500;
 }
 
 .column {
-    padding: 24px 26px
+  padding: 24px 26px;
 }
 
 .content h2 {
-    margin-bottom: .2em
+  margin-bottom: 0.2em;
 }
 
 .section-lead {
-    color: #b5b5b5
+  color: #b5b5b5;
 }
 
 .section {
-    padding: 1rem 0
+  padding: 1rem 0;
 }
 
 .is-avatar {
-    width: 5%;
-    flex: inherit;
-    margin-right: 20px;
-    border-radius: 12px
+  width: 5%;
+  flex: inherit;
+  margin-right: 20px;
+  border-radius: 12px;
 }
 
 .header-avatar {
-    border-radius: 12px
+  border-radius: 12px;
 }
 
 .card {
-    border-radius: 0.5em;
-    color: #fff;
-    padding: 10px;
-    position: relative;
-    border: 0;
-    background: hsl(var(--main),15%,25%);
+  border-radius: 0.5em;
+  color: #fff;
+  padding: 10px;
+  position: relative;
+  border: 0;
+  background: hsl(var(--main), 15%, 25%);
 }
 
 .card .stat {
-    border-top: 1px solid rgba(255, 255, 255, .3);
-    font-size: 0.5em;
-    margin-top: 6px;
-    padding: 10px 10px 0;
-    text-transform: uppercase
+  border-top: 1px solid rgba(255, 255, 255, 0.3);
+  font-size: 0.5em;
+  margin-top: 6px;
+  padding: 10px 10px 0;
+  text-transform: uppercase;
 }
 
 .card .title {
-    display: inline-block;
-    font-size: 0.5em;
-    padding: 10px 10px 0;
-    text-transform: uppercase
+  display: inline-block;
+  font-size: 0.5em;
+  padding: 10px 10px 0;
+  text-transform: uppercase;
 }
 
 .card .value {
-    font-size: 28px;
-    padding: 0 10px
+  font-size: 28px;
+  padding: 0 10px;
 }
 
 .recent-beat {
-    margin-top: 20px
+  margin-top: 20px;
 }
 
 .recent-beat .section-title {
-    font-size: 20px
+  font-size: 20px;
 }
 
 .title:not(:last-child) {
-    margin-bottom: 0
+  margin-bottom: 0;
 }
 
 .user-block {
-    transition: .2s ease
+  transition: 0.2s ease;
 }
 
 .user-block {
-    display: flex;
-    border-radius: 0.5em;
-    padding: 12px;
-    font-weight: 700;
-    line-height: 1.3;
-    align-items: center;
-    overflow: hidden;
-    height: 76px;
-    margin-top: 0.5em
+  display: flex;
+  border-radius: 0.5em;
+  padding: 12px;
+  font-weight: 700;
+  line-height: 1.3;
+  align-items: center;
+  overflow: hidden;
+  height: 76px;
+  margin-top: 0.5em;
 }
 
 .user-block {
-    background-color: #413030;
-    color: #fff
+  background-color: #413030;
+  color: #fff;
 }
 
 .user-block:hover {
-    box-shadow: 0 0 1px rgba(0, 0, 0, .04), 0 4px 0.5em rgba(0, 0, 0, .04), 0 16px 24px rgba(0, 0, 0, .04), 0 24px 32px rgba(0, 0, 0, .04);
-    color: #fff;
-    transform: translateY(-5px)
+  box-shadow: 0 0 1px rgba(0, 0, 0, 0.04), 0 4px 0.5em rgba(0, 0, 0, 0.04),
+    0 16px 24px rgba(0, 0, 0, 0.04), 0 24px 32px rgba(0, 0, 0, 0.04);
+  color: #fff;
+  transform: translateY(-2px);
 }
 
 .avatar-picture {
-    width: 58px;
-    border-radius: 6px;
-    margin-right: 0.5em
+  width: 58px;
+  border-radius: 6px;
+  margin-right: 0.5em;
 }
 
 .profile-flag {
-    width: 18px
+  width: 18px;
 }
 
 .unverified {
-    background: #3c3c3c
+  background: #3c3c3c;
 }
 
 .unverified .target-button {
-    background: #4c4a4a!important
+  background: #4c4a4a !important;
 }
 
-.user-artist, .user-mapper, .user-title {
-    text-overflow: ellipsis;
-    overflow: hidden;
-    white-space: nowrap;
-    font-size: 12
+.user-artist,
+.user-mapper,
+.user-title {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+  font-size: 12;
 }
 
 .user-artist {
-    font-size: 11px;
-    font-weight: 500
+  font-size: 11px;
+  font-weight: 500;
 }
 
 .user-footer {
-    display: flex;
-    justify-content: space-between;
-    align-items: baseline;
-    margin-top: 0.5em;
-    font-size: 16px;
-    font-weight: 600;
-    color: #fff;
-    white-space: nowrap
+  display: flex;
+  justify-content: space-between;
+  align-items: baseline;
+  margin-top: 0.5em;
+  font-size: 16px;
+  font-weight: 600;
+  color: #fff;
+  white-space: nowrap;
 }
 
 .user-footer .target-button {
-    background-color: #5d4343;
-    border-radius: 6px;
-    padding: 4.5px 7px;
-    font-size: 12px;
-    margin-left: 10px;
-    transition: .2s background-color;
-    color: #ff679b
+  background-color: #5d4343;
+  border-radius: 6px;
+  padding: 4.5px 7px;
+  font-size: 12px;
+  margin-left: 10px;
+  transition: 0.2s background-color;
+  color: #ff679b;
 }
 
 .user-stats {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    min-width: 0
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+.user-stats:hover .target-button {
+  opacity: 1;
+}
+
+.user-stats .target-button {
+  opacity: 0;
+  transition: all ease-in-out 0.1s;
 }
 
 .user-link {
-    width: 400px;
-    overflow: hidden
+  width: 400px;
+  overflow: hidden;
 }
 
 span.user-mapper {
-    padding-right: 0.5em
+  padding-right: 0.5em;
 }
 
 .d-flex.align-items-baseline {
-    display: flex
+  display: flex;
 }
 
 .extra-block {
-    width: 100%;
-    display: flex;
-    justify-content: center
+  width: 100%;
+  display: flex;
+  justify-content: center;
 }
 
 .map-single {
-    height: 76px;
-    min-width: 0;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    padding-right: 0;
-    margin: 0.5em 0 0 0;
-    padding: 0.5em;
-    border-radius: 0.5em;
-    overflow: hidden;
-    background: #413030;
-    transition: .2s ease;
-    cursor: pointer
+  height: 76px;
+  min-width: 0;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  padding-right: 0;
+  margin: 0.5em 0 0 0;
+  padding: 0.5em;
+  border-radius: 0.5em;
+  overflow: hidden;
+  background: #413030;
+  transition: 0.2s ease;
+  cursor: pointer;
 }
 
 .map-single:hover {
-    border-radius: 0.5em;
-    transform: translateY(-5px);
-    box-shadow: 0 0 1px rgba(0, 0, 0, .04), 0 4px 0.5em rgba(0, 0, 0, .04), 0 16px 24px rgba(0, 0, 0, .04), 0 24px 32px rgba(0, 0, 0, .04)
+  border-radius: 0.5em;
+  transform: translateY(-2px);
+  box-shadow: 0 0 1px rgba(0, 0, 0, 0.04), 0 4px 0.5em rgba(0, 0, 0, 0.04),
+    0 16px 24px rgba(0, 0, 0, 0.04), 0 24px 32px rgba(0, 0, 0, 0.04);
 }
 
 .map-content1 {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    height: 100%;
-    min-width: 0;
-    flex: 1
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  height: 100%;
+  min-width: 0;
+  flex: 1;
 }
 
 .map-title {
-    font-size: 14px;
-    display: flex;
-    font-weight: 500;
-    align-items: center;
-    white-space: nowrap
+  font-size: 14px;
+  display: flex;
+  font-weight: 500;
+  align-items: center;
+  white-space: nowrap;
 }
 
 .map-title-block {
-    display: flex;
-    flex-direction: column;
-    line-height: 1;
-    margin-left: 6px;
-    min-width: 0;
-    padding-right: 12px;
-    flex: 2
+  display: flex;
+  flex-direction: column;
+  line-height: 1;
+  margin-left: 6px;
+  min-width: 0;
+  padding-right: 12px;
+  flex: 2;
 }
 
 .map-date {
-    font-size: 10px;
-    font-weight: 500;
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-start
+  font-size: 10px;
+  font-weight: 500;
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
 }
 
-.map-date>time {
-    margin-top: 2px
+.map-date > time {
+  margin-top: 2px;
 }
 
 .map-content2 {
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    line-height: 1.2;
-    align-items: flex-end;
-    justify-content: center
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  line-height: 1.2;
+  align-items: flex-end;
+  justify-content: center;
 }
 
 .map-pp {
-    font-weight: 700;
-    color: #cc5288;
-    font-size: 20px
+  font-weight: 700;
+  color: #cc5288;
+  font-size: 20px;
 }
 
 .map-acc {
-    font-size: 12px;
-    display: flex;
-    justify-content: flex-end
+  font-size: 12px;
+  display: flex;
+  justify-content: flex-end;
 }
 
 .main-stats {
-    display: flex;
-    flex-direction: column;
-    color: #fff;
-    height: 100%;
-    justify-content: space-between
+  display: flex;
+  flex-direction: column;
+  color: #fff;
+  height: 100%;
+  justify-content: space-between;
 }
 
 .rank-single {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    line-height: 1
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  line-height: 1;
 }
 
 .rank-block {
-    margin: auto 0
+  margin: auto 0;
 }
 
 .score-details_right-block {
-    display: flex;
-    flex-direction: row;
-    align-items: flex-end;
-    height: 100%;
-    min-width: 140px;
-    justify-content: center;
-    padding-right: 14px;
-    padding-left: 20px;
-    position: relative;
-    border-radius: 0 10px 10px 0;
-    z-index: 0;
-    margin-left: 6px;
-    align-items: center
+  display: flex;
+  flex-direction: row;
+  align-items: flex-end;
+  height: 100%;
+  min-width: 140px;
+  justify-content: center;
+  padding-right: 14px;
+  padding-left: 20px;
+  position: relative;
+  border-radius: 0 10px 10px 0;
+  z-index: 0;
+  margin-left: 6px;
+  align-items: center;
 }
 
 .score-details_pp-block {
-    display: flex;
-    flex-direction: column;
-    align-items: flex-end;
-    height: 100%;
-    justify-content: center;
-    position: relative;
-    border-radius: 0 10px 10px 0;
-    z-index: 0;
-    margin-left: 6px;
-    margin-right: 12px
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  height: 100%;
+  justify-content: center;
+  position: relative;
+  border-radius: 0 10px 10px 0;
+  z-index: 0;
+  margin-left: 6px;
+  margin-right: 12px;
 }
 
 .score-details {
-    height: 100%;
-    align-items: flex-end
+  height: 100%;
+  align-items: flex-end;
 }
 
 .score-details_grade-block .rank-single {
-    margin: 0
+  margin: 0;
 }
 
 .score-details_grade-block .map-rank {
-    font-size: 32px
+  font-size: 32px;
 }
 
 .map-image-picture {
-    width: 64px;
-    height: 45px;
-    border-radius: 6px;
-    object-fit: cover
-}
\ No newline at end of file
+  width: 64px;
+  height: 45px;
+  border-radius: 6px;
+  object-fit: cover;
+}
+
+.user-block,
+.map-single {
+  border: 1px solid rgba(255, 255, 255, 0);
+}
+
+.user-block:hover,
+.map-single:hover {
+  border: 1px solid rgba(255, 255, 255, .2);
+}
diff --git a/static/css/pages/profile.css b/static/css/pages/profile.css
index 92888e67..b9c80f3b 100644
--- a/static/css/pages/profile.css
+++ b/static/css/pages/profile.css
@@ -18,6 +18,8 @@
   transition: 0.2s ease;
   margin-bottom: 12px;
 }
+
+
 .extra-block {
   width: 100%;
   display: flex;
@@ -25,7 +27,8 @@
   background: hsl(var(--main), 20%, 20%);
 }
 
-.stats-block, .extra-block
+.stats-block,
+.log-block > *:last-child
 {
   border-radius: 0 0 0.5em 0.5em;
 }
@@ -767,3 +770,13 @@ span.beatmap-mapper {
 .pop-enter, .pop-leave-to {
   transform: scale(0.8);
 }
+
+.beatmap-block,
+.map-single {
+  border: 1px solid rgba(255, 255, 255, 0);
+}
+
+.beatmap-block:hover,
+.map-single:hover {
+  border: 1px solid rgba(255, 255, 255, 0.2);
+}
diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index a5a54380..5dde4c30 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -7,10 +7,7 @@ window.addEventListener('load', () => {
   }
 
   // eslint-disable-next-line no-undef
-  _testGlobals(
-    { exists: ['mode', 'mods', 'userid', 'domain'] },
-    s
-  )
+  _testGlobals({ exists: ['mode', 'mods', 'userid', 'domain'] }, s)
   // eslint-disable-next-line no-new, no-undef
   new Vue({
     el: '#app',
@@ -18,6 +15,15 @@ window.addEventListener('load', () => {
     data () {
       return {
         loop: undefined,
+        fetchMoreIncremental: {
+          score: 20,
+          map: 20
+        },
+        cap: {
+          best: 100,
+          recent: 100,
+          most: 100
+        },
         data: {
           stats: {
             out: [{}],
@@ -47,7 +53,7 @@ window.addEventListener('load', () => {
               out: [],
               load: true,
               more: {
-                limit: 5,
+                limit: 10,
                 full: true
               }
             }
@@ -115,7 +121,7 @@ window.addEventListener('load', () => {
               r += 'NC'
               hasNightcore = true
             }
-            if (!hasNightcore && (m & DoubleTime)) {
+            if (!hasNightcore && m & DoubleTime) {
               r += 'DT'
             }
             if (m & Relax) {
@@ -192,7 +198,7 @@ window.addEventListener('load', () => {
     },
     computed: {},
     created () {
-    // starting a page
+      // starting a page
       this.modegulag = this.StrtoGulagInt()
       this.LoadProfileData()
       this.LoadAllofdata({ animation: false })
@@ -206,63 +212,76 @@ window.addEventListener('load', () => {
       },
       LoadProfileData () {
         this.$set(this.data.stats, 'load', true)
-        this.$axios.get(`//api.${s.domain}/get_player_info`, {
-          params: {
-            id: this.userid,
-            scope: 'all'
-          }
-        })
-          .then(res => {
+        this.$axios
+          .get(`//api.${s.domain}/get_player_info`, {
+            params: {
+              id: this.userid,
+              scope: 'all'
+            }
+          })
+          .then((res) => {
             this.$set(this.data.stats, 'out', res.data.player.stats)
             this.data.stats.load = false
           })
       },
       async LoadScores (sort, { animation = true } = {}) {
         this.$set(this.data.scores[`${sort}`], 'load', true)
-        await this.$axios.get(`//api.${s.domain}/get_player_scores`, {
-          params: {
-            id: this.userid,
-            mode: this.StrtoGulagInt(),
-            scope: sort,
-            limit: this.data.scores[`${sort}`].more.limit
-          }
-        })
-          .then(res => {
+        await this.$axios
+          .get(`//api.${s.domain}/get_player_scores`, {
+            params: {
+              id: this.userid,
+              mode: this.StrtoGulagInt(),
+              scope: sort,
+              limit: this.data.scores[`${sort}`].more.limit
+            }
+          })
+          .then((res) => {
             this.data.scores[`${sort}`].out = res.data.scores
-            // eslint-disable-next-line eqeqeq
-            this.data.scores[`${sort}`].more.full = this.data.scores[`${sort}`].out.length != this.data.scores[`${sort}`].more.limit
+            this.data.scores[`${sort}`].more.full =
+            (this.data.scores[`${sort}`].out.length !== this.data.scores[`${sort}`].more.limit ||
+              this.data.scores[`${sort}`].out.length >= this.cap[sort]
+            )
           })
-        const toShow = (this.$refs.scores && this.$refs.scores.filter(el => !el.classList.contains('show'))) || []
+        const toShow =
+          (this.$refs.scores &&
+            this.$refs.scores.filter((el) => !el.classList.contains('show'))) ||
+          []
         // animation
         if (!animation) {
-          toShow.forEach(el => el.classList.add('show'))
+          toShow.forEach((el) => el.classList.add('show'))
           this.data.scores[`${sort}`].load = false
         } else {
           this.data.scores[`${sort}`].load = false
           toShow.forEach((el, index) => {
             setTimeout(() => {
               el.classList.add('show')
-            }, index * 30)
+            }, index * 25)
           })
         }
       },
       async LoadMostBeatmaps ({ animation = true } = {}) {
         this.$set(this.data.maps.most, 'load', true)
-        await this.$axios.get(`//api.${s.domain}/get_player_most_played`, {
-          params: {
-            id: this.userid,
-            mode: this.StrtoGulagInt(),
-            limit: this.data.maps.most.more.limit
-          }
-        })
-          .then(res => {
+        await this.$axios
+          .get(`//api.${s.domain}/get_player_most_played`, {
+            params: {
+              id: this.userid,
+              mode: this.StrtoGulagInt(),
+              limit: this.data.maps.most.more.limit
+            }
+          })
+          .then((res) => {
             this.data.maps.most.out = res.data.maps
             this.data.maps.most.more.full = this.data.maps.most.out.length !== this.data.maps.most.more.limit
           })
-        const toShow = (this.$refs.mostPlayed && this.$refs.mostPlayed.filter(el => !el.classList.contains('show'))) || []
+        const toShow =
+          (this.$refs.mostPlayed &&
+            this.$refs.mostPlayed.filter(
+              (el) => !el.classList.contains('show')
+            )) ||
+          []
         // animation
         if (!animation) {
-          toShow.forEach(el => el.classList.add('show'))
+          toShow.forEach((el) => el.classList.add('show'))
           this.data.maps.most.load = false
         } else {
           this.data.maps.most.load = false
@@ -274,12 +293,13 @@ window.addEventListener('load', () => {
         }
       },
       LoadUserStatus () {
-        this.$axios.get(`//api.${s.domain}/get_player_status`, {
-          params: {
-            id: this.userid
-          }
-        })
-          .then(res => {
+        this.$axios
+          .get(`//api.${s.domain}/get_player_status`, {
+            params: {
+              id: this.userid
+            }
+          })
+          .then((res) => {
             this.$set(this.data, 'status', res.data.player_status)
           })
           .catch(function (error) {
@@ -289,7 +309,9 @@ window.addEventListener('load', () => {
         this.loop = setTimeout(this.LoadUserStatus, 5000)
       },
       ChangeModeMods (mode, mods) {
-        if (s.event) { s.event.preventDefault() }
+        if (s.event) {
+          s.event.preventDefault()
+        }
 
         this.mode = mode
         this.mods = mods
@@ -301,16 +323,21 @@ window.addEventListener('load', () => {
         this.LoadAllofdata()
       },
       AddLimit (which) {
-        if (s.event) { s.event.preventDefault() }
+        if (s.event) {
+          s.event.preventDefault()
+        }
 
         if (which === 'bestscore') {
-          this.data.scores.best.more.limit += 5
+          this.data.scores.best.more.limit += this.fetchMoreIncremental.score
+          if (this.data.scores.best.more.limit >= this.cap.best) { this.data.scores.best.more.limit = this.cap.best }
           this.LoadScores('best')
         } else if (which === 'recentscore') {
-          this.data.scores.recent.more.limit += 5
+          this.data.scores.recent.more.limit += this.fetchMoreIncremental.score
+          if (this.data.scores.recent.more.limit >= this.cap.best) { this.data.recent.best.more.limit = this.cap.best }
           this.LoadScores('recent')
         } else if (which === 'mostplay') {
-          this.data.maps.most.more.limit += 4
+          this.data.maps.most.more.limit += this.fetchMoreIncremental.map
+          if (this.data.maps.most.more.limit >= this.cap.best) { this.data.maps.most.more.limit = this.cap.best }
           this.LoadMostBeatmaps()
         }
       },
@@ -360,8 +387,8 @@ window.addEventListener('load', () => {
       secondsToDhm (seconds) {
         seconds = Number(seconds)
         const dDisplay = `${Math.floor(seconds / (3600 * 24))}d `
-        const hDisplay = `${Math.floor(seconds % (3600 * 24) / 3600)}h `
-        const mDisplay = `${Math.floor(seconds % 3600 / 60)}m `
+        const hDisplay = `${Math.floor((seconds % (3600 * 24)) / 3600)}h `
+        const mDisplay = `${Math.floor((seconds % 3600) / 60)}m `
         return dDisplay + hDisplay + mDisplay
       },
       StrtoGulagInt () {
diff --git a/templates/admin/home.html b/templates/admin/home.html
index 3b079606..96e9d794 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -83,10 +83,6 @@ <h2 class="section-title">{{ t('admin.home.recent-users') }}</h2>
                                 (datetime.datetime.now() + datetime.timedelta(seconds = 60 * 3.4))) }}
                             </span>
                             <div class="d-flex align-items-baseline">
-                                <span>
-                                {{ timeago.format((datetime.datetime.fromtimestamp(user.latest_activity)),
-                                    (datetime.datetime.now() + datetime.timedelta(seconds = 60 * 3.4))) }}
-                                </span>
                                 <div class="target-button newmaps-color">
                                     <i class="fa fa-arrow-right"></i>
                                 </div>
diff --git a/templates/profile.html b/templates/profile.html
index 8cd21fa4..aa2d065a 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -137,7 +137,7 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
             </div>
         </div>
     </div>
-    <div v-if="data.maps.{{ id }}.more.full == false" class="extra-block">
+    <div v-show="data.maps.{{ id }}.more.full == false" class="extra-block">
         <a class="show-button rounded-sm" @click="AddLimit('mostplay')">{{ t('profile.show-more') }}</a>
     </div>
 </div>
@@ -152,7 +152,7 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
 <script>
     window.addEventListener('load', () => {
         window._state = createState({
-            userid: {{ user['id'] | JSON }}
+            userid: {{ user['id'] | JSON }},
             mode: {{ mode | JSON }},
             mods: {{ mods | JSON }},
             domain: {{ domain() | JSON }}

From 4c294543b57468075f736abf7f69e2567e5f13f2 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 3 Sep 2022 17:49:09 +0000
Subject: [PATCH 254/278] full responsive

---
 templates/admin/base.html         | 190 +++++++++++++++++++-----------
 templates/admin/restrictions.html | 130 ++++++++++----------
 2 files changed, 183 insertions(+), 137 deletions(-)

diff --git a/templates/admin/base.html b/templates/admin/base.html
index c6ea4dae..e0f16a1d 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -1,86 +1,136 @@
 <html>
+  <head>
+    <!-- injection check -->
+    <script src="/static/js/_runtime-check.js"></script>
+    <!-- title -->
+    <title>
+      {{ appName() }} - {{ t('admin.base.admin') }} - {% block title %}{%
+      endblock %}
+    </title>
 
-<head>
-  <!-- injection check -->
-  <script src="/static/js/_runtime-check.js"></script>
-  <!-- title -->
-  <title>{{ appName() }} - {{ t('admin.base.admin') }} - {% block title %}{% endblock %}</title>
+    <!-- favicon -->
+    <link
+      rel="apple-touch-icon"
+      sizes="180x180"
+      href="/static/favicon/apple-touch-icon.png"
+    />
+    <link
+      rel="icon"
+      type="image/png"
+      sizes="32x32"
+      href="/static/favicon/favicon-32x32.png"
+    />
+    <link
+      rel="icon"
+      type="image/png"
+      sizes="16x16"
+      href="/static/favicon/favicon-16x16.png"
+    />
+    <link rel="manifest" href="/static/favicon/site.webmanifest" />
+    <link
+      rel="mask-icon"
+      href="/static/favicon/safari-pinned-tab.svg"
+      color="#d55b9e"
+    />
+    <link rel="shortcut icon" href="/static/favicon/favicon.ico" />
+    <meta name="msapplication-TileColor" content="#000000" />
+    <meta
+      name="msapplication-config"
+      content="/static/favicon/browserconfig.xml"
+    />
+    <meta name="theme-color" content="#000000" />
 
-  <!-- favicon -->
-  <link rel="apple-touch-icon" sizes="180x180" href="/static/favicon/apple-touch-icon.png">
-  <link rel="icon" type="image/png" sizes="32x32" href="/static/favicon/favicon-32x32.png">
-  <link rel="icon" type="image/png" sizes="16x16" href="/static/favicon/favicon-16x16.png">
-  <link rel="manifest" href="/static/favicon/site.webmanifest">
-  <link rel="mask-icon" href="/static/favicon/safari-pinned-tab.svg" color="#d55b9e">
-  <link rel="shortcut icon" href="/static/favicon/favicon.ico">
-  <meta name="msapplication-TileColor" content="#000000">
-  <meta name="msapplication-config" content="/static/favicon/browserconfig.xml">
-  <meta name="theme-color" content="#000000">
+    <!-- metadata -->
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
 
-  <!-- metadata -->
-  <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- jquery -->
+    <script src="/static/js/assets/jquery-min.js"></script>
 
-  <!-- jquery -->
-  <script src="/static/js/assets/jquery-min.js"></script>
+    <!-- bulma -->
+    <link rel="stylesheet" href="/static/css/bulma.css?v={{ appVersion() }} " />
 
-  <!-- bulma -->
-  <link rel="stylesheet" href="/static/css/bulma.css?v={{ appVersion() }} " />
+    <!-- font awesome -->
+    <link
+      rel="stylesheet"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
+    />
 
-  <!-- font awesome -->
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
+    <!-- custom style -->
+    <link rel="stylesheet" href="/static/css/style.css?v={{ appVersion() }} " />
+    <link
+      rel="stylesheet"
+      href="/static/css/pages/admin/style.css?v={{ appVersion() }} "
+    />
 
-  <!-- custom style -->
-  <link rel="stylesheet" href="/static/css/style.css?v={{ appVersion() }} ">
-  <link rel="stylesheet" href="/static/css/pages/admin/style.css?v={{ appVersion() }} ">
+    {% block header %} {% endblock %}
+  </head>
 
-  {% block header %}
-  {% endblock %}
-</head>
+  <body>
+    <!-- Header -->
+    {% include './components/navbar.html' %}
 
-<body>
-  <!-- Header -->
-  {% include './components/navbar.html' %}
-
-  <!-- content -->
-  <div class="content admin-con">
-    <div class="columns is-marginless is-paddingless">
-      {# <div class="colmun">
-        <div class="sidebar">
-          <div id="style-3" class="sidebar-wrapper">
-            <div class="logo"><a class="simple-text logo-normal">{{ t('admin.base.admin-panel', appName = appName())
-                }}</a></div>
-            <ul class="nav">
-              <li class="nav-item"><a class="nav-link" href="/admin/dashboard"><span class="icon"><i
-                      class="fa fa-home"></i></span> <span class="name">{{ t('admin.base.dashboard') }}</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/users"><span class="icon"><i
-                      class="fa fa-user"></i></span> <span class="name">{{ t("admin.base.users") }}</span></a></li>
-              <li class="nav-item"><a class="nav-link" href="/admin/restrictions"><span class="icon"><i
-                      class="fa fa-ban"></i></span> <span class="name">{{ t("admin.base.restrictions") }}</span></a>
-              </li>
-              <li class="nav-item"><a class="nav-link" href="/admin/beatmaps"><span class="icon"><i
-                      class="fa fa-map"></i></span> <span class="name">{{ t("admin.base.beatmaps") }}</span></a></li>
-            </ul>
+    <!-- content -->
+    <div class="content admin-con">
+      {#
+      <div class="columns is-marginless is-paddingless">
+        <div class="colmun">
+          <div class="sidebar">
+            <div id="style-3" class="sidebar-wrapper">
+              <div class="logo">
+                <a class="simple-text logo-normal"
+                  >{{ t('admin.base.admin-panel', appName = appName()) }}</a
+                >
+              </div>
+              <ul class="nav">
+                <li class="nav-item">
+                  <a class="nav-link" href="/admin/dashboard"
+                    ><span class="icon"><i class="fa fa-home"></i></span>
+                    <span class="name">{{ t('admin.base.dashboard') }}</span></a
+                  >
+                </li>
+                <li class="nav-item">
+                  <a class="nav-link" href="/admin/users"
+                    ><span class="icon"><i class="fa fa-user"></i></span>
+                    <span class="name">{{ t("admin.base.users") }}</span></a
+                  >
+                </li>
+                <li class="nav-item">
+                  <a class="nav-link" href="/admin/restrictions"
+                    ><span class="icon"><i class="fa fa-ban"></i></span>
+                    <span class="name"
+                      >{{ t("admin.base.restrictions") }}</span
+                    ></a
+                  >
+                </li>
+                <li class="nav-item">
+                  <a class="nav-link" href="/admin/beatmaps"
+                    ><span class="icon"><i class="fa fa-map"></i></span>
+                    <span class="name">{{ t("admin.base.beatmaps") }}</span></a
+                  >
+                </li>
+              </ul>
+            </div>
           </div>
         </div>
-      </div> #}
-      <div class="column content" style="min-height: 1000px;">
-        <section class="section">
-          {% block content %}
-          {% endblock %}
-        </section>
+        <div class="column content">
+          <section class="section"></section>
+        </div>
       </div>
+      #}
+      <section class="section m-4">{% block content %} {% endblock %}</section>
     </div>
-  </div>
 
-  <!-- footer -->
-  <footer class="footer">
-    <div class="content">
-      <span>{{ appName() }} <strong>v{{ appVersion() }}</strong></span>
-    </div>
-  </footer>
-
-  <!-- main js script -->
-  <script src="/static/js/main.js?v={{ appVersion() }} " crossorigin="anonymous"></script>
-</body>
+    <!-- footer -->
+    <footer class="footer">
+      <div class="content">
+        <span>{{ appName() }} <strong>v{{ appVersion() }}</strong></span>
+      </div>
+    </footer>
 
-</html>
\ No newline at end of file
+    <!-- main js script -->
+    <script
+      src="/static/js/main.js?v={{ appVersion() }} "
+      crossorigin="anonymous"
+    ></script>
+  </body>
+</html>
diff --git a/templates/admin/restrictions.html b/templates/admin/restrictions.html
index 714ce8d4..2eb86a71 100644
--- a/templates/admin/restrictions.html
+++ b/templates/admin/restrictions.html
@@ -1,73 +1,69 @@
-{% extends 'admin/base.html' %}
-{% block header %}
+{% extends 'admin/base.html' %} {% block header %}
 <style>
-    .text-nowrap {
-        white-space: nowrap;
-    }
-    .rounded {
-        border-radius: 0.5rem;
-    }
-    .d-flex {
-        display: flex;
-    }
-    .gap-2 {
-        grid-gap: 1em 1em;
-    }
+  .text-nowrap {
+    white-space: nowrap;
+  }
+  .rounded {
+    border-radius: 0.5rem;
+  }
+  .d-flex {
+    display: flex;
+  }
+  .gap-2 {
+    grid-gap: 1em 1em;
+  }
 </style>
-{% endblock %}
-{% block title %} Restrictions {% endblock %}
-
-{% block content %}
+{% endblock %} {% block title %} Restrictions {% endblock %} {% block content %}
 <div class="columns is-marginless">
-    <div class="column is-paddingless flex-vcenter">
-      <h2 class="section-title">{{ t("admin.base.restrictions") }}</h2>
-      <p class="section-lead">{{ t("admin.restrictions.welcome-to-restrictions-panel") }}</p>
-    </div>
+  <div class="column is-paddingless flex-vcenter">
+    <h2 class="section-title">{{ t("admin.base.restrictions") }}</h2>
+    <p class="section-lead">
+      {{ t("admin.restrictions.welcome-to-restrictions-panel") }}
+    </p>
+  </div>
 </div>
-<div class="row row-deck row-cards" style="margin-top: 20px">
-    <div class="col-12">
-        <!-- <div class="card"> -->
-            <div class="table-responsive">
-                <table class="table table-vcenter text-nowrap datatable rounded">
-                    <thead>
-                        <tr>
-                            <th class="has-text-right">{{ t("admin.users.id") }}</th>
-                            <th>{{ t("admin.users.flag-or-username") }}</th>
-                            <th class="has-text-centered">{{ t("admin.restrictions.details") }}</th>
-                            <th class="has-text-centered">{{ t("admin.restrictions.date") }}</th>
-                            <th class="has-text-centered">{{ t("admin.restrictions.action") }}</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        {% for i in query_data %}
-                        <tr>
-                            <td class="has-text-right">{{ i.id }}</td>
-                            <td class="td-truncate text-nowrap">
-                                <img src="/static/images/flags/{{ i.country|upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">
-                                <a class='ml-2' href="/u/{{ i.id }}">{{ i.name }}</a>
-                            </td>
-                            <td>
-                                {% if i.msg %}{{ i.msg }}
-                                {% else %} -
-                                {% endif %}
-                            </td>
-                            <td class="has-text-centered">
-                                {% if i.time %}{{ i.time }}
-                                {% else %} -
-                                {% endif %}
-                            </td>
-                            <td>
-                                <a class="btn text-nowrap" href="/admin/user/{{ i.id }}/edit">
-                                    <i class="far fa-edit" aria-hidden="true"></i> {{ t("admin.users.edit") }}
-                                </a>
-                            </td>
-                        </tr>
-                        {% endfor %}
-                    </tbody>
-                </table>
-            </div>
-        <!-- </div> -->
-    </div>
+<div class="table-responsive pt-4">
+  <table class="table table-vcenter text-nowrap datatable rounded">
+    <thead>
+      <tr>
+        <th class="has-text-right">{{ t("admin.users.id") }}</th>
+        <th>{{ t("admin.users.flag-or-username") }}</th>
+        <th class="has-text-centered">{{ t("admin.restrictions.details") }}</th>
+        <th class="has-text-centered">{{ t("admin.restrictions.date") }}</th>
+        <th class="has-text-centered">{{ t("admin.restrictions.action") }}</th>
+      </tr>
+    </thead>
+    <tbody>
+      {% for i in query_data %}
+      <tr>
+        <td class="has-text-right">{{ i.id }}</td>
+        <td class="td-truncate text-nowrap">
+          <img
+            src="/static/images/flags/{{ i.country|upper }}.png"
+            class="profile-flag"
+            style="
+              width: 25px;
+              height: 17px;
+              -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.63);
+              box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);
+            "
+          />
+          <a class="ml-2" href="/u/{{ i.id }}">{{ i.name }}</a>
+        </td>
+        <td>{% if i.msg %}{{ i.msg }} {% else %} - {% endif %}</td>
+        <td class="has-text-centered">
+          {% if i.time %}{{ i.time }} {% else %} - {% endif %}
+        </td>
+        <td>
+          <a class="btn text-nowrap" href="/admin/user/{{ i.id }}/edit">
+            <i class="far fa-edit" aria-hidden="true"></i> {{
+            t("admin.users.edit") }}
+          </a>
+        </td>
+      </tr>
+      {% endfor %}
+    </tbody>
+  </table>
 </div>
 
-{% endblock %}
\ No newline at end of file
+{% endblock %}

From 6273eada345c6c8c66dff22c87f5ac61443d2529 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 3 Sep 2022 17:50:08 +0000
Subject: [PATCH 255/278] todo: delete old tags

---
 templates/admin/base.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/admin/base.html b/templates/admin/base.html
index e0f16a1d..fc87b760 100644
--- a/templates/admin/base.html
+++ b/templates/admin/base.html
@@ -113,7 +113,7 @@
           </div>
         </div>
         <div class="column content">
-          <section class="section"></section>
+          <section class="section">/* block content */</section>
         </div>
       </div>
       #}

From e43ee2a25306699da068d9a7e92ff581897e917a Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 3 Sep 2022 17:51:40 +0000
Subject: [PATCH 256/278] responsive design

---
 templates/admin/home.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/templates/admin/home.html b/templates/admin/home.html
index 96e9d794..6de69609 100644
--- a/templates/admin/home.html
+++ b/templates/admin/home.html
@@ -61,7 +61,7 @@ <h2 class="section-title">{{ t('admin.base.dashboard') }}</h2>
     </div>
 <div class="columns is-marginless is-paddingless">
     {% if recentusers %}
-    <div class="column is-paddingless mr-1 is-3">
+    <div class="column is-paddingless m-1 is-3">
         <div class="recent-beat">
             <div class="columns is-marginless">
                 <div class="column is-paddingless flex-vcenter">
@@ -96,7 +96,7 @@ <h2 class="section-title">{{ t('admin.home.recent-users') }}</h2>
     </div>
     {% endif %}
     {% if recentscores %}
-    <div class="column is-paddingless ml-1">
+    <div class="column is-paddingless m-1">
         <div class="recent-beat">
             <div class="columns is-marginless">
                 <div class="column is-paddingless flex-vcenter">

From 67c79fc7d34308d67845cfc247b92fd173412817 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 3 Sep 2022 17:59:07 +0000
Subject: [PATCH 257/278] fix api call breaking page

---
 static/js/pages/profile.js |   2 +-
 templates/profile.html     | 898 ++++++++++++++++++++-----------------
 2 files changed, 478 insertions(+), 422 deletions(-)

diff --git a/static/js/pages/profile.js b/static/js/pages/profile.js
index 5dde4c30..bbc0fc0d 100644
--- a/static/js/pages/profile.js
+++ b/static/js/pages/profile.js
@@ -26,7 +26,7 @@ window.addEventListener('load', () => {
         },
         data: {
           stats: {
-            out: [{}],
+            out: [],
             load: true
           },
           grades: {},
diff --git a/templates/profile.html b/templates/profile.html
index aa2d065a..941d73f2 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -1,335 +1,374 @@
-{% extends 'base.html' %}
-{% block title %} {{ t('global.profile') }} {% endblock %}
-
-{% macro userpage(user) %}
-{% if user['userpage_content'] != None and user['userpage_content'] != "" %}
+{% extends 'base.html' %} {% block title %} {{ t('global.profile') }} {%
+endblock %} {% macro userpage(user) %} {% if user['userpage_content'] != None
+and user['userpage_content'] != "" %}
 <div class="log-block">
-    <div class="header">
-        <div class="title">
-            <i class="fas fa-address-book"></i> {{ t("profile.about-me-title") }}
-        </div>
-    </div>
-    <div class="stats-block rank-block" style="padding: 12.5px;">
-        <article class="reset-bulma-style">
-            {{ render_markdown(user['userpage_content']) | safe }}
-        </article>
+  <div class="header">
+    <div class="title">
+      <i class="fas fa-address-book"></i> {{ t("profile.about-me-title") }}
     </div>
+  </div>
+  <div class="stats-block rank-block" style="padding: 12.5px">
+    <article class="reset-bulma-style">
+      {{ render_markdown(user['userpage_content']) | safe }}
+    </article>
+  </div>
 </div>
-{% endif %}
-{% endmacro %}
-
-{% macro scores(title, id) %}
+{% endif %} {% endmacro %} {% macro scores(title, id) %}
 <div class="log-block" :class="{ load : data.scores.{{ id }}.load }">
-    <div class="header">
-        <div class="title">
-            <i class="fas fa-trophy"></i> {{ title }}
+  <div class="header">
+    <div class="title"><i class="fas fa-trophy"></i> {{ title }}</div>
+  </div>
+  <div v-if="data.scores.{{ id }}.out.length" class="scores">
+    <div
+      v-for="(map, index) in data.scores.{{ id }}.out"
+      class="map-single"
+      ref="scores"
+      :key="map.beatmap.map_id"
+      :style="`background: linear-gradient(hsl(var(--main), 25%, 25%, 90%), hsl(var(--main), 25%, 25%, 90%)), url(https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/cover.jpg)`"
+    >
+      <div
+        class="map-data"
+        @click="window.open(`https://osu.ppy.sh/beatmaps/${map.beatmap.id}`) "
+      >
+        <div class="map-content1">
+          <div class="map-image">
+            <img
+              :src="`https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/card.jpg`"
+              class="map-image-picture"
+            />
+          </div>
+          <div class="map-title-block">
+            <div class="map-title">
+              <a class="beatmap-link">
+                <% map.beatmap.artist %> - <% map.beatmap.title %> [<%
+                map.beatmap.version %>]
+              </a>
+            </div>
+            <div class="play-stats">
+              <% getScoreMods(map.mods) %> /
+              <b> <% addCommas(map.max_combo) %> </b>x
+            </div>
+            <div class="map-date">
+              <time> <% timeago.format(map.play_time) %> </time>
+            </div>
+          </div>
         </div>
-    </div>
-    <div v-if="data.scores.{{ id }}.out.length" class="scores">
-        <div v-for="(map, index) in data.scores.{{ id }}.out" class="map-single" ref="scores" :key="map.beatmap.map_id"
-            :style="`background: linear-gradient(hsl(var(--main), 25%, 25%, 90%), hsl(var(--main), 25%, 25%, 90%)), url(https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/cover.jpg)`">
-            <div class="map-data" @click="window.open(`https://osu.ppy.sh/beatmaps/${map.beatmap.id}`) ">
-                <div class="map-content1">
-                    <div class="map-image">
-                        <img :src="`https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/card.jpg`"
-                            class="map-image-picture">
-                    </div>
-                    <div class="map-title-block">
-                        <div class="map-title">
-                            <a class="beatmap-link">
-                                <% map.beatmap.artist %> - <% map.beatmap.title %> [<% map.beatmap.version %>]
-                            </a>
-                        </div>
-                        <div class="play-stats">
-                            <% getScoreMods(map.mods) %> / <b>
-                                    <% addCommas(map.max_combo) %>
-                                </b>x
-                        </div>
-                        <div class="map-date">
-                            <time>
-                                <% timeago.format(map.play_time) %>
-                            </time>
-                        </div>
-                    </div>
+        <div class="map-content2">
+          <div class="score-details d-flex">
+            <div class="score-details_right-block">
+              <div class="score-details_pp-block">
+                <div class="map-pp">
+                  <% addCommas(map.pp.toFixed()) %><span class="map-pp-unit"
+                    >{{ t('global.pp') }}</span
+                  >
                 </div>
-                <div class="map-content2">
-                    <div class="score-details d-flex">
-                        <div class="score-details_right-block">
-                            <div class="score-details_pp-block">
-                                <div class="map-pp">
-                                    <% addCommas(map.pp.toFixed()) %><span class="map-pp-unit">{{ t('global.pp')
-                                            }}</span>
-                                </div>
-                                <div class="map-acc">{{ t('global.accuracy') }}:&nbsp;<b>
-                                        <% map.acc.toFixed(2) %>%
-                                    </b></div>
-                            </div>
-                            <div class="score-details_grade-block">
-                                <div class="rank-single">
-                                    <div :class="`map-rank rank-${map.grade}`">
-                                        <% map.grade.replace("X", "SS" ).replace("H", "" ) %>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
+                <div class="map-acc">
+                  {{ t('global.accuracy') }}:&nbsp;<b>
+                    <% map.acc.toFixed(2) %>%
+                  </b>
                 </div>
+              </div>
+              <div class="score-details_grade-block">
+                <div class="rank-single">
+                  <div :class="`map-rank rank-${map.grade}`">
+                    <% map.grade.replace("X", "SS" ).replace("H", "" ) %>
+                  </div>
+                </div>
+              </div>
             </div>
+          </div>
         </div>
+      </div>
     </div>
-    <div v-else-if="data.scores.{{ id }}.out.length == 0" class="stats-block">
-        <div class="columns is-marginless">
-            <div class="column is-1">
-                <h1 class="title">: (</h1>
-            </div>
-            <div class="column">
-                <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
-                <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
-            </div>
-        </div>
-    </div>
-    <div v-if="data.scores.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button rounded-sm" @click="AddLimit('{{ id }}score')">{{ t('profile.show-more') }}</a>
+  </div>
+  <div v-else-if="data.scores.{{ id }}.out.length == 0" class="stats-block">
+    <div class="columns is-marginless">
+      <div class="column is-1">
+        <h1 class="title">: (</h1>
+      </div>
+      <div class="column">
+        <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
+        <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
+      </div>
     </div>
+  </div>
+  <div v-if="data.scores.{{ id }}.more.full == false" class="extra-block">
+    <a class="show-button rounded-sm" @click="AddLimit('{{ id }}score')"
+      >{{ t('profile.show-more') }}</a
+    >
+  </div>
 </div>
-{% endmacro %}
-
-{% macro maps(title, id) %}
+{% endmacro %} {% macro maps(title, id) %}
 <div class="log-block" :class="{ load : data.maps.{{ id }}.load }">
-    <div class="header">
-        <div class="title">
-            <i class="fas fa-address-book"></i> {{ title }}
-        </div>
-    </div>
-    <div v-if="data.maps.{{ id }}.out.length" class="beatmaps">
-        <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block rounded-sm" ref="mostPlayed"
-            :key="map.id">
-            <div class="beatmap-preview"
-                :style='{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }'>
-            </div>
-            <div class="beatmap-stats"><span class="beatmap-title">
-                    <% map.title %>
-                </span> <span class="beatmap-artist">
-                    <% map.artist %>
-                </span>
-                <div class="beatmap-footer"><span class="beatmap-mapper"> {{ t('profile.by') }} <span
-                            class="newmaps-color">
-                            <% map.creator %>
-                        </span></span>
-                    <div class="d-flex align-items-baseline"><span>
-                            <% map.plays %>
-                        </span>
-                        <div class="target-button newmaps-color"><i class="fas fa-arrow-right"></i>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </a>
-    </div>
-    <div v-else-if="data.maps.{{ id }}.out.length == 0" class="stats-block">
-        <div class="columns is-marginless">
-            <div class="column is-1">
-                <h1 class="title">: (</h1>
-            </div>
-            <div class="column">
-                <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
-                <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
+  <div class="header">
+    <div class="title"><i class="fas fa-address-book"></i> {{ title }}</div>
+  </div>
+  <div v-if="data.maps.{{ id }}.out.length" class="beatmaps">
+    <a
+      v-for="(map, index) in data.maps.{{ id }}.out"
+      class="beatmap-block rounded-sm"
+      ref="mostPlayed"
+      :key="map.id"
+    >
+      <div
+        class="beatmap-preview"
+        :style="{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }"
+      ></div>
+      <div class="beatmap-stats">
+        <span class="beatmap-title"> <% map.title %> </span>
+        <span class="beatmap-artist"> <% map.artist %> </span>
+        <div class="beatmap-footer">
+          <span class="beatmap-mapper">
+            {{ t('profile.by') }}
+            <span class="newmaps-color"> <% map.creator %> </span></span
+          >
+          <div class="d-flex align-items-baseline">
+            <span> <% map.plays %> </span>
+            <div class="target-button newmaps-color">
+              <i class="fas fa-arrow-right"></i>
             </div>
+          </div>
         </div>
+      </div>
+    </a>
+  </div>
+  <div v-else-if="data.maps.{{ id }}.out.length == 0" class="stats-block">
+    <div class="columns is-marginless">
+      <div class="column is-1">
+        <h1 class="title">: (</h1>
+      </div>
+      <div class="column">
+        <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
+        <p class="subtitle is-7">{{ t('profile.try-playing-something') }}</p>
+      </div>
     </div>
-    <div v-show="data.maps.{{ id }}.more.full == false" class="extra-block">
-        <a class="show-button rounded-sm" @click="AddLimit('mostplay')">{{ t('profile.show-more') }}</a>
-    </div>
+  </div>
+  <div v-show="data.maps.{{ id }}.more.full == false" class="extra-block">
+    <a class="show-button rounded-sm" @click="AddLimit('mostplay')"
+      >{{ t('profile.show-more') }}</a
+    >
+  </div>
 </div>
-{% endmacro %}
-
-{% block header %}
+{% endmacro %} {% block header %}
 <script src="/static/js/assets/vue.js?v={{ appVersion() }} "></script>
 <script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
-<link rel="stylesheet" href="/static/css/pages/profile.css?v={{ appVersion() }} ">
+<link
+  rel="stylesheet"
+  href="/static/css/pages/profile.css?v={{ appVersion() }} "
+/>
 
 <script>
-    window.addEventListener('load', () => {
-        window._state = createState({
-            userid: {{ user['id'] | JSON }},
-            mode: {{ mode | JSON }},
-            mods: {{ mods | JSON }},
-            domain: {{ domain() | JSON }}
-        })
-    })
+  window.addEventListener('load', () => {
+      window._state = createState({
+          userid: {{ user['id'] | JSON }},
+          mode: {{ mode | JSON }},
+          mods: {{ mods | JSON }},
+          domain: {{ domain() | JSON }}
+      })
+  })
 </script>
 <style>
-    .rounded-sm {
-        border-radius: 0.5em;
-    }
+  .rounded-sm {
+    border-radius: 0.5em;
+  }
 </style>
 
 {% if user['userpage_content'] != None and user['userpage_content'] != "" %}
 <style>
-    /* HTML5 display-role reset for older browsers */
+  /* HTML5 display-role reset for older browsers */
 
-    article,
-    .reset-bulma-style aside,
-    .reset-bulma-style details,
-    .reset-bulma-style figcaption,
-    .reset-bulma-style figure,
-    .reset-bulma-style footer,
-    .reset-bulma-style header,
-    .reset-bulma-style hgroup,
-    .reset-bulma-style menu,
-    .reset-bulma-style nav,
-    .reset-bulma-style section {
-        display: block;
-    }
+  article,
+  .reset-bulma-style aside,
+  .reset-bulma-style details,
+  .reset-bulma-style figcaption,
+  .reset-bulma-style figure,
+  .reset-bulma-style footer,
+  .reset-bulma-style header,
+  .reset-bulma-style hgroup,
+  .reset-bulma-style menu,
+  .reset-bulma-style nav,
+  .reset-bulma-style section {
+    display: block;
+  }
 
-    .reset-bulma-style body {
-        line-height: 1;
-    }
+  .reset-bulma-style body {
+    line-height: 1;
+  }
 
-    .reset-bulma-style ol,
-    .reset-bulma-style ul {
-        list-style: none;
-    }
+  .reset-bulma-style ol,
+  .reset-bulma-style ul {
+    list-style: none;
+  }
 
-    .reset-bulma-style blockquote,
-    .reset-bulma-style q {
-        quotes: none;
-    }
+  .reset-bulma-style blockquote,
+  .reset-bulma-style q {
+    quotes: none;
+  }
 
-    .reset-bulma-style blockquote:before,
-    .reset-bulma-style blockquote:after,
-    .reset-bulma-style q:before,
-    .reset-bulma-style q:after {
-        content: '';
-        content: none;
-    }
+  .reset-bulma-style blockquote:before,
+  .reset-bulma-style blockquote:after,
+  .reset-bulma-style q:before,
+  .reset-bulma-style q:after {
+    content: "";
+    content: none;
+  }
 
-    .reset-bulma-style table {
-        border-collapse: collapse;
-        border-spacing: 0;
-    }
+  .reset-bulma-style table {
+    border-collapse: collapse;
+    border-spacing: 0;
+  }
 
-    /* custom css */
+  /* custom css */
 
-    .reset-bulma-style ul,
-    .reset-bulma-style li {
-        list-style: initial;
-        padding: initial;
-        margin: initial;
-        margin-left: 1em;
-    }
+  .reset-bulma-style ul,
+  .reset-bulma-style li {
+    list-style: initial;
+    padding: initial;
+    margin: initial;
+    margin-left: 1em;
+  }
 
-    .reset-bulma-style h1 {
-        font-size: 2.5em;
-    }
+  .reset-bulma-style h1 {
+    font-size: 2.5em;
+  }
 
-    .reset-bulma-style h2 {
-        font-size: 2em;
-    }
+  .reset-bulma-style h2 {
+    font-size: 2em;
+  }
 
-    .reset-bulma-style h3 {
-        font-size: 1.67em;
-    }
+  .reset-bulma-style h3 {
+    font-size: 1.67em;
+  }
 
-    .reset-bulma-style h4 {
-        font-size: 1.33em;
-    }
+  .reset-bulma-style h4 {
+    font-size: 1.33em;
+  }
 
-    .reset-bulma-style h5 {
-        font-size: 1em;
-    }
+  .reset-bulma-style h5 {
+    font-size: 1em;
+  }
 
-    .reset-bulma-style h6 {
-        font-size: 0.5em;
-    }
+  .reset-bulma-style h6 {
+    font-size: 0.5em;
+  }
 
-    .reset-bulma-style pre {
-        border-radius: 0.5em;
-    }
+  .reset-bulma-style pre {
+    border-radius: 0.5em;
+  }
 </style>
-{% endif %}
-
-{% endblock %}
-
-{% block content %}
+{% endif %} {% endblock %} {% block content %}
 <div id="app">
-    <div class="main-block">
-        <div class="profile-bg">
-            <div class="info-block">
-                <h1 class="title">
-                    <p class="ranks">
-                        <img src="/static/images/flags/{{ user['country']|upper }}.png" class="profile-flag">
-                        <span class="bgf">{{ user['name'] }}</span>
-                    </p>
-                </h1>
-                <transition name="fade">
-                    <div class="subtitle" v-if='data.status.online == false'>
-                        <a class='circle'>●</a> {{ t('global.offline') }}
-                    </div>
-                    <div class="subtitle" v-else-if='data.status.online == true' :style="{
+  <div class="main-block">
+    <div class="profile-bg">
+      <div class="info-block">
+        <h1 class="title">
+          <p class="ranks">
+            <img
+              src="/static/images/flags/{{ user['country']|upper }}.png"
+              class="profile-flag"
+            />
+            <span class="bgf">{{ user['name'] }}</span>
+          </p>
+        </h1>
+        <transition name="fade">
+          <div class="subtitle" v-if="data.status.online == false">
+            <a class="circle">●</a> {{ t('global.offline') }}
+          </div>
+          <div
+            class="subtitle"
+            v-else-if="data.status.online == true"
+            :style="{
                         display: 'flex',
                         gap: '0.5em',
                         alignItems: 'center'
-                    }">
-                        <a class='circle green'>●</a> {{ t('global.online') }}
-                        <transition name="click">
-                            <div class="online-infomation" :key="`online-information`">
-                                <% actionIntToStr(data.status.status) %>
-                            </div>
-                        </transition>
-                    </div>
-                </transition>
-            </div>
-            <div class="anime-girl">
-                <!-- (if you want to add it)
+                    }"
+          >
+            <a class="circle green">●</a> {{ t('global.online') }}
+            <transition name="click">
+              <div class="online-infomation" :key="`online-information`">
+                <% actionIntToStr(data.status.status) %>
+              </div>
+            </transition>
+          </div>
+        </transition>
+      </div>
+      <div class="anime-girl">
+        <!-- (if you want to add it)
                     <img src="{your transparent img src}" alt="">
                 -->
-            </div>
+      </div>
+    </div>
+    <div class="profile-flex">
+      <div class="profile-avatar-area">
+        <img
+          src="https://a.{{ domain() }}/{{ user['id'] }}"
+          alt="avatar"
+          class="rounded-avatar profile-avatar"
+          onError="this.src='/static/images/avatar_notwork.png';"
+        />
+      </div>
+      <div class="bar-selection mode-selects">
+        <div class="select-left">
+          <a
+            class="simple-banner-switch"
+            :class="{ 'selected': mode === 'std' }"
+            @click="ChangeModeMods('std',mods)"
+            ><i class="mode-icon mode-osu"></i
+            ><span class="mode-text">{{ t('global.mode.osu') }}</span></a
+          >
+          <a
+            class="simple-banner-switch"
+            :class="{ 'selected': mode === 'taiko', 'disabled': mods === 'ap' }"
+            @click="ChangeModeMods('taiko',mods)"
+            ><i class="mode-icon mode-taiko"></i
+            ><span class="mode-text">{{ t('global.mode.taiko') }}</span></a
+          >
+          <a
+            class="simple-banner-switch"
+            :class="{ 'selected': mode === 'catch', 'disabled': mods === 'ap' }"
+            @click="ChangeModeMods('catch',mods)"
+            ><i class="mode-icon mode-catch"></i
+            ><span class="mode-text">{{ t('global.mode.catch') }}</span></a
+          >
+          <a
+            class="simple-banner-switch"
+            :class="{ 'selected': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
+            @click="ChangeModeMods('mania',mods)"
+            ><i class="mode-icon mode-mania"></i
+            ><span class="mode-text">{{ t('global.mode.mania') }}</span></a
+          >
         </div>
-        <div class="profile-flex">
-            <div class="profile-avatar-area">
-                <img src="https://a.{{ domain() }}/{{ user['id'] }}" alt="avatar" class="rounded-avatar profile-avatar"
-                    onError="this.src='/static/images/avatar_notwork.png';">
-            </div>
-            <div class="bar-selection mode-selects">
-                <div class="select-left">
-                    <a class="simple-banner-switch" :class="{ 'selected': mode === 'std' }"
-                        @click="ChangeModeMods('std',mods)"><i class="mode-icon mode-osu"></i><span class="mode-text">{{
-                            t('global.mode.osu') }}</span></a>
-                    <a class="simple-banner-switch" :class="{ 'selected': mode === 'taiko', 'disabled': mods === 'ap' }"
-                        @click="ChangeModeMods('taiko',mods)"><i class="mode-icon mode-taiko"></i><span
-                            class="mode-text">{{ t('global.mode.taiko') }}</span></a>
-                    <a class="simple-banner-switch" :class="{ 'selected': mode === 'catch', 'disabled': mods === 'ap' }"
-                        @click="ChangeModeMods('catch',mods)"><i class="mode-icon mode-catch"></i><span
-                            class="mode-text">{{ t('global.mode.catch') }}</span></a>
-                    <a class="simple-banner-switch"
-                        :class="{ 'selected': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
-                        @click="ChangeModeMods('mania',mods)"><i class="mode-icon mode-mania"></i><span
-                            class="mode-text">{{ t('global.mode.mania') }}</span></a>
-                </div>
-                <div class="select-right">
-                    <a class="simple-banner-switch" :class=" { 'selected': mods === 'vn' }"
-                        @click="ChangeModeMods(mode,'vn')"><span class="mods-fulltext">{{ t('global.mode.vanilla')
-                            }}</span>
-                        <span class="mods-shorttext">{{ t('global.mode.VN') }}</span></a>
-                    <a class="simple-banner-switch"
-                        :class=" { 'selected': mods === 'rx', 'disabled': mode === 'mania' }"
-                        @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">{{ t('global.mode.relax')
-                            }}</span>
-                        <span class="mods-shorttext">{{ t('global.mode.RX') }}</span></a>
-                    <a class="simple-banner-switch"
-                        :class=" { 'selected': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
-                        @click="ChangeModeMods(mode,'ap')"><span class="mods-fulltext">{{ t('global.mode.autopilot')
-                            }}</span><span class="mods-shorttext">{{ t('global.mode.AP') }}</span></a>
-                </div>
-            </div>
+        <div class="select-right">
+          <a
+            class="simple-banner-switch"
+            :class=" { 'selected': mods === 'vn' }"
+            @click="ChangeModeMods(mode,'vn')"
+            ><span class="mods-fulltext">{{ t('global.mode.vanilla') }}</span>
+            <span class="mods-shorttext">{{ t('global.mode.VN') }}</span></a
+          >
+          <a
+            class="simple-banner-switch"
+            :class=" { 'selected': mods === 'rx', 'disabled': mode === 'mania' }"
+            @click="ChangeModeMods(mode,'rx')"
+            ><span class="mods-fulltext">{{ t('global.mode.relax') }}</span>
+            <span class="mods-shorttext">{{ t('global.mode.RX') }}</span></a
+          >
+          <a
+            class="simple-banner-switch"
+            :class=" { 'selected': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
+            @click="ChangeModeMods(mode,'ap')"
+            ><span class="mods-fulltext">{{ t('global.mode.autopilot') }}</span
+            ><span class="mods-shorttext">{{ t('global.mode.AP') }}</span></a
+          >
         </div>
+      </div>
     </div>
-    <div class="second-block">
-        <div class="columns is-marginless two-sides">
-            <div class="column is-one-third" v-cloak>
-                <!-- <div class="header">
+  </div>
+  <div class="second-block">
+    <div class="columns is-marginless two-sides">
+      <div class="column is-one-third" v-cloak>
+        <!-- <div class="header">
                     <div class="title">
                         <i class="fas fa-user-friends"></i> Badge
                     </div>
@@ -343,158 +382,175 @@ <h1 class="title">
                         </tbody>
                     </table>
                 </div> -->
-                <div class="header" v-if='data.stats.out[modegulag].rank != 0'>
-                    <div class="title">
-                        <i class="fas fa-user-friends"></i> {{ t("profile.rank-title") }}
+        <template v-if="data.stats.out[modegulag]">
+          <div class="header" v-if="data.stats.out[modegulag].rank != 0">
+            <div class="title">
+              <i class="fas fa-user-friends"></i> {{ t("profile.rank-title") }}
+            </div>
+          </div>
+          <div
+            class="stats-block rank-block"
+            v-if="data.stats.out[modegulag].rank != 0"
+          >
+            <table class="is-striped">
+              <tbody>
+                <tr>
+                  <td>{{ t('profile.global-rank') }}</td>
+                  <td class="right-aligned">
+                    <span id="global-rank">
+                      <% '#' + data.stats.out[modegulag].rank %>
+                    </span>
+                  </td>
+                </tr>
+                <tr>
+                  <td>{{ t('profile.country-rank') }}</td>
+                  <td class="right-aligned">
+                    <span id="country-rank">
+                      <% '#' + data.stats.out[modegulag].country_rank %>
+                    </span>
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+
+          <div class="header">
+            <div class="title">
+              <i class="fas fa-chart-pie"></i> {{ t('profile.statistics') }}
+            </div>
+          </div>
+          <div class="stats-block">
+            <table class="is-striped">
+              <tbody>
+                <tr>
+                  <td><b>{{ t('global.pp').upper() }}</b></td>
+                  <td class="right-aligned">
+                    <% addCommas(data.stats.out[modegulag].pp) %>
+                  </td>
+                </tr>
+                <tr>
+                  <td><b>{{ t('global.ranked-score') }}</b></td>
+                  <td class="right-aligned">
+                    <% addCommas(data.stats.out[modegulag].rscore) %>
+                  </td>
+                </tr>
+                <tr>
+                  <td><b>{{ t('global.total-score') }}</b></td>
+                  <td class="right-aligned">
+                    <% addCommas(data.stats.out[modegulag].tscore) %>
+                  </td>
+                </tr>
+                <tr>
+                  <td><b>{{ t('global.max-combo') }}</b></td>
+                  <td class="right-aligned">
+                    <% addCommas(data.stats.out[modegulag].max_combo) %>
+                  </td>
+                </tr>
+                <tr>
+                  <td><b>{{ t('global.playcount') }}</b></td>
+                  <td class="right-aligned">
+                    <% addCommas(data.stats.out[modegulag].plays) %>
+                  </td>
+                </tr>
+                <tr>
+                  <td><b>{{ t('global.playtime') }}</b></td>
+                  <td class="right-aligned">
+                    <% secondsToDhm(data.stats.out[modegulag].playtime) %>
+                  </td>
+                </tr>
+                <tr>
+                  <td><b>{{ t('global.accuracy') }}</b></td>
+                  <td class="right-aligned">
+                    <% data.stats.out[modegulag].acc %>%
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+            <div class="grade-block" v-if="data.grades">
+              <article class="media">
+                <div class="media-content">
+                  <div class="grade-line">
+                    <div class="rank-single">
+                      <div class="map-rank rank-X">
+                        {{ t('global.rank.ss') }}
+                      </div>
+                      <div class="rank-amount">
+                        <% data.stats.out[modegulag].x_count %>
+                      </div>
                     </div>
-                </div>
-                <div class="stats-block rank-block" v-if='data.stats.out[modegulag].rank != 0'>
-                    <table class="is-striped">
-                        <tbody>
-                            <tr>
-                                <td>{{ t('profile.global-rank') }}</td>
-                                <td class="right-aligned">
-                                    <span id="global-rank">
-                                        <% '#' + data.stats.out[modegulag].rank %>
-                                    </span>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td>{{ t('profile.country-rank') }}</td>
-                                <td class="right-aligned">
-                                    <span id="country-rank">
-                                        <% '#' + data.stats.out[modegulag].country_rank %>
-                                    </span>
-                                </td>
-                            </tr>
-                        </tbody>
-                    </table>
-                </div>
-                <div class="header">
-                    <div class="title">
-                        <i class="fas fa-chart-pie"></i> {{ t('profile.statistics') }}
+                    <div class="rank-single">
+                      <div class="map-rank rank-XH">
+                        {{ t('global.rank.ssh') }}
+                      </div>
+                      <div class="rank-amount">
+                        <% data.stats.out[modegulag].xh_count %>
+                      </div>
                     </div>
-                </div>
-                <div class="stats-block">
-                    <table class="is-striped">
-                        <tbody>
-                            <tr>
-                                <td><b>{{ t('global.pp').upper() }}</b></td>
-                                <td class="right-aligned">
-                                    <% addCommas(data.stats.out[modegulag].pp) %>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td><b>{{ t('global.ranked-score') }}</b></td>
-                                <td class="right-aligned">
-                                    <% addCommas(data.stats.out[modegulag].rscore) %>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td><b>{{ t('global.total-score') }}</b></td>
-                                <td class="right-aligned">
-                                    <% addCommas(data.stats.out[modegulag].tscore) %>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td><b>{{ t('global.max-combo') }}</b></td>
-                                <td class="right-aligned">
-                                    <% addCommas(data.stats.out[modegulag].max_combo) %>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td><b>{{ t('global.playcount') }}</b></td>
-                                <td class="right-aligned">
-                                    <% addCommas(data.stats.out[modegulag].plays) %>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td><b>{{ t('global.playtime') }}</b></td>
-                                <td class="right-aligned">
-                                    <% secondsToDhm(data.stats.out[modegulag].playtime) %>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td><b>{{ t('global.accuracy') }}</b></td>
-                                <td class="right-aligned">
-                                    <% data.stats.out[modegulag].acc %>%
-                                </td>
-                            </tr>
-                        </tbody>
-                    </table>
-                    <div class="grade-block" v-if="data.grades">
-                        <article class="media">
-                            <div class="media-content">
-                                <div class="grade-line">
-                                    <div class="rank-single">
-                                        <div class="map-rank rank-X">{{ t('global.rank.ss') }}</div>
-                                        <div class="rank-amount">
-                                            <% data.stats.out[modegulag].x_count %>
-                                        </div>
-                                    </div>
-                                    <div class="rank-single">
-                                        <div class="map-rank rank-XH">{{ t('global.rank.ssh') }}</div>
-                                        <div class="rank-amount">
-                                            <% data.stats.out[modegulag].xh_count %>
-                                        </div>
-                                    </div>
-                                </div>
-                                <div class="grade-line">
-                                    <div class="rank-single">
-                                        <div class="map-rank rank-S">{{ t('global.rank.s') }}</div>
-                                        <div class="rank-amount">
-                                            <% data.stats.out[modegulag].s_count %>
-                                        </div>
-                                    </div>
-                                    <div class="rank-single">
-                                        <div class="map-rank rank-SH">{{ t('global.rank.sh') }}</div>
-                                        <div class="rank-amount">
-                                            <% data.stats.out[modegulag].sh_count %>
-                                        </div>
-                                    </div>
-                                    <div class="rank-single">
-                                        <div class="map-rank rank-A">{{ t('global.rank.a') }}</div>
-                                        <div class="rank-amount">
-                                            <% data.stats.out[modegulag].a_count %>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </article>
+                  </div>
+                  <div class="grade-line">
+                    <div class="rank-single">
+                      <div class="map-rank rank-S">
+                        {{ t('global.rank.s') }}
+                      </div>
+                      <div class="rank-amount">
+                        <% data.stats.out[modegulag].s_count %>
+                      </div>
+                    </div>
+                    <div class="rank-single">
+                      <div class="map-rank rank-SH">
+                        {{ t('global.rank.sh') }}
+                      </div>
+                      <div class="rank-amount">
+                        <% data.stats.out[modegulag].sh_count %>
+                      </div>
                     </div>
+                    <div class="rank-single">
+                      <div class="map-rank rank-A">
+                        {{ t('global.rank.a') }}
+                      </div>
+                      <div class="rank-amount">
+                        <% data.stats.out[modegulag].a_count %>
+                      </div>
+                    </div>
+                  </div>
                 </div>
+              </article>
             </div>
-            <div class="column is-two-third">
-                {{ userpage(user) }}
-                {{ scores(t('profile.best-scores') , 'best')}}
-                {{ scores(t('profile.recent-scores'), 'recent')}}
-                {{ maps(t('profile.most-played-beatmaps'), 'most')}}
-            </div>
-        </div>
+          </div>
+        </template>
+      </div>
+      <div class="column is-two-third">
+        {{ userpage(user) }} {{ scores(t('profile.best-scores') , 'best')}} {{
+        scores(t('profile.recent-scores'), 'recent')}} {{
+        maps(t('profile.most-played-beatmaps'), 'most')}}
+      </div>
     </div>
+  </div>
 </div>
-{% endblock %}
-
-{% block bottom %}
+{% endblock %} {% block bottom %}
 <script src="/static/js/pages/profile.js?v={{ appVersion() }} "></script>
 {% if user['customisation']['banner'] == True %}
 <style>
-    .profile-bg {
-        min-height: 262px;
-        background: linear-gradient(hsl(var(--main), 25%, 25%, 20%), hsl(var(--main), 25%, 25%, 60%)),
-        url("/banners/{{ user['id'] }}");
-        background-size: cover;
-    }
+  .profile-bg {
+    min-height: 262px;
+    background: linear-gradient(
+        hsl(var(--main), 25%, 25%, 20%),
+        hsl(var(--main), 25%, 25%, 60%)
+      ),
+      url("/banners/{{ user['id'] }}");
+    background-size: cover;
+  }
 </style>
-{% endif %}
-{% if user['customisation']['background'] == True %}
+{% endif %} {% if user['customisation']['background'] == True %}
 <style>
-    body {
-        background: linear-gradient(hsl(var(--main), 25%, 25%, 20%), hsl(var(--main), 10%, 10%)),
-        url("/backgrounds/{{ user['id'] }}");
-        background-size: cover;
-        background-clip: content-box;
-    }
+  body {
+    background: linear-gradient(
+        hsl(var(--main), 25%, 25%, 20%),
+        hsl(var(--main), 10%, 10%)
+      ),
+      url("/backgrounds/{{ user['id'] }}");
+    background-size: cover;
+    background-clip: content-box;
+  }
 </style>
-{% endif %}
-{% endblock bottom %}
\ No newline at end of file
+{% endif %} {% endblock bottom %}

From 4e37c280b370963e8808eb2cad282424b66054cc Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 3 Sep 2022 18:03:24 +0000
Subject: [PATCH 258/278] bump ver

---
 objects/glob.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/objects/glob.py b/objects/glob.py
index c8fca014..e90bd921 100644
--- a/objects/glob.py
+++ b/objects/glob.py
@@ -21,7 +21,7 @@
 http: 'ClientSession'
 version: 'Version'
 app = Quart(__name__, template_folder=f'{os.getcwd()}/templates', static_folder=f'{os.getcwd()}/static')
-version = Version(1, 4, 0)
+version = Version(1, 4, 1)
 
 cache = {
     'bcrypt': {},

From 95cb903614009341e4c0f7763c9a59e94faf390f Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 30 Oct 2022 13:04:13 +0900
Subject: [PATCH 259/278] defer img

---
 templates/profile.html | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/templates/profile.html b/templates/profile.html
index 941d73f2..81d14fc1 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -35,6 +35,7 @@
             <img
               :src="`https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/card.jpg`"
               class="map-image-picture"
+              defer
             />
           </div>
           <div class="map-title-block">
@@ -306,6 +307,7 @@ <h1 class="title">
           alt="avatar"
           class="rounded-avatar profile-avatar"
           onError="this.src='/static/images/avatar_notwork.png';"
+          defer
         />
       </div>
       <div class="bar-selection mode-selects">

From 267cf9a5e898aa1fcc4f8f46c9c0d5681c9aedd7 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 30 Oct 2022 13:20:07 +0900
Subject: [PATCH 260/278] use black formatter

---
 .eslintrc.js          |  4 ++
 .vscode/settings.json |  3 +-
 objects/glob.py       | 98 +++++++++++++++++++++++++------------------
 utils/i18n/config.ts  |  2 +-
 utils/i18n/reader.ts  |  4 +-
 5 files changed, 68 insertions(+), 43 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 7d2a7dfc..da5be704 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -20,5 +20,9 @@ module.exports = {
   plugins: [
     'jquery'
   ],
+  rules: {
+    // disable the rule for all files
+    '@typescript-eslint/explicit-function-return-type': 'off'
+  },
   globals
 }
diff --git a/.vscode/settings.json b/.vscode/settings.json
index 7ad106fa..f963fc36 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -55,5 +55,6 @@
   },
   "files.associations": {
     "*.html": "jinja-html"
-  }
+  },
+  "python.formatting.provider": "black"
 }
diff --git a/objects/glob.py b/objects/glob.py
index e90bd921..f7452548 100644
--- a/objects/glob.py
+++ b/objects/glob.py
@@ -1,6 +1,6 @@
 # -*- coding: utf-8 -*-
 
-__all__ = ('db', 'http', 'version', 'cache')
+__all__ = ("db", "http", "version", "cache")
 
 import os
 import time
@@ -17,36 +17,41 @@
 from constants.privileges import Privileges
 
 
-db: 'AsyncSQLPool'
-http: 'ClientSession'
-version: 'Version'
-app = Quart(__name__, template_folder=f'{os.getcwd()}/templates', static_folder=f'{os.getcwd()}/static')
+db: "AsyncSQLPool"
+http: "ClientSession"
+version: "Version"
+app = Quart(
+    __name__,
+    template_folder=f"{os.getcwd()}/templates",
+    static_folder=f"{os.getcwd()}/static",
+)
 version = Version(1, 4, 1)
 
-cache = {
-    'bcrypt': {},
-    'search_data': {}
-}
+cache = {"bcrypt": {}, "search_data": {}}
+
 
 @app.template_global()
 def t(key, **kwargs) -> str:
-    kwargs['locale'] = session.get('lang', config.default_locale)
+    kwargs["locale"] = session.get("lang", config.default_locale)
     try:
         return i18n.t(key, **kwargs)
     except:
         try:
-            return i18n.t(key + '._string', **kwargs)
+            return i18n.t(key + "._string", **kwargs)
         except:
             return key
 
+
 @app.template_global()
 def appName() -> str:
     return config.app_name
 
+
 @app.template_global()
 def appVersion() -> str:
     return repr(version)
 
+
 # Verified Unrestricted -> Normal
 # Dangerous Admin Mod -> Stuff
 # Supporter Premium -> Donator
@@ -54,55 +59,68 @@ def appVersion() -> str:
 # Not Unrestricted -> Restricted
 @app.template_global()
 def format_priv(target_priv: int) -> set:
-    priv_list = [priv.name for priv in Privileges if target_priv & priv and bin(priv).count("1") == 1][::-1]
-    if 'Unrestricted' not in priv_list:
-        return ['Restricted']
-    if 'Verified' not in priv_list:
-        return ['Disclaimed']
-    if set(['Verified', 'Unrestricted']).issubset(priv_list):
-        priv_list.remove('Verified')
-        priv_list.remove('Unrestricted')
-        priv_list.append('Normal')
-    if set(['Dangerous', 'Admin', 'Mod']).issubset(priv_list):
-        priv_list.remove('Dangerous')
-        priv_list.remove('Admin')
-        priv_list.remove('Mod')
-        priv_list.append('Stuff')
-    if set(['Supporter', 'Premium']).issubset(priv_list):
-        priv_list.remove('Supporter')
-        priv_list.remove('Premium')
-        priv_list.append('Donator')
-    if 'Normal' in priv_list and len(priv_list) != 1:
-        priv_list.remove('Normal')
+    priv_list = [
+        priv.name
+        for priv in Privileges
+        if target_priv & priv and bin(priv).count("1") == 1
+    ][::-1]
+    if "Unrestricted" not in priv_list:
+        return ["Restricted"]
+    if "Verified" not in priv_list:
+        return ["Disclaimed"]
+    if set(["Verified", "Unrestricted"]).issubset(priv_list):
+        priv_list.remove("Verified")
+        priv_list.remove("Unrestricted")
+        priv_list.append("Normal")
+    if set(["Dangerous", "Admin", "Mod"]).issubset(priv_list):
+        priv_list.remove("Dangerous")
+        priv_list.remove("Admin")
+        priv_list.remove("Mod")
+        priv_list.append("Stuff")
+    if set(["Supporter", "Premium"]).issubset(priv_list):
+        priv_list.remove("Supporter")
+        priv_list.remove("Premium")
+        priv_list.append("Donator")
+    if "Normal" in priv_list and len(priv_list) != 1:
+        priv_list.remove("Normal")
     # return ', '.join(priv_list)
     return priv_list
 
+
 @app.template_global()
 def captchaKey() -> str:
     return config.hCaptcha_sitekey
 
+
 @app.template_global()
 def handle_timestamp(timestamp):
     return time.strftime("%Y-%m-%d %H:%M", time.localtime(int(timestamp)))
 
+
 @app.template_global()
 def domain() -> str:
     return config.domain
 
+
 @app.template_global()
 def render_markdown(md: str) -> str:
-    return markdown2.markdown(html.unescape(md), extras=[
-        'tables',
-        'break-on-newline',
-        'fenced-code-blocks',
-        'spoiler',
-        'strike'
-    ])
+    return markdown2.markdown(
+        html.unescape(md),
+        extras=[
+            "tables",
+            "break-on-newline",
+            "fenced-code-blocks",
+            "spoiler",
+            "strike",
+        ],
+    )
+
 
 @app.template_global()
 def decode_map_status(status: int) -> str:
     return RankedStatus(status).name
 
-@app.template_filter('JSON')
+
+@app.template_filter("JSON")
 def JSON(anyting) -> str:
-    return app.jinja_env.filters['safe'](json.dumps(anyting))
\ No newline at end of file
+    return app.jinja_env.filters["safe"](json.dumps(anyting))
diff --git a/utils/i18n/config.ts b/utils/i18n/config.ts
index 4c86d2c6..eac01d10 100644
--- a/utils/i18n/config.ts
+++ b/utils/i18n/config.ts
@@ -69,7 +69,7 @@ export const divider = '.'
 export function contextToFileName (context: FileContext): string {
   return `${context.namespace}/${context.locale}.${context.extension || 'yml'}`
 }
-// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
+
 export function contextFromFileName (fileName: string) {
   const split = fileName.split('/').join(divider).split(divider)
   const namespaces = split.slice(0, split.length - 2)
diff --git a/utils/i18n/reader.ts b/utils/i18n/reader.ts
index ee679461..80e97256 100644
--- a/utils/i18n/reader.ts
+++ b/utils/i18n/reader.ts
@@ -1,3 +1,5 @@
+/* eslint-disable @typescript-eslint/strict-boolean-expressions */
+/* eslint-disable @typescript-eslint/restrict-template-expressions */
 import path from 'path'
 import fs from 'fs'
 import yaml from 'js-yaml'
@@ -68,7 +70,7 @@ const mixinLocale = (
           if (!merging) {
             console.warn(`[Warning] Merging into initilazed value:
 ${key}.${k}:
-[${typeof srcValue[k]}${(typeof srcValue[k] === 'string' && `\`${srcValue[k] as string}\``) || ''}] merging into [${typeof objValue[k]}${(typeof objValue[k] === 'string' && `\`${objValue[k] as string}\``) || ''}].`)
+[${typeof srcValue[k]}${(typeof srcValue[k] === 'string' && `\`${srcValue[k]}\``) || ''}] merging into [${typeof objValue[k]}${(typeof objValue[k] === 'string' && `\`${objValue[k]}\``) || ''}].`)
           }
           objValue = createConfilitKeyHandler(merging)(objValue, srcValue, k)
           if (!merging) console.log('')

From 705f15aa052adb774290704d737ca1cf088726ba Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sun, 30 Oct 2022 13:27:48 +0900
Subject: [PATCH 261/278] format

---
 blueprints/admin.py     | 272 +++++++++-------
 blueprints/frontend.py  | 704 ++++++++++++++++++++++++----------------
 config.sample.py        |  61 ++--
 constants/beatmaps.py   |   2 +-
 constants/privileges.py |  25 +-
 constants/regexes.py    |   4 +-
 main.py                 |  25 +-
 objects/utils.py        | 145 +++++----
 objects/varka.py        |  99 +++---
 9 files changed, 781 insertions(+), 556 deletions(-)

diff --git a/blueprints/admin.py b/blueprints/admin.py
index 78033d89..f1c86bfb 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -21,204 +21,238 @@
 import timeago
 
 
-admin = Blueprint('admin', __name__)
+admin = Blueprint("admin", __name__)
+
 
 def dict_cmp(a: dict, b: dict):
     cmp = a.items() - b.items()
     return dict(cmp)
 
+
 async def get(table_name: str, id: str):
     data = await varka.get_data(table_name, id)
     return data
 
+
 def priv_check(priv: Privileges):
     def decorate(func):
         @wraps(func)
         async def wrapper(*args, **kwargs):
-            if not 'authenticated' in session:
-                return await flash('error', t('admin.please-login-in-first'), 'login')
-            if not session['user_data']['priv'] & priv:
-                return await flash('error', t('admin.you-have-sufficient-privileges'), 'home')
+            if not "authenticated" in session:
+                return await flash("error", t("admin.please-login-in-first"), "login")
+            if not session["user_data"]["priv"] & priv:
+                return await flash(
+                    "error", t("admin.you-have-sufficient-privileges"), "home"
+                )
             return await func(*args, **kwargs)
+
         return wrapper
+
     return decorate
 
-@admin.route('/')
-@admin.route('/home')
-@admin.route('/dashboard')
+
+@admin.route("/")
+@admin.route("/home")
+@admin.route("/dashboard")
 @priv_check(priv=Privileges.Staff)
 async def home():
     # fetch data from database
     dash_data = await glob.db.fetch(
-        'SELECT COUNT(id) count, '
-        '(SELECT name FROM users ORDER BY id DESC LIMIT 1) lastest_user, '
-        '(SELECT COUNT(id) FROM users WHERE NOT priv & 1) banned '
-        'FROM users'
+        "SELECT COUNT(id) count, "
+        "(SELECT name FROM users ORDER BY id DESC LIMIT 1) lastest_user, "
+        "(SELECT COUNT(id) FROM users WHERE NOT priv & 1) banned "
+        "FROM users"
     )
 
-    recent_users = await glob.db.fetchall('SELECT * FROM users ORDER BY id DESC LIMIT 5')
+    recent_users = await glob.db.fetchall(
+        "SELECT * FROM users ORDER BY id DESC LIMIT 5"
+    )
     recent_scores = await glob.db.fetchall(
-        'SELECT scores.*, maps.artist, maps.title, '
-        'maps.set_id, maps.creator, maps.version '
-        'FROM scores JOIN maps ON scores.map_md5 = maps.md5 '
-        'ORDER BY scores.id DESC LIMIT 5'
+        "SELECT scores.*, maps.artist, maps.title, "
+        "maps.set_id, maps.creator, maps.version "
+        "FROM scores JOIN maps ON scores.map_md5 = maps.md5 "
+        "ORDER BY scores.id DESC LIMIT 5"
     )
 
     return await render_template(
-        'admin/home.html', dashdata=dash_data,
-        recentusers=recent_users, recentscores=recent_scores,
-        datetime=datetime, timeago=timeago
+        "admin/home.html",
+        dashdata=dash_data,
+        recentusers=recent_users,
+        recentscores=recent_scores,
+        datetime=datetime,
+        timeago=timeago,
     )
 
-@admin.route('/restrictions', methods=['GET', 'POST'])
+
+@admin.route("/restrictions", methods=["GET", "POST"])
 @priv_check(priv=Privileges.Staff)
 async def restrictions():
-    return await render_template('/admin/restrictions.html', query_data=await varka.get_res_users())
+    return await render_template(
+        "/admin/restrictions.html", query_data=await varka.get_res_users()
+    )
 
-@admin.route('/users', methods=['GET'])
+
+@admin.route("/users", methods=["GET"])
 @priv_check(priv=Privileges.Staff)
 async def users():
     query_data = await varka.get_users()
-    return await render_template('/admin/users/index.html', query_data=query_data)
+    return await render_template("/admin/users/index.html", query_data=query_data)
+
 
-@admin.route('/users/search/<q>', methods=['GET'])
+@admin.route("/users/search/<q>", methods=["GET"])
 @priv_check(priv=Privileges.Staff)
 async def users_search(q: str):
     query_data = await varka.get_users(search=q)
-    return await render_template('/admin/users/index.html', query_data=query_data, search_value=q)
+    return await render_template(
+        "/admin/users/index.html", query_data=query_data, search_value=q
+    )
+
 
-@admin.route('/user/<id>/edit')
+@admin.route("/user/<id>/edit")
 @priv_check(priv=Privileges.Staff)
-async def users_edit(id:int):
+async def users_edit(id: int):
     query = await varka.get_user(id)
-    return await render_template('admin/users/edit.html', search_data=query)
+    return await render_template("admin/users/edit.html", search_data=query)
 
-@admin.route('/user/<id>/upload-scores')
+
+@admin.route("/user/<id>/upload-scores")
 @priv_check(priv=Privileges.Staff)
-async def users_upload_score(id:int):
+async def users_upload_score(id: int):
     query = await varka.get_user(id)
-    return await render_template('admin/users/upload-scores.html', search_data=query)
+    return await render_template("admin/users/upload-scores.html", search_data=query)
+
 
-@admin.route('/user/<id>/update', methods=['POST']) # POST
+@admin.route("/user/<id>/update", methods=["POST"])  # POST
 @priv_check(priv=Privileges.Staff)
-async def users_update(id:int):
+async def users_update(id: int):
     try:
         form = await request.form
-        datadef: dict = await get('users', id)
+        datadef: dict = await get("users", id)
         data = dict(
-            name = form['edit-username'],
-            safe_name = form['edit-username'].lower().replace(' ', '_'),
-            email = form['edit-email'],
-            country = form['edit-country']
+            name=form["edit-username"],
+            safe_name=form["edit-username"].lower().replace(" ", "_"),
+            email=form["edit-email"],
+            country=form["edit-country"],
         )
-        if form['legality'] == 'restricted':
-            data['priv'] = 2
-        elif datadef['priv'] == 2 and form['legality'] == 'unrestricted':
-            data['priv'] = 3 
-        if form['password'] != "":
-            pw_md5 = hashlib.md5(form['password'].encode()).hexdigest().encode()
+        if form["legality"] == "restricted":
+            data["priv"] = 2
+        elif datadef["priv"] == 2 and form["legality"] == "unrestricted":
+            data["priv"] = 3
+        if form["password"] != "":
+            pw_md5 = hashlib.md5(form["password"].encode()).hexdigest().encode()
             pw_bcrypt = bcrypt.hashpw(pw_md5, bcrypt.gensalt())
             await glob.db.execute(
-                'UPDATE users '
-                'SET pw_bcrypt = %s '
-                'WHERE id = %s',
-                [pw_bcrypt, id]
+                "UPDATE users " "SET pw_bcrypt = %s " "WHERE id = %s", [pw_bcrypt, id]
             )
-        await varka.update('users', ('id', id), **dict_cmp(data, datadef))
-        return redirect(f'/admin/users/search/{id}')
-    except: 
-        return redirect('/admin/users')
+        await varka.update("users", ("id", id), **dict_cmp(data, datadef))
+        return redirect(f"/admin/users/search/{id}")
+    except:
+        return redirect("/admin/users")
+
 
-@admin.route('/beatmaps')
-@priv_check(priv = Privileges.Nominator | Privileges.Dangerous)
+@admin.route("/beatmaps")
+@priv_check(priv=Privileges.Nominator | Privileges.Dangerous)
 async def beatmaps():
     query = await glob.db.fetch(
-        'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
-        '(SELECT COUNT(id) as `l` FROM maps WHERE `status`= 5) AS `l`, '
-        '(SELECT COUNT(id) as `p` FROM maps WHERE `status`= 0) AS `p`, '
-        '(SELECT COUNT(id) as `t` FROM maps) `t`'
+        "SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, "
+        "(SELECT COUNT(id) as `l` FROM maps WHERE `status`= 5) AS `l`, "
+        "(SELECT COUNT(id) as `p` FROM maps WHERE `status`= 0) AS `p`, "
+        "(SELECT COUNT(id) as `t` FROM maps) `t`"
     )
     counts = {
-        "ranked": query['r'], 
-        "loved": query['l'], 
-        "pending": query['p'], 
-        "total": query['t']
+        "ranked": query["r"],
+        "loved": query["l"],
+        "pending": query["p"],
+        "total": query["t"],
     }
     # This thing needs to be moved to API
     beatmaps = await glob.db.fetchall(
-        'SELECT set_id, id AS `map_id`, status, '
-        'artist, title, version AS `diff_name`, '
-        'total_length AS length, creator, mode, '
-        'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
-        'FROM maps ORDER BY id DESC '
-        'LIMIT 50'
+        "SELECT set_id, id AS `map_id`, status, "
+        "artist, title, version AS `diff_name`, "
+        "total_length AS length, creator, mode, "
+        "cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` "
+        "FROM maps ORDER BY id DESC "
+        "LIMIT 50"
     )
-    return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps)
+    return await render_template(
+        "admin/beatmaps.html", counts=counts, bmap_query=beatmaps
+    )
+
 
-@admin.route('/beatmaps/search/<q>')
-@priv_check(priv = Privileges.Nominator | Privileges.Dangerous)
+@admin.route("/beatmaps/search/<q>")
+@priv_check(priv=Privileges.Nominator | Privileges.Dangerous)
 async def beatmaps_search(q: str):
     query = await glob.db.fetch(
-        'SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, '
-        '(SELECT COUNT(id) as `l` FROM maps WHERE `status`= 5) AS `l`, '
-        '(SELECT COUNT(id) as `p` FROM maps WHERE `status`= 0) AS `p`, '
-        '(SELECT COUNT(id) as `t` FROM maps) `t`'
+        "SELECT (SELECT COUNT(id) as `r` FROM maps WHERE `status`= 2) AS `r`, "
+        "(SELECT COUNT(id) as `l` FROM maps WHERE `status`= 5) AS `l`, "
+        "(SELECT COUNT(id) as `p` FROM maps WHERE `status`= 0) AS `p`, "
+        "(SELECT COUNT(id) as `t` FROM maps) `t`"
     )
     counts = {
-        "ranked": query['r'], 
-        "loved": query['l'], 
-        "pending": query['p'], 
-        "total": query['t']
+        "ranked": query["r"],
+        "loved": query["l"],
+        "pending": query["p"],
+        "total": query["t"],
     }
     numq = int(q) if q.isdigit() else 0
     beatmaps = await glob.db.fetchall(
-        'SELECT set_id, id AS `map_id`, status, '
-        'artist, title, version AS `diff_name`, '
-        'total_length AS length, creator, mode, '
-        'cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` '
-        'FROM maps WHERE id=%s OR set_id=%s OR title like %s ORDER BY id DESC '
-        'LIMIT 50 OFFSET 0', [numq, numq, q + '%']
+        "SELECT set_id, id AS `map_id`, status, "
+        "artist, title, version AS `diff_name`, "
+        "total_length AS length, creator, mode, "
+        "cs, od, ar, hp, bpm, ROUND(diff, 2) AS `stars` "
+        "FROM maps WHERE id=%s OR set_id=%s OR title like %s ORDER BY id DESC "
+        "LIMIT 50 OFFSET 0",
+        [numq, numq, q + "%"],
+    )
+    return await render_template(
+        "admin/beatmaps.html", counts=counts, bmap_query=beatmaps, search_word=q
     )
-    return await render_template('admin/beatmaps.html', counts=counts, bmap_query=beatmaps, search_word=q)
 
-@admin.route('/beatmaps/edit/<id>')
-@priv_check(priv = Privileges.Nominator | Privileges.Dangerous)
-async def beatmaps_edit(id:int): 
-    status = request.args.get('status', type=int)
-    is_set = request.args.get('set', type=int) == 1
+
+@admin.route("/beatmaps/edit/<id>")
+@priv_check(priv=Privileges.Nominator | Privileges.Dangerous)
+async def beatmaps_edit(id: int):
+    status = request.args.get("status", type=int)
+    is_set = request.args.get("set", type=int) == 1
     if is_set:
-        await glob.db.execute("UPDATE maps SET frozen=1, status=%s WHERE set_id=%s", [str(status), str(id)])
+        await glob.db.execute(
+            "UPDATE maps SET frozen=1, status=%s WHERE set_id=%s",
+            [str(status), str(id)],
+        )
     else:
-        await glob.db.execute("UPDATE maps SET frozen=1, status=%s WHERE id=%s", [str(status), str(id)])
-    return redirect ('/admin/beatmaps/search/' + id)
+        await glob.db.execute(
+            "UPDATE maps SET frozen=1, status=%s WHERE id=%s", [str(status), str(id)]
+        )
+    return redirect("/admin/beatmaps/search/" + id)
+
 
-@admin.route('/replays/parse', methods=['POST'])
-async def replays_parse(): 
-    file = (await request.files)['replay_file']
+@admin.route("/replays/parse", methods=["POST"])
+async def replays_parse():
+    file = (await request.files)["replay_file"]
     if file is None:
-        return {'status': 300, 'msg': 'Replay is not exists in multipart.'}
+        return {"status": 300, "msg": "Replay is not exists in multipart."}
     try:
         replay = Replay.from_file(file)
         timestamp = replay.timestamp.timestamp()
     except:
-        return {'status': 400, 'msg': 'Failed to parse the replay file.'}
+        return {"status": 400, "msg": "Failed to parse the replay file."}
     return {
-        'status': 200,
-        'replay': {
-            'map_md5': replay.beatmap_hash,
-            'score': replay.score,
-            'max_combo': replay.max_combo,
-            'mods': replay.mods.value,
-            'n300': replay.count_300,
-            'n100': replay.count_100,
-            'n50': replay.count_50,
-            'nmiss': replay.count_miss,
-            'ngeki': replay.count_geki,
-            'nkatu': replay.count_katu,
-            'mode': replay.mode.value,
-            'playtime': int(timestamp),
-            'replay_id': replay.replay_id,
-            'perfect': replay.perfect,
-            'username': replay.username
-        }
-    }
\ No newline at end of file
+        "status": 200,
+        "replay": {
+            "map_md5": replay.beatmap_hash,
+            "score": replay.score,
+            "max_combo": replay.max_combo,
+            "mods": replay.mods.value,
+            "n300": replay.count_300,
+            "n100": replay.count_100,
+            "n50": replay.count_50,
+            "nmiss": replay.count_miss,
+            "ngeki": replay.count_geki,
+            "nkatu": replay.count_katu,
+            "mode": replay.mode.value,
+            "playtime": int(timestamp),
+            "replay_id": replay.replay_id,
+            "perfect": replay.perfect,
+            "username": replay.username,
+        },
+    }
diff --git a/blueprints/frontend.py b/blueprints/frontend.py
index 2dc1dd38..e25ca754 100644
--- a/blueprints/frontend.py
+++ b/blueprints/frontend.py
@@ -27,55 +27,61 @@
 from objects.glob import t
 from objects.varka import search_user
 
-VALID_MODES = frozenset({'std', 'taiko', 'catch', 'mania'})
-VALID_MODS = frozenset({'vn', 'rx', 'ap'})
+VALID_MODES = frozenset({"std", "taiko", "catch", "mania"})
+VALID_MODS = frozenset({"vn", "rx", "ap"})
 
-frontend = Blueprint('frontend', __name__)
+frontend = Blueprint("frontend", __name__)
 
 
 def login_required(func):
     @wraps(func)
     async def wrapper(*args, **kwargs):
         if not session:
-            return await flash('error', t('global.you-must-be-logged-in-to-access-this-page'), 'login')
+            return await flash(
+                "error", t("global.you-must-be-logged-in-to-access-this-page"), "login"
+            )
         return await func(*args, **kwargs)
+
     return wrapper
 
-@frontend.route('/home')
-@frontend.route('/')
+
+@frontend.route("/home")
+@frontend.route("/")
 async def home():
-    return await render_template('home.html')
+    return await render_template("home.html")
 
-@frontend.route('/home/account/edit')
+
+@frontend.route("/home/account/edit")
 async def home_account_edit():
-    return redirect('/settings/profile')
+    return redirect("/settings/profile")
+
 
-@frontend.route('/settings')
-@frontend.route('/settings/profile')
+@frontend.route("/settings")
+@frontend.route("/settings/profile")
 @login_required
 async def settings_profile():
-    return await render_template('settings/profile.html')
+    return await render_template("settings/profile.html")
+
 
-@frontend.route('/settings/profile', methods=['POST'])
+@frontend.route("/settings/profile", methods=["POST"])
 @login_required
 async def settings_profile_post():
     form = await request.form
 
-    new_name = form.get('username', type=str)
-    new_email = form.get('email', type=str)
+    new_name = form.get("username", type=str)
+    new_email = form.get("email", type=str)
 
     if new_name is None or new_email is None:
-        return await flash('error', t('global.invalid-parameters'), 'home')
+        return await flash("error", t("global.invalid-parameters"), "home")
 
-    old_name = session['user_data']['name']
-    old_email = session['user_data']['email']
+    old_name = session["user_data"]["name"]
+    old_email = session["user_data"]["email"]
 
     # no data has changed; deny post
-    if (
-        new_name == old_name and
-        new_email == old_email
-    ):
-        return await flash('error', t('settings.profile.no-changes-have-been-made'), 'settings/profile')
+    if new_name == old_name and new_email == old_email:
+        return await flash(
+            "error", t("settings.profile.no-changes-have-been-made"), "settings/profile"
+        )
 
     if new_name != old_name:
         # Usernames must:
@@ -83,29 +89,48 @@ async def settings_profile_post():
         # - not contain both ' ' and '_', one is fine
         # - not be in the config's `disallowed_names` list
         # - not already be taken by another player
-        if not session['user_data']['priv'] & Privileges.Supporter and glob.config.name_change_only_for_supporter:
-            return await flash('error', t('username-changes-supporter-only'), 'settings/profile')
+        if (
+            not session["user_data"]["priv"] & Privileges.Supporter
+            and glob.config.name_change_only_for_supporter
+        ):
+            return await flash(
+                "error", t("username-changes-supporter-only"), "settings/profile"
+            )
 
         if not regexes.username.match(new_name):
-            return await flash('error', t('settings.profile.new-username-is-invalid'), 'settings/profile')
+            return await flash(
+                "error",
+                t("settings.profile.new-username-is-invalid"),
+                "settings/profile",
+            )
 
-        if '_' in new_name and ' ' in new_name:
-            return await flash('error', t('settings.profile.new-username-cannot-contains-both-dash-and-space'), 'settings/profile')
+        if "_" in new_name and " " in new_name:
+            return await flash(
+                "error",
+                t("settings.profile.new-username-cannot-contains-both-dash-and-space"),
+                "settings/profile",
+            )
 
         if new_name in glob.config.disallowed_names:
-            return await flash('error', t('settings.profile.new-username-disallowed'), 'settings/profile')
+            return await flash(
+                "error",
+                t("settings.profile.new-username-disallowed"),
+                "settings/profile",
+            )
 
-        if await glob.db.fetch('SELECT 1 FROM users WHERE name = %s', [new_name]):
-            return await flash('error', t('settings.profile.new-username-already-taken-by-others'), 'settings/profile')
+        if await glob.db.fetch("SELECT 1 FROM users WHERE name = %s", [new_name]):
+            return await flash(
+                "error",
+                t("settings.profile.new-username-already-taken-by-others"),
+                "settings/profile",
+            )
 
         safe_name = utils.get_safe_name(new_name)
 
         # username change successful
         await glob.db.execute(
-            'UPDATE users '
-            'SET name = %s, safe_name = %s '
-            'WHERE id = %s',
-            [new_name, safe_name, session['user_data']['id']]
+            "UPDATE users " "SET name = %s, safe_name = %s " "WHERE id = %s",
+            [new_name, safe_name, session["user_data"]["id"]],
         )
 
     if new_email != old_email:
@@ -113,51 +138,63 @@ async def settings_profile_post():
         # - match the regex `^[^@\s]{1,200}@[^@\s\.]{1,30}\.[^@\.\s]{1,24}$`
         # - not already be taken by another player
         if not regexes.email.match(new_email):
-            return await flash('error', t('settings.profile.new-email-is-invalid'), 'settings/profile')
+            return await flash(
+                "error", t("settings.profile.new-email-is-invalid"), "settings/profile"
+            )
 
-        if await glob.db.fetch('SELECT 1 FROM users WHERE email = %s', [new_email]):
-            return await flash('error', '', 'settings/profile')
+        if await glob.db.fetch("SELECT 1 FROM users WHERE email = %s", [new_email]):
+            return await flash("error", "", "settings/profile")
 
         # email change successful
         await glob.db.execute(
-            'UPDATE users '
-            'SET email = %s '
-            'WHERE id = %s',
-            [new_email, session['user_data']['id']]
+            "UPDATE users " "SET email = %s " "WHERE id = %s",
+            [new_email, session["user_data"]["id"]],
         )
 
     # logout
-    session.pop('authenticated', None)
-    session.pop('user_data', None)
-    return await flash('success', t('settings.profile.succeed-please-login-again'), 'login')
+    session.pop("authenticated", None)
+    session.pop("user_data", None)
+    return await flash(
+        "success", t("settings.profile.succeed-please-login-again"), "login"
+    )
+
 
-@frontend.route('/settings/avatar')
+@frontend.route("/settings/avatar")
 @login_required
 async def settings_avatar():
-    return await render_template('settings/avatar.html')
+    return await render_template("settings/avatar.html")
 
-@frontend.route('/settings/avatar', methods=['POST'])
+
+@frontend.route("/settings/avatar", methods=["POST"])
 @login_required
 async def settings_avatar_post():
     # constants
-    AVATARS_PATH = f'{glob.config.path_to_gulag}/.data/avatars'
-    ALLOWED_EXTENSIONS = ['.jpeg', '.jpg', '.png']
+    AVATARS_PATH = f"{glob.config.path_to_gulag}/.data/avatars"
+    ALLOWED_EXTENSIONS = [".jpeg", ".jpg", ".png"]
 
-    avatar = (await request.files).get('avatar')
+    avatar = (await request.files).get("avatar")
 
     # no file uploaded; deny post
     if avatar is None or not avatar.filename:
-        return await flash('error', t('settings.no-image-was-selected'), 'settings/avatar')
+        return await flash(
+            "error", t("settings.no-image-was-selected"), "settings/avatar"
+        )
 
     filename, file_extension = os.path.splitext(avatar.filename.lower())
 
     # bad file extension; deny post
     if not file_extension in ALLOWED_EXTENSIONS:
-        return await flash('error', t('settings.bad-image-extension', something = t('settings.avatar').lower()), 'settings/avatar')
+        return await flash(
+            "error",
+            t("settings.bad-image-extension", something=t("settings.avatar").lower()),
+            "settings/avatar",
+        )
 
     # remove old avatars
     for fx in ALLOWED_EXTENSIONS:
-        if os.path.isfile(f'{AVATARS_PATH}/{session["user_data"]["id"]}{fx}'): # Checking file e
+        if os.path.isfile(
+            f'{AVATARS_PATH}/{session["user_data"]["id"]}{fx}'
+        ):  # Checking file e
             os.remove(f'{AVATARS_PATH}/{session["user_data"]["id"]}{fx}')
 
     # avatar cropping to 1:1
@@ -165,154 +202,241 @@ async def settings_avatar_post():
 
     # avatar change success
     pilavatar = utils.crop_image(pilavatar)
-    
+
     try:
-        pilavatar.save(os.path.join(AVATARS_PATH, f'{session["user_data"]["id"]}{file_extension.lower()}'))
+        pilavatar.save(
+            os.path.join(
+                AVATARS_PATH, f'{session["user_data"]["id"]}{file_extension.lower()}'
+            )
+        )
     except OSError:
-        pilavatar = pilavatar.convert('RGBA')
+        pilavatar = pilavatar.convert("RGBA")
         pilavatar.save(os.path.join(AVATARS_PATH, f'{session["user_data"]["id"]}.png'))
-    return await flash('success', t('settings.change-succeed', something = t('settings.avatar').lower()), 'settings/avatar')
+    return await flash(
+        "success",
+        t("settings.change-succeed", something=t("settings.avatar").lower()),
+        "settings/avatar",
+    )
 
-@frontend.route('/settings/custom')
+
+@frontend.route("/settings/custom")
 @login_required
 async def settings_custom():
-    profile_customizations = utils.has_profile_customizations(session['user_data']['id'])
-    return await render_template('settings/custom.html', customizations=profile_customizations)
+    profile_customizations = utils.has_profile_customizations(
+        session["user_data"]["id"]
+    )
+    return await render_template(
+        "settings/custom.html", customizations=profile_customizations
+    )
 
-@frontend.route('/settings/custom', methods=['POST'])
+
+@frontend.route("/settings/custom", methods=["POST"])
 @login_required
 async def settings_custom_post():
     files = await request.files
-    banner = files.get('banner')
-    background = files.get('background')
-    ALLOWED_EXTENSIONS = ['.jpeg', '.jpg', '.png', '.gif']
+    banner = files.get("banner")
+    background = files.get("background")
+    ALLOWED_EXTENSIONS = [".jpeg", ".jpg", ".png", ".gif"]
 
     # no file uploaded; deny post
     if banner is None and background is None:
-        return await flash_with_customizations('error', t('settings.no-image-was-selected'), 'settings/custom')
+        return await flash_with_customizations(
+            "error", t("settings.no-image-was-selected"), "settings/custom"
+        )
 
     if banner is not None and banner.filename:
         _, file_extension = os.path.splitext(banner.filename.lower())
         if not file_extension in ALLOWED_EXTENSIONS:
-            return await flash_with_customizations('error', t('settings.bad-image-extension', something = t('settings.banner').lower()), 'settings/custom')
+            return await flash_with_customizations(
+                "error",
+                t(
+                    "settings.bad-image-extension",
+                    something=t("settings.banner").lower(),
+                ),
+                "settings/custom",
+            )
 
-        banner_file_no_ext = os.path.join(f'.data/banners', f'{session["user_data"]["id"]}')
+        banner_file_no_ext = os.path.join(
+            f".data/banners", f'{session["user_data"]["id"]}'
+        )
 
         # remove old picture
         for ext in ALLOWED_EXTENSIONS:
-            banner_file_with_ext = f'{banner_file_no_ext}{ext}'
+            banner_file_with_ext = f"{banner_file_no_ext}{ext}"
             if os.path.isfile(banner_file_with_ext):
                 os.remove(banner_file_with_ext)
 
-        await banner.save(f'{banner_file_no_ext}{file_extension}')
+        await banner.save(f"{banner_file_no_ext}{file_extension}")
 
     if background is not None and background.filename:
         _, file_extension = os.path.splitext(background.filename.lower())
         if not file_extension in ALLOWED_EXTENSIONS:
-            return await flash_with_customizations('error', t('settings.bad-image-extension', something = t('settings.background').lower()), 'settings/custom')
+            return await flash_with_customizations(
+                "error",
+                t(
+                    "settings.bad-image-extension",
+                    something=t("settings.background").lower(),
+                ),
+                "settings/custom",
+            )
 
-        background_file_no_ext = os.path.join(f'.data/backgrounds', f'{session["user_data"]["id"]}')
+        background_file_no_ext = os.path.join(
+            f".data/backgrounds", f'{session["user_data"]["id"]}'
+        )
 
         # remove old picture
         for ext in ALLOWED_EXTENSIONS:
-            background_file_with_ext = f'{background_file_no_ext}{ext}'
+            background_file_with_ext = f"{background_file_no_ext}{ext}"
             if os.path.isfile(background_file_with_ext):
                 os.remove(background_file_with_ext)
 
-        await background.save(f'{background_file_no_ext}{file_extension}')
+        await background.save(f"{background_file_no_ext}{file_extension}")
+
+    return await flash_with_customizations(
+        "success",
+        t("settings.change-succeed", something=t("settings.customization").lower()),
+        "settings/custom",
+    )
 
-    return await flash_with_customizations('success', t('settings.change-succeed', something = t('settings.customization').lower()), 'settings/custom')
 
-@frontend.route('/settings/aboutme')
+@frontend.route("/settings/aboutme")
 @login_required
 async def settings_aboutme():
-    content = (await glob.db.fetch(
-        'SELECT userpage_content FROM users WHERE id = %s',
-        [session['user_data']['id']]
-    ))['userpage_content']
+    content = (
+        await glob.db.fetch(
+            "SELECT userpage_content FROM users WHERE id = %s",
+            [session["user_data"]["id"]],
+        )
+    )["userpage_content"]
     content = content if content is not None else ""
-    return await render_template('settings/aboutme.html', userpage_content=content)
+    return await render_template("settings/aboutme.html", userpage_content=content)
+
 
-@frontend.route('/settings/aboutme', methods=['POST'])
+@frontend.route("/settings/aboutme", methods=["POST"])
 @login_required
 async def settings_aboutme_post():
     form = await request.form
-    userpage_content = form.get('userpage_content', type=str)
+    userpage_content = form.get("userpage_content", type=str)
     safe_content = userpage_content.lower()
-    if '<iframe' in safe_content or '<script' in safe_content:
-        return await render_template('settings/aboutme.html', flash='Not allowed method', status='error', userpage_content=userpage_content)
-    if (len(userpage_content) > 2048):
-        return await render_template('settings/aboutme.html', flash='Too long text', status='error', userpage_content=userpage_content)
-    await glob.db.execute(
-            'UPDATE users '
-            'SET userpage_content = %s '
-            'WHERE id = %s',
-            [userpage_content, session['user_data']['id']]
+    if "<iframe" in safe_content or "<script" in safe_content:
+        return await render_template(
+            "settings/aboutme.html",
+            flash="Not allowed method",
+            status="error",
+            userpage_content=userpage_content,
+        )
+    if len(userpage_content) > 2048:
+        return await render_template(
+            "settings/aboutme.html",
+            flash="Too long text",
+            status="error",
+            userpage_content=userpage_content,
         )
-    session['user_data']['userpage_content'] = userpage_content
-    return await render_template('settings/aboutme.html', userpage_content=userpage_content)
+    await glob.db.execute(
+        "UPDATE users " "SET userpage_content = %s " "WHERE id = %s",
+        [userpage_content, session["user_data"]["id"]],
+    )
+    session["user_data"]["userpage_content"] = userpage_content
+    return await render_template(
+        "settings/aboutme.html", userpage_content=userpage_content
+    )
 
-@frontend.route('/settings/password')
+
+@frontend.route("/settings/password")
 @login_required
 async def settings_password():
-    return await render_template('settings/password.html')
+    return await render_template("settings/password.html")
+
 
-@frontend.route('/forgot')
+@frontend.route("/forgot")
 async def reset_password():
-    return await render_template('forgot.html')
+    return await render_template("forgot.html")
 
-@frontend.route('/settings/password', methods=["POST"])
+
+@frontend.route("/settings/password", methods=["POST"])
 @login_required
 async def settings_password_post():
     form = await request.form
-    old_password = form.get('old_password')
-    new_password = form.get('new_password')
-    repeat_password = form.get('repeat_password')
+    old_password = form.get("old_password")
+    new_password = form.get("new_password")
+    repeat_password = form.get("repeat_password")
 
     # new password and repeat password don't match; deny post
     if new_password != repeat_password:
-        return await flash('error', t('settings.password.new-passoword-mismatch-repeated-password'), 'settings/password')
+        return await flash(
+            "error",
+            t("settings.password.new-passoword-mismatch-repeated-password"),
+            "settings/password",
+        )
 
     # new password and old password match; deny post
     if old_password == new_password:
-        return await flash('error', t('settings.password.new-passoword-cannot-be-same-as-old-password'), 'settings/password')
+        return await flash(
+            "error",
+            t("settings.password.new-passoword-cannot-be-same-as-old-password"),
+            "settings/password",
+        )
 
     # Passwords must:
     # - be within 8-32 characters in length
     # - have more than 3 unique characters
     # - not be in the config's `disallowed_passwords` list
     if not 8 < len(new_password) <= 32:
-        return await flash('error', t('settings.password.must-between-8-32-characters-in-length'), 'settings/password')
+        return await flash(
+            "error",
+            t("settings.password.must-between-8-32-characters-in-length"),
+            "settings/password",
+        )
 
     if len(set(new_password)) <= 3:
-        return await flash('error', t('settings.password.must-have-more-than-3-unique-characters'), 'settings/password')
+        return await flash(
+            "error",
+            t("settings.password.must-have-more-than-3-unique-characters"),
+            "settings/password",
+        )
 
     if new_password.lower() in glob.config.disallowed_passwords:
-        return await flash('error', t('settings.password.too-simple'), 'settings/password')
+        return await flash(
+            "error", t("settings.password.too-simple"), "settings/password"
+        )
 
     # cache and other password related information
-    bcrypt_cache = glob.cache['bcrypt']
-    pw_bcrypt = (await glob.db.fetch(
-        'SELECT pw_bcrypt '
-        'FROM users '
-        'WHERE id = %s',
-        [session['user_data']['id']])
-    )['pw_bcrypt'].encode()
+    bcrypt_cache = glob.cache["bcrypt"]
+    pw_bcrypt = (
+        await glob.db.fetch(
+            "SELECT pw_bcrypt " "FROM users " "WHERE id = %s",
+            [session["user_data"]["id"]],
+        )
+    )["pw_bcrypt"].encode()
 
     pw_md5 = hashlib.md5(old_password.encode()).hexdigest().encode()
 
     # check old password against db
     # intentionally slow, will cache to speed up
     if pw_bcrypt in bcrypt_cache:
-        if pw_md5 != bcrypt_cache[pw_bcrypt]: # ~0.1ms
+        if pw_md5 != bcrypt_cache[pw_bcrypt]:  # ~0.1ms
             if glob.config.debug:
-                log(f"{session['user_data']['name']}'s change pw failed - pw incorrect.", Ansi.LYELLOW)
-            return await flash('error', t('settings.password.old-password-incorrect'), 'settings/password')
-    else: # ~200ms
+                log(
+                    f"{session['user_data']['name']}'s change pw failed - pw incorrect.",
+                    Ansi.LYELLOW,
+                )
+            return await flash(
+                "error",
+                t("settings.password.old-password-incorrect"),
+                "settings/password",
+            )
+    else:  # ~200ms
         if not bcrypt.checkpw(pw_md5, pw_bcrypt):
             if glob.config.debug:
-                log(f"{session['user_data']['name']}'s change pw failed - pw incorrect.", Ansi.LYELLOW)
-            return await flash('error', t('settings.password.old-password-incorrect'), 'settings/password')
+                log(
+                    f"{session['user_data']['name']}'s change pw failed - pw incorrect.",
+                    Ansi.LYELLOW,
+                )
+            return await flash(
+                "error",
+                t("settings.password.old-password-incorrect"),
+                "settings/password",
+            )
 
     # remove old password from cache
     if pw_bcrypt in bcrypt_cache:
@@ -325,193 +449,193 @@ async def settings_password_post():
     # update password in cache and db
     bcrypt_cache[pw_bcrypt] = pw_md5
     await glob.db.execute(
-        'UPDATE users '
-        'SET pw_bcrypt = %s '
-        'WHERE safe_name = %s',
-        [pw_bcrypt, utils.get_safe_name(session['user_data']['name'])]
+        "UPDATE users " "SET pw_bcrypt = %s " "WHERE safe_name = %s",
+        [pw_bcrypt, utils.get_safe_name(session["user_data"]["name"])],
     )
 
     # logout
-    session.pop('authenticated', None)
-    session.pop('user_data', None)
-    return await flash('success', t('settings.change-succeed', something = t('global.password')), 'login')
+    session.pop("authenticated", None)
+    session.pop("user_data", None)
+    return await flash(
+        "success", t("settings.change-succeed", something=t("global.password")), "login"
+    )
 
 
-@frontend.route('/u/<id>')
+@frontend.route("/u/<id>")
 async def profile_select(id):
 
-    mode = request.args.get('mode', 'std', type=str) # 1. key 2. default value
-    mods = request.args.get('mods', 'vn', type=str)
+    mode = request.args.get("mode", "std", type=str)  # 1. key 2. default value
+    mods = request.args.get("mods", "vn", type=str)
     user_data = await glob.db.fetch(
-        'SELECT name, safe_name, id, priv, country, userpage_content '
-        'FROM users '
-        'WHERE safe_name = %s OR id = %s LIMIT 1',
-        [utils.get_safe_name(id), id]
+        "SELECT name, safe_name, id, priv, country, userpage_content "
+        "FROM users "
+        "WHERE safe_name = %s OR id = %s LIMIT 1",
+        [utils.get_safe_name(id), id],
     )
 
     # no user and no bot page
     if not user_data or user_data["id"] == 1:
-        return (await render_template('404.html'), 404)
+        return (await render_template("404.html"), 404)
 
     # make sure mode & mods are valid args
     if mode is not None and mode not in VALID_MODES:
-        return (await render_template('404.html'), 404)
+        return (await render_template("404.html"), 404)
 
     if mods is not None and mods not in VALID_MODS:
-        return (await render_template('404.html'), 404)
+        return (await render_template("404.html"), 404)
 
-    is_staff = 'authenticated' in session and session['user_data']['is_staff']
-    if not user_data or not (user_data['priv'] & Privileges.Unrestricted or is_staff):
-        return (await render_template('404.html'), 404)
+    is_staff = "authenticated" in session and session["user_data"]["is_staff"]
+    if not user_data or not (user_data["priv"] & Privileges.Unrestricted or is_staff):
+        return (await render_template("404.html"), 404)
 
-    user_data['customisation'] = utils.has_profile_customizations(user_data['id'])
-    return await render_template('profile.html', user=user_data, mode=mode, mods=mods)
+    user_data["customisation"] = utils.has_profile_customizations(user_data["id"])
+    return await render_template("profile.html", user=user_data, mode=mode, mods=mods)
 
 
-@frontend.route('/leaderboard')
-@frontend.route('/lb')
-@frontend.route('/leaderboard/<mode>/<sort>/<mods>')
-@frontend.route('/lb/<mode>/<sort>/<mods>')
-async def leaderboard(mode='std', sort='pp', mods='vn'):
-    return await render_template('leaderboard.html', mode=mode, sort=sort, mods=mods)
+@frontend.route("/leaderboard")
+@frontend.route("/lb")
+@frontend.route("/leaderboard/<mode>/<sort>/<mods>")
+@frontend.route("/lb/<mode>/<sort>/<mods>")
+async def leaderboard(mode="std", sort="pp", mods="vn"):
+    return await render_template("leaderboard.html", mode=mode, sort=sort, mods=mods)
 
-@frontend.route('/login')
+
+@frontend.route("/login")
 async def login():
-    if 'authenticated' in session:
-        return await flash('error', t('global.you-are-already-logged-in'), 'home')
+    if "authenticated" in session:
+        return await flash("error", t("global.you-are-already-logged-in"), "home")
+
+    return await render_template("login.html")
 
-    return await render_template('login.html')
 
-@frontend.route('/login', methods=['POST'])
+@frontend.route("/login", methods=["POST"])
 async def login_post():
-    if 'authenticated' in session:
-        return await flash('error', t('global.you-are-already-logged-in'), 'home')
+    if "authenticated" in session:
+        return await flash("error", t("global.you-are-already-logged-in"), "home")
 
     if glob.config.debug:
         login_time = time.time_ns()
 
     form = await request.form
-    username = form.get('username', type=str)
-    passwd_txt = form.get('password', type=str)
+    username = form.get("username", type=str)
+    passwd_txt = form.get("password", type=str)
 
     if username is None or passwd_txt is None:
-        return await flash('error', t('global.invalid-parameters'), 'home')
+        return await flash("error", t("global.invalid-parameters"), "home")
 
     # check if account exists
     user_info = await glob.db.fetch(
-        'SELECT id, name, email, priv, '
-        'pw_bcrypt, silence_end, api_key, userpage_content '
-        'FROM users '
-        'WHERE safe_name = %s',
-        [utils.get_safe_name(username)]
+        "SELECT id, name, email, priv, "
+        "pw_bcrypt, silence_end, api_key, userpage_content "
+        "FROM users "
+        "WHERE safe_name = %s",
+        [utils.get_safe_name(username)],
     )
 
     # user doesn't exist; deny post
     # NOTE: Bot isn't a user.
-    if not user_info or user_info['id'] == 1:
+    if not user_info or user_info["id"] == 1:
         if glob.config.debug:
             log(f"{username}'s login failed - account doesn't exist.", Ansi.LYELLOW)
-        return await flash('error', t('login.account-does-not-exist'), 'login')
+        return await flash("error", t("login.account-does-not-exist"), "login")
 
     # cache and other related password information
-    bcrypt_cache = glob.cache['bcrypt']
-    pw_bcrypt = user_info['pw_bcrypt'].encode()
+    bcrypt_cache = glob.cache["bcrypt"]
+    pw_bcrypt = user_info["pw_bcrypt"].encode()
     pw_md5 = hashlib.md5(passwd_txt.encode()).hexdigest().encode()
 
     # check credentials (password) against db
     # intentionally slow, will cache to speed up
     if pw_bcrypt in bcrypt_cache:
-        if pw_md5 != bcrypt_cache[pw_bcrypt]: # ~0.1ms
+        if pw_md5 != bcrypt_cache[pw_bcrypt]:  # ~0.1ms
             if glob.config.debug:
                 log(f"{username}'s login failed - pw incorrect.", Ansi.LYELLOW)
-            return await flash('error', t('login.password-incorrect'), 'login')
-    else: # ~200ms
+            return await flash("error", t("login.password-incorrect"), "login")
+    else:  # ~200ms
         if not bcrypt.checkpw(pw_md5, pw_bcrypt):
             if glob.config.debug:
                 log(f"{username}'s login failed - pw incorrect.", Ansi.LYELLOW)
-            return await flash('error', t('login.password-incorrect'), 'login')
+            return await flash("error", t("login.password-incorrect"), "login")
 
         # login successful; cache password for next login
         bcrypt_cache[pw_bcrypt] = pw_md5
 
     # user not verified; render verify
-    if not user_info['priv'] & Privileges.Verified:
+    if not user_info["priv"] & Privileges.Verified:
         if glob.config.debug:
             log(f"{username}'s login failed - not verified.", Ansi.LYELLOW)
-        return await render_template('verify.html')
+        return await render_template("verify.html")
 
     # user banned; deny post
-    if not user_info['priv'] & Privileges.Unrestricted:
+    if not user_info["priv"] & Privileges.Unrestricted:
         if glob.config.debug:
             log(f"{username}'s login failed - banned.", Ansi.RED)
-        return await flash('error', t('login.restricted-not-allowed-to-login'), 'login')
+        return await flash("error", t("login.restricted-not-allowed-to-login"), "login")
 
-    api_key = user_info['api_key']
+    api_key = user_info["api_key"]
 
     if api_key is None and glob.config.create_api_key_if_not_exist:
         api_key = str(uuid.uuid4())
         await glob.db.execute(
-        "UPDATE users SET api_key = %s WHERE id = %s",
-        [api_key, user_info['id']]
-    )
+            "UPDATE users SET api_key = %s WHERE id = %s", [api_key, user_info["id"]]
+        )
 
     # login successful; store session data
     if glob.config.debug:
         log(f"{username}'s login succeeded.", Ansi.LGREEN)
 
-    session['authenticated'] = True
-    session['user_data'] = {
-        'id': user_info['id'],
-        'name': user_info['name'],
-        'email': user_info['email'],
-        'priv': user_info['priv'],
-        'api_key': api_key,
-        'silence_end': user_info['silence_end'],
-        'userpage_content': user_info['userpage_content'],
-        'is_staff': user_info['priv'] & Privileges.Staff != 0,
-        'is_bn': user_info['priv'] & Privileges.Nominator != 0,
-        'is_donator': user_info['priv'] & Privileges.Donator != 0
+    session["authenticated"] = True
+    session["user_data"] = {
+        "id": user_info["id"],
+        "name": user_info["name"],
+        "email": user_info["email"],
+        "priv": user_info["priv"],
+        "api_key": api_key,
+        "silence_end": user_info["silence_end"],
+        "userpage_content": user_info["userpage_content"],
+        "is_staff": user_info["priv"] & Privileges.Staff != 0,
+        "is_bn": user_info["priv"] & Privileges.Nominator != 0,
+        "is_donator": user_info["priv"] & Privileges.Donator != 0,
     }
 
     if glob.config.debug:
         login_time = (time.time_ns() - login_time) / 1e6
-        log(f'Login took {login_time:.2f}ms!', Ansi.LYELLOW)
+        log(f"Login took {login_time:.2f}ms!", Ansi.LYELLOW)
+
+    return await flash("success", t("login.welcome-back", username=username), "home")
 
-    return await flash('success', t('login.welcome-back', username = username), 'home')
 
-@frontend.route('/register')
+@frontend.route("/register")
 async def register():
-    if 'authenticated' in session:
-        return await flash('error', t('global.you-are-already-logged-in'), 'home')
+    if "authenticated" in session:
+        return await flash("error", t("global.you-are-already-logged-in"), "home")
 
     if not glob.config.registration:
-        return await flash('error', t('register.currently-disabled'), 'home')
+        return await flash("error", t("register.currently-disabled"), "home")
 
-    return await render_template('register.html')
+    return await render_template("register.html")
 
-@frontend.route('/register', methods=['POST'])
+
+@frontend.route("/register", methods=["POST"])
 async def register_post():
-    if 'authenticated' in session:
-        return await flash('error', t('global.you-are-already-logged-in'), 'home')
+    if "authenticated" in session:
+        return await flash("error", t("global.you-are-already-logged-in"), "home")
 
     if not glob.config.registration:
-        return await flash('error', t('register.currently-disabled'), 'home')
+        return await flash("error", t("register.currently-disabled"), "home")
 
     form = await request.form
-    username = form.get('username', type=str)
-    email = form.get('email', type=str)
-    passwd_txt = form.get('password', type=str)
+    username = form.get("username", type=str)
+    email = form.get("email", type=str)
+    passwd_txt = form.get("password", type=str)
 
     if username is None or email is None or passwd_txt is None:
-        return await flash('error', t('global.invalid-parameters'), 'home')
+        return await flash("error", t("global.invalid-parameters"), "home")
 
-    if glob.config.hCaptcha_sitekey != 'changeme':
-        captcha_data = form.get('h-captcha-response', type=str)
-        if (
-            captcha_data is None or
-            not await utils.validate_captcha(captcha_data)
-        ):
-            return await flash('error', t('register.captcha-failed'), 'register')
+    if glob.config.hCaptcha_sitekey != "changeme":
+        captcha_data = form.get("h-captcha-response", type=str)
+        if captcha_data is None or not await utils.validate_captcha(captcha_data):
+            return await flash("error", t("register.captcha-failed"), "register")
 
     # Usernames must:
     # - be within 2-15 characters in length
@@ -520,161 +644,191 @@ async def register_post():
     # - not already be taken by another player
     # check if username exists
     if not regexes.username.match(username):
-        return await flash('error', t('register.username-syntax-is-invalid'), 'register')
+        return await flash(
+            "error", t("register.username-syntax-is-invalid"), "register"
+        )
 
-    if '_' in username and ' ' in username:
-        return await flash('error', t('register.username-cannot-contains-both-dash-and-space'), 'register')
+    if "_" in username and " " in username:
+        return await flash(
+            "error",
+            t("register.username-cannot-contains-both-dash-and-space"),
+            "register",
+        )
 
     if username in glob.config.disallowed_names:
-        return await flash('error', t('register.username-disallowed'), 'register')
+        return await flash("error", t("register.username-disallowed"), "register")
 
-    if await glob.db.fetch('SELECT 1 FROM users WHERE name = %s', username):
-        return await flash('error', t('register.username-already-taken-by-others'), 'register')
+    if await glob.db.fetch("SELECT 1 FROM users WHERE name = %s", username):
+        return await flash(
+            "error", t("register.username-already-taken-by-others"), "register"
+        )
 
     # Emails must:
     # - match the regex `^[^@\s]{1,200}@[^@\s\.]{1,30}\.[^@\.\s]{1,24}$`
     # - not already be taken by another player
     if not regexes.email.match(email):
-        return await flash('error', t('register.email-is-invalid'), 'register')
+        return await flash("error", t("register.email-is-invalid"), "register")
 
-    if await glob.db.fetch('SELECT 1 FROM users WHERE email = %s', email):
-        return await flash('error', t('register.email-already-taken'), 'register')
+    if await glob.db.fetch("SELECT 1 FROM users WHERE email = %s", email):
+        return await flash("error", t("register.email-already-taken"), "register")
 
     # Passwords must:
     # - be within 8-32 characters in length
     # - have more than 3 unique characters
     # - not be in the config's `disallowed_passwords` list
     if not 8 <= len(passwd_txt) <= 32:
-        return await flash('error', t('register.password.must-between-8-32-characters-in-length'), 'register')
+        return await flash(
+            "error",
+            t("register.password.must-between-8-32-characters-in-length"),
+            "register",
+        )
 
     if len(set(passwd_txt)) <= 3:
-        return await flash('error', t('register.password.must-have-more-than-3-unique-characters'), 'register')
+        return await flash(
+            "error",
+            t("register.password.must-have-more-than-3-unique-characters"),
+            "register",
+        )
 
     if passwd_txt.lower() in glob.config.disallowed_passwords:
-        return await flash('error', t('register.password.too-simple'), 'register')
+        return await flash("error", t("register.password.too-simple"), "register")
 
     # TODO: add correct locking
     # (start of lock)
     pw_md5 = hashlib.md5(passwd_txt.encode()).hexdigest().encode()
     pw_bcrypt = bcrypt.hashpw(pw_md5, bcrypt.gensalt())
-    glob.cache['bcrypt'][pw_bcrypt] = pw_md5 # cache pw
+    glob.cache["bcrypt"][pw_bcrypt] = pw_md5  # cache pw
 
     safe_name = utils.get_safe_name(username)
 
     # fetch the users' country
     if (
-        request.headers and
-        (ip := request.headers.get('X-Real-IP', type=str)) is not None
+        request.headers
+        and (ip := request.headers.get("X-Real-IP", type=str)) is not None
     ):
         country = await utils.fetch_geoloc(ip)
     else:
-        country = 'xx'
+        country = "xx"
 
     async with glob.db.pool.acquire() as conn:
         async with conn.cursor() as db_cursor:
             # add to `users` table.
             await db_cursor.execute(
-                'INSERT INTO users '
-                '(name, safe_name, email, pw_bcrypt, country, creation_time, latest_activity) '
-                'VALUES (%s, %s, %s, %s, %s, UNIX_TIMESTAMP(), UNIX_TIMESTAMP())',
-                [username, safe_name, email, pw_bcrypt, country]
+                "INSERT INTO users "
+                "(name, safe_name, email, pw_bcrypt, country, creation_time, latest_activity) "
+                "VALUES (%s, %s, %s, %s, %s, UNIX_TIMESTAMP(), UNIX_TIMESTAMP())",
+                [username, safe_name, email, pw_bcrypt, country],
             )
             user_id = db_cursor.lastrowid
 
             # add to `stats` table.
             await db_cursor.executemany(
-                'INSERT INTO stats '
-                '(id, mode) VALUES (%s, %s)',
-                [(user_id, mode) for mode in (
-                    0,  # vn!std
-                    1,  # vn!taiko
-                    2,  # vn!catch
-                    3,  # vn!mania
-                    4,  # rx!std
-                    5,  # rx!taiko
-                    6,  # rx!catch
-                    8,  # ap!std
-                )]
+                "INSERT INTO stats " "(id, mode) VALUES (%s, %s)",
+                [
+                    (user_id, mode)
+                    for mode in (
+                        0,  # vn!std
+                        1,  # vn!taiko
+                        2,  # vn!catch
+                        3,  # vn!mania
+                        4,  # rx!std
+                        5,  # rx!taiko
+                        6,  # rx!catch
+                        8,  # ap!std
+                    )
+                ],
             )
 
     # (end of lock)
 
     if glob.config.debug:
-        log(f'{username} has registered - awaiting verification.', Ansi.LGREEN)
+        log(f"{username} has registered - awaiting verification.", Ansi.LGREEN)
 
     # user has successfully registered
-    return await render_template('verify.html')
+    return await render_template("verify.html")
 
-@frontend.route('/logout')
+
+@frontend.route("/logout")
 async def logout():
-    if 'authenticated' not in session:
-        return await flash('error', t('logout.cannot-logout-if-not-logged-in'), 'login')
+    if "authenticated" not in session:
+        return await flash("error", t("logout.cannot-logout-if-not-logged-in"), "login")
 
     if glob.config.debug:
         log(f'{session["user_data"]["name"]} logged out.', Ansi.LGREEN)
 
     # clear session data
-    session.pop('authenticated', None)
-    session.pop('user_data', None)
+    session.pop("authenticated", None)
+    session.pop("user_data", None)
 
     # render login
-    return await flash('success', t('logout.succeed'), 'login')
+    return await flash("success", t("logout.succeed"), "login")
+
 
-@frontend.route('/search')
+@frontend.route("/search")
 async def user_search():
-    q = request.args.get('q', type=str)
+    q = request.args.get("q", type=str)
     return await search_user(q)
 
+
 # social media redirections
 
-@frontend.route('/github')
-@frontend.route('/gh')
+
+@frontend.route("/github")
+@frontend.route("/gh")
 async def github_redirect():
     return redirect(glob.config.github)
 
-@frontend.route('/discord')
+
+@frontend.route("/discord")
 async def discord_redirect():
     return redirect(glob.config.discord_server)
 
-@frontend.route('/youtube')
-@frontend.route('/yt')
+
+@frontend.route("/youtube")
+@frontend.route("/yt")
 async def youtube_redirect():
     return redirect(glob.config.youtube)
 
-@frontend.route('/twitter')
+
+@frontend.route("/twitter")
 async def twitter_redirect():
     return redirect(glob.config.twitter)
 
-@frontend.route('/instagram')
-@frontend.route('/ig')
+
+@frontend.route("/instagram")
+@frontend.route("/ig")
 async def instagram_redirect():
     return redirect(glob.config.instagram)
 
+
 # profile customisation
-BANNERS_PATH = Path.cwd() / '.data/banners'
-BACKGROUND_PATH = Path.cwd() / '.data/backgrounds'
-@frontend.route('/banners/<user_id>')
+BANNERS_PATH = Path.cwd() / ".data/banners"
+BACKGROUND_PATH = Path.cwd() / ".data/backgrounds"
+
+
+@frontend.route("/banners/<user_id>")
 async def get_profile_banner(user_id: int):
     # Check if avatar exists
-    for ext in ('jpg', 'jpeg', 'png', 'gif'):
-        path = BANNERS_PATH / f'{user_id}.{ext}'
+    for ext in ("jpg", "jpeg", "png", "gif"):
+        path = BANNERS_PATH / f"{user_id}.{ext}"
         if path.exists():
             return await send_file(path)
 
     return b'{"status":404}'
 
-@frontend.route('/language/<lang>/<path:path>')
-@frontend.route('/language/<lang>/', defaults = {'path' : 'home'})
+
+@frontend.route("/language/<lang>/<path:path>")
+@frontend.route("/language/<lang>/", defaults={"path": "home"})
 async def set_language(lang: str, path: str):
-    session['lang'] = lang
-    return redirect('/' + path)
+    session["lang"] = lang
+    return redirect("/" + path)
 
 
-@frontend.route('/backgrounds/<user_id>')
+@frontend.route("/backgrounds/<user_id>")
 async def get_profile_background(user_id: int):
     # Check if avatar exists
-    for ext in ('jpg', 'jpeg', 'png', 'gif'):
-        path = BACKGROUND_PATH / f'{user_id}.{ext}'
+    for ext in ("jpg", "jpeg", "png", "gif"):
+        path = BACKGROUND_PATH / f"{user_id}.{ext}"
         if path.exists():
             return await send_file(path)
 
diff --git a/config.sample.py b/config.sample.py
index d4db8d91..92eed03f 100644
--- a/config.sample.py
+++ b/config.sample.py
@@ -24,60 +24,69 @@
 # end env
 
 # app name
-app_name = _app_name if _app_name is not None else 'guweb'
+app_name = _app_name if _app_name is not None else "guweb"
 
 # secret key
-secret_key = _secret_key if _secret_key is not None else 'changeme'
+secret_key = _secret_key if _secret_key is not None else "changeme"
 
-#hCaptcha settings:
-hCaptcha_sitekey = _h_captcha_sitekey if _h_captcha_sitekey is not None else 'changeme'
-hCaptcha_secret = _h_captcha_secret if _h_captcha_secret is not None else 'changeme'
+# hCaptcha settings:
+hCaptcha_sitekey = _h_captcha_sitekey if _h_captcha_sitekey is not None else "changeme"
+hCaptcha_secret = _h_captcha_secret if _h_captcha_secret is not None else "changeme"
 
 # domain (used for api, avatar, etc)
 # *.dev.ppy.sb are resolved as 127.0.0.1, you can keep it as it is when developing.
-domain = _domain if _domain is not None else 'dev.ppy.sb'
+domain = _domain if _domain is not None else "dev.ppy.sb"
 
 # mysql credentials
 mysql = {
-    'db': _db_database if _db_database is not None else 'banchopy',
-    'host': _db_host if _db_host is not None else 'mysql',
-    'user': _db_user if _db_user is not None else 'root',
-    'password': _db_password if _db_password is not None else '',
+    "db": _db_database if _db_database is not None else "banchopy",
+    "host": _db_host if _db_host is not None else "mysql",
+    "user": _db_user if _db_user is not None else "root",
+    "password": _db_password if _db_password is not None else "",
 }
 
 # path to gulag root (must have leading and following slash),
 # you don't need to change this assume you put /guweb and /bancho.py in the same folder.
-path_to_gulag = _path_to_bancho_py if _path_to_bancho_py is not None else os.path.join(os.getcwd(), '../bancho.py') + '/'
+path_to_gulag = (
+    _path_to_bancho_py
+    if _path_to_bancho_py is not None
+    else os.path.join(os.getcwd(), "../bancho.py") + "/"
+)
 
 # enable debug (disable when in production to improve performance)
 debug = _is_dev
 
 # disallowed names (hardcoded banned usernames)
-disallowed_names = {
-    'cookiezi', 'rrtyui',
-    'hvick225', 'qsc20010'
-}
+disallowed_names = {"cookiezi", "rrtyui", "hvick225", "qsc20010"}
 
 # disallowed passwords (hardcoded banned passwords)
-disallowed_passwords = {
-    'password', 'minilamp'
-}
+disallowed_passwords = {"password", "minilamp"}
 
 # enable registration
 registration = _registration_allowed if _registration_allowed is not None else True
 
 # create api_key if not exist (admin panel update maps requires the api key)
-create_api_key_if_not_exist = _create_api_key_if_not_exist if _create_api_key_if_not_exist is not None else False
+create_api_key_if_not_exist = (
+    _create_api_key_if_not_exist if _create_api_key_if_not_exist is not None else False
+)
 
 # only supporters can change their username through user edit page
-name_change_only_for_supporter = _name_change_only_for_supporter if _name_change_only_for_supporter is not None else True
+name_change_only_for_supporter = (
+    _name_change_only_for_supporter
+    if _name_change_only_for_supporter is not None
+    else True
+)
 
-default_locale = _default_locale if _default_locale is not None else 'en_GB'
+default_locale = _default_locale if _default_locale is not None else "en_GB"
 
 # social links (used throughout guweb)
-github = 'https://github.com/ppy-sb/guweb'
+github = "https://github.com/ppy-sb/guweb"
 discord_invite_id = _discord_invite_id
-discord_server = 'https://discord.com/invite/' + discord_invite_id if discord_invite_id is not None else None
-youtube = 'https://youtube.com/'
-twitter = 'https://twitter.com/'
-instagram = 'https://instagram.com/'
+discord_server = (
+    "https://discord.com/invite/" + discord_invite_id
+    if discord_invite_id is not None
+    else None
+)
+youtube = "https://youtube.com/"
+twitter = "https://twitter.com/"
+instagram = "https://instagram.com/"
diff --git a/constants/beatmaps.py b/constants/beatmaps.py
index 5d57b850..90dd9e0b 100644
--- a/constants/beatmaps.py
+++ b/constants/beatmaps.py
@@ -8,4 +8,4 @@ class RankedStatus(IntEnum):
     Ranked = 2
     Approved = 3
     Qualified = 4
-    Loved = 5
\ No newline at end of file
+    Loved = 5
diff --git a/constants/privileges.py b/constants/privileges.py
index 2c0affbb..ba44c5bd 100644
--- a/constants/privileges.py
+++ b/constants/privileges.py
@@ -3,33 +3,34 @@
 from enum import IntFlag
 from enum import unique
 
-__all__ = ('Privileges',)
+__all__ = ("Privileges",)
+
 
 @unique
 class Privileges(IntFlag):
     """Server side user privileges."""
 
     # privileges intended for all normal players.
-    
-    Unrestricted = 1 << 0 # is an unbanned player.
-    Verified    = 1 << 1 # has logged in to the server in-game.
+
+    Unrestricted = 1 << 0  # is an unbanned player.
+    Verified = 1 << 1  # has logged in to the server in-game.
 
     # has bypass to low-ceiling anticheat measures (trusted).
     Whitelisted = 1 << 2
 
     # donation tiers, receives some extra benefits.
-    Supporter   = 1 << 4
-    Premium     = 1 << 5
+    Supporter = 1 << 4
+    Premium = 1 << 5
 
     # notable users, receives some extra benefits.
-    Alumni      = 1 << 7
+    Alumni = 1 << 7
 
     # staff permissions, able to manage server state.
-    Tournament  = 1 << 10 # able to manage match state without host.
-    Nominator   = 1 << 11 # able to manage maps ranked status.
-    Mod         = 1 << 12 # able to manage users (level 1).
-    Admin       = 1 << 13 # able to manage users (level 2).
-    Dangerous   = 1 << 14 # able to manage full server state.
+    Tournament = 1 << 10  # able to manage match state without host.
+    Nominator = 1 << 11  # able to manage maps ranked status.
+    Mod = 1 << 12  # able to manage users (level 1).
+    Admin = 1 << 13  # able to manage users (level 2).
+    Dangerous = 1 << 14  # able to manage full server state.
 
     Donator = Supporter | Premium
     Staff = Mod | Admin | Dangerous
diff --git a/constants/regexes.py b/constants/regexes.py
index f4a7da49..ef5dbc00 100644
--- a/constants/regexes.py
+++ b/constants/regexes.py
@@ -2,5 +2,5 @@
 
 import re
 
-username = re.compile(r'^[\w \[\]-]{2,15}$')
-email = re.compile(r'^[^@\s]{1,200}@[^@\s\.]{1,30}\.[^@\.\s]{1,24}$')
+username = re.compile(r"^[\w \[\]-]{2,15}$")
+email = re.compile(r"^[^@\s]{1,200}@[^@\s\.]{1,30}\.[^@\.\s]{1,24}$")
diff --git a/main.py b/main.py
index ed573a85..c98a3caf 100755
--- a/main.py
+++ b/main.py
@@ -18,37 +18,46 @@
 # we recommend using a long randomly generated ascii string.
 app.secret_key = glob.config.secret_key
 
+
 @app.before_serving
 async def mysql_conn() -> None:
     glob.db = AsyncSQLPool()
-    await glob.db.connect(glob.config.mysql) # type: ignore
-    log('Connected to MySQL!', Ansi.LGREEN)
+    await glob.db.connect(glob.config.mysql)  # type: ignore
+    log("Connected to MySQL!", Ansi.LGREEN)
+
 
 @app.before_serving
 async def load_lang():
-    i18n.load_path.append(os.getcwd() + '/.locales')
+    i18n.load_path.append(os.getcwd() + "/.locales")
+
 
 @app.before_serving
 async def http_conn() -> None:
     glob.http = aiohttp.ClientSession(json_serialize=lambda x: orjson.dumps(x).decode())
-    log('Got our Client Session!', Ansi.LGREEN)
+    log("Got our Client Session!", Ansi.LGREEN)
+
 
 @app.after_serving
 async def shutdown() -> None:
     await glob.db.close()
     await glob.http.close()
 
+
 from blueprints.frontend import frontend
+
 app.register_blueprint(frontend)
 
 from blueprints.admin import admin
-app.register_blueprint(admin, url_prefix='/admin')
+
+app.register_blueprint(admin, url_prefix="/admin")
+
 
 @app.errorhandler(404)
 async def page_not_found(e):
     # NOTE: we set the 404 status explicitly
-    return (await render_template('404.html'), 404)
+    return (await render_template("404.html"), 404)
+
 
-if __name__ == '__main__':
+if __name__ == "__main__":
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    app.run(host='0.0.0.0', port=10000, debug=glob.config.debug)  # blocking call
+    app.run(host="0.0.0.0", port=10000, debug=glob.config.debug)  # blocking call
diff --git a/objects/utils.py b/objects/utils.py
index 16cc1cfc..062e316a 100644
--- a/objects/utils.py
+++ b/objects/utils.py
@@ -15,151 +15,154 @@
 if TYPE_CHECKING:
     from PIL.Image import Image
 
+
 async def flash(status: str, msg: str, template: str) -> str:
     """Flashes a success/error message on a specified template."""
-    return await render_template(f'{template}.html', flash=msg, status=status)
+    return await render_template(f"{template}.html", flash=msg, status=status)
+
 
 async def flash_with_customizations(status: str, msg: str, template: str) -> str:
     """Flashes a success/error message on a specified template. (for customisation settings)"""
-    profile_customizations = utils.has_profile_customizations(session['user_data']['id'])
+    profile_customizations = utils.has_profile_customizations(
+        session["user_data"]["id"]
+    )
     return await render_template(
-        template_name_or_list=f'{template}.html',
+        template_name_or_list=f"{template}.html",
         flash=msg,
         status=status,
-        customizations=profile_customizations
+        customizations=profile_customizations,
     )
 
+
 def get_safe_name(name: str) -> str:
     """Returns the safe version of a username."""
     # Safe name should meet few criterias.
     # - Whole name should be lower letters.
     # - Space must be replaced with _
-    return name.lower().replace(' ', '_')
+    return name.lower().replace(" ", "_")
+
 
 def convert_mode_int(mode: str) -> Optional[int]:
     """Converts mode (str) to mode (int)."""
     if mode not in _str_mode_dict:
-        print('invalid mode passed into utils.convert_mode_int?')
+        print("invalid mode passed into utils.convert_mode_int?")
         return
     return _str_mode_dict[mode]
 
-_str_mode_dict = {
-    'std': 0,
-    'taiko': 1,
-    'catch': 2,
-    'mania': 3
-}
+
+_str_mode_dict = {"std": 0, "taiko": 1, "catch": 2, "mania": 3}
+
 
 def convert_mode_str(mode: int) -> Optional[str]:
     """Converts mode (int) to mode (str)."""
     if mode not in _mode_str_dict:
-        print('invalid mode passed into utils.convert_mode_str?')
+        print("invalid mode passed into utils.convert_mode_str?")
         return
     return _mode_str_dict[mode]
 
-_mode_str_dict = {
-    0: 'std',
-    1: 'taiko',
-    2: 'catch',
-    3: 'mania'
-}
+
+_mode_str_dict = {0: "std", 1: "taiko", 2: "catch", 3: "mania"}
+
 
 async def fetch_geoloc(ip: str) -> str:
     """Fetches the country code corresponding to an IP."""
-    url = f'http://ip-api.com/line/{ip}'
+    url = f"http://ip-api.com/line/{ip}"
 
     async with glob.http.get(url) as resp:
         if not resp or resp.status != 200:
             if glob.config.debug:
-                log('Failed to get geoloc data: request failed.', Ansi.LRED)
-            return 'xx'
-        status, *lines = (await resp.text()).split('\n')
-        if status != 'success':
+                log("Failed to get geoloc data: request failed.", Ansi.LRED)
+            return "xx"
+        status, *lines = (await resp.text()).split("\n")
+        if status != "success":
             if glob.config.debug:
-                log(f'Failed to get geoloc data: {lines[0]}.', Ansi.LRED)
-            return 'xx'
+                log(f"Failed to get geoloc data: {lines[0]}.", Ansi.LRED)
+            return "xx"
         return lines[1].lower()
 
+
 async def validate_captcha(data: str) -> bool:
     """Verify `data` with hcaptcha's API."""
-    url = f'https://hcaptcha.com/siteverify'
+    url = f"https://hcaptcha.com/siteverify"
 
-    request_data = {
-        'secret': glob.config.hCaptcha_secret,
-        'response': data
-    }
+    request_data = {"secret": glob.config.hCaptcha_secret, "response": data}
 
     async with glob.http.post(url, data=request_data) as resp:
         if not resp or resp.status != 200:
             if glob.config.debug:
-                log('Failed to verify captcha: request failed.', Ansi.LRED)
+                log("Failed to verify captcha: request failed.", Ansi.LRED)
             return False
 
         res = await resp.json()
 
-        return res['success']
+        return res["success"]
+
 
 def get_required_score_for_level(level: int) -> float:
-	if level <= 100:
-		if level >= 2:
-			return 5000 / 3 * (4 * (level ** 3) - 3 * (level ** 2) - level) + 1.25 * (1.8 ** (level - 60))
-		else:
-			return 1.0  # Should be 0, but we get division by 0 below so set to 1
-	else:
-		return 26931190829 + 1e11 * (level - 100)
+    if level <= 100:
+        if level >= 2:
+            return 5000 / 3 * (4 * (level**3) - 3 * (level**2) - level) + 1.25 * (
+                1.8 ** (level - 60)
+            )
+        else:
+            return 1.0  # Should be 0, but we get division by 0 below so set to 1
+    else:
+        return 26931190829 + 1e11 * (level - 100)
+
 
 def get_level(totalScore: int) -> int:
-	level = 1
-	while True:
-		# Avoid endless loops
-		if level > 120:
-			return level
-
-		# Calculate required score
-		reqScore = get_required_score_for_level(level)
-
-		# Check if this is our level
-		if totalScore <= reqScore:
-			# Our level, return it and break
-			return level - 1
-		else:
-			# Not our level, calculate score for next level
-			level += 1
-
-BANNERS_PATH = Path.cwd() / '.data/banners'
-BACKGROUND_PATH = Path.cwd() / '.data/backgrounds'
+    level = 1
+    while True:
+        # Avoid endless loops
+        if level > 120:
+            return level
+
+        # Calculate required score
+        reqScore = get_required_score_for_level(level)
+
+        # Check if this is our level
+        if totalScore <= reqScore:
+            # Our level, return it and break
+            return level - 1
+        else:
+            # Not our level, calculate score for next level
+            level += 1
+
+
+BANNERS_PATH = Path.cwd() / ".data/banners"
+BACKGROUND_PATH = Path.cwd() / ".data/backgrounds"
+
+
 def has_profile_customizations(user_id: int = 0) -> dict[str, bool]:
     # check for custom banner image file
-    for ext in ('jpg', 'jpeg', 'png', 'gif'):
-        path = BANNERS_PATH / f'{user_id}.{ext}'
+    for ext in ("jpg", "jpeg", "png", "gif"):
+        path = BANNERS_PATH / f"{user_id}.{ext}"
         if has_custom_banner := path.exists():
             break
     else:
         has_custom_banner = False
 
     # check for custom background image file
-    for ext in ('jpg', 'jpeg', 'png', 'gif'):
-        path = BACKGROUND_PATH / f'{user_id}.{ext}'
+    for ext in ("jpg", "jpeg", "png", "gif"):
+        path = BACKGROUND_PATH / f"{user_id}.{ext}"
         if has_custom_background := path.exists():
             break
     else:
         has_custom_background = False
 
-    return {
-        'banner' : has_custom_banner,
-        'background': has_custom_background
-    }
+    return {"banner": has_custom_banner, "background": has_custom_background}
+
 
-def crop_image(image: 'Image') -> 'Image':
+def crop_image(image: "Image") -> "Image":
     width, height = image.size
     if width == height:
         return image
 
-    offset = int(abs(height-width) / 2)
+    offset = int(abs(height - width) / 2)
 
     if width > height:
-        image = image.crop([offset, 0, width-offset, height])
+        image = image.crop([offset, 0, width - offset, height])
     else:
-        image = image.crop([0, offset, width, height-offset])
+        image = image.crop([0, offset, width, height - offset])
 
     return image
diff --git a/objects/varka.py b/objects/varka.py
index 495c7d0f..8a3a95d0 100644
--- a/objects/varka.py
+++ b/objects/varka.py
@@ -1,7 +1,8 @@
 from quart import jsonify
 from objects import glob
 
-async def get_users(limit:int=100, search:str=None):
+
+async def get_users(limit: int = 100, search: str = None):
     """Returns the all of a users."""
     query = """
         select 
@@ -21,66 +22,76 @@ async def get_users(limit:int=100, search:str=None):
             ON i1.id = i2.max_id
         ) as l
         on u.id = l.userid
-    """.replace('  ', ' ').splitlines()
+    """.replace(
+        "  ", " "
+    ).splitlines()
     args = []
 
     if search:
         query.append("WHERE u.`name` LIKE %s")
-        args.append(f'{search}%')
+        args.append(f"{search}%")
         query.append("OR u.`email` LIKE %s")
-        args.append(f'{search}%')
+        args.append(f"{search}%")
         query.append("OR CONVERT(u.`id`, char) LIKE %s")
-        args.append(f'{search}%%')
+        args.append(f"{search}%%")
 
-    query.append(f'ORDER BY l.`datetime` DESC LIMIT %s')
+    query.append(f"ORDER BY l.`datetime` DESC LIMIT %s")
     args.append(limit)
-    
-    
-    query = ' '.join(query)
+
+    query = " ".join(query)
     res = await glob.db.fetchall(query, args)
     return res
 
-async def get_user(id:int):
+
+async def get_user(id: int):
     """Returns the all of a users."""
-    query = (f'SELECT * FROM users WHERE id={id}')
+    query = f"SELECT * FROM users WHERE id={id}"
     res = await glob.db.fetch(query)
     return res
 
-async def get_user_username(username:str):
-    query = (f'SELECT id from users WHERE name="{username}"')
+
+async def get_user_username(username: str):
+    query = f'SELECT id from users WHERE name="{username}"'
     res = await glob.db.fetch(query)
     return res
 
-async def get_user_email(email:str):
-    query = (f'SELECT id from users WHERE email="{email}"')
+
+async def get_user_email(email: str):
+    query = f'SELECT id from users WHERE email="{email}"'
     res = await glob.db.fetch(query)
     return res
 
+
 async def get_res_users():
-    query = ('select ru.id, ru.country, ru.name,`logs`.msg, `logs`.time  from (SELECT * FROM `users` where NOT users.priv & 1) ru left join `logs` on ru.id=`logs`.to')
+    query = "select ru.id, ru.country, ru.name,`logs`.msg, `logs`.time  from (SELECT * FROM `users` where NOT users.priv & 1) ru left join `logs` on ru.id=`logs`.to"
     res = await glob.db.fetchall(query)
     return res
 
-async def get_scores(limit:int=25):
+
+async def get_scores(limit: int = 25):
     """Returns the all of a scores."""
     query = (
-        'SELECT scores_vn.*, maps.artist, maps.title, '
-        'maps.set_id, maps.creator, maps.version '
-        'FROM scores_vn '
-        'JOIN maps ON scores_vn.map_md5 = maps.md5 '
-        f'ORDER BY scores_vn.id DESC LIMIT {limit}'
+        "SELECT scores_vn.*, maps.artist, maps.title, "
+        "maps.set_id, maps.creator, maps.version "
+        "FROM scores_vn "
+        "JOIN maps ON scores_vn.map_md5 = maps.md5 "
+        f"ORDER BY scores_vn.id DESC LIMIT {limit}"
     )
     res = await glob.db.fetchall(query)
     return res
 
-async def get_data(table_name:str, id:str):
-    if table_name in ('users'):
+
+async def get_data(table_name: str, id: str):
+    if table_name in ("users"):
         if id.isdigit():
-            return await glob.db.fetch('select * from `%s` where id = %s limit 1' % (table_name, id))
+            return await glob.db.fetch(
+                "select * from `%s` where id = %s limit 1" % (table_name, id)
+            )
         else:
-            return (404)
+            return 404
     else:
-        return (404)
+        return 404
+
 
 async def update(table, id, **kargs):
     params = []
@@ -89,8 +100,11 @@ async def update(table, id, **kargs):
             params.append(f"{k}='{v}'")
         else:
             params.append(f"{k}=NULL")
-    await glob.db.execute("UPDATE `%s` SET %s WHERE %s = '%s'" % (table, ', '.join(params), *id))
-    return 'ok'
+    await glob.db.execute(
+        "UPDATE `%s` SET %s WHERE %s = '%s'" % (table, ", ".join(params), *id)
+    )
+    return "ok"
+
 
 async def insert(table, **kargs):
     params = []
@@ -99,21 +113,22 @@ async def insert(table, **kargs):
             params.append(f"{k}='{v}'")
         else:
             params.append(f"{k}=NULL")
-    return glob.db.execute("INSERT INTO `%s` SET %s" % (table, ', '.join(params)))
+    return glob.db.execute("INSERT INTO `%s` SET %s" % (table, ", ".join(params)))
+
 
 async def search_user(keyword: str):
     if not keyword:
-        return b'{}'
+        return b"{}"
     result = await glob.db.fetchall(
-        'SELECT id, name '
-        'FROM `users` '
-        'WHERE priv >= 3 '
-        'AND ('
-        '   `name` LIKE %s '
-        '   OR CONVERT(`id`, char) LIKE %s '
-        ') LIMIT 5',
-        [keyword + '%%', keyword + '%%']
+        "SELECT id, name "
+        "FROM `users` "
+        "WHERE priv >= 3 "
+        "AND ("
+        "   `name` LIKE %s "
+        "   OR CONVERT(`id`, char) LIKE %s "
+        ") LIMIT 5",
+        [keyword + "%%", keyword + "%%"],
     )
-    if (len(result) == 0):
-        return b'{}'
-    return jsonify(result) 
+    if len(result) == 0:
+        return b"{}"
+    return jsonify(result)

From 75162fe14b7a8222a8990274f9afdba990c3488f Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 2 Dec 2022 11:21:58 +0900
Subject: [PATCH 262/278] profile__literal

---
 .vscode/settings.json              | 3 ++-
 locales/default/global/en-GB.yml   | 4 ++--
 locales/default/global/en-US.yml   | 4 ++--
 locales/default/global/zh-CN.yml   | 4 ++--
 locales/default/navbar/en-GB.yml   | 2 +-
 locales/default/navbar/en-US.yml   | 2 +-
 locales/default/navbar/zh-CN.yml   | 2 +-
 locales/default/settings/en-GB.yml | 2 +-
 locales/default/settings/en-US.yml | 2 +-
 locales/default/settings/zh-CN.yml | 2 +-
 10 files changed, 14 insertions(+), 13 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index f963fc36..f284a4d6 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -56,5 +56,6 @@
   "files.associations": {
     "*.html": "jinja-html"
   },
-  "python.formatting.provider": "black"
+  "python.formatting.provider": "black",
+  "githubPullRequests.ignoredPullRequestBranches": ["main"]
 }
diff --git a/locales/default/global/en-GB.yml b/locales/default/global/en-GB.yml
index ddbcd319..483a38c5 100644
--- a/locales/default/global/en-GB.yml
+++ b/locales/default/global/en-GB.yml
@@ -4,7 +4,7 @@ offline: Offline
 online: Online
 leaderboard: Leaderboard
 login: Login
-profile: Profile
+unused_profile__literal: Profile
 register: Register
 password: Password
 bannertype-error: Warning
@@ -42,7 +42,7 @@ invalid-parameters: Invalid parameters.
 you-are-already-logged-in: You're already logged in!
 you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
 grade: Grade
-grades-N: 'N'
+grades-N: "N"
 grades-F: F
 grades-D: D
 grades-C: C
diff --git a/locales/default/global/en-US.yml b/locales/default/global/en-US.yml
index ddbcd319..483a38c5 100644
--- a/locales/default/global/en-US.yml
+++ b/locales/default/global/en-US.yml
@@ -4,7 +4,7 @@ offline: Offline
 online: Online
 leaderboard: Leaderboard
 login: Login
-profile: Profile
+unused_profile__literal: Profile
 register: Register
 password: Password
 bannertype-error: Warning
@@ -42,7 +42,7 @@ invalid-parameters: Invalid parameters.
 you-are-already-logged-in: You're already logged in!
 you-must-be-logged-in-to-access-this-page: You must be logged in to access this page.
 grade: Grade
-grades-N: 'N'
+grades-N: "N"
 grades-F: F
 grades-D: D
 grades-C: C
diff --git a/locales/default/global/zh-CN.yml b/locales/default/global/zh-CN.yml
index 3ea3f672..c3ffca1a 100644
--- a/locales/default/global/zh-CN.yml
+++ b/locales/default/global/zh-CN.yml
@@ -4,7 +4,7 @@ offline: 离线
 online: 在线
 leaderboard: 排行榜
 login: 登录
-profile: 用户信息
+unused_profile__literal: 用户信息
 register: 注册
 bannertype-success: 操作成功
 bannertype-error: 出错了
@@ -42,7 +42,7 @@ invalid-parameters: 请输入用户名密码以及邮箱
 you-are-already-logged-in: 你已经登录啦!
 you-must-be-logged-in-to-access-this-page: 你必须登录了才能访问该页面
 grade: 评分
-grades-N: 'N'
+grades-N: "N"
 grades-F: F
 grades-D: D
 grades-C: C
diff --git a/locales/default/navbar/en-GB.yml b/locales/default/navbar/en-GB.yml
index 8b8a2b23..91616655 100644
--- a/locales/default/navbar/en-GB.yml
+++ b/locales/default/navbar/en-GB.yml
@@ -2,7 +2,7 @@ home: Home
 leaderboards: Leaderboards
 information: Information
 admin: Admin
-profile: Profile
+unused_profile__literal: Profile
 settings: Settings
 logout: Logout
 todo: Todo..
diff --git a/locales/default/navbar/en-US.yml b/locales/default/navbar/en-US.yml
index 8b8a2b23..91616655 100644
--- a/locales/default/navbar/en-US.yml
+++ b/locales/default/navbar/en-US.yml
@@ -2,7 +2,7 @@ home: Home
 leaderboards: Leaderboards
 information: Information
 admin: Admin
-profile: Profile
+unused_profile__literal: Profile
 settings: Settings
 logout: Logout
 todo: Todo..
diff --git a/locales/default/navbar/zh-CN.yml b/locales/default/navbar/zh-CN.yml
index 576f5e9a..6d3cfb27 100644
--- a/locales/default/navbar/zh-CN.yml
+++ b/locales/default/navbar/zh-CN.yml
@@ -2,7 +2,7 @@ home: 主页
 leaderboards: 排行榜
 information: 文档
 admin: 管理员
-profile: 玩家资料
+unused_profile__literal: 玩家资料
 settings: 设置
 logout: 登出
 todo: 敬请期待
diff --git a/locales/default/settings/en-GB.yml b/locales/default/settings/en-GB.yml
index f01cd416..00c7da59 100644
--- a/locales/default/settings/en-GB.yml
+++ b/locales/default/settings/en-GB.yml
@@ -14,7 +14,7 @@ password-change: Password Change
 old-password: Old Password
 new-password: New Password
 repeat-password: Repeat Password
-profile: Profile
+unused_profile__literal: Profile
 user-information: User Infomation
 username: Username
 settings: Settings
diff --git a/locales/default/settings/en-US.yml b/locales/default/settings/en-US.yml
index 1d6d73c7..a9bb0aad 100644
--- a/locales/default/settings/en-US.yml
+++ b/locales/default/settings/en-US.yml
@@ -14,7 +14,7 @@ password-change: Password Change
 old-password: Old Password
 new-password: New Password
 repeat-password: Repeat Password
-profile: Profile
+unused_profile__literal: Profile
 user-information: User Infomation
 username: Username
 settings: Settings
diff --git a/locales/default/settings/zh-CN.yml b/locales/default/settings/zh-CN.yml
index a8a351fb..7baebf46 100644
--- a/locales/default/settings/zh-CN.yml
+++ b/locales/default/settings/zh-CN.yml
@@ -13,7 +13,7 @@ password-change: 更改密码
 old-password: 旧密码
 new-password: 新密码
 repeat-password: 确认新密码
-profile: 玩家资料
+unused_profile__literal: 玩家资料
 user-information: 用户信息
 username: 你的用户名
 settings: 设置

From 5e2cfe7c7ef755b10a6e01ceb99a3914f7b18532 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 2 Dec 2022 11:26:58 +0900
Subject: [PATCH 263/278] navbar.profile

---
 .vscode/i18n-ally-custom-framework.yml | 7 ++-----
 locales/default/global/en-GB.yml       | 2 +-
 locales/default/global/en-US.yml       | 2 +-
 locales/default/global/zh-CN.yml       | 2 +-
 locales/default/navbar/en-GB.yml       | 2 +-
 locales/default/navbar/en-US.yml       | 2 +-
 locales/default/navbar/zh-CN.yml       | 2 +-
 locales/default/settings/en-GB.yml     | 2 +-
 locales/default/settings/en-US.yml     | 2 +-
 locales/default/settings/zh-CN.yml     | 2 +-
 10 files changed, 11 insertions(+), 14 deletions(-)

diff --git a/.vscode/i18n-ally-custom-framework.yml b/.vscode/i18n-ally-custom-framework.yml
index a4e6eda4..97c342d7 100644
--- a/.vscode/i18n-ally-custom-framework.yml
+++ b/.vscode/i18n-ally-custom-framework.yml
@@ -6,7 +6,6 @@ languageIds:
   - html
   - jinja-html
   - python
-  
 
 # An array of RegExes to find the key usage. **The key should be captured in the first match group**.
 # You should unescape RegEx strings in order to fit in the YAML file
@@ -17,14 +16,12 @@ usageMatchRegex:
   # you can ignore it and use your own matching rules as well
   - "[^\\w\\d]t\\(['\"`]({key})['\"`]"
 
-
 # An array of strings containing refactor templates.
 # The "$1" will be replaced by the keypath specified.
 # Optional: uncomment the following two lines to use
 
 refactorTemplates:
- - t("$1")
-
+  - t("$1")
 
 # If set to true, only enables this custom framework (will disable all built-in frameworks)
-monopoly: true
\ No newline at end of file
+monopoly: true
diff --git a/locales/default/global/en-GB.yml b/locales/default/global/en-GB.yml
index 483a38c5..6c6c7aae 100644
--- a/locales/default/global/en-GB.yml
+++ b/locales/default/global/en-GB.yml
@@ -4,7 +4,7 @@ offline: Offline
 online: Online
 leaderboard: Leaderboard
 login: Login
-unused_profile__literal: Profile
+profile__literal: Profile
 register: Register
 password: Password
 bannertype-error: Warning
diff --git a/locales/default/global/en-US.yml b/locales/default/global/en-US.yml
index 483a38c5..6c6c7aae 100644
--- a/locales/default/global/en-US.yml
+++ b/locales/default/global/en-US.yml
@@ -4,7 +4,7 @@ offline: Offline
 online: Online
 leaderboard: Leaderboard
 login: Login
-unused_profile__literal: Profile
+profile__literal: Profile
 register: Register
 password: Password
 bannertype-error: Warning
diff --git a/locales/default/global/zh-CN.yml b/locales/default/global/zh-CN.yml
index c3ffca1a..d21d598c 100644
--- a/locales/default/global/zh-CN.yml
+++ b/locales/default/global/zh-CN.yml
@@ -4,7 +4,7 @@ offline: 离线
 online: 在线
 leaderboard: 排行榜
 login: 登录
-unused_profile__literal: 用户信息
+profile__literal: 用户信息
 register: 注册
 bannertype-success: 操作成功
 bannertype-error: 出错了
diff --git a/locales/default/navbar/en-GB.yml b/locales/default/navbar/en-GB.yml
index 91616655..8b8a2b23 100644
--- a/locales/default/navbar/en-GB.yml
+++ b/locales/default/navbar/en-GB.yml
@@ -2,7 +2,7 @@ home: Home
 leaderboards: Leaderboards
 information: Information
 admin: Admin
-unused_profile__literal: Profile
+profile: Profile
 settings: Settings
 logout: Logout
 todo: Todo..
diff --git a/locales/default/navbar/en-US.yml b/locales/default/navbar/en-US.yml
index 91616655..8b8a2b23 100644
--- a/locales/default/navbar/en-US.yml
+++ b/locales/default/navbar/en-US.yml
@@ -2,7 +2,7 @@ home: Home
 leaderboards: Leaderboards
 information: Information
 admin: Admin
-unused_profile__literal: Profile
+profile: Profile
 settings: Settings
 logout: Logout
 todo: Todo..
diff --git a/locales/default/navbar/zh-CN.yml b/locales/default/navbar/zh-CN.yml
index 6d3cfb27..576f5e9a 100644
--- a/locales/default/navbar/zh-CN.yml
+++ b/locales/default/navbar/zh-CN.yml
@@ -2,7 +2,7 @@ home: 主页
 leaderboards: 排行榜
 information: 文档
 admin: 管理员
-unused_profile__literal: 玩家资料
+profile: 玩家资料
 settings: 设置
 logout: 登出
 todo: 敬请期待
diff --git a/locales/default/settings/en-GB.yml b/locales/default/settings/en-GB.yml
index 00c7da59..a11b6998 100644
--- a/locales/default/settings/en-GB.yml
+++ b/locales/default/settings/en-GB.yml
@@ -14,7 +14,7 @@ password-change: Password Change
 old-password: Old Password
 new-password: New Password
 repeat-password: Repeat Password
-unused_profile__literal: Profile
+profile__literal: Profile
 user-information: User Infomation
 username: Username
 settings: Settings
diff --git a/locales/default/settings/en-US.yml b/locales/default/settings/en-US.yml
index a9bb0aad..45cca2b6 100644
--- a/locales/default/settings/en-US.yml
+++ b/locales/default/settings/en-US.yml
@@ -14,7 +14,7 @@ password-change: Password Change
 old-password: Old Password
 new-password: New Password
 repeat-password: Repeat Password
-unused_profile__literal: Profile
+profile__literal: Profile
 user-information: User Infomation
 username: Username
 settings: Settings
diff --git a/locales/default/settings/zh-CN.yml b/locales/default/settings/zh-CN.yml
index 7baebf46..4393fefe 100644
--- a/locales/default/settings/zh-CN.yml
+++ b/locales/default/settings/zh-CN.yml
@@ -13,7 +13,7 @@ password-change: 更改密码
 old-password: 旧密码
 new-password: 新密码
 repeat-password: 确认新密码
-unused_profile__literal: 玩家资料
+profile__literal: 玩家资料
 user-information: 用户信息
 username: 你的用户名
 settings: 设置

From ed80f363c549fa1750acdbe4b330bf00b9f34c9e Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Fri, 2 Dec 2022 11:58:33 +0900
Subject: [PATCH 264/278] fix missing i18n keys

---
 .vscode/i18n-ally-custom-framework.yml        |   4 +-
 .vscode/settings.json                         |   7 +-
 locales/default/admin/upload-replay/en-GB.yml |   5 +-
 locales/default/admin/upload-replay/en-US.yml |   5 +-
 locales/default/admin/upload-replay/zh-CN.yml |   5 +-
 locales/default/osr-reader/en-GB.yml          |   2 +
 templates/admin/users/upload-scores.html      |  15 +-
 templates/profile.html                        | 203 ++++++------------
 templates/settings/profile.html               |  18 +-
 templates/settings/sidebar.html               |   7 +-
 10 files changed, 113 insertions(+), 158 deletions(-)
 create mode 100644 locales/default/osr-reader/en-GB.yml

diff --git a/.vscode/i18n-ally-custom-framework.yml b/.vscode/i18n-ally-custom-framework.yml
index 97c342d7..8fe16edf 100644
--- a/.vscode/i18n-ally-custom-framework.yml
+++ b/.vscode/i18n-ally-custom-framework.yml
@@ -14,7 +14,9 @@ usageMatchRegex:
   # The following example shows how to detect `t("your.i18n.keys")`
   # the `{key}` will be placed by a proper keypath matching regex,
   # you can ignore it and use your own matching rules as well
-  - "[^\\w\\d]t\\(['\"`]({key})['\"`]"
+  - "[^\\w\\d]t\\('({key})'"
+  - "[^\\w\\d]t\\(\"({key})\""
+  - "[^\\w\\d]t\\(`({key})`"
 
 # An array of strings containing refactor templates.
 # The "$1" will be replaced by the keypath specified.
diff --git a/.vscode/settings.json b/.vscode/settings.json
index f284a4d6..477cff42 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,5 +1,4 @@
 {
-  "nuxt.isNuxtApp": false,
   "i18n-ally.namespace": true,
   "i18n-ally.pathMatcher": "{namespaces}/{locale}.{ext}",
   "i18n-ally.localesPaths": ["locales/default", "locales/ppy.sb"],
@@ -34,9 +33,13 @@
       // affect scope (optional)
       // see https://github.com/lokalise/i18n-ally/blob/master/src/core/types.ts#L156-L156
       "source": "html-inline",
-      "templates": ["t('{key}'{args})", "t('{key}'{args})"],
+      "templates": ["t('{key}'{args})", "t(\"{key}\"{args})"],
       // accept globs, resolved to project root (optional)
       "include": ["templates/**/*.html"]
+    },
+    {
+      "templates": ["t('{key}'{args})", "t(\"{key}\"{args})"],
+      "include": ["blueprints/**/*.py", "objects/**/*.py", "constants/**/*.py"]
     }
     // ...
   ],
diff --git a/locales/default/admin/upload-replay/en-GB.yml b/locales/default/admin/upload-replay/en-GB.yml
index 2644b3a6..4755d6ec 100644
--- a/locales/default/admin/upload-replay/en-GB.yml
+++ b/locales/default/admin/upload-replay/en-GB.yml
@@ -1,6 +1,9 @@
 upload-score-for: Upload score for %{name}
 identifier-type: Identifier type
-replay-username: Replay username
+identifier-types:
+  server-user-id: Server's User ID
+  replay-username: Replay username
+  replay-id: Replay ID
 outer_identifier: Outer identifier
 map-md5: map md5
 max-combo: Max combo
diff --git a/locales/default/admin/upload-replay/en-US.yml b/locales/default/admin/upload-replay/en-US.yml
index d4e26a69..2124cceb 100644
--- a/locales/default/admin/upload-replay/en-US.yml
+++ b/locales/default/admin/upload-replay/en-US.yml
@@ -1,6 +1,9 @@
 upload-score-for: Upload score for %{name}
 identifier-type: Identifier type
-replay-username: Replay username
+identifier-types:
+  server-user-id: Server's User ID
+  replay-username: Replay username
+  replay-id: Replay ID
 outer_identifier: Outer identifier
 map-md5: map md5
 max-combo: Max combo
diff --git a/locales/default/admin/upload-replay/zh-CN.yml b/locales/default/admin/upload-replay/zh-CN.yml
index 0c9b28be..c42ad331 100644
--- a/locales/default/admin/upload-replay/zh-CN.yml
+++ b/locales/default/admin/upload-replay/zh-CN.yml
@@ -1,6 +1,9 @@
 upload-score-for: 上传 %{name} 的成绩
 identifier-type: 身份标识类型
-replay-username: 回放者的用户名
+identifier-types:
+  server-user-id: Server's User ID
+  replay-username: 回放者的用户名
+  replay-id: Replay ID
 outer_identifier: 外部成绩的来源身份标识
 map-md5: 谱面的md5
 max-combo: 最大连击数
diff --git a/locales/default/osr-reader/en-GB.yml b/locales/default/osr-reader/en-GB.yml
new file mode 100644
index 00000000..d8ad831c
--- /dev/null
+++ b/locales/default/osr-reader/en-GB.yml
@@ -0,0 +1,2 @@
+replay-id: Replay ID
+username: Username
diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
index aeb8716c..097ac978 100644
--- a/templates/admin/users/upload-scores.html
+++ b/templates/admin/users/upload-scores.html
@@ -25,7 +25,8 @@
 <script>
     document.addEventListener('DOMContentLoaded', () => {
         transaction(state => {
-            state.apiKey = {{ session.user_data['api_key'] | JSON }}
+            state.apiKey = {{ session.user_data['api_key'] | JSON }
+        }
             state.userId = {{ search_data.id | JSON }}
         }, false)
     })
@@ -137,11 +138,11 @@
                             <span class="select">
                                 <select name="identifier_type" required>
                                     <option value="replay_username">
-                                        {{ t("admin.upload-replay.identifier-types.replay_username") }}</option>
+                                        {{ t("admin.upload-replay.identifier-types.replay-username") }}</option>
                                     <option value="server_userid">
-                                        {{ t("admin.upload-replay.identifier-types.server_userid") }}
+                                        {{ t("admin.upload-replay.identifier-types.server-user-id") }}
                                     </option>
-                                    <option value="replay_id">{{ t("admin.upload-replay.identifier-types.replay_id") }}
+                                    <option value="replay_id">{{ t("admin.upload-replay.identifier-types.replay-id") }}
                                     </option>
                                 </select>
                             </span>
@@ -239,7 +240,7 @@
             </div>
 
             <!-- <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.replay_id") }}</div>
+                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.replay-id") }}</div>
                 <div class="column py-0">
                     <input type="number" class="input" name="replay_id">
                 </div>
@@ -261,8 +262,8 @@
             <hr>
             <div class="panel-block pb-4">
                 <div style="margin-left: auto;"></div>
-                <button type="submit" form="submit-replay"
-                    class="button is-primary">{{ t("admin.upload-replay.upload") }}</button>
+                <button type="submit" form="submit-replay" class="button is-primary">{{ t("admin.upload-replay.upload")
+                    }}</button>
                 <div style="margin-right: 1em;"></div>
             </div>
         </form>
diff --git a/templates/profile.html b/templates/profile.html
index 81d14fc1..cf1257f8 100644
--- a/templates/profile.html
+++ b/templates/profile.html
@@ -1,4 +1,4 @@
-{% extends 'base.html' %} {% block title %} {{ t('global.profile') }} {%
+{% extends 'base.html' %} {% block title %} {{ t('global.profile__literal') }} {%
 endblock %} {% macro userpage(user) %} {% if user['userpage_content'] != None
 and user['userpage_content'] != "" %}
 <div class="log-block">
@@ -19,38 +19,30 @@
     <div class="title"><i class="fas fa-trophy"></i> {{ title }}</div>
   </div>
   <div v-if="data.scores.{{ id }}.out.length" class="scores">
-    <div
-      v-for="(map, index) in data.scores.{{ id }}.out"
-      class="map-single"
-      ref="scores"
-      :key="map.beatmap.map_id"
-      :style="`background: linear-gradient(hsl(var(--main), 25%, 25%, 90%), hsl(var(--main), 25%, 25%, 90%)), url(https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/cover.jpg)`"
-    >
-      <div
-        class="map-data"
-        @click="window.open(`https://osu.ppy.sh/beatmaps/${map.beatmap.id}`) "
-      >
+    <div v-for="(map, index) in data.scores.{{ id }}.out" class="map-single" ref="scores" :key="map.beatmap.map_id"
+      :style="`background: linear-gradient(hsl(var(--main), 25%, 25%, 90%), hsl(var(--main), 25%, 25%, 90%)), url(https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/cover.jpg)`">
+      <div class="map-data" @click="window.open(`https://osu.ppy.sh/beatmaps/${map.beatmap.id}`) ">
         <div class="map-content1">
           <div class="map-image">
-            <img
-              :src="`https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/card.jpg`"
-              class="map-image-picture"
-              defer
-            />
+            <img :src="`https://assets.ppy.sh/beatmaps/${map.beatmap.set_id}/covers/card.jpg`" class="map-image-picture"
+              defer />
           </div>
           <div class="map-title-block">
             <div class="map-title">
               <a class="beatmap-link">
-                <% map.beatmap.artist %> - <% map.beatmap.title %> [<%
-                map.beatmap.version %>]
+                <% map.beatmap.artist %> - <% map.beatmap.title %> [<% map.beatmap.version %>]
               </a>
             </div>
             <div class="play-stats">
               <% getScoreMods(map.mods) %> /
-              <b> <% addCommas(map.max_combo) %> </b>x
+                <b>
+                  <% addCommas(map.max_combo) %>
+                </b>x
             </div>
             <div class="map-date">
-              <time> <% timeago.format(map.play_time) %> </time>
+              <time>
+                <% timeago.format(map.play_time) %>
+              </time>
             </div>
           </div>
         </div>
@@ -59,9 +51,7 @@
             <div class="score-details_right-block">
               <div class="score-details_pp-block">
                 <div class="map-pp">
-                  <% addCommas(map.pp.toFixed()) %><span class="map-pp-unit"
-                    >{{ t('global.pp') }}</span
-                  >
+                  <% addCommas(map.pp.toFixed()) %><span class="map-pp-unit">{{ t('global.pp') }}</span>
                 </div>
                 <div class="map-acc">
                   {{ t('global.accuracy') }}:&nbsp;<b>
@@ -94,9 +84,7 @@ <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
     </div>
   </div>
   <div v-if="data.scores.{{ id }}.more.full == false" class="extra-block">
-    <a class="show-button rounded-sm" @click="AddLimit('{{ id }}score')"
-      >{{ t('profile.show-more') }}</a
-    >
+    <a class="show-button rounded-sm" @click="AddLimit('{{ id }}score')">{{ t('profile.show-more') }}</a>
   </div>
 </div>
 {% endmacro %} {% macro maps(title, id) %}
@@ -105,26 +93,26 @@ <h1 class="title is-6">{{ t('profile.no-scores-available') }}</h1>
     <div class="title"><i class="fas fa-address-book"></i> {{ title }}</div>
   </div>
   <div v-if="data.maps.{{ id }}.out.length" class="beatmaps">
-    <a
-      v-for="(map, index) in data.maps.{{ id }}.out"
-      class="beatmap-block rounded-sm"
-      ref="mostPlayed"
-      :key="map.id"
-    >
-      <div
-        class="beatmap-preview"
-        :style="{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }"
-      ></div>
+    <a v-for="(map, index) in data.maps.{{ id }}.out" class="beatmap-block rounded-sm" ref="mostPlayed" :key="map.id">
+      <div class="beatmap-preview"
+        :style="{ background: `url(https://assets.ppy.sh/beatmaps/${map.set_id}/covers/card.jpg)` }"></div>
       <div class="beatmap-stats">
-        <span class="beatmap-title"> <% map.title %> </span>
-        <span class="beatmap-artist"> <% map.artist %> </span>
+        <span class="beatmap-title">
+          <% map.title %>
+        </span>
+        <span class="beatmap-artist">
+          <% map.artist %>
+        </span>
         <div class="beatmap-footer">
           <span class="beatmap-mapper">
             {{ t('profile.by') }}
-            <span class="newmaps-color"> <% map.creator %> </span></span
-          >
+            <span class="newmaps-color">
+              <% map.creator %>
+            </span></span>
           <div class="d-flex align-items-baseline">
-            <span> <% map.plays %> </span>
+            <span>
+              <% map.plays %>
+            </span>
             <div class="target-button newmaps-color">
               <i class="fas fa-arrow-right"></i>
             </div>
@@ -145,27 +133,22 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
     </div>
   </div>
   <div v-show="data.maps.{{ id }}.more.full == false" class="extra-block">
-    <a class="show-button rounded-sm" @click="AddLimit('mostplay')"
-      >{{ t('profile.show-more') }}</a
-    >
+    <a class="show-button rounded-sm" @click="AddLimit('mostplay')">{{ t('profile.show-more') }}</a>
   </div>
 </div>
 {% endmacro %} {% block header %}
 <script src="/static/js/assets/vue.js?v={{ appVersion() }} "></script>
 <script src="/static/js/assets/vue-axios.js?v={{ appVersion() }} "></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/timeago.js/4.0.2/timeago.min.js"></script>
-<link
-  rel="stylesheet"
-  href="/static/css/pages/profile.css?v={{ appVersion() }} "
-/>
+<link rel="stylesheet" href="/static/css/pages/profile.css?v={{ appVersion() }} " />
 
 <script>
   window.addEventListener('load', () => {
-      window._state = createState({
-          userid: {{ user['id'] | JSON }},
-          mode: {{ mode | JSON }},
-          mods: {{ mods | JSON }},
-          domain: {{ domain() | JSON }}
+    window._state = createState({
+      userid: {{ user['id'] | JSON }},
+    mode: {{ mode | JSON }},
+    mods: {{ mods | JSON }},
+    domain: {{ domain() | JSON }}
       })
   })
 </script>
@@ -265,10 +248,7 @@ <h1 class="title is-6">{{ t('profile.no-beatmaps-available') }}</h1>
       <div class="info-block">
         <h1 class="title">
           <p class="ranks">
-            <img
-              src="/static/images/flags/{{ user['country']|upper }}.png"
-              class="profile-flag"
-            />
+            <img src="/static/images/flags/{{ user['country']|upper }}.png" class="profile-flag" />
             <span class="bgf">{{ user['name'] }}</span>
           </p>
         </h1>
@@ -276,15 +256,11 @@ <h1 class="title">
           <div class="subtitle" v-if="data.status.online == false">
             <a class="circle">●</a> {{ t('global.offline') }}
           </div>
-          <div
-            class="subtitle"
-            v-else-if="data.status.online == true"
-            :style="{
+          <div class="subtitle" v-else-if="data.status.online == true" :style="{
                         display: 'flex',
                         gap: '0.5em',
                         alignItems: 'center'
-                    }"
-          >
+                    }">
             <a class="circle green">●</a> {{ t('global.online') }}
             <transition name="click">
               <div class="online-infomation" :key="`online-information`">
@@ -302,67 +278,35 @@ <h1 class="title">
     </div>
     <div class="profile-flex">
       <div class="profile-avatar-area">
-        <img
-          src="https://a.{{ domain() }}/{{ user['id'] }}"
-          alt="avatar"
-          class="rounded-avatar profile-avatar"
-          onError="this.src='/static/images/avatar_notwork.png';"
-          defer
-        />
+        <img src="https://a.{{ domain() }}/{{ user['id'] }}" alt="avatar" class="rounded-avatar profile-avatar"
+          onError="this.src='/static/images/avatar_notwork.png';" defer />
       </div>
       <div class="bar-selection mode-selects">
         <div class="select-left">
-          <a
-            class="simple-banner-switch"
-            :class="{ 'selected': mode === 'std' }"
-            @click="ChangeModeMods('std',mods)"
-            ><i class="mode-icon mode-osu"></i
-            ><span class="mode-text">{{ t('global.mode.osu') }}</span></a
-          >
-          <a
-            class="simple-banner-switch"
-            :class="{ 'selected': mode === 'taiko', 'disabled': mods === 'ap' }"
-            @click="ChangeModeMods('taiko',mods)"
-            ><i class="mode-icon mode-taiko"></i
-            ><span class="mode-text">{{ t('global.mode.taiko') }}</span></a
-          >
-          <a
-            class="simple-banner-switch"
-            :class="{ 'selected': mode === 'catch', 'disabled': mods === 'ap' }"
-            @click="ChangeModeMods('catch',mods)"
-            ><i class="mode-icon mode-catch"></i
-            ><span class="mode-text">{{ t('global.mode.catch') }}</span></a
-          >
-          <a
-            class="simple-banner-switch"
+          <a class="simple-banner-switch" :class="{ 'selected': mode === 'std' }" @click="ChangeModeMods('std',mods)"><i
+              class="mode-icon mode-osu"></i><span class="mode-text">{{ t('global.mode.osu') }}</span></a>
+          <a class="simple-banner-switch" :class="{ 'selected': mode === 'taiko', 'disabled': mods === 'ap' }"
+            @click="ChangeModeMods('taiko',mods)"><i class="mode-icon mode-taiko"></i><span class="mode-text">{{
+              t('global.mode.taiko') }}</span></a>
+          <a class="simple-banner-switch" :class="{ 'selected': mode === 'catch', 'disabled': mods === 'ap' }"
+            @click="ChangeModeMods('catch',mods)"><i class="mode-icon mode-catch"></i><span class="mode-text">{{
+              t('global.mode.catch') }}</span></a>
+          <a class="simple-banner-switch"
             :class="{ 'selected': mode === 'mania', 'disabled': mods === 'ap' || mods === 'rx' }"
-            @click="ChangeModeMods('mania',mods)"
-            ><i class="mode-icon mode-mania"></i
-            ><span class="mode-text">{{ t('global.mode.mania') }}</span></a
-          >
+            @click="ChangeModeMods('mania',mods)"><i class="mode-icon mode-mania"></i><span class="mode-text">{{
+              t('global.mode.mania') }}</span></a>
         </div>
         <div class="select-right">
-          <a
-            class="simple-banner-switch"
-            :class=" { 'selected': mods === 'vn' }"
-            @click="ChangeModeMods(mode,'vn')"
-            ><span class="mods-fulltext">{{ t('global.mode.vanilla') }}</span>
-            <span class="mods-shorttext">{{ t('global.mode.VN') }}</span></a
-          >
-          <a
-            class="simple-banner-switch"
-            :class=" { 'selected': mods === 'rx', 'disabled': mode === 'mania' }"
-            @click="ChangeModeMods(mode,'rx')"
-            ><span class="mods-fulltext">{{ t('global.mode.relax') }}</span>
-            <span class="mods-shorttext">{{ t('global.mode.RX') }}</span></a
-          >
-          <a
-            class="simple-banner-switch"
+          <a class="simple-banner-switch" :class=" { 'selected': mods === 'vn' }"
+            @click="ChangeModeMods(mode,'vn')"><span class="mods-fulltext">{{ t('global.mode.vanilla') }}</span>
+            <span class="mods-shorttext">{{ t('global.mode.VN') }}</span></a>
+          <a class="simple-banner-switch" :class=" { 'selected': mods === 'rx', 'disabled': mode === 'mania' }"
+            @click="ChangeModeMods(mode,'rx')"><span class="mods-fulltext">{{ t('global.mode.relax') }}</span>
+            <span class="mods-shorttext">{{ t('global.mode.RX') }}</span></a>
+          <a class="simple-banner-switch"
             :class=" { 'selected': mods === 'ap', 'disabled': mode === 'taiko' || mode === 'catch' || mode === 'mania'  }"
-            @click="ChangeModeMods(mode,'ap')"
-            ><span class="mods-fulltext">{{ t('global.mode.autopilot') }}</span
-            ><span class="mods-shorttext">{{ t('global.mode.AP') }}</span></a
-          >
+            @click="ChangeModeMods(mode,'ap')"><span class="mods-fulltext">{{ t('global.mode.autopilot') }}</span><span
+              class="mods-shorttext">{{ t('global.mode.AP') }}</span></a>
         </div>
       </div>
     </div>
@@ -390,10 +334,7 @@ <h1 class="title">
               <i class="fas fa-user-friends"></i> {{ t("profile.rank-title") }}
             </div>
           </div>
-          <div
-            class="stats-block rank-block"
-            v-if="data.stats.out[modegulag].rank != 0"
-          >
+          <div class="stats-block rank-block" v-if="data.stats.out[modegulag].rank != 0">
             <table class="is-striped">
               <tbody>
                 <tr>
@@ -535,24 +476,20 @@ <h1 class="title">
 <style>
   .profile-bg {
     min-height: 262px;
-    background: linear-gradient(
-        hsl(var(--main), 25%, 25%, 20%),
-        hsl(var(--main), 25%, 25%, 60%)
-      ),
-      url("/banners/{{ user['id'] }}");
+    background: linear-gradient(hsl(var(--main), 25%, 25%, 20%),
+      hsl(var(--main), 25%, 25%, 60%)),
+    url("/banners/{{ user['id'] }}");
     background-size: cover;
   }
 </style>
 {% endif %} {% if user['customisation']['background'] == True %}
 <style>
   body {
-    background: linear-gradient(
-        hsl(var(--main), 25%, 25%, 20%),
-        hsl(var(--main), 10%, 10%)
-      ),
-      url("/backgrounds/{{ user['id'] }}");
+    background: linear-gradient(hsl(var(--main), 25%, 25%, 20%),
+      hsl(var(--main), 10%, 10%)),
+    url("/backgrounds/{{ user['id'] }}");
     background-size: cover;
     background-clip: content-box;
   }
 </style>
-{% endif %} {% endblock bottom %}
+{% endif %} {% endblock bottom %}
\ No newline at end of file
diff --git a/templates/settings/profile.html b/templates/settings/profile.html
index 12e9c38c..2781ecb9 100644
--- a/templates/settings/profile.html
+++ b/templates/settings/profile.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% block title %} {{ t('global.profile') }} {% endblock %}
+{% block title %} {{ t('global.profile__literal') }} {% endblock %}
 
 {% block content %}
 <link rel="stylesheet" href="/static/css/pages/settings/style.css?v={{ appVersion() }} ">
@@ -9,7 +9,7 @@
   <div class="block-content right">
     <div id="general" class="single-right-block">
       <div class="right-block-header">
-          {{ t('settings.user-information') }}
+        {{ t('settings.user-information') }}
       </div>
       <form action="/settings/profile" method="post" class="setting-block-content">
         <div class="single-block-content">
@@ -22,8 +22,7 @@
             <div class="field-body">
               <div class="field">
                 <p class="control">
-                  <input class="input" type="text" name="username"
-                  value="{{ session.user_data['name'] }}">
+                  <input class="input" type="text" name="username" value="{{ session.user_data['name'] }}">
                 </p>
               </div>
             </div>
@@ -61,7 +60,8 @@
             </div>
           </div>
         </div>
-        <button class='button is-primary' type='submit'><span>{{ t('settings.save') }}</span><span class='icon is-small'><i class='fas fa-check'></i></span></button>
+        <button class='button is-primary' type='submit'><span>{{ t('settings.save') }}</span><span
+            class='icon is-small'><i class='fas fa-check'></i></span></button>
       </form>
     </div>
   </div>
@@ -75,16 +75,16 @@
       <div class='noti-col noti-col-label'>
         <div class='noti-bannertype'>
           {% if status=='error' %}
-            {{ t('global.bannertype-error') }}
+          {{ t('global.bannertype-error') }}
           {% elif status=='success' %}
-            {{ t('global.bannertype-success') }}
+          {{ t('global.bannertype-success') }}
           {% endif %}
         </div>
         <div class='noti-bannertext'>
           {% if status=='error' %}
           {{ t('global.bannertext-error') }}
           {% elif status=='success' %}
-            {{ t('global.bannertype-success') }}
+          {{ t('global.bannertype-success') }}
           {% endif %}
         </div>
       </div>
@@ -96,4 +96,4 @@
 </div>
 {% endif %}
 
-{% endblock %}
+{% endblock %}
\ No newline at end of file
diff --git a/templates/settings/sidebar.html b/templates/settings/sidebar.html
index f31b4ab9..2b57234a 100644
--- a/templates/settings/sidebar.html
+++ b/templates/settings/sidebar.html
@@ -9,7 +9,7 @@
     </div>
     <div class="left-selector">
         <a class="single-menu single-menu--active router-link" href="/settings/profile">
-            <i class="fas fa-user"></i><span class="single-menu--text"> {{ t('global.profile') }} </span>
+            <i class="fas fa-user"></i><span class="single-menu--text"> {{ t('global.profile__literal') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/avatar">
             <i class="fas fa-brush"></i><span class="single-menu--text"> {{ t('settings.avatar') }} </span>
@@ -18,10 +18,11 @@
             <i class="fas fa-lock"></i><span class="single-menu--text"> {{ t('global.password') }} </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/custom">
-            <i class="fas fa-air-freshener"></i><span class="single-menu--text"> {{ t('settings.customization') }} </span>
+            <i class="fas fa-air-freshener"></i><span class="single-menu--text"> {{ t('settings.customization') }}
+            </span>
         </a>
         <a class="single-menu single-menu--active router-link" href="/settings/aboutme">
             <i class="fas fa-air-freshener"></i><span class="single-menu--text">{{ t("settings.about-me") }}</span>
         </a>
     </div>
-</div>
+</div>
\ No newline at end of file

From 0de9ca9e105392d27e3cc92c3ee949ad78bbe4d5 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 3 Dec 2022 09:49:05 +0000
Subject: [PATCH 265/278] render table properly now

---
 objects/glob.py | 17 ++++++++++-------
 1 file changed, 10 insertions(+), 7 deletions(-)

diff --git a/objects/glob.py b/objects/glob.py
index f7452548..6da679f9 100644
--- a/objects/glob.py
+++ b/objects/glob.py
@@ -106,13 +106,16 @@ def domain() -> str:
 def render_markdown(md: str) -> str:
     return markdown2.markdown(
         html.unescape(md),
-        extras=[
-            "tables",
-            "break-on-newline",
-            "fenced-code-blocks",
-            "spoiler",
-            "strike",
-        ],
+        extras={
+            "tables": None,
+            "break-on-newline": None,
+            "fenced-code-blocks": None,
+            "spoiler": None,
+            "strike": None,
+            "html-classes": {
+                "table": "table"
+            }
+        },
     )
 
 

From 046a1916f9d19e308868090aeda12c0017bb1bc3 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 8 Dec 2022 19:07:53 +0900
Subject: [PATCH 266/278] strict mode

---
 utils/i18n/lib.ts    |  2 ++
 utils/i18n/reader.ts | 26 ++++++++++++++------------
 2 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/utils/i18n/lib.ts b/utils/i18n/lib.ts
index 0d5e1c2c..2a0365f2 100644
--- a/utils/i18n/lib.ts
+++ b/utils/i18n/lib.ts
@@ -5,3 +5,5 @@ export const asyncGlob = async (path: string): Promise<string[]> => await new Pr
     else resolve(matches)
   })
 })
+const mode = process.argv[2]
+export const strict = mode?.includes('strict') || false
diff --git a/utils/i18n/reader.ts b/utils/i18n/reader.ts
index 80e97256..f979f915 100644
--- a/utils/i18n/reader.ts
+++ b/utils/i18n/reader.ts
@@ -1,12 +1,12 @@
+import { strict, asyncGlob, strict } from './lib'
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
 /* eslint-disable @typescript-eslint/restrict-template-expressions */
 import path from 'path'
 import fs from 'fs'
 import yaml from 'js-yaml'
 import { mergeWith } from 'lodash'
-import { asyncGlob } from './lib'
 
-import { paths as translationPaths, contextFromFileName, createConfilitKeyHandler, FileContext } from './config'
+import { paths as translationPaths, contextFromFileName, createConfilitKeyHandler as createConflictKeyHandler, FileContext } from './config'
 
 const parseLocale = (file: string, context: FileContext): LocaleRoot => {
   const locale = yaml.load(fs.readFileSync(file, 'utf8')) as Locale
@@ -48,8 +48,10 @@ const parseLocale = (file: string, context: FileContext): LocaleRoot => {
 }
 
 const mixinLocale = (
-  { merging, joinedLocales, mixingWith: { parsedLocale, context } }:
-  { merging: boolean
+  { merging, joinedLocales, mixingWith: { parsedLocale, context }, strict }:
+  {
+    strict: boolean
+    merging: boolean
     joinedLocales: LocaleRoot
     mixingWith: {
       parsedLocale: LocaleRoot
@@ -68,11 +70,11 @@ const mixinLocale = (
       for (const k in srcValue) {
         if ((Boolean(objValue[k])) && objValue[k] !== srcValue[k]) {
           if (!merging) {
-            console.warn(`[Warning] Merging into initilazed value:
-${key}.${k}:
-[${typeof srcValue[k]}${(typeof srcValue[k] === 'string' && `\`${srcValue[k]}\``) || ''}] merging into [${typeof objValue[k]}${(typeof objValue[k] === 'string' && `\`${objValue[k]}\``) || ''}].`)
+            console.warn(`[Warning] Merging into initialized value:
+${key}.${k}: [${typeof srcValue[k]}${(typeof srcValue[k] === 'string' && `\`${srcValue[k]}\``) || ''}] merging into [${typeof objValue[k]}${(typeof objValue[k] === 'string' && `\`${objValue[k]}\``) || ''}].`)
           }
-          objValue = createConfilitKeyHandler(merging)(objValue, srcValue, k)
+          if (strict) process.exit(1)
+          objValue = createConflictKeyHandler(merging)(objValue, srcValue, k)
           if (!merging) console.log('')
         } else {
           objValue[k] = srcValue[k]
@@ -84,7 +86,7 @@ ${key}.${k}:
   )
 }
 
-const createReducer = ({ translationPath, merging }: {translationPath: string, merging: boolean}) => async (acc: LocaleRoot, match: string) => {
+const createReducer = ({ translationPath, merging, strict }: {translationPath: string, merging: boolean, strict: boolean}) => async (acc: LocaleRoot, match: string) => {
   console.log('parsing', match, '...\n')
   try {
     acc = await acc
@@ -97,14 +99,14 @@ const createReducer = ({ translationPath, merging }: {translationPath: string, m
       mixingWith: {
         parsedLocale: data,
         context
-      }
+      },
+      strict
     })
     return acc
   } catch (error) {
     console.error(error)
   }
 }
-
 export const readLocales = async (): Promise<LocaleRoot> => {
   let locales = {}
   for (const [index, conf] of translationPaths.entries()) {
@@ -112,7 +114,7 @@ export const readLocales = async (): Promise<LocaleRoot> => {
     const { path: translationPath, filter } = conf
     const matches = (await asyncGlob(path.join(translationPath, '**/*.yml')))
       .filter(filter)
-    const reducer = createReducer({ translationPath, merging: index > 0 })
+    const reducer = createReducer({ translationPath, merging: index > 0, strict })
     locales = await matches.reduce(reducer, locales)
   }
 

From f4eda8399f8d73f656c846b9493057921ccc2989 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 8 Dec 2022 19:13:02 +0900
Subject: [PATCH 267/278] imported twice wtf

---
 utils/i18n/reader.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/utils/i18n/reader.ts b/utils/i18n/reader.ts
index f979f915..8dec4a42 100644
--- a/utils/i18n/reader.ts
+++ b/utils/i18n/reader.ts
@@ -1,4 +1,4 @@
-import { strict, asyncGlob, strict } from './lib'
+import { strict, asyncGlob } from './lib'
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
 /* eslint-disable @typescript-eslint/restrict-template-expressions */
 import path from 'path'

From 2deaca2cce8999327514c037dc87965ad30acd79 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 8 Dec 2022 19:13:32 +0900
Subject: [PATCH 268/278] typo

---
 utils/i18n/config.ts | 2 +-
 utils/i18n/reader.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/utils/i18n/config.ts b/utils/i18n/config.ts
index eac01d10..1e2a2502 100644
--- a/utils/i18n/config.ts
+++ b/utils/i18n/config.ts
@@ -88,7 +88,7 @@ export interface FileContext {
   extension: string
 }
 
-export const createConfilitKeyHandler = (mergeMode: boolean) => function onConflictingKey (oldVal: any, newVal: any, key: string) {
+export const createConflictKeyHandler = (mergeMode: boolean) => function onConflictingKey (oldVal: any, newVal: any, key: string) {
   if (typeof newVal[key] !== 'object' && typeof oldVal[key] !== 'object') {
     return {
       ...oldVal,
diff --git a/utils/i18n/reader.ts b/utils/i18n/reader.ts
index 8dec4a42..b4c9ec98 100644
--- a/utils/i18n/reader.ts
+++ b/utils/i18n/reader.ts
@@ -6,7 +6,7 @@ import fs from 'fs'
 import yaml from 'js-yaml'
 import { mergeWith } from 'lodash'
 
-import { paths as translationPaths, contextFromFileName, createConfilitKeyHandler as createConflictKeyHandler, FileContext } from './config'
+import { paths as translationPaths, contextFromFileName, createConflictKeyHandler, FileContext } from './config'
 
 const parseLocale = (file: string, context: FileContext): LocaleRoot => {
   const locale = yaml.load(fs.readFileSync(file, 'utf8')) as Locale

From 77f71c042e03f0b5aa74dc3a029ba0d32abeecbb Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Thu, 8 Dec 2022 19:18:35 +0900
Subject: [PATCH 269/278] test

---
 locales/default/settings/en-US.yml | 2 +-
 locales/default/settings/zh-CN.yml | 2 +-
 utils/i18n/reader.ts               | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/locales/default/settings/en-US.yml b/locales/default/settings/en-US.yml
index 45cca2b6..c834dcb0 100644
--- a/locales/default/settings/en-US.yml
+++ b/locales/default/settings/en-US.yml
@@ -9,7 +9,7 @@ banner: Banner
 banner-description: Recommend with 1440x262 pixels with GIF, PNG, JPG, JPEG
 profile-background: Profile Background
 profile-background-description: Recommend with 16:9 ratio with PNG, JPG, JPEG
-password: Password
+password__literal: Password
 password-change: Password Change
 old-password: Old Password
 new-password: New Password
diff --git a/locales/default/settings/zh-CN.yml b/locales/default/settings/zh-CN.yml
index 4393fefe..68396146 100644
--- a/locales/default/settings/zh-CN.yml
+++ b/locales/default/settings/zh-CN.yml
@@ -8,7 +8,7 @@ banner: 背景横幅
 banner-description: 建议上传分辨率为 1440x262 的 GIF, PNG, JPG, JPEG 等四种格式的图片
 profile-background: 资料背景
 profile-background-description: 建议上传长宽比为 16:9  的 PNG, JPG, JPEG 格式的图片
-password: 密码
+password__literal: 密码
 password-change: 更改密码
 old-password: 旧密码
 new-password: 新密码
diff --git a/utils/i18n/reader.ts b/utils/i18n/reader.ts
index b4c9ec98..1d47e1d8 100644
--- a/utils/i18n/reader.ts
+++ b/utils/i18n/reader.ts
@@ -72,8 +72,8 @@ const mixinLocale = (
           if (!merging) {
             console.warn(`[Warning] Merging into initialized value:
 ${key}.${k}: [${typeof srcValue[k]}${(typeof srcValue[k] === 'string' && `\`${srcValue[k]}\``) || ''}] merging into [${typeof objValue[k]}${(typeof objValue[k] === 'string' && `\`${objValue[k]}\``) || ''}].`)
+            if (strict) process.exit(1)
           }
-          if (strict) process.exit(1)
           objValue = createConflictKeyHandler(merging)(objValue, srcValue, k)
           if (!merging) console.log('')
         } else {

From 04b40bae24afcee1106be57020293a3520d995a6 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Mon, 26 Dec 2022 01:12:28 +0000
Subject: [PATCH 270/278] beatmap force update

---
 locales/default/admin/beatmaps/en-GB.yml |  1 +
 locales/default/admin/beatmaps/en-US.yml |  1 +
 locales/default/admin/beatmaps/zh-CN.yml |  1 +
 static/js/pages/admin/beatmaps.js        | 30 ++++++++++++++++++++++++
 templates/admin/beatmaps.html            | 17 ++++++--------
 5 files changed, 40 insertions(+), 10 deletions(-)

diff --git a/locales/default/admin/beatmaps/en-GB.yml b/locales/default/admin/beatmaps/en-GB.yml
index 8bdb7e47..beb9cc21 100644
--- a/locales/default/admin/beatmaps/en-GB.yml
+++ b/locales/default/admin/beatmaps/en-GB.yml
@@ -25,4 +25,5 @@ ranked-set: Ranked Set
 loved-set: Loved Set
 approved-set: Approved Set
 pending-set: Pending Set
+update-maps: Force update
 search-by-bid-sid-or-title: Search by bid, sid or title
diff --git a/locales/default/admin/beatmaps/en-US.yml b/locales/default/admin/beatmaps/en-US.yml
index 8bdb7e47..beb9cc21 100644
--- a/locales/default/admin/beatmaps/en-US.yml
+++ b/locales/default/admin/beatmaps/en-US.yml
@@ -25,4 +25,5 @@ ranked-set: Ranked Set
 loved-set: Loved Set
 approved-set: Approved Set
 pending-set: Pending Set
+update-maps: Force update
 search-by-bid-sid-or-title: Search by bid, sid or title
diff --git a/locales/default/admin/beatmaps/zh-CN.yml b/locales/default/admin/beatmaps/zh-CN.yml
index 35cd3bf8..496c174a 100644
--- a/locales/default/admin/beatmaps/zh-CN.yml
+++ b/locales/default/admin/beatmaps/zh-CN.yml
@@ -25,4 +25,5 @@ ranked-set: 将整个谱面设置为 Ranked 状态
 loved-set: 将整个谱面设置为 Loved 状态
 approved-set: 将整个谱面设置为 Approved 状态
 pending-set: 将整个谱面设置为 Pending 状态
+update-maps: 强制更新谱面
 search-by-bid-sid-or-title: 根据 bid, sid 或者是 谱面名字 进行搜索
diff --git a/static/js/pages/admin/beatmaps.js b/static/js/pages/admin/beatmaps.js
index a4bddfe2..1610fa71 100644
--- a/static/js/pages/admin/beatmaps.js
+++ b/static/js/pages/admin/beatmaps.js
@@ -5,3 +5,33 @@ function searchMaps () {
   if (search.value === '') window.location.href = '/admin/beatmaps'
   else window.location.href = '/admin/beatmaps/search/' + search.value
 }
+
+function updateMaps(sid) {
+  _testGlobals(
+      { exists: ['domain', 'api_key'] }
+  )
+  var bar = document.getElementById('progress_bar')
+  var elements = document.getElementsByClassName('operate-button');
+  bar && bar.removeAttribute('style')
+  Array.prototype.forEach.call(elements, function (element) {
+      element.classList.add('is-disabled')
+  });
+  $.ajax({
+    type: "GET",
+    url: '//api.' + window.domain + '/update_maps?&sid=' + sid,
+    beforeSend: function(request) {
+        request.setRequestHeader("Authorization", window.api_key);
+    },
+    success: function (data, status) {
+      bar && setStyle(bar, {
+          display: 'none'
+      })
+      Array.prototype.forEach.call(elements, function (element) {
+          element.classList.remove('is-disabled')
+      });
+      if (status == 'success') {
+          window.location.href = '/admin/beatmaps/search/' + data['sid']
+      }
+  }
+});
+}
diff --git a/templates/admin/beatmaps.html b/templates/admin/beatmaps.html
index ce092d1c..3d1b4b1a 100644
--- a/templates/admin/beatmaps.html
+++ b/templates/admin/beatmaps.html
@@ -49,18 +49,11 @@
 {% block title %} Beatmaps {% endblock %}
 
 {% block content %}
-{# TODO I found api_key not used in this page so I commented out this injection
-uncomment if it's needed in the future
-#}
-{#
+
 <script>
-    window.addEventListener('load', () => {
-        window._state = createState({
-            api_key: {{ session.user_data['api_key'] | JSON }}
-        })
-    })
+    window.api_key = {{ session.user_data['api_key'] | JSON }}
 </script>
-#}
+
 <progress id="progress_bar" class="progress is-small is-primary" max="100" style="display: none;"></progress>
 <div class="columns is-marginless">
     <div class="column is-paddingless flex-vcenter">
@@ -212,6 +205,10 @@ <h2 class="section-title">{{ t("admin.base.beatmaps") }}</h2>
                                     <a class="dropdown-item"
                                         href="/admin/beatmaps/edit/{{ i.set_id }}?status=0&set=1">{{
                                         t("admin.beatmaps.pending-set") }}</a>
+                                    <hr class="dropdown-divider">
+                                    <a class="dropdown-item"
+                                        href="javascript:void(0);" onclick="updateMaps({{ i.set_id }})">{{
+                                        t("admin.beatmaps.update-maps") }}</a>
                                 </div>
                             </div>
                         </div>

From 3f5c9ff35a0ae57a1a6f7e6b8e563468ae67505d Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Wed, 25 Jan 2023 18:05:51 +0000
Subject: [PATCH 271/278] bump version

---
 objects/glob.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/objects/glob.py b/objects/glob.py
index 6da679f9..67815991 100644
--- a/objects/glob.py
+++ b/objects/glob.py
@@ -25,7 +25,7 @@
     template_folder=f"{os.getcwd()}/templates",
     static_folder=f"{os.getcwd()}/static",
 )
-version = Version(1, 4, 1)
+version = Version(1, 5, 0)
 
 cache = {"bcrypt": {}, "search_data": {}}
 

From 0c4750e72fe9772f9384a23c7b6744679a07b8b9 Mon Sep 17 00:00:00 2001
From: Usagi no Niku <chenbohan911@163.com>
Date: Wed, 25 Jan 2023 18:09:42 +0000
Subject: [PATCH 272/278] adapt to apiv1 structure

---
 static/js/pages/admin/beatmaps.js            | 2 +-
 static/js/pages/admin/users/upload-scores.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/static/js/pages/admin/beatmaps.js b/static/js/pages/admin/beatmaps.js
index 1610fa71..46e0d327 100644
--- a/static/js/pages/admin/beatmaps.js
+++ b/static/js/pages/admin/beatmaps.js
@@ -18,7 +18,7 @@ function updateMaps(sid) {
   });
   $.ajax({
     type: "GET",
-    url: '//api.' + window.domain + '/update_maps?&sid=' + sid,
+    url: '//api.' + window.domain + '/v1/update_maps?&sid=' + sid,
     beforeSend: function(request) {
         request.setRequestHeader("Authorization", window.api_key);
     },
diff --git a/static/js/pages/admin/users/upload-scores.js b/static/js/pages/admin/users/upload-scores.js
index b9ade2c7..9e11b8cc 100644
--- a/static/js/pages/admin/users/upload-scores.js
+++ b/static/js/pages/admin/users/upload-scores.js
@@ -127,7 +127,7 @@ async function submitReplay () {
   formData.append('perfect', nonReactive.parsed.perfect)
 
   // console.log([...formData.entries()])
-  const endpoint = `//api.${window.domain}/submit_score`
+  const endpoint = `//api.${window.domain}/v1/submit_score`
   const { detail, status, score_id: scoreId } = await fetch(endpoint, {
     method: 'post',
     body: formData,

From f594a493297e8463123daaf6cb243378255de42e Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 28 Jan 2023 02:19:02 +0900
Subject: [PATCH 273/278] don't mess up!

---
 .gitignore | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/.gitignore b/.gitignore
index bf49449a..d5d45e2b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -152,4 +152,6 @@ yarn.lock
 # js utils config
 config.js
 # compiled locales
-.locales
\ No newline at end of file
+.locales
+
+.DS_Store

From 8d79a25c7672d316edefef65c4dd4217ed24fb20 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 28 Jan 2023 02:36:04 +0900
Subject: [PATCH 274/278] undo ppy.sb

---
 config.sample.py | 2 +-
 main.py          | 2 +-
 package.json     | 6 +++---
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/config.sample.py b/config.sample.py
index 92eed03f..f71bc705 100644
--- a/config.sample.py
+++ b/config.sample.py
@@ -80,7 +80,7 @@
 default_locale = _default_locale if _default_locale is not None else "en_GB"
 
 # social links (used throughout guweb)
-github = "https://github.com/ppy-sb/guweb"
+github = "https://github.com/Varkaria/guweb"
 discord_invite_id = _discord_invite_id
 discord_server = (
     "https://discord.com/invite/" + discord_invite_id
diff --git a/main.py b/main.py
index c98a3caf..93c45da9 100755
--- a/main.py
+++ b/main.py
@@ -60,4 +60,4 @@ async def page_not_found(e):
 
 if __name__ == "__main__":
     os.chdir(os.path.dirname(os.path.realpath(__file__)))
-    app.run(host="0.0.0.0", port=10000, debug=glob.config.debug)  # blocking call
+    app.run(host="0.0.0.0", port=8000, debug=glob.config.debug)  # blocking call
diff --git a/package.json b/package.json
index d07c9cc0..8ab92065 100644
--- a/package.json
+++ b/package.json
@@ -14,14 +14,14 @@
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/ppy-sb/guweb.git"
+    "url": "git+https://github.com/Varkaria/guweb.git"
   },
   "author": "",
   "license": "MIT",
   "bugs": {
-    "url": "https://github.com/ppy-sb/guweb/issues"
+    "url": "https://github.com/Varkaria/guweb/issues"
   },
-  "homepage": "https://github.com/ppy-sb/guweb#readme",
+  "homepage": "https://github.com/Varkaria/guweb#readme",
   "devDependencies": {
     "@types/clui": "^0.3.1",
     "@types/glob": "^7.2.0",

From 749cf083402f1fb448aeb0314d16e034846872ac Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 28 Jan 2023 02:50:42 +0900
Subject: [PATCH 275/278] remove upload score stuff

---
 blueprints/admin.py                           |   7 -
 locales/default/admin/upload-replay/en-GB.yml |  24 --
 locales/default/admin/upload-replay/en-US.yml |  24 --
 locales/default/admin/upload-replay/zh-CN.yml |  24 --
 locales/default/admin/users/en-GB.yml         |   1 -
 locales/default/admin/users/en-US.yml         |   1 -
 locales/default/admin/users/zh-CN.yml         |   3 +-
 templates/admin/users/edit.html               |  23 +-
 templates/admin/users/upload-scores.html      | 273 ------------------
 9 files changed, 15 insertions(+), 365 deletions(-)
 delete mode 100644 locales/default/admin/upload-replay/en-GB.yml
 delete mode 100644 locales/default/admin/upload-replay/en-US.yml
 delete mode 100644 locales/default/admin/upload-replay/zh-CN.yml
 delete mode 100644 templates/admin/users/upload-scores.html

diff --git a/blueprints/admin.py b/blueprints/admin.py
index f1c86bfb..e2bab054 100644
--- a/blueprints/admin.py
+++ b/blueprints/admin.py
@@ -115,13 +115,6 @@ async def users_edit(id: int):
     return await render_template("admin/users/edit.html", search_data=query)
 
 
-@admin.route("/user/<id>/upload-scores")
-@priv_check(priv=Privileges.Staff)
-async def users_upload_score(id: int):
-    query = await varka.get_user(id)
-    return await render_template("admin/users/upload-scores.html", search_data=query)
-
-
 @admin.route("/user/<id>/update", methods=["POST"])  # POST
 @priv_check(priv=Privileges.Staff)
 async def users_update(id: int):
diff --git a/locales/default/admin/upload-replay/en-GB.yml b/locales/default/admin/upload-replay/en-GB.yml
deleted file mode 100644
index 4755d6ec..00000000
--- a/locales/default/admin/upload-replay/en-GB.yml
+++ /dev/null
@@ -1,24 +0,0 @@
-upload-score-for: Upload score for %{name}
-identifier-type: Identifier type
-identifier-types:
-  server-user-id: Server's User ID
-  replay-username: Replay username
-  replay-id: Replay ID
-outer_identifier: Outer identifier
-map-md5: map md5
-max-combo: Max combo
-mode: mode
-mods: mods
-n100: number of 100
-n300: number of 300
-n50: number of 50
-ngeki: number of Geki
-nkatu: number of Katu
-nmiss: number of miss
-playtime: replay time
-score: Score
-upload: Upload
-perfect: Is perfect
-osu-replay-file: Osu replay file
-upload-osr-file: Upload osr file
-foreign-score-id: Foreign score id
diff --git a/locales/default/admin/upload-replay/en-US.yml b/locales/default/admin/upload-replay/en-US.yml
deleted file mode 100644
index 2124cceb..00000000
--- a/locales/default/admin/upload-replay/en-US.yml
+++ /dev/null
@@ -1,24 +0,0 @@
-upload-score-for: Upload score for %{name}
-identifier-type: Identifier type
-identifier-types:
-  server-user-id: Server's User ID
-  replay-username: Replay username
-  replay-id: Replay ID
-outer_identifier: Outer identifier
-map-md5: map md5
-max-combo: Max combo
-mode: mode
-mods: mods
-n100: number of 100
-n300: number of 100
-n50: number of 50
-ngeki: number of Geki
-nkatu: number of Katu
-nmiss: number of miss
-playtime: replay time
-score: Score
-upload: Upload
-perfect: Is perfect
-osu-replay-file: Osu replay file
-upload-osr-file: Upload osr file
-foreign-score-id: Foreign score id
diff --git a/locales/default/admin/upload-replay/zh-CN.yml b/locales/default/admin/upload-replay/zh-CN.yml
deleted file mode 100644
index c42ad331..00000000
--- a/locales/default/admin/upload-replay/zh-CN.yml
+++ /dev/null
@@ -1,24 +0,0 @@
-upload-score-for: 上传 %{name} 的成绩
-identifier-type: 身份标识类型
-identifier-types:
-  server-user-id: Server's User ID
-  replay-username: 回放者的用户名
-  replay-id: Replay ID
-outer_identifier: 外部成绩的来源身份标识
-map-md5: 谱面的md5
-max-combo: 最大连击数
-mode: 模式
-mods: mods
-n100: 100的个数
-n300: 300的个数
-n50: 50的个数
-ngeki: 激的个数
-nkatu: 喝的个数
-nmiss: miss的个数
-playtime: 回放时长
-score: 分数
-upload: 上传
-perfect: 是否为perfect
-osu-replay-file: osu回放文件
-upload-osr-file: 上传osr文件
-foreign-score-id: 外部来源的成绩id
diff --git a/locales/default/admin/users/en-GB.yml b/locales/default/admin/users/en-GB.yml
index f0ccdc93..c0d8f8e3 100644
--- a/locales/default/admin/users/en-GB.yml
+++ b/locales/default/admin/users/en-GB.yml
@@ -19,4 +19,3 @@ update: Update
 search-by-username-or-email: Search by username or email
 password: Password
 new-password: New Password
-upload-new-score: Upload new socre
diff --git a/locales/default/admin/users/en-US.yml b/locales/default/admin/users/en-US.yml
index f0ccdc93..c0d8f8e3 100644
--- a/locales/default/admin/users/en-US.yml
+++ b/locales/default/admin/users/en-US.yml
@@ -19,4 +19,3 @@ update: Update
 search-by-username-or-email: Search by username or email
 password: Password
 new-password: New Password
-upload-new-score: Upload new socre
diff --git a/locales/default/admin/users/zh-CN.yml b/locales/default/admin/users/zh-CN.yml
index e4c0ec44..ce63a3a8 100644
--- a/locales/default/admin/users/zh-CN.yml
+++ b/locales/default/admin/users/zh-CN.yml
@@ -9,7 +9,7 @@ client-channel: 客户端频道
 email: 邮箱
 ip: IP
 edit: 修改
-edit-info-of: '修改 %{name} 的信息:'
+edit-info-of: "修改 %{name} 的信息:"
 username: 用户名
 country: 地区
 legality: 封禁状态
@@ -19,4 +19,3 @@ update: 更新
 search-by-username-or-email: 根据 用户名 或 邮箱 进行搜索
 password: 密码
 new-password: 请输入新密码
-upload-new-score: 上传成绩
diff --git a/templates/admin/users/edit.html b/templates/admin/users/edit.html
index 2bd25451..3c3fd90e 100644
--- a/templates/admin/users/edit.html
+++ b/templates/admin/users/edit.html
@@ -1,28 +1,31 @@
-{% extends 'admin/base.html' %} 
+{% extends 'admin/base.html' %}
 {% block header %}
 <style>
     .text-nowrap {
         white-space: nowrap;
     }
+
     .w-100 {
         width: 100%;
     }
+
     .ml-auto {
         margin-left: auto;
     }
+
     .gap-2 {
         gap: 0.5em;
     }
 </style>
-{% endblock %} 
-{% block title %} Users {% endblock %} 
+{% endblock %}
+{% block title %} Users {% endblock %}
 
-{% block content %} 
+{% block content %}
 <form action="/admin/user/{{ search_data['id'] }}/update" method="POST" id="edit-user">
     <div class="is-flex is-align-items-center is-flex-direction-column">
         <article style="min-width: fit-content; width: 40vw;" class="panel is-primary">
             <p class="panel-heading">
-            {{ t("admin.users.edit-info-of", name = search_data['name']) }}
+                {{ t("admin.users.edit-info-of", name = search_data['name']) }}
             </p>
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
@@ -48,7 +51,9 @@
                     {{ t("admin.users.country") }}
                 </div>
                 <div class="column is-flex gap-2 is-align-items-center">
-                    <img id="country-preview" src="/static/images/flags/{{ search_data.country | upper }}.png" class="profile-flag" style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">
+                    <img id="country-preview" src="/static/images/flags/{{ search_data.country | upper }}.png"
+                        class="profile-flag"
+                        style="width: 25px; height: 17px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.63); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);">
                     <input name="edit-country" type="text" class="input" value="{{ search_data.country }}" oninput="
                         if (this.value.length === 2) {
                             document.getElementById('country-preview').src = '/static/images/flags/' + this.value.toUpperCase() + '.png'
@@ -67,7 +72,7 @@
             </div>
             <div class="panel-block columns" style="height: 50px;">
                 <div class="column is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
-                    <i class="fas fa-ban"  aria-hidden="true"></i>
+                    <i class="fas fa-ban" aria-hidden="true"></i>
                     {{ t("admin.users.legality") }}
                 </div>
                 <div class="column">
@@ -85,9 +90,9 @@
                 </div>
             </div>
             <div class="panel-block pb-4">
-                <a href="./upload-scores" style="margin-right: 1em;" class="button is-info">{{ t("admin.users.upload-new-score") }}</a>
                 <div style="margin-left: auto;"></div>
-                <button type="submit" form="edit-user" style="margin-right: 1em; width: 100px;" class="button is-primary">{{ t("admin.users.update") }}</button>
+                <button type="submit" form="edit-user" style="margin-right: 1em; width: 100px;"
+                    class="button is-primary">{{ t("admin.users.update") }}</button>
             </div>
         </article>
     </div>
diff --git a/templates/admin/users/upload-scores.html b/templates/admin/users/upload-scores.html
deleted file mode 100644
index 097ac978..00000000
--- a/templates/admin/users/upload-scores.html
+++ /dev/null
@@ -1,273 +0,0 @@
-{% extends 'admin/base.html' %}
-{% block header %}
-<style>
-    .text-nowrap {
-        white-space: nowrap;
-    }
-
-    .w-100 {
-        width: 100%;
-    }
-
-    .ml-auto {
-        margin-left: auto;
-    }
-
-    .gap-2 {
-        gap: 0.5em;
-    }
-
-    .is-right {
-        text-align: right;
-    }
-</style>
-<script src="/static/js/pages/admin/users/upload-scores.js" defer></script>
-<script>
-    document.addEventListener('DOMContentLoaded', () => {
-        transaction(state => {
-            state.apiKey = {{ session.user_data['api_key'] | JSON }
-        }
-            state.userId = {{ search_data.id | JSON }}
-        }, false)
-    })
-</script>
-{% endblock %}
-{% block title %} Users {% endblock %}
-
-{% block content %}
-<template id="template-replay-row">
-    <div class="tags has-addons m-0">
-        <span class="tag mb-0" id="key"></span>
-        <span class="tag mb-0 is-primary" id="value"></span>
-    </div>
-</template>
-<div class="is-flex is-align-items-center is-flex-direction-column pt-4">
-    <article style="min-width: fit-content; width: 60vw;" class="panel is-primary">
-        <p class="panel-heading">
-            {{ t("admin.upload-replay.upload-score-for", name = search_data['name']) }}
-        </p>
-        <form id="osr-reader" onsubmit="event.preventDefault()">
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
-                    <i class="fas fa-id-card" aria-hidden="true"></i>
-                    {{ t("admin.upload-replay.osu-replay-file") }}
-                </div>
-                <div class="column py-0 is-flex is-align-items-center gap-2">
-                    <div class="file" id="form-replay-file-label">
-                        <label class="file-label">
-                            <input class="file-input" type="file" name="replay_file" onchange="uploadOsr()">
-                            <span class="file-cta">
-                                <span class="file-icon">
-                                    <i class="fas fa-upload"></i>
-                                </span>
-                                <span class="file-label">
-                                    {{ t("admin.upload-replay.upload-osr-file") }}
-                                </span>
-                            </span>
-                        </label>
-                    </div>
-                    <div id="replay-result" class="is-flex is-align-items-center gap-2"></div>
-                </div>
-            </div>
-        </form>
-        <hr>
-        <form id="submit-replay" onsubmit="event.preventDefault(); submitReplay()">
-            <!-- <div class="panel-block columns is-hidden" >
-                <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
-                    <i class="fas fa-id-card" aria-hidden="true"></i>
-                    {{ t("admin.users.id") }}
-                </div>
-                <div class="column py-0">
-                    <input name="userid" type="text" class="input" value="{{ search_data.id }}" required>
-                </div>
-            </div> -->
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
-                    <i class="fab fa-octopus-deploy"></i>
-                    {{ t("global.grade") }}
-                </div>
-                <div class="column py-0">
-                    <div class="select w-100">
-                        <select name="grade" class="w-100" required>
-                            <!-- <option value="N">{{ t("global.grades-N") }}</option> -->
-                            <option value="F">{{ t("global.grades-F") }}</option>
-                            <option value="D">{{ t("global.grades-D") }}</option>
-                            <option value="C">{{ t("global.grades-C") }}</option>
-                            <option value="B">{{ t("global.grades-B") }}</option>
-                            <option value="A">{{ t("global.grades-A") }}</option>
-                            <option value="S">{{ t("global.grades-S") }}</option>
-                            <option value="SH">{{ t("global.grades-SH") }}</option>
-                            <option value="X">{{ t("global.grades-X") }}</option>
-                            <option value="XH">{{ t("global.grades-XH") }}</option>
-                        </select>
-                    </div>
-                </div>
-            </div>
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
-                    <i class="fa-solid fa-server"></i>
-                    {{ t("global.server") }}
-                </div>
-                <div class="column py-0">
-                    <div class="select w-100">
-                        <select name="server" class="w-100" required>
-                            <option value="bancho">{{ t("global.bancho") }}</option>
-                            <option value="ppysb">{{ t("global.ppy-sb") }}</option>
-                            <option value="akatsuki">{{ t("global.akatsuki") }}</option>
-                            <option value="offline">{{ t("global.server-offline") }}</option>
-                        </select>
-                    </div>
-                </div>
-            </div>
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.foreign-score-id") }}
-                </div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="foreign_score_id" required>
-                </div>
-            </div>
-
-            <!-- <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap is-flex is-align-items-center gap-2">
-                    <i class="fas fa-user-check"></i>
-                    {{ t("admin.upload-replay.identifier-type") }}
-                </div>
-                <div class="column py-0">
-                    <div class="field has-addons w-100 pt-3">
-                        <p class="control">
-                            <span class="select">
-                                <select name="identifier_type" required>
-                                    <option value="replay_username">
-                                        {{ t("admin.upload-replay.identifier-types.replay-username") }}</option>
-                                    <option value="server_userid">
-                                        {{ t("admin.upload-replay.identifier-types.server-user-id") }}
-                                    </option>
-                                    <option value="replay_id">{{ t("admin.upload-replay.identifier-types.replay-id") }}
-                                    </option>
-                                </select>
-                            </span>
-                        </p>
-                        <p class="control w-100">
-                            <input class="input w-100" name="outer_identifier" required type="text"
-                                placeholder="{{ t('admin.upload-replay.outer_identifier') }}">
-                        </p>
-                    </div>
-                </div>
-            </div> -->
-            <hr>
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.map-md5") }}</div>
-                <div class="column py-0">
-                    <input type="text" class="input" name="map_md5" required>
-                </div>
-            </div>
-
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.max-combo") }}</div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="max_combo" required>
-                </div>
-            </div>
-
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.mode") }}</div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="mode" required>
-                </div>
-            </div>
-
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.mods") }}</div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="mods" required>
-                </div>
-            </div>
-
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.n100") }}</div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="n100" required>
-                </div>
-            </div>
-
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.n300") }}</div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="n300" required>
-                </div>
-            </div>
-
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.n50") }}</div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="n50" required>
-                </div>
-            </div>
-
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.ngeki") }}</div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="ngeki" required>
-                </div>
-            </div>
-
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.nkatu") }}</div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="nkatu" required>
-                </div>
-            </div>
-
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.nmiss") }}</div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="nmiss" required>
-                </div>
-            </div>
-
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.perfect") }}</div>
-                <div class="column py-0">
-                    <input type="checkbox" class="checkbox" name="perfect">
-                </div>
-            </div>
-
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.playtime") }}</div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="playtime" required>
-                </div>
-            </div>
-
-            <!-- <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.replay-id") }}</div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="replay_id">
-                </div>
-            </div> -->
-
-            <div class="panel-block columns">
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("admin.upload-replay.score") }}</div>
-                <div class="column py-0">
-                    <input type="number" class="input" name="score" required>
-                </div>
-            </div>
-
-            <!-- <div class="panel-block columns" >
-                <div class="column py-0 is-one-quarter text-nowrap">{{ t("osr-reader.username") }}</div>
-                <div class="column py-0">
-                    <input type="text" class="input" name="username">
-                </div>
-            </div> -->
-            <hr>
-            <div class="panel-block pb-4">
-                <div style="margin-left: auto;"></div>
-                <button type="submit" form="submit-replay" class="button is-primary">{{ t("admin.upload-replay.upload")
-                    }}</button>
-                <div style="margin-right: 1em;"></div>
-            </div>
-        </form>
-    </article>
-</div>
-
-{% endblock content %}
\ No newline at end of file

From ba1fd9a33155db85ed6f6b30667c6167311908c9 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Sat, 28 Jan 2023 02:58:04 +0900
Subject: [PATCH 276/278] update readme

---
 README.md | 33 ++++++++++++++++++++-------------
 1 file changed, 20 insertions(+), 13 deletions(-)

diff --git a/README.md b/README.md
index 317567b7..ff10c16b 100644
--- a/README.md
+++ b/README.md
@@ -1,16 +1,17 @@
 Table of Contents
 ==================
+
 - [Table of Contents](#table-of-contents)
-    - [What is guweb?](#what-is-guweb)
-    - [Requirements](#requirements)
-    - [Setup](#setup)
-    - [Translation](#translation)
-        - [requirements](#requirements-1)
-        - [prepare](#prepare)
-        - [how to](#how-to)
-    - [Directory Structure](#directory-structure)
-    - [The team](#the-team)
-    - [The End](#the-end)
+  - [What is guweb?](#what-is-guweb)
+  - [Requirements](#requirements)
+  - [Setup](#setup)
+  - [Translation](#translation)
+    - [requirements](#requirements-1)
+    - [prepare](#prepare)
+    - [how to](#how-to)
+  - [Directory Structure](#directory-structure)
+  - [The team](#the-team)
+  - [The End](#the-end)
 
 What is guweb?
 ------
@@ -70,9 +71,13 @@ sudo nginx -s reload
 
 
 # Configure guweb.
-cp ext/config.py config.py
+cp ext/config.sample.py config.py
 nano config.py
 
+# Configure locales
+cp config.sample.js config.js
+# edit the copied file to meet yor needs
+
 
 # build locales
 npm run i18n:build 
@@ -88,19 +93,21 @@ Translation
 ------
 
 ### requirements
+
 - VSCode (recommend)
 - VSCode plugin: i18n-ally (recommend)
 - Node
   
 ### prepare
+
 `npm install -D`
 
 ### how to
+
 - open any html files with i18n-ally plugin enabled.
 - translate keys
 - run `npm run i18n:build` to generate files for python-i18n
 
-
 Directory Structure
 ------
 
@@ -116,9 +123,9 @@ Directory Structure
         ├── settings # Templated content for settings (/settings).
         └ ...         # Templated content for all of guweb (/).
 
-
 The team
 ------
+
 - [Yoru](https://github.com/Yo-ru) | Backend, Grammar Checking [Deprecated]
 - [Varkaria](https://github.com/Varkaria) | Frontend, Backend?
 - [ppysb-Team](https://github.com/ppy-sb) | i18n, Maintainer

From 4dd11325fb5d7e58c6631f54a948d1d36a82763a Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Tue, 31 Jan 2023 15:38:49 +0900
Subject: [PATCH 277/278] readme

---
 README.md | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index ff10c16b..37bc5a8a 100644
--- a/README.md
+++ b/README.md
@@ -5,7 +5,7 @@ Table of Contents
   - [What is guweb?](#what-is-guweb)
   - [Requirements](#requirements)
   - [Setup](#setup)
-  - [Translation](#translation)
+  - [Prepare Locales](#prepare-locales)
     - [requirements](#requirements-1)
     - [prepare](#prepare)
     - [how to](#how-to)
@@ -27,6 +27,7 @@ Requirements
 - Some know-how with Linux (tested on Ubuntu 18.04), Python, and general-programming knowledge.
 - MySQL
 - NGINX
+- NodeJS
 
 Setup
 ------
@@ -89,7 +90,7 @@ python3.9 main.py # Run directly to access debug features for development!
 hypercorn main.py # Please run guweb with hypercorn when in production! It will improve performance drastically by disabling all of the debug features a developer would need!
 ```
 
-Translation
+Prepare Locales
 ------
 
 ### requirements

From d2dc55dc9d4e10795d4e3f071ee5bc9e47fa9403 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Tue, 31 Jan 2023 15:45:24 +0900
Subject: [PATCH 278/278] rename gulag

---
 README.md                      |  2 +-
 config.sample.py               |  2 +-
 ext/config.sample.py           | 43 +++++++++++++++-------------------
 locales/default/home/en-GB.yml |  2 +-
 locales/default/home/en-US.yml |  2 +-
 5 files changed, 23 insertions(+), 28 deletions(-)

diff --git a/README.md b/README.md
index 37bc5a8a..832c93bb 100644
--- a/README.md
+++ b/README.md
@@ -16,7 +16,7 @@ Table of Contents
 What is guweb?
 ------
 
-guweb is the front-facing appearance of the osu! server protocol, [gulag](https://github.com/cmyui/gulag)!
+guweb is the front-facing appearance of the osu! server protocol, [bancho.py](https://github.com/cmyui/bancho.py)!
 Using native async/await syntax written on top of [Quart](https://github.com/pgjones/quart) and
 [cmyui's multipurpose library](https://github.com/cmyui/cmyui_pkg), guweb achieves flexability, cleanliness,
 and efficiency not seen in other frontend implementations - all while maintaining the simplicity of Python.
diff --git a/config.sample.py b/config.sample.py
index f71bc705..db262b24 100644
--- a/config.sample.py
+++ b/config.sample.py
@@ -45,7 +45,7 @@
     "password": _db_password if _db_password is not None else "",
 }
 
-# path to gulag root (must have leading and following slash),
+# path to bancho.py root (must have leading and following slash),
 # you don't need to change this assume you put /guweb and /bancho.py in the same folder.
 path_to_gulag = (
     _path_to_bancho_py
diff --git a/ext/config.sample.py b/ext/config.sample.py
index a155869f..94daea8a 100644
--- a/ext/config.sample.py
+++ b/ext/config.sample.py
@@ -1,52 +1,47 @@
 # -*- coding: utf-8 -*-
 
 # app name
-app_name = 'guweb'
+app_name = "guweb"
 
 # secret key
-secret_key = 'changeme'
+secret_key = "changeme"
 
-#hCaptcha settings:
-hCaptcha_sitekey = 'changeme'
-hCaptcha_secret = 'changeme'
+# hCaptcha settings:
+hCaptcha_sitekey = "changeme"
+hCaptcha_secret = "changeme"
 
 # domain (used for api, avatar, etc)
-domain = 'gulag.ca'
+domain = "gulag.ca"
 
 # max image size for avatars, in megabytes
 max_image_size = 2
 
 # mysql credentials
 mysql = {
-    'db': 'gulag',
-    'host': 'localhost',
-    'user': 'cmyui',
-    'password': 'changeme',
+    "db": "gulag",
+    "host": "localhost",
+    "user": "cmyui",
+    "password": "changeme",
 }
 
-# path to gulag root (must have leading and following slash)
-path_to_gulag = '/path/to/gulag/'
+# path to bancho.py root (must have leading and following slash)
+path_to_gulag = "/path/to/gulag/"
 
 # enable debug (disable when in production to improve performance)
 debug = False
 
 # disallowed names (hardcoded banned usernames)
-disallowed_names = {
-    'cookiezi', 'rrtyui',
-    'hvick225', 'qsc20010'
-}
+disallowed_names = {"cookiezi", "rrtyui", "hvick225", "qsc20010"}
 
 # disallowed passwords (hardcoded banned passwords)
-disallowed_passwords = {
-    'password', 'minilamp'
-}
+disallowed_passwords = {"password", "minilamp"}
 
 # enable registration
 registration = True
 
 # social links (used throughout guweb)
-github = 'https://github.com/varkaria/guweb'
-discord_server = 'https://discord.com/invite/Y5uPvcNpD9'
-youtube = 'https://youtube.com/'
-twitter = 'https://twitter.com/'
-instagram = 'https://instagram.com/'
+github = "https://github.com/varkaria/guweb"
+discord_server = "https://discord.com/invite/Y5uPvcNpD9"
+youtube = "https://youtube.com/"
+twitter = "https://twitter.com/"
+instagram = "https://instagram.com/"
diff --git a/locales/default/home/en-GB.yml b/locales/default/home/en-GB.yml
index f8183bfb..6a1a60db 100644
--- a/locales/default/home/en-GB.yml
+++ b/locales/default/home/en-GB.yml
@@ -1,5 +1,5 @@
 subtitle-big: |-
-  We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
+  We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out bancho.py and guweb on GitHub - we're fully open source!
 some-of-our-coolest-features: Some of our coolest features
 features-title-1: PP for Relax and Autopilot
 features-content-1: |-
diff --git a/locales/default/home/en-US.yml b/locales/default/home/en-US.yml
index f8183bfb..6a1a60db 100644
--- a/locales/default/home/en-US.yml
+++ b/locales/default/home/en-US.yml
@@ -1,5 +1,5 @@
 subtitle-big: |-
-  We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out gulag and guweb on GitHub - we're fully open source!
+  We are an osu! private server built from the ground up with many unique features not seen elsewhere - for more information, check out bancho.py and guweb on GitHub - we're fully open source!
 some-of-our-coolest-features: Some of our coolest features
 features-title-1: PP for Relax and Autopilot
 features-content-1: |-