wip

client/game.css

@@ -70,8 +70,10 @@
     transition-timing-function: ease;
 }
 
-.game-cryp .img {
+.game-cryp .avatar {
     grid-area: avatar;
+    /*max-height: 50%;*/
+    height: auto;
 }
 
 .game-cryp .stats {

client/src/components/game.component.jsx

@@ -54,7 +54,7 @@ function GamePanel(props) {
     const header = (
         <div className="top">
             <button
-                className="game-btn instance-btn instance-ui-btn right"
+                className="instance-btn instance-ui-btn right"
                 onClick={() => sendGameReady()}>
                 Ready
             </button>
@@ -137,6 +137,10 @@ function GamePanel(props) {
                 <div className="effects">
                     {effects}
                 </div>
+                <div className="avatar">
+                    <div className="targeting">
+                        <div>></div>
+                    </div>
                     <figure
                         className="img"
                         onClick={() => selectSkillTarget(cryp.id)} >
@@ -144,6 +148,7 @@ function GamePanel(props) {
                         {combatTextEl}
                     </figure>
                 </div>
+            </div>
         );
     }
 

client/src/components/game.cryp.jsx

@@ -78,12 +78,17 @@ function GameCryp(props) {
             <div className="skills">
                 {skills}
             </div>
+            <div className="avatar">
+                <div className="targeting">
+                    <div>></div>
+                </div>
                 <figure
                     className="img"
                     onClick={() => selectSkillTarget(cryp.id)} >
                     {crypAvatar(cryp.name)}
                     {combatTextEl}
                 </figure>
+            </div>
             <div className="effects">
                 {effects}
             </div>

client/src/components/menu.component.jsx

@@ -147,7 +147,6 @@ function Menu(args) {
     return (
         <section className="menu">
             {instanceList()}
-            {crypList()}
         </section>
     );
 }

client/src/socket.jsx

@@ -312,7 +312,7 @@ function createSocket(events) {
                 sendAccountCryps();
             }
 
-            // sendPing();
+            sendPing();
 
             return true;
         });

client/styles.css

@@ -17,9 +17,9 @@ html, body, main {
     -ms-user-select: none;
 
     /* this is the sweet nectar to keep it full page*/
-    height: 100%;
+    height: 100vh;
-    max-height: 100%;
+    max-height: 100vh;
-    min-height: 100%;
+    min-height: 100vh;
     /*padding: 0 20%;*/
 
     /* stops inspector going skitz*/