retropulse/public/overlay.html
2025-09-02 22:27:25 +05:30

48 lines
1.6 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>RetroPulse - Overlay</title>
<link rel="stylesheet" href="/css/overlay.css">
</head>
<body>
<div class="overlay-container">
<!-- Connection Status -->
<div id="connection-status" class="connection-status connecting">
<span class="status-text">Connecting...</span>
</div>
<!-- Current Game Info -->
<div id="current-game" class="current-game hidden">
<div class="game-header">
<img id="game-icon" src="" alt="Game Icon" class="game-icon">
<div class="game-info">
<h2 id="game-title">Loading...</h2>
<p id="console-name" class="console-name"></p>
</div>
</div>
</div>
<!-- Recent Achievements -->
<div id="achievements-container" class="achievements-container">
<h3>Recent Achievements</h3>
<div id="achievements-list" class="achievements-list">
<!-- Achievements will be populated by JavaScript -->
</div>
</div>
<!-- Error Display -->
<div id="error-display" class="error-display hidden">
<div class="error-content">
<h3>Connection Error</h3>
<p id="error-message"></p>
<button onclick="location.reload()">Retry</button>
</div>
</div>
</div>
<script src="/js/overlay.js"></script>
</body>
</html>