Only.games.github ❲2025❳

footer text-align: center; margin-top: 4rem; font-size: 0.8rem; color: #4a5568;

.game-grid display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.8rem; max-width: 1200px; margin: 0 auto;

.game-thumb width: 100%; aspect-ratio: 16 / 9; background: #1e2533; border-radius: 1rem; display: flex; align-items: center; justify-content: center; font-size: 3rem; only.games.github

Your live URL will be: https://<your-username>.github.io/only.games.github only.games.github/ ├── index.html ├── style.css ├── games/ │ ├── snake/ │ │ ├── index.html │ │ ├── script.js │ │ └── style.css │ ├── tetris/ │ │ └── ... │ └── platformer/ │ └── ... ├── assets/ │ ├── favicon.ico │ └── placeholder.png └── README.md 4. Core HTML (index.html) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> <title>only.games — classic arcade</title> <link rel="stylesheet" href="style.css"> <link rel="icon" type="image/x-icon" href="assets/favicon.ico"> </head> <body> <header> <h1>🎮 only.games</h1> <p>no launchers. no logins. just games.</p> </header> <main class="game-grid" id="gameGrid">  </main> <footer> <span>⚡ hosted on GitHub Pages</span> </footer> <script src="script.js"></script> </body> </html> 5. Style (style.css) * margin: 0; padding: 0; box-sizing: border-box;

Create games.json in the root:

.game-card:hover transform: translateY(-4px); box-shadow: 0 12px 24px rgba(0,0,0,0.4); border-color: #5b6e8c;

body font-family: system-ui, 'Segoe UI', monospace; background: #0a0f1e; color: #eef4ff; padding: 2rem; min-height: 100vh; footer text-align: center; margin-top: 4rem; font-size: 0

header text-align: center; margin-bottom: 3rem;