feat(ui): changed Background color, centered Lobby

Added a background color for the mainmenu and the lobby + centered lobby
This commit is contained in:
LQ63
2025-11-09 16:34:47 +01:00
parent b847d3c054
commit a71752df2f
7 changed files with 91 additions and 96 deletions

View File

@@ -2,31 +2,33 @@
@main("Create Game") {
@navbar(user)
<form action="@routes.MainMenuController.createGame()" method="post" class="game-field-background">
<div class="w-50 mx-auto">
<div class="mt-3">
<label for="lobbyname" class="form-label">Lobby-Name</label>
<input type="text" class="form-control" id="lobbyname" name="lobbyname" placeholder="Lobby 1" required>
</div>
<div class="form-check form-switch mt-3">
<input class="form-check-input" type="checkbox" id="visibilityswitch" disabled>
<label class="form-check-label" for="visibilityswitch">public/private</label>
</div>
<main class="lobby-background flex-grow-1">
<form action="@routes.MainMenuController.createGame()" method="post">
<div class="w-50 mx-auto">
<div class="mt-3">
<label for="playeramount" class="form-label">Playeramount:</label>
<input type="range" class="form-range text-body" min="2" max="7" value="2" id="playeramount" name="playeramount">
<div class="d-flex justify-content-between">
<span>2</span>
<span>3</span>
<span>4</span>
<span>5</span>
<span>6</span>
<span>7</span>
</div>
<label for="lobbyname" class="form-label">Lobby-Name</label>
<input type="text" class="form-control" id="lobbyname" name="lobbyname" placeholder="Lobby 1" required>
</div>
<div class="form-check form-switch mt-3">
<input class="form-check-input" type="checkbox" id="visibilityswitch" disabled>
<label class="form-check-label" for="visibilityswitch">public/private</label>
</div>
<div class="mt-3">
<label for="playeramount" class="form-label">Playeramount:</label>
<input type="range" class="form-range text-body" min="2" max="7" value="2" id="playeramount" name="playeramount">
<div class="d-flex justify-content-between">
<span>2</span>
<span>3</span>
<span>4</span>
<span>5</span>
<span>6</span>
<span>7</span>
</div>
</div>
<div class="mt-3 text-center">
<button type="submit" class="btn btn-success">Create Game</button>
</div>
<div class="mt-3 text-center">
<button type="submit" class="btn btn-success">Create Game</button>
</div>
</div>
</form>
</form>
</main>
}