Skip to content

Commit 2b2149e

Browse files
lukepololukepolo
authored
feature: scrim finder (#470)
1 parent 5553a15 commit 2b2149e

66 files changed

Lines changed: 18848 additions & 1102 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎assets/css/tailwind.css‎

Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -371,3 +371,102 @@ mark {
371371
transform: none;
372372
}
373373
}
374+
375+
/* Rendered markdown for news articles. Shared by the published article page
376+
(news/[slug].vue) and the editor live preview (MarkdownEditor.vue) so the
377+
draft preview matches what readers see. Kept unlayered so these rules win
378+
over Tailwind's `@layer base` preflight, which otherwise strips heading/list
379+
spacing and makes the rendered markdown read as flat text. */
380+
.news-content {
381+
color: hsl(var(--foreground));
382+
line-height: 1.7;
383+
font-size: 1.05rem;
384+
}
385+
.news-content h1,
386+
.news-content h2,
387+
.news-content h3,
388+
.news-content h4 {
389+
font-weight: 700;
390+
line-height: 1.25;
391+
margin-top: 1.75rem;
392+
margin-bottom: 0.75rem;
393+
}
394+
.news-content h1:first-child,
395+
.news-content h2:first-child,
396+
.news-content h3:first-child,
397+
.news-content h4:first-child {
398+
margin-top: 0;
399+
}
400+
.news-content h1 {
401+
font-size: 1.8rem;
402+
}
403+
.news-content h2 {
404+
font-size: 1.5rem;
405+
}
406+
.news-content h3 {
407+
font-size: 1.25rem;
408+
}
409+
.news-content p {
410+
margin-bottom: 1rem;
411+
}
412+
.news-content a {
413+
color: hsl(var(--primary));
414+
text-decoration: underline;
415+
}
416+
.news-content ul,
417+
.news-content ol {
418+
margin: 0 0 1rem 1.5rem;
419+
}
420+
.news-content ul {
421+
list-style: disc;
422+
}
423+
.news-content ol {
424+
list-style: decimal;
425+
}
426+
.news-content li {
427+
margin-bottom: 0.35rem;
428+
}
429+
.news-content blockquote {
430+
border-left: 3px solid hsl(var(--border));
431+
padding-left: 1rem;
432+
color: hsl(var(--muted-foreground));
433+
margin: 0 0 1rem 0;
434+
}
435+
.news-content img {
436+
max-width: 100%;
437+
height: auto;
438+
border-radius: 0.5rem;
439+
margin: 1rem 0;
440+
}
441+
.news-content pre {
442+
background: hsl(var(--muted));
443+
padding: 1rem;
444+
border-radius: 0.5rem;
445+
overflow-x: auto;
446+
margin-bottom: 1rem;
447+
}
448+
.news-content code {
449+
font-family: var(--font-mono, monospace);
450+
font-size: 0.875em;
451+
}
452+
.news-content :not(pre) > code {
453+
background: hsl(var(--muted));
454+
padding: 0.15rem 0.35rem;
455+
border-radius: 0.25rem;
456+
}
457+
.news-content hr {
458+
border: none;
459+
border-top: 1px solid hsl(var(--border));
460+
margin: 1.5rem 0;
461+
}
462+
.news-content table {
463+
width: 100%;
464+
border-collapse: collapse;
465+
margin-bottom: 1rem;
466+
}
467+
.news-content th,
468+
.news-content td {
469+
border: 1px solid hsl(var(--border));
470+
padding: 0.5rem 0.75rem;
471+
text-align: left;
472+
}

‎components/MatchTableRow.vue‎

