From 2e8f0022665dd641bb1a676c16474c3ff63092f9 Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Wed, 31 Jan 2024 03:40:33 -0800
Subject: refactor(list): use global opacity class

---
 src/lib/List/Anime/CleanAnimeList.svelte | 8 ++++----
 src/lib/List/Manga/CleanMangaList.svelte | 4 ++--
 2 files changed, 6 insertions(+), 6 deletions(-)

(limited to 'src/lib/List')

diff --git a/src/lib/List/Anime/CleanAnimeList.svelte b/src/lib/List/Anime/CleanAnimeList.svelte
index 32d9edd7..f2f2804e 100644
--- a/src/lib/List/Anime/CleanAnimeList.svelte
+++ b/src/lib/List/Anime/CleanAnimeList.svelte
@@ -98,8 +98,8 @@
 						{#if !upcoming || notYetReleased}
 							{pendingUpdate === anime.id ? progress + 1 : progress}{@html totalEpisodes(anime)}
 							<button
-								class="button-square button-action"
-								style={pendingUpdate === anime.id ? 'pointer-events: none; opacity: 50%;' : ''}
+								class={`button-square button-action ${pendingUpdate === anime.id ? 'opaque' : ''}`}
+								style={pendingUpdate === anime.id ? 'pointer-events: none;' : ''}
 								on:click={() => {
 									if (pendingUpdate !== anime.id) {
 										lastUpdatedMedia = anime.id;
@@ -185,8 +185,8 @@
 							<!-- {anime.mediaListEntry?.progress || 0}{@html totalEpisodes(anime)} -->
 							{pendingUpdate === anime.id ? progress + 1 : progress}{@html totalEpisodes(anime)}
 							<button
-								class="button-square button-action"
-								style={pendingUpdate === anime.id ? 'pointer-events: none; opacity: 50%;' : ''}
+								class={`button-square button-action ${pendingUpdate === anime.id ? 'opaque' : ''}`}
+								style={pendingUpdate === anime.id ? 'pointer-events: none;' : ''}
 								on:click={() => {
 									if (pendingUpdate !== anime.id) {
 										lastUpdatedMedia = anime.id;
diff --git a/src/lib/List/Manga/CleanMangaList.svelte b/src/lib/List/Manga/CleanMangaList.svelte
index b8587111..ebfba340 100644
--- a/src/lib/List/Manga/CleanMangaList.svelte
+++ b/src/lib/List/Manga/CleanMangaList.svelte
@@ -149,8 +149,8 @@
 					<span class="opaque">/{manga.chapters || '?'}</span>
 				{/if}
 				<button
-					class="button-square button-action"
-					style={pendingUpdate === manga.id ? 'pointer-events: none; opacity: 50%;' : ''}
+					class={`button-square button-action ${pendingUpdate === manga.id ? 'opaque' : ''}`}
+					style={pendingUpdate === manga.id ? 'pointer-events: none;' : ''}
 					on:click={() =>
 						pendingUpdate === manga.id
 							? null
-- 
cgit v1.2.3