You can now select cards

Signed-off-by: James Ketrenos <james_eikona@ketrenos.com>

client/src/Board.css

@@ -125,7 +125,7 @@
   background-color: white;
 }
 
-.Selected {
+.Board .Selected {
   background-color: rgba(0, 0, 0, 1);
   box-shadow: 5px 5px 5px black;
 }

client/src/Table.css

@@ -132,6 +132,11 @@
   filter: brightness(150%);
 }
 
+.Resource.Selected {
+  filter: brightness(150%);
+  top: -1em;
+}
+
 .Dice {
   width: 1rem;
   height: 1rem;

client/src/Table.js

@@ -125,23 +125,25 @@ class Development extends React.Component {
   }
 };
 
-class Resource extends React.Component {
-  render() {
-    const array = new Array(Number(this.props.count ? this.props.count : 0));
-    return (
-      <>
-      { array.length > 0 && 
-        <div className="Stack">
-        { React.Children.map(array, i => (
-          <div className="Resource"
-            style={{backgroundImage:`url(${assetsPath}/gfx/card-${this.props.type}.png)`}}>
-          </div>
-        )) }
-      </div>
-      }
-      </>
-    );
-  }
+const Resource = ({ type, count }) => {
+  const array = new Array(Number(count ? count : 0));
+  const select = (event) => {
+    event.target.classList.toggle('Selected');
+  };
+  return (
+    <>
+    { array.length > 0 && 
+      <div className="Stack">
+      { React.Children.map(array, i => (
+        <div className="Resource"
+          onClick={select}
+          style={{backgroundImage:`url(${assetsPath}/gfx/card-${type}.png)`}}>
+        </div>
+      )) }
+    </div>
+    }
+    </>
+  );
 };
 
 const Chat = ({ table }) => {