X-Git-Url: https://git.auder.net/css/rpsls.css?a=blobdiff_plain;f=client%2Fsrc%2Fviews%2FGame.vue;h=e22156196081b532b0cf765eece70fe697b46a0a;hb=2f258c37c19c5be20ec68695ddfaec2c21f7f0ae;hp=2a7fae87e7f6a3bc8be8531cc8a351fec43e829f;hpb=1d6d7b1d4027cbab04ded299d057ad2fb2896ee6;p=vchess.git diff --git a/client/src/views/Game.vue b/client/src/views/Game.vue index 2a7fae87..e2215619 100644 --- a/client/src/views/Game.vue +++ b/client/src/views/Game.vue @@ -14,7 +14,8 @@ main :newChat="newChat" @mychat="processChat") .row #aboveBoard.col-sm-12.col-md-9.col-md-offset-3.col-lg-10.col-lg-offset-2 - span.variant-info {{ game.vname }} + span.variant-cadence {{ game.cadence }} + span.variant-name {{ game.vname }} button#chatBtn(onClick="doClick('modalChat')") Chat #actions(v-if="game.score=='*'") button(@click="clickDraw()" :class="{['draw-' + drawOffer]: true}") @@ -345,7 +346,7 @@ export default { case "newchat": this.newChat = data.data; if (!document.getElementById("modalChat").checked) - document.getElementById("chatBtn").style.backgroundColor = "#c5fefe"; + document.getElementById("chatBtn").classList.add("somethingnew"); break; } }, @@ -667,7 +668,7 @@ export default { }, resetChatColor: function() { // TODO: this is called twice, once on opening an once on closing - document.getElementById("chatBtn").style.backgroundColor = "#e2e2e2"; + document.getElementById("chatBtn").classList.remove("somethingnew"); }, processChat: function(chat) { this.send("newchat", {data:chat}); @@ -706,6 +707,9 @@ export default { color: grey font-style: italic +#playersInfo > p + margin: 0 + @media screen and (min-width: 768px) #actions width: 300px @@ -727,7 +731,10 @@ export default { #aboveBoard margin-left: 30% -.variant-info +.variant-cadence + padding-right: 10px + +.variant-name font-weight: bold padding-right: 10px @@ -760,4 +767,7 @@ export default { .draw-threerep, .draw-threerep:hover background-color: #e4d1fc + +.somethingnew + background-color: #c5fefe