animations env

client/assets/styles/game.css

@@ -72,7 +72,7 @@
         "name       "
         "stats      ";
 
-    transition-property: all;
+    transition-property: translate;
     transition-duration: 0.25s;
     transition-delay: 0;
     transition-timing-function: ease;
@@ -186,8 +186,8 @@
 .game-construct.ko {
     animation: none;
     opacity: 0.35;
-    filter: grayscale(100%);
-}
+/*    filter: grayscale(100%);
+*/}
 
 .game-construct.ko button:hover {
     color: #333;
@@ -195,12 +195,12 @@
 
 .game-construct.unfocus {
     opacity: 0.65;
-    filter: blur(5px);
-}
+/*    filter: blur(5px);
+*/}
 
 .game-construct.unfocus.ko {
-    filter: blur(5px) grayscale(100%);
-}
+/*    filter: blur(5px) grayscale(100%);
+*/}
 
 .combat-text {
     font-size: 2em;
@@ -227,12 +227,12 @@
 }
 
 .game-construct.active-skill {
-    filter: drop-shadow(0 0 0.2em silver);
-}
+/*    filter: drop-shadow(0 0 0.2em silver);
+*/}
 
 .game-construct.red-damage {
-    filter: drop-shadow(0 0 0.2em red);
-    color: red;
+/*    filter: drop-shadow(0 0 0.2em red);
+*/    color: red;
     /*ensure construct doesn't get opacity lowered because of being KO before the KO animation*/
     opacity: 1;
 
@@ -253,8 +253,8 @@
 }
 
 .game-construct.blue-damage {
-    filter: drop-shadow(0 0 0.2em blue);
-    color: blue;
+/*    filter: drop-shadow(0 0 0.2em blue);
+*/    color: blue;
     opacity: 1;
     /*border-color: blue;*/
 }
@@ -273,8 +273,8 @@
 }
 
 .game-construct.green-damage {
-    filter: drop-shadow(0 0 0.2em green);
-    color: green;
+/*    filter: drop-shadow(0 0 0.2em green);
+*/    color: green;
     opacity: 1;
     /*border-color: green;*/
 }
@@ -293,8 +293,8 @@
 }
 
 .game-construct.purple-damage {
-    filter: drop-shadow(0 0 0.2em purple);
-    color: purple;
+/*    filter: drop-shadow(0 0 0.2em purple);
+*/    color: purple;
     border-color: purple;
 }
 

client/assets/styles/styles.css

@@ -80,6 +80,7 @@ nav {
     grid-area: nav;
     padding-left: 2em;
     margin-right: 2em;
+    max-height: 100%;
 }
 
 nav h2:first-child {