diff options
| author | mat <github@matdoes.dev> | 2022-05-20 22:26:23 -0500 |
|---|---|---|
| committer | mat <github@matdoes.dev> | 2022-05-20 22:26:23 -0500 |
| commit | fbb5d90301c60308071bcd01b65c3dba34ba5725 (patch) | |
| tree | 42caf7688dcf2cae2371e2f4a135da89ecc2263a | |
| parent | 3a4eb5cecc5851f8d62d62d5d4011d0f45afe0e5 (diff) | |
| download | skyblock-stats-fbb5d90301c60308071bcd01b65c3dba34ba5725.tar.gz skyblock-stats-fbb5d90301c60308071bcd01b65c3dba34ba5725.tar.bz2 skyblock-stats-fbb5d90301c60308071bcd01b65c3dba34ba5725.zip | |
Improve achievements
| -rw-r--r-- | src/lib/APITypes.d.ts | 8 | ||||
| -rw-r--r-- | src/lib/sections/Achievements.svelte | 26 |
2 files changed, 23 insertions, 11 deletions
diff --git a/src/lib/APITypes.d.ts b/src/lib/APITypes.d.ts index 04cd554..d9d6d12 100644 --- a/src/lib/APITypes.d.ts +++ b/src/lib/APITypes.d.ts @@ -459,7 +459,13 @@ export interface ItemAuctionsSchema { interface TieredAchievement { id: string name: string - value: number | null + tier: number + amount: number + /** + * The amount that has to be gotten to get to the next tier. If this is + * null, that means the player is at the max tier. + */ + next: number | null description: string } diff --git a/src/lib/sections/Achievements.svelte b/src/lib/sections/Achievements.svelte index 61f320e..92ba468 100644 --- a/src/lib/sections/Achievements.svelte +++ b/src/lib/sections/Achievements.svelte @@ -8,7 +8,7 @@ <h3> Tiered <span class="achievement-count"> - ({data.member.achievements.tiered.filter(a => a.value).length}/{data.member.achievements + ({data.member.achievements.tiered.filter(a => a.amount).length}/{data.member.achievements .tiered.length}) </span> </h3> @@ -20,15 +20,13 @@ {achievement.description} </span> - {#if achievement.value} - <span> - {achievement.name}: <b>{achievement.value}</b> - </span> - {:else} - <span class="achievement-locked"> - {achievement.name} - </span> - {/if} + <span class:achievement-locked={achievement.amount === 0}> + {achievement.name}: {#if achievement.next} + <b class="achievement-amount">{achievement.amount}</b>/{achievement.next} + {:else} + <span class="achievement-amount achievement-amount-maxed">{achievement.amount}</span> + {/if} + </span> </Tooltip> </li> {/each} @@ -78,4 +76,12 @@ color: var(--theme-darker-text); font-weight: normal; } + + .achievement-amount { + opacity: 0.9; + } + .achievement-amount-maxed { + color: #0e0; + opacity: 1; + } </style> |