index.html

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>GuessNumber</title>
        <link rel="stylesheet" href="./css/style.css">
        <script src="./js/index.js" defer></script>

        <!-- Favicon -->
        <link rel="shortcut icon" href="img/numbers.png">
        <!-- Fonts -->
        <link rel="preconnect" href="https://fonts.googleapis.com">
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link href="https://fonts.googleapis.com/css2?family=Special+Elite&display=swap" rel="stylesheet">
    </head>
    <body>
        <header>
            <a href="#"><h1>GuessNumber</h1></a>
        </header>      

        <main class="container">
            <form id="form">
                <label for="kick">Digite um número de (0 a 10)</label>
                <input type="number" id="kick" max="10" placeholder="0">

                <button type="submit">Jogar!</button>
            </form>

            <section class="result-box" id="result">
                <h2 id="status">Adivinhe o numero sorteado!</h2>
                <span id="attempt">Tentativas: 0</span>
            </section>
            
            <button id="btnRestart" onclick ="restart()">Jogar de novo!</button>
        </main>

        <footer>
            <p>GuessNumber, 2021 &copy;</p>
        </footer>
    </body>
</html> 