diff --git a/client/assets/styles/game.css b/client/assets/styles/game.css index 4f5a000e..329d82fa 100644 --- a/client/assets/styles/game.css +++ b/client/assets/styles/game.css @@ -35,7 +35,6 @@ transform: translate(-50%, -50%); } - .opponent .game-construct { align-items: flex-start; grid-template-rows: min-content min-content min-content minmax(min-content, 2fr); @@ -74,24 +73,18 @@ transition-timing-function: ease; } -.game .targeting-arrows { - grid-area: target; +.game #targeting { height: 100%; width: 100%; stroke-width: 2px; stroke: whitesmoke; + + /* some stupid bug in chrome makes it fill the entire screen */ + max-height: 10em; } -.game-construct .targeting { - grid-area: avatar; - position: relative; - left: 60%; - top: 50%; - text-align: center; -} - -.game-construct .img { - grid-area: avatar; +.resolving #targeting { + opacity: 0; } .game-construct .name { @@ -208,11 +201,8 @@ left: 50%; } - .game-construct.active-skill { filter: drop-shadow(0 0 0.2em silver); - - /*border-color: silver;*/ } .game-construct.red-damage { @@ -327,10 +317,6 @@ opacity: 0; } -.resolving .targeting { - opacity: 0; -} - /* COMBAT ANIMATIONS */ diff --git a/client/src/components/game.construct.jsx b/client/src/components/game.construct.jsx index 8c8a6c3e..06f0b0df 100644 --- a/client/src/components/game.construct.jsx +++ b/client/src/components/game.construct.jsx @@ -94,12 +94,14 @@ function GameConstruct(props) { return (