implemented radio button system for entering the games

This commit is contained in:
Jonas Hahn
2025-08-27 15:22:13 +02:00
parent 9595da7a53
commit c04466835e
2 changed files with 108 additions and 52 deletions

View File

@@ -8,34 +8,81 @@
{{end}}
<form method="POST" action="/enter">
<div class="row">
<div style="flex:1;min-width:180px">
<h3>Team A</h3>
<label class="label">Player A1</label>
<input class="input" name="a1" {{if (index .Form "a1")}}value="{{index .Form "a1"}}"{{else}}value="{{.CurrentUser.Username}}"{{end}} placeholder="username or email">
<div style="height:6px"></div>
<label class="label">Player A2 (optional)</label>
<input class="input" name="a2" value="{{index .Form "a2"}}" placeholder="username or email">
<div style="height:12px"></div>
<label class="label">Score A</label>
<input class="input" type="number" name="scoreA" value="{{index .Form "scoreA"}}" placeholder="0" min="0" max="10" required>
<div class="players">
{{/* Player 1 */}}
<div class="player-row">
<input class="input" name="p1"
{{if (index .Form "p1")}}value="{{index .Form "p1"}}"{{else}}value="{{.CurrentUser.Username}}"{{end}}
placeholder="Player 1">
<div class="team-choice">
<label><input type="radio" name="team_p1" value="A" checked>A</label>
<label><input type="radio" name="team_p1" value="B">B</label>
<label><input type="radio" name="team_p1" value="none">None</label>
</div>
</div>
<div style="flex:1;min-width:180px">
<h3>Team B</h3>
<label class="label">Player B1</label>
<input class="input" name="b1" value="{{index .Form "b1"}}" placeholder="username or email">
<div style="height:6px"></div>
<label class="label">Player B2 (optional)</label>
<input class="input" name="b2" value="{{index .Form "b2"}}" placeholder="username or email">
<div style="height:12px"></div>
<label class="label">Score B</label>
<input class="input" type="number" name="scoreB" value="{{index .Form "scoreB"}}" placeholder="0" min="0" max="10" required>
{{/* Player 2 */}}
<div class="player-row">
<input class="input" name="p2" value="{{index .Form "p2"}}" placeholder="Player 2">
<div class="team-choice">
<label><input type="radio" name="team_p2" value="A">A</label>
<label><input type="radio" name="team_p2" value="B" checked>B</label>
<label><input type="radio" name="team_p2" value="none">None</label>
</div>
</div>
{{/* Player 3 */}}
<div class="player-row">
<input class="input" name="p3" value="{{index .Form "p3"}}" placeholder="Player 3 (optional)">
<div class="team-choice">
<label><input type="radio" name="team_p3" value="A">A</label>
<label><input type="radio" name="team_p3" value="B">B</label>
<label><input type="radio" name="team_p3" value="none" checked>None</label>
</div>
</div>
{{/* Player 3 */}}
<div class="player-row">
<input class="input" name="p4" value="{{index .Form "p4"}}" placeholder="Player 4 (optional)">
<div class="team-choice">
<label><input type="radio" name="team_p4" value="A">A</label>
<label><input type="radio" name="team_p4" value="B">B</label>
<label><input type="radio" name="team_p4" value="none" checked>None</label>
</div>
</div>
</div>
<div style="height:12px"></div>
<div style="height:16px"></div>
<div class="scores">
<label class="label">Score Team A</label>
<input class="input" type="number" name="scoreA" value="{{index .Form "scoreA"}}" placeholder="0" min="0" max="10" required>
<div style="height:12px"></div>
<label class="label">Score Team B</label>
<input class="input" type="number" name="scoreB" value="{{index .Form "scoreB"}}" placeholder="0" min="0" max="10" required>
</div>
<div style="height:16px"></div>
<button class="btn btn-primary" type="submit">Submit result</button>
</form>
</div>
<style>
.player-row {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 10px;
}
.team-choice {
display: flex;
gap: 10px;
font-size: 14px;
}
.players {
margin-bottom: 20px;
}
</style>
{{end}}