diff options
| author | Fuwn <[email protected]> | 2023-11-12 20:23:23 -0800 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2023-11-12 20:23:23 -0800 |
| commit | 4caa690002a05793a8f1af0626fa7ee1ba68ea9e (patch) | |
| tree | 6dd913212d529808f0d684cb44b6261ad08a92c9 /src/lib/Tools/CharacterBirthdays.svelte | |
| parent | feat(tools): grid and avatar for birthdays (diff) | |
| download | due.moe-4caa690002a05793a8f1af0626fa7ee1ba68ea9e.tar.xz due.moe-4caa690002a05793a8f1af0626fa7ee1ba68ea9e.zip | |
refactor(tools): move birthdays to module
Diffstat (limited to 'src/lib/Tools/CharacterBirthdays.svelte')
| -rw-r--r-- | src/lib/Tools/CharacterBirthdays.svelte | 34 |
1 files changed, 34 insertions, 0 deletions
diff --git a/src/lib/Tools/CharacterBirthdays.svelte b/src/lib/Tools/CharacterBirthdays.svelte new file mode 100644 index 00000000..56b332a5 --- /dev/null +++ b/src/lib/Tools/CharacterBirthdays.svelte @@ -0,0 +1,34 @@ +<script> + import { todaysCharacterBirthdays } from '$lib/AniList/character'; + import Error from '$lib/Error.svelte'; +</script> + +{#await todaysCharacterBirthdays()} + Loading ... +{:then birthdays} + <div id="characters"> + {#each birthdays as birthday} + <div> + <a href={`https://anilist.co/character/${birthday.id}`} target="_blank"> + {birthday.name.full} + <img src={birthday.image.large} alt="Character (Large)" class="character-image" /> + </a> + </div> + {/each} + </div> +{:catch} + <Error type="Character" /> +{/await} + +<style> + #characters { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(8%, 1fr)); + grid-gap: 0; + grid-row-gap: 1rem; + } + + .character-image { + height: 20vh; + } +</style> |