From: Carl Worth <cworth@cworth.org>
Date: Wed, 27 May 2020 04:27:41 +0000 (-0700)
Subject: Change styling to not put game info to the right of the board
X-Git-Url: https://git.cworth.org/git?p=lmno.games;a=commitdiff_plain;h=1292fbceb528e33906f7f28f7205d57d6ff19b61;hp=d1b224fb4410e5ae5a06a5a8edc707524f1c2b73

Change styling to not put game info to the right of the board

Now that we don't have that huge list of buttons, it seems silly to
have the short status message off to the side.
---

diff --git a/tictactoe/tictactoe.css b/tictactoe/tictactoe.css
index 10ad370..d505c7d 100644
--- a/tictactoe/tictactoe.css
+++ b/tictactoe/tictactoe.css
@@ -35,13 +35,3 @@ ol, ul {
 .kbd-navigation .square:focus {
   background: #ddd;
 }
-
-.game {
-  display: flex;
-  flex-direction: row;
-}
-
-.game-info {
-  margin-left: 20px;
-  margin-bottom: 20px;
-}
diff --git a/tictactoe/tictactoe.jsx b/tictactoe/tictactoe.jsx
index 934faa8..849a6f2 100644
--- a/tictactoe/tictactoe.jsx
+++ b/tictactoe/tictactoe.jsx
@@ -146,15 +146,15 @@ class Game extends React.Component {
 
     return (
       <div className="game">
+        <div className="game-info">
+          <div>{status}</div>
+        </div>
         <div className="game-board">
           <Board
             squares={current.squares}
             onClick={i => this.handleClick(i)}
           />
         </div>
-        <div className="game-info">
-          <div>{status}</div>
-        </div>
       </div>
     );
   }