Style game buttons
This commit is contained in:
parent
fa04758877
commit
8b048dbef9
@ -123,7 +123,7 @@ public class LingoController {
|
||||
final Game game = new Game(player);
|
||||
gameById.put(game.id, game);
|
||||
gameByPlayer.put(player, game);
|
||||
log.info("{} hosted a game", player);
|
||||
log.info("{} hosted Game {}", player, game.id);
|
||||
send(Destinations.GAME_HOSTED, game);
|
||||
}
|
||||
|
||||
@ -198,6 +198,7 @@ public class LingoController {
|
||||
if (playerOne == player) {
|
||||
if (playerTwo == null) {
|
||||
// Close the game
|
||||
log.info("{} closed Game {}", player, game.id);
|
||||
gameById.remove(game.id);
|
||||
send(Destinations.GAME_CLOSED, game);
|
||||
} else {
|
||||
|
@ -26,14 +26,14 @@
|
||||
</div>
|
||||
<div class="list-group">
|
||||
<div v-if="games.length === 0" class="list-group-item">There are no games</div>
|
||||
<div v-for="game in games">
|
||||
<template v-for="game in games">
|
||||
<div v-if="game.started" v-bind:id="'game-' + game.id" class="list-group-item">
|
||||
<strong>{{ game.playerOne }}</strong> is playing with <strong>{{ game.playerTwo }}</strong>
|
||||
<strong>{{ game.playerOne }}</strong> vs. <strong>{{ game.playerTwo }}</strong>
|
||||
</div>
|
||||
<button v-else v-bind:id="'game-' + game.id" @click="joinGame" type="button" class="list-group-item">
|
||||
<button v-else v-bind:id="'game-' + game.id" @click="joinGame" type="button" v-bind:disabled="inGame" class="list-group-item">
|
||||
<strong>{{ game.playerOne }}</strong> wants to play
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<button v-show="inGame" @click="leaveGame" type="button" class="leave button">Leave game</button>
|
||||
|
@ -112,6 +112,7 @@ button:hover:disabled {
|
||||
font-size: 1em;
|
||||
border-width: 1px 0;
|
||||
border-radius: 0;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.list-group-item {
|
||||
@ -132,6 +133,15 @@ button.list-group-item:hover {
|
||||
background-color: lightblue;
|
||||
}
|
||||
|
||||
button.list-group-item:disabled {
|
||||
color: black;
|
||||
}
|
||||
|
||||
button.list-group-item:hover:disabled {
|
||||
background-color: white;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.button {
|
||||
width: 120px;
|
||||
margin-left: 10px;
|
||||
|
Loading…
x
Reference in New Issue
Block a user