From 2d852c2fc0c8301b274fa4934959120c1da4f905 Mon Sep 17 00:00:00 2001
From: Alec Maier <Maier.144@osu.edu>
Date: Sun, 1 Sep 2019 14:09:18 -0400
Subject: [PATCH] Set max width for game header, fixed bug in flipping card on
 every state change

---
 static/game.js    | 6 +++++-
 static/styles.css | 2 ++
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/static/game.js b/static/game.js
index 3fc886d..48b0d92 100644
--- a/static/game.js
+++ b/static/game.js
@@ -4,6 +4,7 @@ const socket = io();
 let clock;
 let currentGame = null;
 let cardFlippedOver = false;
+let cardDealt = false;
 
 // respond to the game state received from the server
 socket.on('state', function(game) {
@@ -81,7 +82,10 @@ function renderGame() {
         "</div>";
 
     // initially flip the card over for a reveal, allow it to be flipped on click/tap
-    flipCard();
+    if (!cardDealt) {
+        flipCard();
+        cardDealt = true;
+    }
     document.getElementById("game-card").addEventListener("click", flipCard);
 
     let killedBtn = document.createElement("button");
diff --git a/static/styles.css b/static/styles.css
index 9d87d64..896f4f8 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -393,6 +393,7 @@ label {
 #players-remaining {
     font-size: 1.7em;
     color: gray;
+    width: 4em;
     margin-bottom: 0.5em;
 }
 
@@ -410,5 +411,6 @@ label {
 .game-header {
     display: flex;
     margin: 0 auto;
+    max-width: 35em;
     justify-content: space-evenly;
 }