de07d6e7a2
- Split monolithic index.astro into Astro components for each screen and modal - Moved all styles to src/styles/index.css - Moved all JS logic to src/scripts/index.js and public/scripts/index.js - Updated event wiring and removed inline handlers for best practice - Ensured all components and scripts are integrated and functional Refs #1
50 lines
2.0 KiB
Plaintext
50 lines
2.0 KiB
Plaintext
---
|
|
---
|
|
<div class="screen" id="new-game-screen">
|
|
<div class="screen-content">
|
|
<h1 class="screen-title">Neues Spiel</h1>
|
|
<div class="player-inputs">
|
|
<div class="player-input">
|
|
<label for="player1">Spieler 1</label>
|
|
<div class="name-input-container">
|
|
<select id="player1-select" class="name-select"><option value="">Vorherige Spieler...</option></select>
|
|
<input type="text" id="player1" placeholder="Name Spieler 1" class="name-input" />
|
|
</div>
|
|
</div>
|
|
<div class="player-input">
|
|
<label for="player2">Spieler 2</label>
|
|
<div class="name-input-container">
|
|
<select id="player2-select" class="name-select"><option value="">Vorherige Spieler...</option></select>
|
|
<input type="text" id="player2" placeholder="Name Spieler 2" class="name-input" />
|
|
</div>
|
|
</div>
|
|
<div class="player-input">
|
|
<label for="player3">Spieler 3 (optional)</label>
|
|
<div class="name-input-container">
|
|
<select id="player3-select" class="name-select"><option value="">Vorherige Spieler...</option></select>
|
|
<input type="text" id="player3" placeholder="Name Spieler 3" class="name-input" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="game-settings">
|
|
<div class="setting-group">
|
|
<label for="game-type">Spieltyp</label>
|
|
<select id="game-type">
|
|
<option value="8-Ball">8-Ball</option>
|
|
<option value="9-Ball">9-Ball</option>
|
|
<option value="10-Ball">10-Ball</option>
|
|
<option value="14/1">14/1 endlos</option>
|
|
</select>
|
|
</div>
|
|
<div class="setting-group">
|
|
<label for="race-to">Race to X (optional)</label>
|
|
<input type="number" id="race-to" placeholder="0" min="0" max="99" />
|
|
</div>
|
|
</div>
|
|
<div class="nav-buttons">
|
|
<button class="btn nav-button">Spiel starten</button>
|
|
<button class="btn nav-button">Abbrechen</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- TODO: Wire up events and props for integration --> |