Lines changed: 82 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -264,7 +264,21 @@ import MatchOverviewDrawer from "~/components/match/MatchOverviewDrawer.vue";
264264
}"
265265
:title="match.lineup_1.name"
266266
>
267-
{{ match.lineup_1.name }}
267+
<component
268+
:is="match.lineup_1.team_id ? 'NuxtLink' : 'span'"
269+
:to="
270+
match.lineup_1.team_id
271+
? `/teams/${match.lineup_1.team_id}`
272+
: undefined
273+
"
274+
:class="
275+
match.lineup_1.team_id &&
276+
'transition-colors hover:text-[hsl(var(--tac-amber))]'
277+
"
278+
@click="match.lineup_1.team_id && $event.stopPropagation()"
279+
>
280+
{{ match.lineup_1.name }}
281+
</component>
268282
</h3>
269283
<div class="flex shrink-0 items-baseline gap-1.5">
270284
<span
@@ -295,7 +309,21 @@ import MatchOverviewDrawer from "~/components/match/MatchOverviewDrawer.vue";
295309
}"
296310
:title="match.lineup_2.name"
297311
>
298-
{{ match.lineup_2.name }}
312+
<component
313+
:is="match.lineup_2.team_id ? 'NuxtLink' : 'span'"
314+
:to="
315+
match.lineup_2.team_id
316+
? `/teams/${match.lineup_2.team_id}`
317+
: undefined
318+
"
319+
:class="
320+
match.lineup_2.team_id &&
321+
'transition-colors hover:text-[hsl(var(--tac-amber))]'
322+
"
323+
@click="match.lineup_2.team_id && $event.stopPropagation()"
324+
>
325+
{{ match.lineup_2.name }}
326+
</component>
299327
</h3>
300328
<div class="flex shrink-0 items-baseline gap-1.5">
301329
<span
@@ -332,14 +360,25 @@ import MatchOverviewDrawer from "~/components/match/MatchOverviewDrawer.vue";
332360
focusPlayerLineupId === match.lineup_1_id,
333361
}"
334362
>
335-
<span
336-
:class="{
337-
'border-b border-primary/40':
338-
playerLineup === match.lineup_1_id,
339-
}"
363+
<component
364+
:is="match.lineup_1.team_id ? 'NuxtLink' : 'span'"
365+
:to="
366+
match.lineup_1.team_id
367+
? `/teams/${match.lineup_1.team_id}`
368+
: undefined
369+
"
370+
:class="[
371+
{
372+
'border-b border-primary/40':
373+
playerLineup === match.lineup_1_id,
374+
},
375+
match.lineup_1.team_id &&
376+
'transition-colors hover:text-[hsl(var(--tac-amber))]',
377+
]"
378+
@click="match.lineup_1.team_id && $event.stopPropagation()"
340379
>
341380
{{ match.lineup_1.name }}
342-
</span>
381+
</component>
343382
</h3>
344383
<div
345384
v-if="match.status === e_match_status_enum.PickingPlayers"
@@ -357,7 +396,7 @@ import MatchOverviewDrawer from "~/components/match/MatchOverviewDrawer.vue";
357396
</div>
358397

359398
<div
360-
class="flex items-center justify-center order-first lg:order-none py-2 lg:py-0"
399+
class="flex flex-col items-center justify-center order-first lg:order-none py-2 lg:py-0"
361400
>
362401
<div class="text-2xl md:text-3xl font-bold">
363402
<span :class="getScoreColorClasses(match.lineup_1.id)">{{
@@ -368,6 +407,12 @@ import MatchOverviewDrawer from "~/components/match/MatchOverviewDrawer.vue";
368407
getTeamScore(match, match.lineup_2.id)
369408
}}</span>
370409
</div>
410+
<span
411+
v-if="isTie"
412+
class="mt-0.5 font-mono text-[0.6rem] font-bold uppercase tracking-[0.18em] text-muted-foreground"
413+
>
414+
{{ $t("match.status.tied") }}
415+
</span>
371416
</div>
372417

