From 9d6ad8e62258eba6e812145efeeb96431d722901 Mon Sep 17 00:00:00 2001
From: "cool.gitter.not.me.again.duh" <gitter@cordovault.com>
Date: Thu, 29 May 2025 21:52:46 -0600
Subject: [PATCH] correct css again

---
 src/js/watch.ts            |  2 +-
 static/css/watch/watch.css | 13 +++++++++++++
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/js/watch.ts b/src/js/watch.ts
index b93d136..b5beb11 100644
--- a/src/js/watch.ts
+++ b/src/js/watch.ts
@@ -535,7 +535,7 @@ function showEmptyState(show: boolean) {
 async function unwatchItem(itemId: string, itemType: 'artist' | 'playlist', buttonElement: HTMLButtonElement, cardElement: HTMLElement) {
   const originalButtonContent = buttonElement.innerHTML;
   buttonElement.disabled = true;
-  buttonElement.innerHTML = '<img src="/static/images/loader-small.svg" alt="Unwatching...">'; // Assuming a small loader icon
+  buttonElement.innerHTML = '<img src="/static/images/refresh.svg" class="spin-counter-clockwise" alt="Unwatching...">'; // Assuming a small loader icon
 
   const endpoint = `/api/${itemType}/watch/${itemId}`;
 
diff --git a/static/css/watch/watch.css b/static/css/watch/watch.css
index f62b7c3..1a33a65 100644
--- a/static/css/watch/watch.css
+++ b/static/css/watch/watch.css
@@ -343,4 +343,17 @@ body {
 .notification-toast.hide {
   opacity: 0;
   transform: translateY(100%); /* Slide down for exit, or could keep translateX if preferred */
+}
+
+@keyframes spin-counter-clockwise {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(-360deg);
+  }
+}
+
+.spin-counter-clockwise {
+  animation: spin-counter-clockwise 1s linear infinite;
 } 
\ No newline at end of file