index.html (2234B)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>Letter Find — KGames</title> 7 <link rel="preconnect" href="https://fonts.googleapis.com"> 8 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> 9 <link href="https://fonts.googleapis.com/css2?family=Fredoka:wght@400;600&display=swap" rel="stylesheet"> 10 <style> 11 * { margin: 0; padding: 0; box-sizing: border-box; } 12 html, body { height: 100%; overflow: hidden; } 13 body { 14 background: #1A1A2E; 15 font-family: 'Fredoka', sans-serif; 16 display: flex; 17 flex-direction: column; 18 } 19 nav { width: 100%; padding: 0.6rem 1.25rem; flex-shrink: 0; } 20 nav a { color: #aaa; text-decoration: none; font-size: 1rem; } 21 nav a:hover { color: #fff; } 22 #game-container { flex: 1; width: 100%; } 23 24 #audio-controls { 25 position: fixed; 26 top: 0.45rem; 27 right: 1rem; 28 display: flex; 29 gap: 0.4rem; 30 z-index: 10; 31 } 32 #audio-controls button { 33 background: rgba(255,255,255,0.08); 34 border: 1px solid rgba(255,255,255,0.18); 35 color: #bbb; 36 font-family: 'Fredoka', sans-serif; 37 font-size: 0.85rem; 38 padding: 0.25rem 0.65rem; 39 border-radius: 6px; 40 cursor: pointer; 41 transition: background 0.15s, color 0.15s; 42 user-select: none; 43 } 44 #audio-controls button:hover { background: rgba(255,255,255,0.16); color: #fff; } 45 #audio-controls button.muted { color: #555; border-color: rgba(255,255,255,0.08); } 46 </style> 47 </head> 48 <body> 49 <nav><a href="../../index.html">← Back to KGames</a></nav> 50 <div id="audio-controls"> 51 <button id="btn-music">Music: ON</button> 52 <button id="btn-sfx">SFX: ON</button> 53 </div> 54 <div id="game-container"></div> 55 <script src="https://cdn.jsdelivr.net/npm/phaser@3.80.1/dist/phaser.min.js"></script> 56 <script src="https://cdn.jsdelivr.net/npm/tone@14.7.77/build/Tone.js"></script> 57 <script src="../../js/shared/game-shared.js"></script> 58 <script src="game.js"></script> 59 <script src="../../js/shared/touch-controls.js"></script> 60 <script>KGames.initTouchControls({ layout: 'alphabet' });</script> 61 </body> 62 </html>