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

View File

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