index.html

<!DOCTYPE HTML>
<html>
<head>
    <title>Knowledge of Hacker</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <link rel="stylesheet" href="assets/css/main.css">
    <link rel="stylesheet" href="assets/css/custom.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/pretty-checkbox@3.0/dist/pretty-checkbox.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.1.1/socket.io.js"></script>
    <script src="assets/js/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
    <!-- alertify -->
    <script src="https://cdn.jsdelivr.net/npm/alertifyjs@1.11.2/build/alertify.min.js"></script>
    <!-- CSS -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/alertifyjs@1.11.2/build/css/alertify.min.css">
    <!-- Default theme -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/alertifyjs@1.11.2/build/css/themes/default.min.css">
    <!-- alertify  end -->
    <noscript><link rel="stylesheet" href="assets/css/noscript.css"></noscript>
</head>
<body class="is-preload">
    <!-- Wrapper -->
    <div id="wrapper">
        <!-- Main -->
        <section id="main">
            <header>
                <span class="avatar"><img src="images/Mrblack.png" alt=""></span>
                <h1>資安知識王</h1>
                <p>Knowledge of Hacker</p>
            </header>
            <hr>
            <h2 id="title">請先註冊</h2>
            <div id="nidform">
                <div class="fields">
                    <div class="field">
                        <input type="text" id="nid" placeholder="Name(試玩：D0000000)">
                    </div>
                </div>
                <br>
                <ul class="actions special">
                    <li><button id="sid" class="button" disabled>送出學號</button></li>
                </ul>
            </div>
            <div id="gogame">
                <ul class="actions special">
                    <li><button id="gstart" class="button" >開始遊戲</button></li>
                </ul>
                <ul class="actions special">
                    <li><button id="resettoken" class="button" >登出</button></li>
                </ul>
            </div>
            <div id="nickform">
                <div class="fields">
                    <div class="field">
                        <input type="text" id="nickname" placeholder="nickname">
                    </div>
                </div>
                <br>
                <ul class="actions special">
                    <li><button id="start" class="button" disabled>設定暱稱</button></li>
                </ul>
            </div>
                <div class="pretty p-default p-curve">
                    <input type="checkbox" id="use_bot">
                    <div class="state">
                        <label>是否與bot遊戲</label>
                    </div>
                </div>
            <hr>
            <footer>
                <ul class="actions special">
                    <li><a href="rule.html" class="button">規則說明</a></li>
                    <li><a href="rank.html" class="button">排行榜</a></li>
                </ul>
                <ul class="actions special">
                  <li><a href="About.html" class="button">About Hackersir</a></li>
                </ul>
                <ul class="icons">
                    <!--<li><a href="#" class="fa-twitter">Twitter</a></li>-->
                    <li><a href="https://www.instagram.com/fcu_hackersir/" class="fa-instagram">Instagram</a></li>
                    <li><a href="https://www.facebook.com/HackerSir.tw/" class="fa-facebook">Facebook</a></li>
                </ul>
            </footer>
        </section>
        <!-- Footer -->
        <footer id="footer">
            <ul class="copyright">
                <li>&copy; Design: <a href="http://html5up.net">html5up</a></li>
                <li>&copy; Game: <a href="http://hackersir.org">FCU Hackersir</a></li>
            </ul>
        </footer>
    </div>
    <script src="assets/js/config.js"></script>
    <script src="assets/js/login.js"></script>
    <script>
        <!-- 動畫 -->
        window.addEventListener("load", () => {
            document.body.className = document.body.className.replace(/\bis-preload\b/, "");
        });
        document.body.className += (navigator.userAgent.match(/(MSIE|rv:11\.0)/) ? " is-ie" : "");
    </script>
</body>
</html>