111 lines
4.0 KiB
HTML
111 lines
4.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Leaderboard - 2048</title>
|
|
<link rel="stylesheet" href="leaderboard.css">
|
|
</head>
|
|
|
|
<body>
|
|
<div id="particles"></div>
|
|
|
|
<div class="container">
|
|
<h1>Leaderboard</h1>
|
|
|
|
<div class="stats-container">
|
|
<div class="stat-box">
|
|
<div class="stat-label">Players</div>
|
|
<div class="stat-value" id="totalPlayers">142</div>
|
|
</div>
|
|
<div class="stat-box">
|
|
<div class="stat-label">Your Rank</div>
|
|
<div class="stat-value" id="yourRank">--</div>
|
|
</div>
|
|
<div class="stat-box">
|
|
<div class="stat-label">Top Score</div>
|
|
<div class="stat-value" id="topScore">0</div>
|
|
</div>
|
|
</div>
|
|
|
|
<ul class="leaderboard-list" id="leaderboardList">
|
|
|
|
<li class="leaderboard-item rank-1">
|
|
<div class="rank-badge">1</div>
|
|
<div class="player-info">
|
|
<div class="player-name">CyberKing</div>
|
|
<div class="player-level">Level 99</div>
|
|
</div>
|
|
<div class="player-score">
|
|
<div class="score-value">9,850</div>
|
|
<div class="score-label">Points</div>
|
|
</div>
|
|
</li>
|
|
|
|
<li class="leaderboard-item rank-2">
|
|
<div class="rank-badge">2</div>
|
|
<div class="player-info">
|
|
<div class="player-name">NeonMaster</div>
|
|
<div class="player-level">Level 87</div>
|
|
</div>
|
|
<div class="player-score">
|
|
<div class="score-value">8,200</div>
|
|
<div class="score-label">Points</div>
|
|
</div>
|
|
</li>
|
|
|
|
<li class="leaderboard-item rank-3">
|
|
<div class="rank-badge">3</div>
|
|
<div class="player-info">
|
|
<div class="player-name">PixelHunter</div>
|
|
<div class="player-level">Level 75</div>
|
|
</div>
|
|
<div class="player-score">
|
|
<div class="score-value">6,950</div>
|
|
<div class="score-label">Points</div>
|
|
</div>
|
|
</li>
|
|
|
|
<li class="leaderboard-item rank-other">
|
|
<div class="rank-badge">4</div>
|
|
<div class="player-info">
|
|
<div class="player-name">StarGazer</div>
|
|
<div class="player-level">Level 62</div>
|
|
</div>
|
|
<div class="player-score">
|
|
<div class="score-value">5,420</div>
|
|
<div class="score-label">Points</div>
|
|
</div>
|
|
</li>
|
|
|
|
<li class="leaderboard-item rank-other">
|
|
<div class="rank-badge">5</div>
|
|
<div class="player-info">
|
|
<div class="player-name">CodeNinja</div>
|
|
<div class="player-level">Level 58</div>
|
|
</div>
|
|
<div class="player-score">
|
|
<div class="score-value">4,890</div>
|
|
<div class="score-label">Points</div>
|
|
</div>
|
|
</li>
|
|
|
|
<li class="leaderboard-item rank-other your-rank">
|
|
<div class="rank-badge">12</div>
|
|
<div class="player-info">
|
|
<div class="player-name">You</div>
|
|
<div class="player-level">Level 42</div>
|
|
</div>
|
|
<div class="player-score">
|
|
<div class="score-value">3,120</div>
|
|
<div class="score-label">Points</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
<button class="btn-back" onclick="location.href='2048.html'">
|
|
Back to Game
|
|
</button>
|
|
</div>
|
|
</body>
|
|
</html> |