| 
									
										
										
										
											2025-01-04 21:00:39 +01:00
										 |  |  | <!DOCTYPE html> | 
					
						
							|  |  |  | <html lang="en"> | 
					
						
							| 
									
										
										
										
											2025-01-05 01:13:23 +01:00
										 |  |  |   <head> | 
					
						
							|  |  |  |     <meta charset="UTF-8" /> | 
					
						
							|  |  |  |     <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | 
					
						
							|  |  |  |     <title>Guess My Number</title> | 
					
						
							|  |  |  |     <link rel="stylesheet" href="styles.css" /> | 
					
						
							| 
									
										
										
										
											2025-02-21 11:34:11 +01:00
										 |  |  |     <link | 
					
						
							|  |  |  |       rel="apple-touch-icon" | 
					
						
							|  |  |  |       sizes="180x180" | 
					
						
							|  |  |  |       href="../../favicon_io/apple-touch-icon.png" | 
					
						
							|  |  |  |     /> | 
					
						
							|  |  |  |     <link | 
					
						
							|  |  |  |       rel="icon" | 
					
						
							|  |  |  |       type="image/png" | 
					
						
							|  |  |  |       sizes="32x32" | 
					
						
							|  |  |  |       href="../../favicon_io/favicon-32x32.png" | 
					
						
							|  |  |  |     /> | 
					
						
							|  |  |  |     <link | 
					
						
							|  |  |  |       rel="icon" | 
					
						
							|  |  |  |       type="image/png" | 
					
						
							|  |  |  |       sizes="16x16" | 
					
						
							|  |  |  |       href="../../favicon_io/favicon-16x16.png" | 
					
						
							|  |  |  |     /> | 
					
						
							|  |  |  |     <link rel="manifest" href="../../favicon_io/site.webmanifest" /> | 
					
						
							| 
									
										
										
										
											2025-01-05 01:13:23 +01:00
										 |  |  |   </head> | 
					
						
							|  |  |  |   <body> | 
					
						
							|  |  |  |     <div class="gameboy"> | 
					
						
							|  |  |  |       <!-- Game Boy Screen --> | 
					
						
							|  |  |  |       <div class="screen"> | 
					
						
							|  |  |  |         <article class="game"> | 
					
						
							|  |  |  |           <h1>Guess My Number - Game</h1> | 
					
						
							|  |  |  |           <p class="message"></p> | 
					
						
							|  |  |  |           <div class="guess-display"> | 
					
						
							|  |  |  |             <span id="guess"></span> | 
					
						
							|  |  |  |           </div> | 
					
						
							|  |  |  |           <p class="score"></p> | 
					
						
							|  |  |  |           <p class="highScore"></p> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |           <div class="description"> | 
					
						
							| 
									
										
										
										
											2025-01-04 21:00:39 +01:00
										 |  |  |             <h2>Description</h2> | 
					
						
							|  |  |  |             <p>Guess a number between 1 and 20</p> | 
					
						
							|  |  |  |             <p>A = check</p> | 
					
						
							|  |  |  |             <p>B = Reload</p> | 
					
						
							|  |  |  |             <p>▲ = increases guess by one</p> | 
					
						
							| 
									
										
										
										
											2025-01-04 21:44:30 +01:00
										 |  |  |             <p>▼ = decreases guess by one</p> | 
					
						
							| 
									
										
										
										
											2025-01-05 01:13:23 +01:00
										 |  |  |           </div> | 
					
						
							|  |  |  |         </article> | 
					
						
							| 
									
										
										
										
											2025-01-04 21:00:39 +01:00
										 |  |  |       </div> | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2025-01-05 01:13:23 +01:00
										 |  |  |       <!-- Controls --> | 
					
						
							|  |  |  |       <div class="controls"> | 
					
						
							|  |  |  |         <!-- D-Pad on the left --> | 
					
						
							|  |  |  |         <div class="dpad"> | 
					
						
							|  |  |  |           <button class="dpad-btn up" id="up">▲</button> | 
					
						
							|  |  |  |           <button class="dpad-btn left" id="left">◀</button> | 
					
						
							|  |  |  |           <div class="dpad-center"></div> | 
					
						
							|  |  |  |           <button class="dpad-btn right" id="right">▶</button> | 
					
						
							|  |  |  |           <button class="dpad-btn down" id="down">▼</button> | 
					
						
							|  |  |  |         </div> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |         <!-- A and B Buttons on the right --> | 
					
						
							|  |  |  |         <div class="action-buttons"> | 
					
						
							|  |  |  |           <button class="btn" id="check">A</button> | 
					
						
							|  |  |  |           <button class="btn" id="restart">B</button> | 
					
						
							|  |  |  |         </div> | 
					
						
							| 
									
										
										
										
											2025-01-04 21:00:39 +01:00
										 |  |  |       </div> | 
					
						
							|  |  |  |     </div> | 
					
						
							| 
									
										
										
										
											2025-01-05 01:13:23 +01:00
										 |  |  |     <script src="game.js"></script> | 
					
						
							|  |  |  |     <script src="styles.js"></script> | 
					
						
							|  |  |  |   </body> | 
					
						
							| 
									
										
										
										
											2025-01-04 21:00:39 +01:00
										 |  |  | </html> |