commit
5eedd6b2e9
4 changed files with 29 additions and 1 deletions
12
packages/play-node-go/src/components/GameUI/Kifu/Kifu.js
Normal file
12
packages/play-node-go/src/components/GameUI/Kifu/Kifu.js
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
import React from "react";
|
||||||
|
import "./Kifu.scss";
|
||||||
|
|
||||||
|
const Kifu = () => {
|
||||||
|
return (
|
||||||
|
<div className="Kifu">
|
||||||
|
<div className="Kifu__board"></div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Kifu;
|
13
packages/play-node-go/src/components/GameUI/Kifu/Kifu.scss
Normal file
13
packages/play-node-go/src/components/GameUI/Kifu/Kifu.scss
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
div.Kifu {
|
||||||
|
order: 0;
|
||||||
|
height: 10vh;
|
||||||
|
width: 8vh;
|
||||||
|
background-color: #FFF;
|
||||||
|
transform: rotate(-20deg);
|
||||||
|
div.Kifu__board {
|
||||||
|
border: 0.25vh solid #444;
|
||||||
|
width: 5vh;
|
||||||
|
height: 5vh;
|
||||||
|
margin: 1vh 2vh 2vh auto;
|
||||||
|
}
|
||||||
|
}
|
|
@ -6,6 +6,7 @@ const PlayerArea = ({
|
||||||
handlePassClick,
|
handlePassClick,
|
||||||
playerMeta,
|
playerMeta,
|
||||||
turn,
|
turn,
|
||||||
|
Kifu,
|
||||||
}) => {
|
}) => {
|
||||||
const { stones, player, rank, captures } = playerMeta;
|
const { stones, player, rank, captures } = playerMeta;
|
||||||
const isTurn =
|
const isTurn =
|
||||||
|
@ -21,7 +22,6 @@ const PlayerArea = ({
|
||||||
const bowlText = () => {
|
const bowlText = () => {
|
||||||
if (isTurn) return "Pass?";
|
if (isTurn) return "Pass?";
|
||||||
if (turn === 0) return "End Game?";
|
if (turn === 0) return "End Game?";
|
||||||
// return;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
@ -32,6 +32,7 @@ const PlayerArea = ({
|
||||||
>
|
>
|
||||||
<p>{bowlText()}</p>
|
<p>{bowlText()}</p>
|
||||||
</div>
|
</div>
|
||||||
|
{Kifu}
|
||||||
<div
|
<div
|
||||||
className={`player-container__name-space player-container__name-space--${stones}`}
|
className={`player-container__name-space player-container__name-space--${stones}`}
|
||||||
>
|
>
|
||||||
|
|
|
@ -5,6 +5,7 @@ import "./Game.scss";
|
||||||
import Logo from "../../components/Display/Logo/Logo";
|
import Logo from "../../components/Display/Logo/Logo";
|
||||||
import Board from "../../components/GameUI/Board/Board";
|
import Board from "../../components/GameUI/Board/Board";
|
||||||
import PlayerArea from "../../components/GameUI/PlayerArea/PlayerArea";
|
import PlayerArea from "../../components/GameUI/PlayerArea/PlayerArea";
|
||||||
|
import Kifu from "../../components/GameUI/Kifu/Kifu";
|
||||||
|
|
||||||
const Game = (props) => {
|
const Game = (props) => {
|
||||||
const { state, dispatch } = props;
|
const { state, dispatch } = props;
|
||||||
|
@ -139,6 +140,7 @@ const Game = (props) => {
|
||||||
? playerWhiteMeta
|
? playerWhiteMeta
|
||||||
: playerBlackMeta
|
: playerBlackMeta
|
||||||
}
|
}
|
||||||
|
Kifu={<Kifu />}
|
||||||
turn={state?.meta?.turn}
|
turn={state?.meta?.turn}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in a new issue