diff --git a/cryptide_project/src/Components/ButtonImgNav.css b/cryptide_project/src/Components/ButtonImgNav.css
index e625ce2..7ac29c0 100644
--- a/cryptide_project/src/Components/ButtonImgNav.css
+++ b/cryptide_project/src/Components/ButtonImgNav.css
@@ -1,5 +1,6 @@
.buttonNabImg{
margin: 15px 0;
+ padding: 10px;
width: auto;
height: 65px;
diff --git a/cryptide_project/src/Components/ScoreBoard.tsx b/cryptide_project/src/Components/ScoreBoard.tsx
new file mode 100644
index 0000000..b756e4a
--- /dev/null
+++ b/cryptide_project/src/Components/ScoreBoard.tsx
@@ -0,0 +1,82 @@
+import React from 'react';
+
+/* Style */
+import '../Pages/Play.css';
+import '../Style/Global.css'
+import { useTheme } from '../Style/ThemeContext';
+
+/* Ressources */
+import Person from '../res/img/Person.png'
+import leave from '../res/img/bot.png'
+import trophy from '../res/icon/trophy.png'
+import share from '../res/icon/share.png';
+
+/* Boostrap */
+import Tab from 'react-bootstrap/Tab';
+import Tabs from 'react-bootstrap/Tabs';
+import Container from 'react-bootstrap/Container';
+import Row from 'react-bootstrap/Row';
+import Col from 'react-bootstrap/Col';
+
+/* Component */
+import ButtonImgNav from './ButtonImgNav';
+
+//@ts-ignore
+function ScoreBoard({Player = null}) {
+ const theme=useTheme();
+ return (
+ //
+
+
+
+
+ Tab content for Contact
+
+
+
+
+
+ Partie Jouées :
+ 10
+
+
+ Partie gagnées :
+ 2
+
+
+ Pions posés :
+ 2
+
+
+
+ Partie solo :
+ 21
+
+
+ Nombre de coups moyen :
+ 19
+
+
+
+
+
+
+
+
+
+
+ //
+ );
+}
+
+export default ScoreBoard;
diff --git a/cryptide_project/src/Pages/Play.css b/cryptide_project/src/Pages/Play.css
index f688821..07e51aa 100644
--- a/cryptide_project/src/Pages/Play.css
+++ b/cryptide_project/src/Pages/Play.css
@@ -35,25 +35,7 @@
width: 30%;
}
-.LeaderBoardiv{
- background-color: #D7D4C6;
- opacity: 80%;
- border-radius: 25px;
- display: flex;
- align-items: center;
- flex-direction: column;
-
- margin: 15px;
-}
-
-
-.textBoard{
- display: flex;
- flex-wrap: column;
- justify-content: space-between;
- width: 300px;
-}
/* .textBoard div{
display: flex;
diff --git a/cryptide_project/src/Pages/Play.tsx b/cryptide_project/src/Pages/Play.tsx
index 2c4b42a..6053853 100644
--- a/cryptide_project/src/Pages/Play.tsx
+++ b/cryptide_project/src/Pages/Play.tsx
@@ -21,6 +21,7 @@ import { socket } from '../SocketConfig';
import { useNavigate } from 'react-router-dom';
import GameCreator from '../model/GameCreator';
import { useGame } from '../Contexts/GameContext';
+import ScoreBoard from '../Components/ScoreBoard';
function Play() {
@@ -62,12 +63,12 @@ function Play() {
}, []); // Aucune dépendance ici
- useEffect(() => {
- if (room !== null) {
- const nouvelleURL = `/lobby?room=${room}`;
- navigate(nouvelleURL);
- }
- }, [room, navigate]);
+ useEffect(() => {
+ if (room !== null) {
+ const nouvelleURL = `/lobby?room=${room}`;
+ navigate(nouvelleURL);
+ }
+ }, [room, navigate]);
@@ -99,33 +100,7 @@ function Play() {
-
-

-
-
-
- Partie Jouées :
- Partie gagnées :
- Pions posés :
-
-
-
-
- 10
- 2
- 45
-
-
-
- {/*
*/}
-
-
+
);
diff --git a/cryptide_project/src/Style/Global.css b/cryptide_project/src/Style/Global.css
index 0e22e38..2ab26a6 100644
--- a/cryptide_project/src/Style/Global.css
+++ b/cryptide_project/src/Style/Global.css
@@ -52,4 +52,31 @@ form{
.listContainer{
columns: 2 auto;
+}
+
+/* LeaderBoard */
+.LeaderBoardiv{
+ border: solid;
+ border-width: 0px 1px 1px 1px;
+ border-color: lightgray;
+ border-radius: 0px 0px 20px 20px;
+
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+
+ margin: 15px;
+}
+
+
+.textBoard{
+ display: flex;
+ flex-wrap: column;
+ justify-content: space-between;
+ width: 300px;
+}
+
+.leftRow{
+ display: flex;
+ justify-content: end;
}
\ No newline at end of file
diff --git a/cryptide_project/src/Translations/en.json b/cryptide_project/src/Translations/en.json
index e287818..b462ccd 100644
--- a/cryptide_project/src/Translations/en.json
+++ b/cryptide_project/src/Translations/en.json
@@ -104,7 +104,7 @@
"info.composant.hair_col.title":"Hair's colors",
"info.composant.hair_col":"The characters also have a hair colour, which can be found in the following colours :",
- "hair.blanc":"Blanc",
+ "hair.blanc":"White",
"hair.blond":"Blond",
"hair.roux":"Red head",
"hair.chatain":"Brown",