blank spec in equip"

"

client/src/components/instance.cryps.jsx

@@ -145,6 +145,7 @@ function Cryp(props) {
             return (
                 <figure key={i} className={equip} >
                     {shapes.diamond(`stat-icon ${equip}`)}
+                    <figcaption>&nbsp;</figcaption>
                 </figure>
             );
         }

client/src/components/instance.equip.jsx

@@ -3,6 +3,7 @@ const preact = require('preact');
 const range = require('lodash/range');
 
 const actions = require('../actions');
+const shapes = require('./shapes');
 const { convertItem, SPECS } = require('./../utils');
 
 const addState = connect(
@@ -101,7 +102,7 @@ function Equipment(props) {
         if (specList.includes(item)) {
             return (
                 <figure key={i} onClick={e => skillClick(e, i)} onMouseOver={e => hoverInfo(e, item)} >
-                    {SPECS[item].svg(`equip-icon ${SPECS[item].colour}`)}
+                    {SPECS[item].svg(`stat-icon ${SPECS[item].colour}`)}
                     <figcaption>{SPECS[item].caption}</figcaption>
                 </figure>
             );
@@ -109,7 +110,14 @@ function Equipment(props) {
     });
 
     if (skills.every(s => !s)) skills.push(<button disabled={true}>&nbsp;</button>);
-    if (specs.every(s => !s)) specs.push(<figure key={0}>&nbsp;</figure>);
+    if (specs.every(s => !s)) {
+        specs.push(
+            <figure>
+                {shapes.diamond('stat-icon gray')}
+                <figcaption>&nbsp;</figcaption>
+            </figure>
+        );
+    }
 
     return (
         <div className="equip" >