Lines working, time to merge

This commit is contained in:
Kristoffer Juelsenn 2022-04-21 14:47:13 +02:00
parent 4e7ccde40a
commit 51a41ab2b7
2 changed files with 28 additions and 23 deletions

View File

@ -74,25 +74,37 @@ function Match(props){
{/* Team 1 (Winner-status?) (Team name) */} {/* Team 1 (Winner-status?) (Team name) */}
<li className={`game game-top ${props.match.winnerId && (props.match.team1Id === props.match.winnerId) ? "winner" : "loser"}`}> <li className={`game game-top ${props.match.winnerId && (props.match.team1Id === props.match.winnerId) ? "winner" : "loser"}`}>
<Stack direction={"row"}> <Stack direction={"row"}>
<Typography className={`teamName`}> <Typography className={`teamName`} align={'center'} sx={{fontSize:'1.5rem'}}>
{team1Name} {team1Name}
</Typography> </Typography>
{/* <IconButton className="removeWinner" color="error" aria-label="remmove winner" component="span"><BackspaceIcon /></IconButton> */} { props.match.winnerId && (props.match.team1Id === props.match.winnerId) &&
<IconButton onClick={setWinner(props.match.team1Id)} className="selectWinner" color="success" aria-label="select winner" component="span"><AddCircleIcon /></IconButton> <IconButton color="error" aria-label="remmove winner" component="span"><BackspaceIcon /></IconButton>
{/* <Box className="winnerTrophy"><EmojiEventsIcon alt="A trohpy" color="gold" /></Box> */} }
{ props.match.team1Id !== null &&
<IconButton onClick={setWinner(props.match.team1Id)} color="success" aria-label="select winner" component="span"><AddCircleIcon /></IconButton>
}
{/* { props.match.winnerId && (props.match.team1Id === props.match.winnerId) &&
<EmojiEventsIcon alt="A trohpy" color="gold" />
} */}
</Stack> </Stack>
</li> </li>
<li className="game game-spacer">&nbsp;</li> <li className="game game-spacer">&nbsp;</li>
{/* Team 2 (Winner-status?) (Team name) */} {/* Team 2 (Winner-status?) (Team name) */}
<li className={`game game-bottom ${props.match.winnerId && (props.match.team2Id === props.match.winnerId) ? "winner" : "loser"}`}> <li className={`game game-bottom ${props.match.winnerId && (props.match.team2Id === props.match.winnerId) ? "winner" : "loser"}`}>
<Stack direction={"row"}> <Stack direction={"row"} sx={{alignItems:'center'}}>
<Typography className={`teamName`}> <Typography className={`teamName`} sx={{fontSize:'1.5rem'}}>
{team2Name} {team2Name}
</Typography> </Typography>
{/* <IconButton className="removeWinner" color="error" aria-label="remmove winner" component="span"><BackspaceIcon /></IconButton> */} { props.match.winnerId && (props.match.team2Id === props.match.winnerId) &&
<IconButton onClick={setWinner(props.match.team1Id)} className="selectWinner" color="success" aria-label="select winner" component="span"><AddCircleIcon /></IconButton> <IconButton color="error" aria-label="remmove winner" component="span"><BackspaceIcon /></IconButton>
{/* <Box className="winnerTrophy"><EmojiEventsIcon alt="A trohpy" color="gold" /></Box> */} }
</Stack> { props.match.team2Id !== null &&
<IconButton onClick={setWinner(props.match.team2Id)} color="success" aria-label="select winner" component="span"><AddCircleIcon /></IconButton>
}
{/* { props.match.winnerId && (props.match.team2Id === props.match.winnerId) &&
<EmojiEventsIcon alt="A trohpy" color="gold" />
} */}
</Stack>
</li> </li>
<li className="spacer">&nbsp;</li> <li className="spacer">&nbsp;</li>
</> </>

View File

@ -13,11 +13,11 @@
width:200px; width:200px;
list-style:none; list-style:none;
padding:0; padding:0;
font-size: 2rem;
} }
.round .spacer{ flex-grow:1; } .round .spacer{ flex-grow:1;}
.round .spacer:first-child, .round .spacer:first-child,
.round .spacer:last-child{ flex-grow:.5; } .round .spacer:last-child{ flex-grow:.5; }
.round .game-spacer{ .round .game-spacer{
flex-grow:1; flex-grow:1;
} }
@ -25,15 +25,15 @@
/* /*
* General Styles * General Styles
*/ */
/* body{ /* body{
font-family:sans-serif; font-family:sans-serif;
font-size:small; font-size:medium;
padding:10px; padding:10px;
line-height:1.4em; line-height:1.4em;
} */ } */
.teamName{ .teamName{
max-width: 5vw; max-width: 7.5vw;
overflow: hidden; overflow: hidden;
word-wrap: none; word-wrap: none;
} }
@ -44,13 +44,6 @@
.winnerTrophy{ .winnerTrophy{
visibility: hidden; visibility: hidden;
} }
li.game > .removeWinner{
display: none;
}
li.game.winner > .removeWinner{
display:inline-flex;
}
.teamName.winner{ .teamName.winner{
font-weight:bold; font-weight:bold;
@ -67,7 +60,7 @@
li.game-spacer{ li.game-spacer{
border-right:1px solid #aaa; border-right:1px solid #aaa;
min-height:40px; min-height:10vh;
} }
li.game-bottom{ li.game-bottom{