Add page language version

assets/components/nav.html

@@ -34,6 +34,11 @@
             Insiders
           </a>
         </li>
+        <li class="nav-item px-1">
+          <a href="/zh-cn/index.html" class="nav-link kl-navlink text-lg text-decoration-none">
+            Language/简体中文
+          </a>
+        </li>
         <!-- <li class="nav-item px-1">
           <a href="/login.html" class="nav-link text-lg text-decoration-none">
             <img width="20px" height="auto" src="/img/login.svg">
@@ -140,4 +145,4 @@ <h6 class="text-sm">Resources</h6>
     </div>
   </div>
 </footer>
-<!-- /Footer -->
+<!-- /Footer -->

zh-cn/assets/components/nav.html

@@ -0,0 +1,148 @@
+<!-- Header -->
+<nav id="header" class="navbar navbar-expand-md shadow-none z-index-3 py-3" style="background-color: #FEFEFE;">
+  <div class="container">
+    <a class="navbar-brand" href="/index.html">
+      <img class="kl-navicon" width="26.44" height="auto" src="/img/mark.svg">
+    </a>
+    <button class="navbar-toggler shadow-none ms-2" type="button" data-bs-toggle="collapse" data-bs-target="#navigation"
+      aria-controls="navigation" aria-expanded="false" aria-label="Toggle navigation">
+      <span class="navbar-toggler-icon mt-2">
+        <span class="navbar-toggler-bar bar1"></span>
+        <span class="navbar-toggler-bar bar2"></span>
+        <span class="navbar-toggler-bar bar3"></span>
+      </span>
+    </button>
+    <div class="collapse navbar-collapse w-100 pt-3 pb-2 py-lg-0" id="navigation">
+      <ul class="navbar-nav navbar-nav-hover ms-auto">
+        <li class="nav-item px-1">
+          <a href="/projects.html" class="nav-link kl-navlink text-lg text-decoration-none">
+            Projects
+          </a>
+        </li>
+        <li class="nav-item px-1">
+          <a href="/guide.html" class="nav-link kl-navlink text-lg text-decoration-none">
+            Guide
+          </a>
+        </li>
+        <li class="nav-item px-1">
+          <a href="/involving.html" class="nav-link kl-navlink text-lg text-decoration-none">
+            Get involved
+          </a>
+        </li>
+        <li class="nav-item px-1">
+          <a href="/insiders.html" class="nav-link kl-navlink text-lg text-decoration-none">
+            Insiders
+          </a>
+        </li>
+		<li class="nav-item px-1">
+          <a href="/" class="nav-link kl-navlink text-lg text-decoration-none">
+            Language/English
+          </a>
+        </li>
+        <!-- <li class="nav-item px-1">
+          <a href="/login.html" class="nav-link text-lg text-decoration-none">
+            <img width="20px" height="auto" src="/img/login.svg">
+          </a>
+        </li> -->
+      </ul>
+    </div>
+  </div>
+</nav>
+<!-- /Header -->
+
+<!-- Footer -->
+<footer id="footer" class="footer py-5" style="background-color: #FEFEFE;">
+  <div class="container">
+    <div class="row">
+      <div class="col-lg-8 mb-5 mb-lg-0">
+        <h5 class="text-uppercase mb-2"><a class="kl-navlink" href="javascript:scroll(0,0)">Katorly Lab</a>
+        </h5>
+        <p class="mb-4 me-5">
+          Open source projects and samples from Katorly and other partners, aiming to share and improve
+          experience.<br><br>
+          "Katorly Lab", "Katorly Code Lab", "katorlys", and their logos and marks are owned by Katorly.
+          View full Licenses <a class="text-secondary kl-footerlink text-decoration-underline" target="_blank"
+            href="/license.html">here</a>.
+        </p>
+        <a href="https://github.com/katorlys" target="_blank" class="text-secondary text-decoration-none me-xl-2 me-2">
+          <img src="/img/social/github.svg" width="22px" height="auto" class="kl-svg">
+        </a>
+        <a href="https://www.npmjs.com/org/katorlys" target="_blank"
+          class="text-secondary text-decoration-none me-xl-2 me-2">
+          <img src="/img/social/npmjs.svg" width="26px" height="auto" class="kl-svg">
+        </a>
+        <a href="https://twitter.com/katorlys" target="_blank"
+          class="text-secondary text-decoration-none me-xl-2 me-2">
+          <img src="/img/social/twitter.svg" width="22px" height="auto" class="kl-svg">
+        </a>
+        <a href="https://www.planetminecraft.com/member/katorly" target="_blank"
+          class="text-secondary text-decoration-none me-xl-2 me-2">
+          <img src="/img/social/planetminecraft.svg" width="22px" height="auto" class="kl-svg">
+        </a>
+        <!-- <a href="https://www.spigotmc.org/members/katorly.1301379/#resources" target="_blank"
+          class="text-secondary text-decoration-none me-xl-2 me-2">
+          <img src="/img/social/spigotmc.svg" width="22px" height="auto" class="kl-svg">
+        </a> -->
+      </div>
+      <div class="col-md-2 col-6 mb-md-0 mb-4">
+        <h6 class="text-sm">Pages</h6>
+        <ul class="flex-column ms-n3 nav">
+          <li class="nav-item">
+            <a class="nav-link kl-footerlink kl-npn text-secondary text-decoration-none" href="/projects.html">
+              Projects
+            </a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link kl-footerlink kl-npn text-secondary text-decoration-none" href="/guide.html">
+              Guide
+            </a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link kl-footerlink kl-npn text-secondary text-decoration-none" href="/involving.html">
+              Get involved
+            </a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link kl-footerlink kl-npn text-secondary text-decoration-none" href="/insiders.html">
+              Insiders
+            </a>
+          </li>
+        </ul>
+      </div>
+      <div class="col-md-2 col-6 mb-md-0 mb-4">
+        <h6 class="text-sm">Resources</h6>
+        <ul class="flex-column ms-n3 nav">
+          <li class="nav-item">
+            <a class="nav-link kl-footerlink kl-npn text-secondary text-decoration-none" href="/license.html"
+              target="_blank" rel="opener">
+              Licenses
+            </a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link kl-footerlink kl-npn text-secondary text-decoration-none"
+              href="https://github.com/katorlys/MediaKit" target="_blank">
+              MediaKit
+            </a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link kl-footerlink kl-npn text-secondary text-decoration-none" href="guestbook.html"
+              target="_blank" rel="opener">
+              Guest book
+            </a>
+          </li>
+        </ul>
+      </div>
+    </div>
+    <hr class="dark mt-lg-5 mt-4 mb-sm-4 mb-1">
+    <div class="row">
+      <div class="col-8 mx-auto text-center">
+        <p class="text-sm text-dark">
+          &copy; 2020-<span id="nowDate"></span>
+          <a href="/index.html" class="kl-navlink text-decoration-none">
+            Katorly Lab</a>.
+        </p>
+      </div>
+    </div>
+  </div>
+</footer>
+<!-- /Footer -->

