diff options
| author | Fuwn <[email protected]> | 2023-12-16 00:19:52 -0800 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2023-12-16 00:19:52 -0800 |
| commit | cedc294b232e2f902fb73a867788e4b5e48beebd (patch) | |
| tree | bbf5183576ecbabd6e03748244554599a2786c4f /src | |
| parent | feat(settings): scroll to section (diff) | |
| download | due.moe-cedc294b232e2f902fb73a867788e4b5e48beebd.tar.xz due.moe-cedc294b232e2f902fb73a867788e4b5e48beebd.zip | |
feat(anime): right align countdown option
Diffstat (limited to 'src')
| -rw-r--r-- | src/lib/List/Anime/CleanAnimeList.svelte | 4 | ||||
| -rw-r--r-- | src/lib/Media/anime.ts | 11 | ||||
| -rw-r--r-- | src/routes/settings/+page.svelte | 4 | ||||
| -rw-r--r-- | src/stores/settings.ts | 2 |
4 files changed, 16 insertions, 5 deletions
diff --git a/src/lib/List/Anime/CleanAnimeList.svelte b/src/lib/List/Anime/CleanAnimeList.svelte index c4d61a3c..2c7c7e26 100644 --- a/src/lib/List/Anime/CleanAnimeList.svelte +++ b/src/lib/List/Anime/CleanAnimeList.svelte @@ -69,7 +69,9 @@ {#if $settings.displaySocialButton} [<a href={`https://anilist.co/anime/${anime.id}/social`} target="_blank">S</a>] {/if} - <span style="opacity: 50%;">|</span> + {#if !$settings.displayCountdownRightAligned || title !== 'Upcoming Episodes'} + <span style="opacity: 50%;">|</span> + {/if} {#if title !== 'Upcoming Episodes'} <!-- {anime.mediaListEntry?.progress || 0}{@html totalEpisodes(anime)} --> {pendingUpdate === anime.id ? progress + 1 : progress}{@html totalEpisodes(anime)} diff --git a/src/lib/Media/anime.ts b/src/lib/Media/anime.ts index 001a7798..380b20d6 100644 --- a/src/lib/Media/anime.ts +++ b/src/lib/Media/anime.ts @@ -70,17 +70,20 @@ export const airingTime = (anime: Media, upcoming = false) => { } const opacity = Math.max(50, 100 - (untilAiring / 60 / 60 / 24 / 7) * 50); + const alignment = get(settings).displayCountdownRightAligned ? 'float: right;' : ''; if (upcoming) return `<span title="${ hours ? `${hours.toFixed(3)} hours` : '' - }" style="opacity: ${opacity}%">${anime.nextAiringEpisode?.episode}${totalEpisodes( - anime - )} in ${timeFrame} <span style="opacity: 50%">${few ? `(${time})` : ''}</span></span>`; + }" style="opacity: ${opacity}%; ${alignment}">${ + anime.nextAiringEpisode?.episode + }${totalEpisodes(anime)} in ${timeFrame} <span style="opacity: 50%">${ + few ? `(${time})` : '' + }</span></span>`; else return `<span title="${ hours ? `${hours.toFixed(3)} hours` : '' - }" style="opacity: ${opacity}%">${anime.nextAiringEpisode?.episode} in ${ + }" style="opacity: ${opacity}%; ${alignment}">${anime.nextAiringEpisode?.episode} in ${ few ? '<b>' : '' }${timeFrame}${few ? '</b>' : ''} ${few ? `(${time})` : ''}</span>`; } diff --git a/src/routes/settings/+page.svelte b/src/routes/settings/+page.svelte index ba86e720..e47af157 100644 --- a/src/routes/settings/+page.svelte +++ b/src/routes/settings/+page.svelte @@ -110,6 +110,10 @@ <SettingCheckboxToggle setting="closeMangaByDefault" text="Collapse manga panel by default" /> <SettingCheckboxToggle setting="limitListHeight" text="Limit list area to screen" /> <SettingCheckboxToggle setting="displaySocialButton" text="Display social button for anime" /> + <SettingCheckboxToggle + setting="displayCountdownRightAligned" + text="Display countdown right aligned" + /> <SettingCheckboxToggle setting="display24HourTime" text="Display time in 24-hour format" /> <SettingCheckboxToggle setting="displayNativeTitles" diff --git a/src/stores/settings.ts b/src/stores/settings.ts index dca40ea9..57d94c6b 100644 --- a/src/stores/settings.ts +++ b/src/stores/settings.ts @@ -26,6 +26,7 @@ export interface Settings { disableAnime: boolean; disableUpcomingAnime: boolean; display24HourTime: boolean; + displayCountdownRightAligned: boolean; // eslint-disable-next-line @typescript-eslint/no-explicit-any [key: string]: any; } @@ -50,6 +51,7 @@ const defaultSettings: Settings = { disableAnime: false, disableUpcomingAnime: false, display24HourTime: false, + displayCountdownRightAligned: false, // Calculation roundDownChapters: true, |