Temple Run Github Page
---
---
## **4. How to Upload to GitHub**
Let me know if you'd like me to add **power-ups**, **mobile swipe controls**, or a **start screen**! </code></pre>
temple-run/ ├── index.html # complete game (canvas + logic + style) └── README.md # this file temple run github
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>Temple Run - GitHub Game</title> <style> * margin: 0; padding: 0; box-sizing: border-box; user-select: none; body background: linear-gradient(145deg, #0a2f1f 0%, #05180e 100%); min-height: 100vh; display: flex; justify-content: center; align-items: center; font-family: 'Courier New', 'Monaco', monospace; .game-container padding: 20px; border-radius: 28px; background: rgba(0,0,0,0.3); box-shadow: 0 20px 35px rgba(0,0,0,0.5); canvas display: block; margin: 0 auto; border-radius: 16px; box-shadow: 0 0 0 4px #d4af37, 0 0 0 8px #3e2a1f; cursor: pointer; .info-panel display: flex; justify-content: space-between; align-items: center; margin-top: 20px; padding: 12px 24px; background: #1e1a0c; border-radius: 60px; color: #f7e05e; text-shadow: 0 2px 0 #5a3e1a; font-weight: bold; font-size: 1.4rem; gap: 30px; flex-wrap: wrap; justify-content: center; .score-box, .high-box background: #000000aa; backdrop-filter: blur(4px); padding: 8px 20px; border-radius: 40px; letter-spacing: 1px; button background: #e25822; border: none; font-family: inherit; font-weight: bold; font-size: 1.2rem; padding: 8px 24px; border-radius: 60px; color: white; text-shadow: 0 1px 0 #7a2e0a; cursor: pointer; transition: 0.1s linear; box-shadow: 0 5px 0 #752e0a; button:active transform: translateY(2px); box-shadow: 0 2px 0 #752e0a; .controls display: flex; gap: 15px; background: #2d2418aa; padding: 8px 20px; border-radius: 60px; font-size: 0.9rem; .controls span background: #0f0f0fcc; padding: 5px 12px; border-radius: 40px; color: #ffd966; @media (max-width: 780px) .info-panel flex-direction: column; align-items: stretch; gap: 12px; .controls justify-content: center; .score-box, .high-box text-align: center; </style> </head> <body> <div> <div class="game-container"> <canvas id="gameCanvas" width="800" height="500"></canvas> <div class="info-panel"> <div class="score-box">🏆 SCORE: <span id="scoreValue">0</span></div> <div class="high-box">👑 BEST: <span id="highScoreValue">0</span></div> <button id="resetBtn">🔄 RUN AGAIN</button> <div class="controls"> <span>⬅️ A / ←</span> <span>➡️ D / →</span> <span>⬆️ W / ↑ (jump)</span> </div> </div> </div> <p style="text-align:center; margin-top:16px; color:#d4c9a3;">🏃♂️ Dodge obstacles | Collect coins | Survive the temple!</p> </div> <script> (function() // ----- CANVAS ----- const canvas = document.getElementById('gameCanvas'); const ctx = canvas.getContext('2d');
1. Create a new repo: `temple-run` 2. Upload `index.html` and `README.md` 3. Enable **GitHub Pages** in Settings → Pages → branch `main` → Save 4. Play online at: `https://yourusername.github.io/temple-run/` --- --- ## **4
The game includes: - 3-lane dodging - Jump mechanic - Coins + score - Persistent high score - Increasing difficulty - Camera shake on collision - Touch & keyboard support
