From 1a83641e222fc56c556f65fd57dffe5316843b48 Mon Sep 17 00:00:00 2001
From: Sage Vaillancourt <sagev9000@tutanota.com>
Date: Mon, 28 Dec 2020 16:54:23 -0500
Subject: [PATCH] Put more of color-handling into JS code

---
 src/index.css | 1 -
 src/index.js  | 5 ++++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/index.css b/src/index.css
index 21e5a88..e27d64d 100644
--- a/src/index.css
+++ b/src/index.css
@@ -38,7 +38,6 @@ ol, ul {
 }
 
 .square:focus {
-  background: #8d98e6;
   outline: none;
 }
 
diff --git a/src/index.js b/src/index.js
index cbe28d8..bbcd3e3 100644
--- a/src/index.js
+++ b/src/index.js
@@ -70,7 +70,7 @@ function Square(props) {
   let bg = {
       backgroundImage: `url(${Images[props.value]})`,
       backgroundSize: `11vw`,
-      // backgroundColor: "lightblue",
+      backgroundColor: props.bg,
   };
   if (props.value != null) {
     return (
@@ -353,10 +353,13 @@ class Board extends React.Component {
   }
 
   renderSquare(i) {
+    let bgColor = this.heldPiece() === i ?
+      "#5D98E6" : "white";
     return (
       <Square
         value={this.state.squares[i]}
         onClick={() => this.handleClick(i)}
+        bg={bgColor}
       />
     );
   }