From 9b3ced1b581921eeb01126f7cbf82942dff1480e Mon Sep 17 00:00:00 2001 From: Maier Date: Fri, 10 Jan 2020 10:11:20 -0500 Subject: [PATCH] cleanud up gradient, attempted fix for killed animation in safari --- static/game.js | 4 ++-- static/styles.css | 12 ++++++++---- views/index.html | 24 ++++++++++++------------ 3 files changed, 22 insertions(+), 18 deletions(-) diff --git a/static/game.js b/static/game.js index 12882ad..04585d7 100644 --- a/static/game.js +++ b/static/game.js @@ -54,14 +54,14 @@ function triggerExitAnimation(e) { e.target.offsetWidth; e.target.classList.add(e.target.exitClass); window.setTimeout(()=>{ - e.target.addEventListener('animationend', hideAfterExit, {"capture": true, "once": true}); + e.target.addEventListener('animationend', hideAfterExit, true); },0); } function triggerEntranceAnimation(selector, entranceClass, exitClass, image) { let transitionEl = document.querySelector(selector); transitionEl.style.display = 'flex'; - transitionEl.addEventListener('animationend', triggerExitAnimation, {"capture": true, "once": true}); + transitionEl.addEventListener('animationend', triggerExitAnimation, true); transitionEl.classList.remove(entranceClass); transitionEl.entranceClass = entranceClass; transitionEl.exitClass = exitClass; diff --git a/static/styles.css b/static/styles.css index 0ffd2c0..a2dfc78 100644 --- a/static/styles.css +++ b/static/styles.css @@ -55,7 +55,6 @@ .app-title img { width: 100%; - filter: drop-shadow(45px -15px 100px rgba(255,255,255, 1)); } #card-select-header, #game-start { @@ -98,8 +97,6 @@ } #overlay { - display: flex; - flex-direction: column; justify-content: center; align-items: center; } @@ -164,7 +161,6 @@ .app-title img { width: 35em; - filter: drop-shadow(45px -15px 100px rgba(255,255,255, 1)); } #main-buttons a { @@ -231,6 +227,7 @@ html, body { margin: 0 auto; width: 100%; + height: 100%; color: #bfb8b8; font-family: 'sitewide-sans-serif', sans-serif; background-color: #23282b !important; @@ -264,6 +261,13 @@ html, body { position: relative; } +#landing-container { + width: 100%; + height: 100%; + text-align: center; + background: linear-gradient(0deg, rgba(35,40,43,0.7959558823529411) 18%, rgba(131,131,131,0.6222864145658263) 100%); +} + .app-title .app-header { width: 6em; display: flex; diff --git a/views/index.html b/views/index.html index 0addceb..1878f32 100644 --- a/views/index.html +++ b/views/index.html @@ -7,23 +7,23 @@ -
+
Where Are the Wolves?
-
-