cgould/lingo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Style action buttons

Browse Source
This commit is contained in:
Charles Gould 2017-01-30 23:16:06 -05:00
parent 3a4c6eff15
commit fa04758877
2 changed files with 21 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
server/src/main/resources/static/index.html
View File

@ -25,7 +25,7 @@
<h3 class="panel-title">Games</h3>
</div>
<div class="list-group">
<div v-if="games.length === 0" class="list-group-item">There are no games.</div>
<div v-if="games.length === 0" class="list-group-item">There are no games</div>
<div 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>
@ -36,8 +36,8 @@
</div>
</div>
</div>
<button v-if="inGame" @click="leaveGame" type="button">Leave game</button>
<button v-else @click="hostGame" type="button">Create a game</button>
<button v-show="inGame" @click="leaveGame" type="button" class="leave button">Leave game</button>
<button v-show="!inGame" @click="hostGame" type="button" class="create button">Create game</button>
</div>
</div>
<div id="gameColumn" class="game column">

18
server/src/main/resources/static/style.css
View File

@ -109,6 +109,7 @@ button:hover:disabled {
}
.panel>.list-group .list-group-item {
font-size: 1em;
border-width: 1px 0;
border-radius: 0;
}
@ -131,6 +132,23 @@ button.list-group-item:hover {
background-color: lightblue;
}
.button {
width: 120px;
margin-left: 10px;
border: none;
outline: none;
}
.create.button {
background-color: steelblue;
color: white;
}
.leave.button {
background-color: lightcoral;
color: black;
}
/* Nickname pane */
.form {