2526-web/kelompok06-2048
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Homepage

Browse Source
This commit is contained in:
Jevinca Marvella 2025-12-01 10:12:19 +07:00
parent 7b532af758
commit 0b4ca95aa8
5 changed files with 613 additions and 285 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
2048.html
View File

@ -15,7 +15,6 @@
<div class="starfield" aria-hidden="true"></div>
<div class="cursor-light" aria-hidden="true"></div>
<!-- SOUND CONTROLS - KIRI ATAS -->
<!-- SOUND CONTROL - KIRI ATAS -->
<div class="sound-control-container">
<!-- Main Sound Button -->

2
2048.js
View File

@ -14,7 +14,7 @@ let mergesInCurrentMove = 0;
Audio Setup
------------------------ */
const audio = {
bg: new Audio("Bgmusic.mp3"),
bg: new Audio("Background_Music.mp3"),
pop: new Audio("Pop.mp3"),
merge: new Audio("Merge.mp3")
};

0
Bgmusic.mp3 → Background_Music.mp3
View File

839
Homepage.css
View File

File diff suppressed because it is too large Load Diff

50
Homepage.html
View File

@ -3,44 +3,32 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>2048</title>
<title>Homepage - 2048</title>
<link rel="stylesheet" href="Homepage.css">
</head>
<body>
<div class="container">
<div class="header">
<h1>2048</h1>
</div>
<!-- Neon Particles Background -->
<div id="particles"></div>
<div class="score-container">
<div class="score-box">
<div class="score-label">Score</div>
<div class="score-value" id="score">0</div>
</div>
<div class="score-box">
<div class="score-label">High</div>
<div class="score-value" id="high">0</div>
</div>
<!-- Header -->
<header>
<div class="logo">2048</div>
<div class="nav-buttons">
<a href="Login.html" class="btn btn-secondary">Login</a>
</div>
</header>
<div class="controls">
<button class="btn" id="newGameBtn">New Game</button>
<button class="btn" id="undoBtn">Undo</button>
<!-- Hero Section -->
<section class="hero">
<div class="hero-title">2048</div>
<p class="hero-subtitle">Join the tiles, reach 2048</p>
<div class="cta-buttons">
<a href="2048.html" class="btn btn-cta btn-play">Play</a>
<a href="leaderboard.html" class="btn btn-cta btn-leaderboard">🏆 Leaderboard</a>
</div>
</section>
<div class="game-board" id="gameBoard"></div>
<div class="instructions">
<h3>How to Play</h3>
<p>Use arrow keys (↑ ↓ ← →) or swipe to move tiles. When two tiles with the same number touch, they merge into one! Join the numbers to reach the <strong>2048 tile</strong>!</p>
</div>
</div>
<div class="game-over" id="gameOver">
<div class="game-over-content">
<h2 id="gameOverTitle">Game Over!</h2>
<p id="gameOverMessage">Your score: <span id="finalScore">0</span></p>
<button class="btn" id="tryAgainBtn">Try Again</button>
</div>
</div>
<script src="Animation_Homepage.js"></script>
</body>
</html>