mirror of
https://github.com/Sendouc/sendou.ink.git
synced 2026-05-12 22:11:06 -05:00
181 lines
3.4 KiB
CSS
181 lines
3.4 KiB
CSS
.play-match__error {
|
|
padding: var(--s-4);
|
|
background-color: var(--bg-lighter);
|
|
border-radius: var(--rounded);
|
|
color: var(--theme-warning);
|
|
}
|
|
|
|
.play-match__waves {
|
|
padding: var(--s-8);
|
|
background: url("/svg/background-pattern.svg");
|
|
background-color: var(--bg-lighter);
|
|
border-radius: var(--rounded);
|
|
margin-block-start: var(--s-4);
|
|
}
|
|
|
|
.play-match__teams {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
gap: var(--s-4);
|
|
}
|
|
|
|
.play-match__waves-section {
|
|
padding: var(--s-4);
|
|
background-color: var(--bg-darker);
|
|
border-radius: var(--rounded);
|
|
font-size: var(--fonts-sm);
|
|
text-align: center;
|
|
}
|
|
|
|
.play-match__info {
|
|
margin-block-start: var(--s-8);
|
|
}
|
|
|
|
.play-match__played-map-list {
|
|
display: grid;
|
|
justify-content: center;
|
|
font-size: var(--fonts-sm);
|
|
font-weight: var(--semi-bold);
|
|
gap: var(--s-2);
|
|
grid-template-columns: 4rem max-content 4rem;
|
|
margin-block-start: var(--s-4);
|
|
text-align: center;
|
|
}
|
|
|
|
.play-match__checkmark {
|
|
display: grid;
|
|
width: 2rem;
|
|
color: var(--theme-success);
|
|
place-items: center;
|
|
}
|
|
|
|
.play-match__checkmark.left {
|
|
margin-left: auto;
|
|
}
|
|
|
|
.play-match__played-stage {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
padding: var(--s-1);
|
|
background-color: var(--bg-darker);
|
|
border-radius: var(--rounded);
|
|
padding-inline: var(--s-3);
|
|
}
|
|
|
|
.play-match__played-mode {
|
|
width: 1.5rem;
|
|
}
|
|
|
|
.play-match__team-info {
|
|
display: grid;
|
|
max-width: 14rem;
|
|
flex: 1;
|
|
gap: var(--s-4);
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
|
|
.play-match__player-name {
|
|
font-size: var(--fonts-xs);
|
|
font-weight: var(--semi-bold);
|
|
margin-block-start: 1px;
|
|
overflow-wrap: anywhere;
|
|
}
|
|
|
|
.play-match__player {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
font-size: var(--fonts-xs);
|
|
}
|
|
|
|
.play-match__score {
|
|
display: grid;
|
|
border-radius: var(--rounded);
|
|
font-size: var(--fonts-lg);
|
|
font-weight: var(--bold);
|
|
grid-column: 1 / 3;
|
|
place-items: center;
|
|
}
|
|
|
|
.play-match__score.winner {
|
|
background-color: var(--theme-transparent);
|
|
}
|
|
|
|
.play-match__waves-button {
|
|
display: flex;
|
|
justify-content: center;
|
|
margin-block-start: var(--s-4);
|
|
}
|
|
|
|
.play-match__select {
|
|
width: 4rem;
|
|
margin-inline-end: var(--s-4);
|
|
}
|
|
|
|
.play-match__select-column-header {
|
|
width: 6rem;
|
|
padding: var(--s-1-5);
|
|
color: var(--theme);
|
|
font-size: var(--fonts-xs);
|
|
font-weight: var(--bold);
|
|
list-style: none;
|
|
text-align: center;
|
|
}
|
|
|
|
.play-match__stages {
|
|
max-width: max-content;
|
|
padding: var(--s-4);
|
|
margin: 0 auto;
|
|
background-color: var(--bg-lighter);
|
|
border-radius: var(--rounded);
|
|
font-size: var(--fonts-sm);
|
|
margin-block-start: var(--s-4);
|
|
}
|
|
|
|
.play-match__map-list-header {
|
|
background-color: var(--bg-darker);
|
|
border-radius: var(--rounded);
|
|
font-size: var(--fonts-sm);
|
|
font-weight: var(--semi-bold);
|
|
text-align: center;
|
|
}
|
|
|
|
.play-match__best-of {
|
|
color: var(--text-lighter);
|
|
font-size: var(--fonts-xs);
|
|
font-weight: var(--semi-bold);
|
|
text-align: center;
|
|
}
|
|
|
|
.play-match__mode {
|
|
width: 1.5rem;
|
|
margin-inline-end: var(--s-2);
|
|
}
|
|
|
|
.play-match__stage {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: var(--s-1-5);
|
|
}
|
|
|
|
.play-match__stage-name {
|
|
font-weight: var(--bold);
|
|
margin-inline: 4px;
|
|
text-overflow: clip;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.play-match__error-text {
|
|
color: var(--theme-warning);
|
|
margin-block-start: var(--s-4);
|
|
text-align: center;
|
|
}
|
|
|
|
.play-match__score-submit-button {
|
|
display: flex;
|
|
justify-content: center;
|
|
margin-block-start: var(--s-4);
|
|
}
|