bold winner text
This commit is contained in:
parent
0aed7cfe73
commit
9b1cb34e7b
@ -419,14 +419,9 @@
|
|||||||
margin-top: 1em;
|
margin-top: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.opponent-name {
|
.winner {
|
||||||
margin-bottom: 1em;
|
color: @yellow;
|
||||||
grid-area: oppname;
|
font-weight: bold;
|
||||||
}
|
|
||||||
|
|
||||||
.player-name {
|
|
||||||
margin-top: 1em;
|
|
||||||
grid-area: playername;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.team {
|
.team {
|
||||||
@ -441,12 +436,12 @@
|
|||||||
font-size: 200%;
|
font-size: 200%;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
letter-spacing: 1em;
|
letter-spacing: 1em;
|
||||||
|
font-weight: bold;
|
||||||
|
|
||||||
color: @black;
|
color: @black;
|
||||||
animation: faceoff 4s linear 0s 2 alternate;
|
animation: faceoff 4s linear 0s 2 alternate;
|
||||||
|
|
||||||
&.winner {
|
&.winner {
|
||||||
color: @yellow;
|
|
||||||
animation: win 2s linear 0s 1;
|
animation: win 2s linear 0s 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -46,6 +46,11 @@
|
|||||||
grid-area: msg;
|
grid-area: msg;
|
||||||
color: @white;
|
color: @white;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.winner {
|
||||||
|
color: @yellow;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.chat {
|
.chat {
|
||||||
|
|||||||
@ -58,7 +58,8 @@ function Faceoff(props) {
|
|||||||
const constructs = team.constructs.map((c, i) =>
|
const constructs = team.constructs.map((c, i) =>
|
||||||
<FaceoffConstruct key={c.id} construct={c}/>);
|
<FaceoffConstruct key={c.id} construct={c}/>);
|
||||||
|
|
||||||
const classes = `team player ${team.ready ? 'ready' : ''}`
|
const winner = instance.winner === team.id;
|
||||||
|
const classes = `team player ${winner ? 'winner' : team.ready ? 'ready' : ''}`
|
||||||
return (
|
return (
|
||||||
<div class={classes}>
|
<div class={classes}>
|
||||||
{constructs}
|
{constructs}
|
||||||
@ -71,7 +72,8 @@ function Faceoff(props) {
|
|||||||
const constructs = team.constructs.map((c, i) =>
|
const constructs = team.constructs.map((c, i) =>
|
||||||
<FaceoffConstruct key={c.id} construct={c}/>);
|
<FaceoffConstruct key={c.id} construct={c}/>);
|
||||||
|
|
||||||
const classes = `team opponent ${team.ready ? 'ready' : ''}`
|
const winner = instance.winner === team.id;
|
||||||
|
const classes = `team opponent ${winner ? 'winner' : team.ready ? 'ready' : ''}`
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div class={classes}>
|
<div class={classes}>
|
||||||
|
|||||||
@ -67,9 +67,11 @@ function Scoreboard(args) {
|
|||||||
return '';
|
return '';
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const winner = player.score === 'Win';
|
||||||
|
|
||||||
if (!isPlayer) {
|
if (!isPlayer) {
|
||||||
return (
|
return (
|
||||||
<div class={`player-box top ${player.ready ? 'ready' : ''}`}>
|
<div class={`player-box top ${winner ? 'winner' : player.ready ? 'ready' : ''}`}>
|
||||||
<div></div>
|
<div></div>
|
||||||
<div class="score">{scoreText()}</div>
|
<div class="score">{scoreText()}</div>
|
||||||
<div class="name">{player.name}</div>
|
<div class="name">{player.name}</div>
|
||||||
@ -80,7 +82,7 @@ function Scoreboard(args) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div class={`player-box bottom ${player.ready ? 'ready' : ''}`}>
|
<div class={`player-box bottom ${winner ? 'winner': player.ready ? 'ready' : ''}`}>
|
||||||
<div class="msg">{chat || '\u00A0'}</div>
|
<div class="msg">{chat || '\u00A0'}</div>
|
||||||
<div class="score">{scoreText()}</div>
|
<div class="score">{scoreText()}</div>
|
||||||
<div class="name">{player.name}</div>
|
<div class="name">{player.name}</div>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user