From 6c46e8fb985d6b979d1d78afa5933c344dff5829 Mon Sep 17 00:00:00 2001
From: djmil <andriy@djmil.dev>
Date: Wed, 25 Oct 2023 09:16:15 +0200
Subject: [PATCH] front: about page

---
 webapp/src/App.js                            | 8 +++-----
 webapp/src/components/About/index.css        | 5 +++++
 webapp/src/components/About/index.jsx        | 9 +++++++++
 webapp/src/components/GameSelector/index.jsx | 1 -
 4 files changed, 17 insertions(+), 6 deletions(-)
 create mode 100644 webapp/src/components/About/index.css
 create mode 100644 webapp/src/components/About/index.jsx

diff --git a/webapp/src/App.js b/webapp/src/App.js
index 25cebe6..c2cb1c7 100644
--- a/webapp/src/App.js
+++ b/webapp/src/App.js
@@ -1,14 +1,11 @@
 import './App.css';
 import React from 'react'
-import {
-  BrowserRouter,
-  Routes,
-  Route,
-} from "react-router-dom"
+import { BrowserRouter, Routes, Route } from "react-router-dom"
 
 import Header from "./components/Header"
 import Leaderboard from "./components/Leaderboard"
 import Game from "./components/Game"
+import About from "./components/About"
 import GameProposal from './components/Game/Proposal'
 
 function App() { 
@@ -20,6 +17,7 @@ function App() {
           <Routes>
             <Route path="/leaderboard" element={<Leaderboard/>} />
             <Route path="/game" element={<Game/>} />
+            <Route path="/about" element={<About/>} />
             <Route path="/game/proposal" element={<GameProposal/>} />
           </Routes>
         </div>
diff --git a/webapp/src/components/About/index.css b/webapp/src/components/About/index.css
new file mode 100644
index 0000000..cf658c6
--- /dev/null
+++ b/webapp/src/components/About/index.css
@@ -0,0 +1,5 @@
+.Leaderboard {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
diff --git a/webapp/src/components/About/index.jsx b/webapp/src/components/About/index.jsx
new file mode 100644
index 0000000..76f962f
--- /dev/null
+++ b/webapp/src/components/About/index.jsx
@@ -0,0 +1,9 @@
+import React from "react"
+import './index.css';
+
+export default function Leaderboard() {
+
+  return <div className="About">
+      A simple american checkers game<br/>
+    </div>
+};
diff --git a/webapp/src/components/GameSelector/index.jsx b/webapp/src/components/GameSelector/index.jsx
index fd401d7..fdd34c5 100644
--- a/webapp/src/components/GameSelector/index.jsx
+++ b/webapp/src/components/GameSelector/index.jsx
@@ -12,7 +12,6 @@ export default function Game() {
   // for (const [key, value] of Object.entries(data.games))
   //   console.log(key, value);
    
-  console.log("data.games", data.games)
   const waitForYou = data.games
     .filter(game => game.status === Status.WaitForYou)
     .map(game => {