oxaliq/node-go
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

add click handler and basic style to menu on Game

Browse source
This commit is contained in:
sorrelbri 2020-06-21 18:47:00 -07:00
parent 3955f940e2
commit 62fe6dfcb4
2 changed files with 33 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
packages/play-node-go/src/components/GameUI/Menu/Menu.js
View file

@ -1,7 +1,22 @@
import React from "react";
import "./Menu.scss";
const Menu = ({ ...props }) => {
return <></>;
const Menu = ({ showMenu, clickClose, ...props }) => {
const handleBackgroundClick = (e) => {
if (e.target.className === "Game__Menu-container") clickClose();
};
if (!showMenu) return <></>;
return (
<div
className="Game__Menu-container"
onClick={(e) => handleBackgroundClick(e)}
>
<div className="Game__Menu-container__Menu">
<button onClick={clickClose}>X</button>
</div>
</div>
);
};
export default Menu;

16
packages/play-node-go/src/components/GameUI/Menu/Menu.scss
View file

@ -0,0 +1,16 @@
div.Game__Menu-container {
background: rgba(0,0,0,0.5);
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
position: absolute;
width: 100vw;
z-index: 2;
.Game__Menu-container__Menu {
background: #eef;
width: 80vw;
min-height: 20vh;
}
}