rank.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Typing Speed Game - Rankings</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <nav><h1>Rankings</h1><span style="display: flex; align-items: center; gap: 10px; font-size: 16px;"><span>Back To Home</span><i class="fa-solid fa-home" onclick="location.href = '/'"></i></span></nav>
    <div class="container">
        <h1 style="width: 100%; display: flex; align-items: center; justify-content: center; gap: 9px; font-size: 18px; font-weight: normal; color: #5d5f62;" class="g"><i class="fa-solid fa-calendar-days" style="font-size: 16px; width: fit-content; margin: 0;"></i><span id="date">english</span></h1>
        <h1 style="width: 100%; display: flex; align-items: center; justify-content: center; gap: 9px; font-size: 18px; font-weight: normal; color: #5d5f62;" class="g">For Typers with over <span style="color: #e2b714">75%</span> accuracy</h1>
        <table id="table">
            <tr>
                <th>Rank</th>
                <th>Name</th>
                <th>WPM</th>
            </tr>
            <tr>
                <td>1.</td>
                <td>AzaanUllah Khan</td>
                <td>156 WPM</td>
            </tr>
            <tr>
                <td>2.</td>
                <td>Moiz Hussain</td>
                <td>149 WPM</td>
            </tr>
            <tr>
                <td>3.</td>
                <td>Abdul Qadir</td>
                <td>17 WPM</td>
            </tr>
        </table>
    </div>
    <script src="script.js"></script>
    <script src="firebase.js" type="module"></script>
</body>
</html>