fix info panel visible issue in mobile

This commit is contained in:
Halit Aksoy 2022-09-03 21:06:52 +03:00
parent 4161d552ba
commit 3344439ef4

View File

@ -263,7 +263,7 @@ const GamePage: FunctionComponent<{
function renderMobileBoardToolbar() {
return <BoardToolbar style={{ justifyContent: "center" }} visible={showBoardView && isMobile || false}>
{buildInfoPanel()}
{buildInfoPanel({ visible: isMobile })}
</BoardToolbar>;
}
@ -273,7 +273,7 @@ const GamePage: FunctionComponent<{
marginBottom: "0.5rem", marginLeft: "6%", maxWidth: isMobile ? "40vw" : "30vw",
width: isMobile ? "40vw" : "30vw"
}} context={context} layoutMode="left" user={topLocatedUser} visible={showBoardView || false} />
{buildInfoPanel()}
{buildInfoPanel({ visible: !isMobile })}
<UserStatus style={{
marginBottom: "0.5rem", marginRight: "6%", maxWidth: isMobile ? "40vw" : "30vw",
width: isMobile ? "40vw" : "30vw"
@ -281,7 +281,7 @@ const GamePage: FunctionComponent<{
</BoardToolbar>;
}
function buildInfoPanel() {
function buildInfoPanel(params: { visible: boolean }) {
return (
<InfoPanel
style={{ marginTop: "0.5rem", marginBottom: "0.5rem" }}
@ -291,7 +291,7 @@ const GamePage: FunctionComponent<{
whitePlayer={topLocatedUser}
blackPlayer={bottomLocatedUser}
leftPlayer={leftPlayer}
visible={!isMobile}
visible={params.visible}
isSpectator={isSpectator} />
);
}