From fb3af5cdb9037a9a47f5c12f17ce5d2fb638e277 Mon Sep 17 00:00:00 2001
From: Maier <maiera3@nationwide.com>
Date: Wed, 8 Jan 2020 11:33:00 -0500
Subject: [PATCH] mobile animation styling

---
 static/game.js    |  2 +-
 static/styles.css | 28 +++++++++++++++++++++++++---
 2 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/static/game.js b/static/game.js
index 452f6ac..fb50f57 100644
--- a/static/game.js
+++ b/static/game.js
@@ -60,7 +60,7 @@ function triggerExitAnimation(e) {
 
 function triggerEntranceAnimation(selector, entranceClass, exitClass, image) {
         let transitionEl = document.querySelector(selector);
-        transitionEl.style.display = 'block';
+        transitionEl.style.display = 'flex';
         transitionEl.addEventListener('animationend', triggerExitAnimation, {"capture": true, "once": true});
         transitionEl.classList.remove(entranceClass);
         transitionEl.entranceClass = entranceClass;
diff --git a/static/styles.css b/static/styles.css
index 32fcd4e..daae2c8 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -90,6 +90,19 @@
     #join-game-container a button {
         width: 100%;
     }
+
+    #overlay {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+    }
+
+    #killed-name {
+        padding-top: 0;
+        margin: 0 0.5em;
+        font-size: 2em;
+    }
 }
 
 @media(min-width: 750.01px) {
@@ -175,6 +188,17 @@
         margin-right: 1em;
     }
 
+    #killed-name {
+        padding-top: 2em;
+        font-size: 2.5em;
+        margin: 0;
+    }
+
+    #overlay {
+        justify-content: flex-start;
+        align-items: center;
+    }
+
 }
 
 @font-face {
@@ -1036,6 +1060,7 @@ label {
     position: fixed;
     user-select: none;
     display: none;
+    flex-direction: column;
     width: 100%;
     height: 100%;
     top: 0;
@@ -1049,9 +1074,6 @@ label {
 #killed-name {
     display: none;
     color: white;
-    padding-top: 2em;
-    font-size: 2.5em;
-    margin: 0;
 }
 
 #killed-role {