memory.html (1889B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Memory</title> 5 <link rel="stylesheet" href="css/main.css" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1" /> 7 </head> 8 <body> 9 <div class ="container"> 10 <div class ="header"> 11 <div class ="menu_btn" onclick="menu()"> 12 <div class="line"></div> 13 <div class="line"></div> 14 <div class="line"></div> 15 </div> 16 <div class="title">Memory</div> 17 <div class="restart_button"> 18 <img class="restart" src="img/restart.png" alt="restart button"> 19 </div> 20 </div> 21 <div class="menu" id="menu"> 22 <div id="theme"> 23 <select id="picture-select" onchange="onSelect()"> 24 <option value="dog">Doggos</option> 25 <option value="cat">Kitties</option> 26 </select> 27 <label for="theme">Select a theme</label> 28 </div> 29 <div id="card_color"> 30 <input type="color" id="closed_card" name="closed_card" value="#df9a06" onchange="colorChange()"> 31 <label for="closed_card">Closed card</label><br> 32 <input type="color" id="found_card" name="found_card" value="#df9a06" onchange="colorChange()"> 33 <label for="found_card">Found card</label> 34 </div> 35 </div> 36 <div class="game_state"> 37 <span id='login'></span> 38 <div id="game_time">Time: 0sec</div> 39 40 <div id="found_pairs">Pairs: <span id='pairs'>0</span></div> 41 <div id="progress_bar"></div> 42 </div> 43 44 <div aria-label="game board" class ="game_board" id="game_board"> 45 46 </div> 47 <div class ="footer"> 48 <div class="high_scores"> 49 <h2> Top 5 </h2> 50 <ul id="top_5" aria-label="Top 5"> 51 </ul> 52 </div> 53 <div id="average_time"><h2>Average playtime: 420s</h2></div> 54 </div> 55 </div> 56 <script type="text/javascript" src="backend.js"></script> 57 <script type="text/javascript" src="memory.js"></script> 58 ></script> 59 </b