mirror of
https://github.com/tiennm99/loldle.git
synced 2026-09-10 04:20:02 +00:00
tiennm99
9572f39f59
Vanilla JS web game with modular architecture: - data-loader: champion data fetching, seeded random selection - game-engine: mode-agnostic state machine with localStorage persistence - classic-mode: 7-attribute comparison logic (gender, genre, range, resource, region, lane, year) - ui-renderer: search autocomplete, colored feedback grid, stats display - Dark theme responsive UI with Data Dragon CDN champion images
36 lines
915 B
HTML
36 lines
915 B
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>LoLdle Classic</title>
|
|
<link rel="stylesheet" href="css/styles.css" />
|
|
</head>
|
|
<body>
|
|
<header class="header">
|
|
<h1>Lo<span>L</span>dle</h1>
|
|
<div class="mode-toggle">
|
|
<button id="mode-daily" class="mode-btn active">Daily</button>
|
|
<button id="mode-unlimited" class="mode-btn">Unlimited</button>
|
|
</div>
|
|
</header>
|
|
|
|
<div id="stats"></div>
|
|
|
|
<div class="search-container">
|
|
<input type="text" id="search-input" placeholder="Type a champion name..." autocomplete="off" />
|
|
<div id="search-dropdown"></div>
|
|
</div>
|
|
|
|
<p id="guess-counter" class="guess-counter"></p>
|
|
|
|
<main class="grid-container">
|
|
<div id="grid"></div>
|
|
</main>
|
|
|
|
<div id="game-over"></div>
|
|
|
|
<script type="module" src="js/app.js"></script>
|
|
</body>
|
|
</html>
|