Only.games.github -
loadGames(); Create games/snake/index.html :
"games": [ "id": "snake", "title": "SNAKE", "desc": "classic arcade snake", "thumb": "🐍", "path": "games/snake/index.html" , "id": "tetris", "title": "TETRIS", "desc": "stack & clear", "thumb": "🧩", "path": "games/tetris/index.html" , "id": "platformer", "title": "PLATFORMER", "desc": "jump & run", "thumb": "🏃", "path": "games/platformer/index.html" ] only.games.github
.game-thumb width: 100%; aspect-ratio: 16 / 9; background: #1e2533; border-radius: 1rem; display: flex; align-items: center; justify-content: center; font-size: 3rem; loadGames(); Create games/snake/index
.game-desc font-size: 0.85rem; color: #9aa9c1; "desc": "classic arcade snake"
async function loadGames() const res = await fetch('games.json'); const data = await res.json(); const grid = document.getElementById('gameGrid'); grid.innerHTML = data.games.map(game => ` <a href="$game.path" class="game-card" target="_top"> <div class="game-thumb">$game.thumb</div> <div class="game-title">$game.title</div> <div class="game-desc">$game.desc</div> </a> `).join('');