diff options
| author | mat <27899617+mat-1@users.noreply.github.com> | 2022-12-15 20:19:42 -0600 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2022-12-15 20:19:42 -0600 |
| commit | ed5eedab8f9fc90dadf5c442cf559572d1b35f0c (patch) | |
| tree | 01a763fd11810e9970f14f7dae180e95b279de9a /src/lib/sections/Harp.svelte | |
| parent | 89bf3d31e36ad3bdfd45461ee6fb69a4c791f848 (diff) | |
| parent | 103689520f51991a1e9a4ca5829fe2f46d1a32c2 (diff) | |
| download | skyblock-stats-ed5eedab8f9fc90dadf5c442cf559572d1b35f0c.tar.gz skyblock-stats-ed5eedab8f9fc90dadf5c442cf559572d1b35f0c.tar.bz2 skyblock-stats-ed5eedab8f9fc90dadf5c442cf559572d1b35f0c.zip | |
Merge pull request #6 from skyblockstats/sveltekit-v1
Sveltekit v1
Diffstat (limited to 'src/lib/sections/Harp.svelte')
| -rw-r--r-- | src/lib/sections/Harp.svelte | 72 |
1 files changed, 0 insertions, 72 deletions
diff --git a/src/lib/sections/Harp.svelte b/src/lib/sections/Harp.svelte deleted file mode 100644 index 6a5c9cc..0000000 --- a/src/lib/sections/Harp.svelte +++ /dev/null @@ -1,72 +0,0 @@ -<script lang="ts"> - import type { CleanMemberProfile } from '$lib/APITypes' - import Emoji from '$lib/Emoji.svelte' - import { cleanId, millisecondsToTime, toTitleCase } from '$lib/utils' - - export let data: CleanMemberProfile -</script> - -<div class="info-text primary-info-text"> - <p>Claimed Melody's hair: <Emoji value={data.member.harp.claimedMelodysHair ? '✅' : '❌'} /></p> - {#if data.member.harp.selected} - <p> - Selected song: - <b class="info-text-value">{toTitleCase(cleanId(data.member.harp.selected.id))}</b> - <span class="harp-selection-timeago"> - {millisecondsToTime(Date.now() - data.member.harp.selected.timestamp)} ago - </span> - </p> - {/if} -</div> -<div class="harp-songs-list"> - {#each data.member.harp.songs as song} - <div class="harp-song" class:selected-harp-song={song.id === data.member.harp.selected?.id}> - <h3>{toTitleCase(cleanId(song.id))}</h3> - <div class="info-text"> - {#if song.completions} - <p>Completions: <b class="info-text-value">{song.completions}</b></p> - {/if} - {#if song.perfectCompletions} - <p>Perfect completions: <b class="info-text-value">{song.perfectCompletions}</b></p> - {:else} - <p>Progress: <b class="info-text-value">{Math.floor(song.progress * 100)}%</b></p> - {/if} - </div> - </div> - {/each} -</div> - -<style> - p { - margin: 0; - } - - .primary-info-text { - margin: 0.5em 0; - } - - .info-text { - color: var(--theme-darker-text); - } - .info-text .info-text-value { - color: var(--theme-main-text); - } - - .harp-songs-list { - display: flex; - flex-wrap: wrap; - max-width: 40rem; - column-gap: 0.5rem; - row-gap: 0.5rem; - } - .harp-song { - border: 1px solid rgba(255, 255, 255, 0.1); - background: rgba(0, 0, 0, 0.1); - padding: 0.75em; - border-radius: 1em; - width: 12em; - } - .selected-harp-song { - border: 1px solid rgba(255, 255, 255, 0.2); - } -</style> |