Merge branch 'master' into game-templates

README.md

@@ -6,6 +6,12 @@
 
 Find the latest production deployment at: https://play-werewolf.app/
 
+- [Features](#features)
+- [Tech Stack](#tech-stack)
+- [Contributing and Developers' Guide](#contributing-and-developers-guide)
+- [Testing](#testing)
+- [Code Formatting](#code-formatting)
+
 An application to run games of <a href="https://en.wikipedia.org/wiki/Mafia_(party_game)">Werewolf (Mafia)</a>
 smoothly when you don't have a deck, or when you and your friends are together virtually. Basically, a host builds a game and deals a role to everyone's device, and then the app keeps track of the game state (timer, player statuses, etc). 
 
@@ -41,8 +47,10 @@ The application prioritizes responsiveness. A key scenario would be when a group
 
 This is a Node.js application. It is written purely using JavaScript/HTML/CSS. The main dependencies are
 <a href="https://expressjs.com/">Express.js</a> and <a href="https://socket.io/">Socket.io</a>. It runs as a containerized application
-via <a href='https://cloud.google.com/run'>Google Cloud Run</a>.
+via <a href='https://cloud.google.com/run'>Google Cloud Run</a>. There is no data persisted in any database. 
 
+Currently there is one container instance, which is sufficient scaling at this time. In the event I need to scale to multiple containers, I will likely
+integrate with a message queue like <a href='https://redis.io/'>Redis</a>.
 ## Contributing and Developers' Guide
 
 ### Running Locally

client/src/modules/HTMLFragments.js

@@ -226,9 +226,7 @@ export const HTMLFragments = {
             <div id='game-player-list'></div>
         </div>`,
     RESTART_GAME_BUTTON:
-        `<div>
-            <button id='restart-game' class='app-button'>Run it back 🔄</button>
-        </div>`,
+        '<button id=\'restart-game\' class=\'app-button\'>Run it back 🔄</button>',
     CREATE_GAME_DECK:
         `<div id='deck-container'>
             <div>

client/src/styles/game.css

@@ -104,9 +104,17 @@ h1 {
     align-items: center;
 }
 
+#end-of-game-header h2 {
+    border: 1px solid #333243;
+    border-radius: 5px;
+    background-color: #1a1726;
+    padding: 7px;
+    margin: 0.5em;
+}
+
 #end-of-game-header button {
     margin: 0.5em;
-    min-width: 10em;
+    min-width: 12em;
 }
 .potential-moderator {
     display: flex;