memory

Play Memory
Log | Files | Refs

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