Leahnaya/sendou.ink
1
0
Fork 0
mirror of https://github.com/Sendouc/sendou.ink.git synced 2026-10-02 08:07:40 -05:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

New style for captain/sub badges (fixes getting hidden) Closes #1713

Browse Source
This commit is contained in:
Kalle
2024-04-07 14:44:20 +03:00
parent 719a4138b5
commit 7f51359e38
2 changed files with 32 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
app/features/tournament/components/TeamWithRoster.tsx
View File

@@ -60,7 +60,17 @@ export function TeamWithRoster({
tournament.ctx.startTime;
return (
<li key={member.userId} className="list-none">
<li key={member.userId} className="tournament__team-member-row">
{member.isOwner ? (
<span className="tournament__team-member-name__role text-theme">
C
</span>
) : null}
{isSub && !member.isOwner ? (
<span className="tournament__team-member-name__role tournament__team-member-name__role__sub">
S
</span>
) : null}
<div
className={clsx("tournament__team-with-roster__member", {
"tournament__team-with-roster__member__inactive":
@@ -71,7 +81,6 @@ export function TeamWithRoster({
user={member}
size="xxs"
className={clsx({
"tournament__team-with-roster__member__avatar-sub": isSub,
"tournament__team-with-roster__member__avatar-inactive":
activePlayers && !activePlayers.includes(member.userId),
})}
@@ -81,16 +90,6 @@ export function TeamWithRoster({
className="tournament__team-member-name"
>
{member.discordName}{" "}
{member.isOwner ? (
<span className="tournament__team-member-name__role text-theme">
(C)
</span>
) : null}
{isSub ? (
<span className="tournament__team-member-name__role text-info">
Sub
</span>
) : null}
</Link>
</div>
{friendCode ? (

27
app/features/tournament/tournament.css
View File

@@ -141,10 +141,6 @@
opacity: 0.4;
}
.tournament__team-with-roster__member__avatar-sub {
outline: 2px solid var(--theme-info);
}
.tournament__team-with-roster__map-pool {
display: grid;
grid-template-columns: max-content max-content max-content max-content;
@@ -180,6 +176,11 @@
word-break: break-word;
}
.tournament__team-member-row {
list-style: none;
position: relative;
}
.tournament__team-member-name {
overflow: hidden;
color: var(--text);
@@ -189,8 +190,22 @@
}
.tournament__team-member-name__role {
font-size: var(--fonts-xxxs);
font-weight: var(--bold);
position: absolute;
background-color: var(--theme-secondary);
color: var(--button-text);
font-weight: var(--semi-bold);
width: 12px;
height: 12px;
border-radius: var(--rounded);
font-size: var(--fonts-xxxxs);
display: grid;
place-items: center;
top: 14px;
left: 15px;
}
.tournament__team-member-name__role__sub {
background-color: var(--theme-info);
}
.tournament__logo-container {