<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Roulette wheel</title>
    <script type="module" src="dist/scripts/bundle.js"></script>
    <link rel="stylesheet" href="app.css" />
  </head>
  <body>
    <audio class="roulette-wheel-audio">
      <source src="static/roulette-wheel.mp3" type="audio/mpeg">
      Your browser does not support the audio element
    </audio>
    <div class="light-dark-mode">
      <img class="moon-sun" src="static/moon.png" alt="mode" />
    </div>
    <div class="menu">
      <p class="counter"></p>
      <label for="new-item">Item name</label>
      <input name="new-item" minlength="1" maxlength="20" />
      <button class="add-item-button">Add</button>
      <button class="remove-all-items-button">Remove all</button>
      <ul class="menu-item-list"></ul>
    </div>
    <div class="roulette-wheel">
      <div class="winner"></div>
      <canvas></canvas>
    </div>
    <footer>
      <div hidden="true" class="icons-authors">
        <img class="moon-sun" src="static/moon.png" alt="mode" />
        <img class="moon-sun" src="static/sun.png" alt="mode" /> Made by made by
        <a href="https://www.freepik.com" title="Freepik">Freepik</a> from
        <a href="https://www.flaticon.com/" title="Flaticon"
          >www.flaticon.com</a>
          <a href="https://freesound.org/people/tony_bear/sounds/274007/">
            Sound
          </a>
      </div>
      <p>Icons & sound</p>
    </footer>
  </body>
</html>