blob: 38604d72acff2c7459518de649e160bfc9574d8c (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
<!--
@component
A sorted list of a user's stats, with the total sometimes being at the top.
-->
<script lang="ts">
import { cleanId, millisecondsToTime } from '$lib/utils'
import type { StatItem } from '$lib/APITypes'
export let stats: StatItem[]
</script>
<ul>
{#each stats.sort((a, b) => b.value - a.value) as stat}
<li class:total-stat={stat.categorizedName === 'total'}>
<span class="stat-name">{cleanId(stat.categorizedName)}:</span>
<span class="stat-value">
{#if stat.unit === 'time'}
{millisecondsToTime(stat.value)}
{:else}
{stat.value.toLocaleString()}
{/if}
</span>
</li>
{/each}
</ul>
<style>
.total-stat .stat-name {
color: var(--theme-darker-text);
}
.total-stat .stat-value {
font-weight: bold;
}
.total-stat {
list-style-type: none;
padding: 0 0 0.5em 0;
right: 1em;
}
li {
position: relative;
}
ul {
margin-top: 0.5em;
padding-left: 1em;
}
</style>
|