373418
<div class="flex items-center space-x-3 justify-end">
@@ -379,14 +424,25 @@ import MatchOverviewDrawer from "~/components/match/MatchOverviewDrawer.vue";
379424
focusPlayerLineupId === match.lineup_2_id,
380425
}"
381426
>
382-
<span
383-
:class="{
384-
'border-b border-primary/40':
385-
playerLineup === match.lineup_2_id,
386-
}"
427+
<component
428+
:is="match.lineup_2.team_id ? 'NuxtLink' : 'span'"
429+
:to="
430+
match.lineup_2.team_id
431+
? `/teams/${match.lineup_2.team_id}`
432+
: undefined
433+
"
434+
:class="[
435+
{
436+
'border-b border-primary/40':
437+
playerLineup === match.lineup_2_id,
438+
},
439+
match.lineup_2.team_id &&
440+
'transition-colors hover:text-[hsl(var(--tac-amber))]',
441+
]"
442+
@click="match.lineup_2.team_id && $event.stopPropagation()"
387443
>
388444
{{ match.lineup_2.name }}
389-
</span>
445+
</component>
390446
</h3>
391447
<div
392448
v-if="match.status === e_match_status_enum.PickingPlayers"
@@ -1410,6 +1466,10 @@ export default {
14101466
return "text-foreground";
14111467
}
14121468
1469+
if (this.isTie) {
1470+
return "text-muted-foreground";
1471+
}
1472+
14131473
if (this.match.status === e_match_status_enum.Finished) {
14141474
if (this.playerLineup) {
14151475
if (this.playerLineup === lineupId) {
@@ -1450,6 +1510,13 @@ export default {
14501510
},
14511511
},
14521512
computed: {
1513+
isTie(): boolean {
1514+
const status = this.match?.status;
1515+
const finishedLike =
1516+
status === e_match_status_enum.Finished ||
1517+
status === e_match_status_enum.Tie;
1518+
return finishedLike && !this.match?.winning_lineup_id;
1519+
},
14531520
isTournamentMatch(): boolean {
14541521
return Boolean(
14551522
this.match?.is_tournament_match ||

‎components/MyUpcoming.vue‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -92,6 +92,9 @@ export default {
9292
result: function ({ data }) {
9393
this.tournaments = data.tournaments;
9494
},
95+
skip: function () {
96+
return !useAuthStore().me?.steam_id;
97+
},
9598
},
9699
},
97100
},

‎components/PlayerDisplay.vue‎

Lines changed: 27 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -57,31 +57,33 @@ import FiveStackToolTip from "./FiveStackToolTip.vue";
5757
alignTop ? 'items-start justify-start' : 'items-center justify-center',
5858
]"
5959
>
60-
<slot name="avatar">
61-
<Avatar shape="square" :class="{ 'h-8 w-8': size === 'xs' || compact }">
62-
<AvatarImage
63-
:src="playerAvatarSrc"
64-
:alt="player.name"
65-
v-if="playerAvatarSrc"
66-
/>
67-
<AvatarFallback>
68-
<slot name="avatar-fallback">
69-
{{ player?.name.slice(0, 2) }}
70-
</slot>
71-
</AvatarFallback>
72-
</Avatar>
73-
</slot>
74-
<slot name="status">
75-
<template v-if="isOnline && showOnline">
76-
<span
77-
class="absolute -top-1 left-0 h-2 w-2 rounded-full animate-ping bg-green-500"
78-
v-if="pingStatus"
79-
></span>
80-
<span
81-
class="absolute -top-1 left-0 h-2 w-2 rounded-full bg-green-500"
82-
></span>
83-
</template>
84-
</slot>
60+
<div class="relative">
61+
<slot name="avatar">
62+
<Avatar shape="square" :class="{ 'h-8 w-8': size === 'xs' || compact }">
63+
<AvatarImage
64+
:src="playerAvatarSrc"
65+
:alt="player.name"
66+
v-if="playerAvatarSrc"
67+
/>
68+
<AvatarFallback>
69+
<slot name="avatar-fallback">
70+
{{ player?.name.slice(0, 2) }}
71+
</slot>
72+
</AvatarFallback>
73+
</Avatar>
74+
</slot>
75+
<slot name="status">
76+
<template v-if="isOnline && showOnline">
77+
<span
78+
class="absolute -top-0.5 -left-0.5 h-2 w-2 rounded-full animate-ping bg-green-500"
79+
v-if="pingStatus"
80+
></span>
81+
<span
82+
class="absolute -top-0.5 -left-0.5 h-2 w-2 rounded-full bg-green-500 ring-2 ring-background"
83+
></span>
84+
</template>
85+
</slot>
86+
</div>
8587
<div class="mt-2" v-if="$slots['avatar-sub']">
8688
<slot name="avatar-sub"></slot>
8789
</div>

‎components/PlayerElo.vue‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,6 @@ const isMobile = useMediaQuery("(max-width: 768px)");
2626
>
2727
<template v-if="bordered">
2828
<span :class="triggerNotchClasses" aria-hidden="true"></span>
29-
<span :class="triggerLabelClasses">ELO</span>
30-
<span :class="triggerSeparatorClasses" aria-hidden="true"></span>
3129
</template>
3230
<span :class="triggerValueClasses">
3331
{{ primaryElo ?? "—" }}

‎components/clips/HighlightSkeleton.vue‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<script setup lang="ts">
2+
import { Film } from "lucide-vue-next";
3+
</script>
4+
5+
<template>
6+
<div
7+
class="relative aspect-video w-full animate-pulse overflow-hidden rounded-lg border border-border/40 bg-card/40"
8+
>
9+
<div
10+
class="absolute inset-0 [background:radial-gradient(120%_120%_at_50%_0%,hsl(var(--muted)/0.35),transparent_60%)]"
11+
/>
12+
<div class="absolute inset-0 flex items-center justify-center">
13+
<Film class="h-6 w-6 text-muted-foreground/25" />
14+
</div>
15+
<div class="absolute inset-x-3 bottom-3 space-y-1.5">
16+
<div class="h-2.5 w-2/3 rounded bg-muted/50" />
17+
<div class="h-2 w-1/3 rounded bg-muted/40" />
18+
</div>
19+
</div>
20+
</template>

0 commit comments

Comments
 (0)