From 9b0a3753aa9d990071ef93414a63cb052567b9f8 Mon Sep 17 00:00:00 2001
From: djmil <andriy@djmil.dev>
Date: Fri, 17 Nov 2023 20:48:22 +0100
Subject: [PATCH] Default player colors alignmnet

---
 webapp/src/components/Checkers.css          | 1 +
 webapp/src/container/games/GameBoard.jsx    | 4 ++--
 webapp/src/container/games/view/NewGame.jsx | 8 ++++----
 3 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/webapp/src/components/Checkers.css b/webapp/src/components/Checkers.css
index 0739a43..9dfa13e 100644
--- a/webapp/src/components/Checkers.css
+++ b/webapp/src/components/Checkers.css
@@ -1,5 +1,6 @@
 .Stone {
     cursor: default; /* disable 'I beam' cursor change */
+    user-select: none;
 }
 
 .Board {
diff --git a/webapp/src/container/games/GameBoard.jsx b/webapp/src/container/games/GameBoard.jsx
index 22043f9..d98d28c 100644
--- a/webapp/src/container/games/GameBoard.jsx
+++ b/webapp/src/container/games/GameBoard.jsx
@@ -51,9 +51,9 @@ export default function GameBoard({ username, onNewGameBoardStone, onActiveGameM
 
   return (
     <div className='GameBoard'>
-      <Player color={opponentColor || Color.white} name={opponentName} />
+      <Player color={opponentColor || Color.black} name={opponentName} />
       <Board game={game} onClick={optionalOnClick} />
-      <Player color={game?.myColor || Color.black} name={myName} />
+      <Player color={game?.myColor || Color.white} name={myName} />
     </div>
   )
 }
diff --git a/webapp/src/container/games/view/NewGame.jsx b/webapp/src/container/games/view/NewGame.jsx
index 6085997..758f955 100644
--- a/webapp/src/container/games/view/NewGame.jsx
+++ b/webapp/src/container/games/view/NewGame.jsx
@@ -46,11 +46,11 @@ export default function NewGame({ players, setOpponent }) {
 
     return (
         <div className='NewGame'>
-            <WhiteStone />
-            <DropdownList selected={whitePlayer} onSelect={(name) => onSelect(name, Color.white)} optionsList={whiteOptions} />
-            <i>- vs -</i>
-            <DropdownList selected={blackPlayer} onSelect={(name) => onSelect(name, Color.black)} optionsList={blackOptions} />
             <BlackStone />
+            <DropdownList selected={blackPlayer} onSelect={(name) => onSelect(name, Color.black)} optionsList={blackOptions} />
+            <i>- vs -</i>
+            <DropdownList selected={whitePlayer} onSelect={(name) => onSelect(name, Color.white)} optionsList={whiteOptions} />
+            <WhiteStone />
         </div>
     )
 }
\ No newline at end of file