diff options
| author | Fuwn <[email protected]> | 2024-01-04 09:28:38 -0800 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2024-01-04 09:28:38 -0800 |
| commit | f81999cdc8d6d5cec3dd24aeb1f3a86d9eb1be03 (patch) | |
| tree | 5b32b734a061acbf475550765b5aa1db0a3dc9f8 /src | |
| parent | refactor(layout): badge username (diff) | |
| download | due.moe-f81999cdc8d6d5cec3dd24aeb1f3a86d9eb1be03.tar.xz due.moe-f81999cdc8d6d5cec3dd24aeb1f3a86d9eb1be03.zip | |
refactor(css): more buttons
Diffstat (limited to 'src')
| -rw-r--r-- | src/app.css | 12 | ||||
| -rw-r--r-- | src/lib/List/Anime/CleanAnimeList.svelte | 6 | ||||
| -rw-r--r-- | src/lib/List/Manga/CleanMangaList.svelte | 6 | ||||
| -rw-r--r-- | src/lib/Settings/Categories/Debug.svelte | 4 |
4 files changed, 20 insertions, 8 deletions
diff --git a/src/app.css b/src/app.css index 3e602dc1..c023718d 100644 --- a/src/app.css +++ b/src/app.css @@ -98,6 +98,12 @@ button:active { transform: scale(0.75); } +.button-square { + background-color: var(--base0C); + transform: scale(0.75); + padding: 0.125em 0.575em; +} + .button-badge:hover { background-color: var(--base0C); cursor: unset; @@ -116,3 +122,9 @@ button:active { padding: 1rem; border-radius: 4px; } + +code { + color: var(--base07); + padding: 0.25em 0.5em; + border-radius: 4px; +} diff --git a/src/lib/List/Anime/CleanAnimeList.svelte b/src/lib/List/Anime/CleanAnimeList.svelte index 7e97ba59..4c15156a 100644 --- a/src/lib/List/Anime/CleanAnimeList.svelte +++ b/src/lib/List/Anime/CleanAnimeList.svelte @@ -106,8 +106,8 @@ {#if title !== 'Upcoming Episodes' || title.includes('Not Yet Released')} <!-- {anime.mediaListEntry?.progress || 0}{@html totalEpisodes(anime)} --> {pendingUpdate === anime.id ? progress + 1 : progress}{@html totalEpisodes(anime)} - <a - href={'#'} + <button + class="button-square" style={pendingUpdate === anime.id ? 'pointer-events: none; opacity: 50%;' : ''} on:click={() => { if (pendingUpdate !== anime.id) { @@ -124,7 +124,7 @@ pendingUpdate = null; }); } - }}>+</a + }}>+</button > {#if !completed} [{anime.nextAiringEpisode?.episode === -1 diff --git a/src/lib/List/Manga/CleanMangaList.svelte b/src/lib/List/Manga/CleanMangaList.svelte index e8d20f13..cc540615 100644 --- a/src/lib/List/Manga/CleanMangaList.svelte +++ b/src/lib/List/Manga/CleanMangaList.svelte @@ -107,8 +107,8 @@ {pendingUpdate === manga.id ? progress + 1 : progress}{#if !due} <span style="opacity: 50%;">/{manga.chapters || '?'}</span> {/if} - <a - href={'#'} + <button + class="button-square" style={pendingUpdate === manga.id ? 'pointer-events: none; opacity: 50%;' : ''} on:click={() => pendingUpdate === manga.id @@ -116,7 +116,7 @@ : updateMedia(manga.id, manga.mediaListEntry?.progress, media)} > + - </a> + </button> {#if due || manga.episodes !== manga.chapters} [{manga.episodes || '?'}] {#await volumeCount(manga) then volumes} diff --git a/src/lib/Settings/Categories/Debug.svelte b/src/lib/Settings/Categories/Debug.svelte index d4ccff53..8a0b9899 100644 --- a/src/lib/Settings/Categories/Debug.svelte +++ b/src/lib/Settings/Categories/Debug.svelte @@ -3,14 +3,14 @@ import SettingHint from '../SettingHint.svelte'; </script> -<a href={'#'} on:click={settings.reset}>Reset <b>ALL</b> settings</a> +<button on:click={settings.reset}>Reset <b>ALL</b> settings</button> <SettingHint lineBreak> Resets all settings present on this page to their default values </SettingHint> <p /> -<a href={'#'} on:click={() => localStorage.clear()}>Clear <code>localStorage</code> </a> +<button on:click={() => localStorage.clear()}>Clear <code>localStorage</code></button> <SettingHint lineBreak> Doesn't break anything, but resets all settings and clears all cached media lists. Recommended after updates |