zh-cn/assets/css/style.css

@@ -0,0 +1,70 @@
+body {
+    font-family: 'Kumbh Sans', sans-serif;
+    background: #FAFAFA;
+
+    /* Firefox scrollbar */
+    scrollbar-width: thin;
+    scrollbar-color: #CFCBD0 #EBEBEB;
+}
+.content {
+    display: none;
+}
+::-webkit-scrollbar {
+    width: 12px;
+    height: 5px;
+    background-color: #EBEBEB;
+}
+::-webkit-scrollbar-thumb:vertical {
+    background-color: #CFCBD0;
+}
+::selection {
+    background: #E0E0E0;
+}
+::-moz-selection {
+    background: #E0E0E0;
+}
+.kl-navicon {
+    transition: all 0.15s;
+    -moz-transition: all 0.15s;
+}
+.kl-navicon:hover {
+    filter: brightness(90%);
+}
+.kl-navlink {
+    transition: all 0.15s;
+    -moz-transition: all 0.15s;
+}
+.kl-navlink:hover {
+    color: #7A8290;
+}
+.kl-footerlink {
+    transition: all 0.15s;
+    -moz-transition: all 0.15s;
+}
+.kl-footerlink:hover {
+    filter: brightness(115%);
+}
+.kl-bg {
+    background-size: 100% auto;
+    background-repeat: no-repeat;
+    background-attachment: scroll;
+}
+.kl-svg {
+    transition: all 0.15s;
+    -moz-transition: all 0.15s;
+}
+.kl-svg:hover {
+    filter: brightness(80%);
+}
+.kl-np {
+    white-space: nowrap;
+    overflow: hidden;
+}
+.kl-npe {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+.kl-npn {
+    white-space: nowrap;
+}

zh-cn/assets/js/script.js

@@ -0,0 +1,13 @@
+//Footer time
+function nowTime() {
+    var today = new Date();
+    var yyyy = today.getFullYear();
+    document.getElementById('nowDate').innerHTML = yyyy;
+}
+setInterval(nowTime, 500);
+
+//Preloader
+$(window).on('load', function () {
+    $(".loader").fadeOut(250);
+    $(".content").fadeIn(250);
+})

zh-cn/browserconfig.xml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <TileColor>#da532c</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>