From 22c44225c2d50124ab64e32638abe0d024cc4bd6 Mon Sep 17 00:00:00 2001
From: DecDuck <declanahofmeyr@gmail.com>
Date: Fri, 27 Dec 2024 12:03:19 +1100
Subject: [PATCH] feat(loading button): add disabled states

---
 components/LoadingButton.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/components/LoadingButton.vue b/components/LoadingButton.vue
index ec0adfa..8a4605a 100644
--- a/components/LoadingButton.vue
+++ b/components/LoadingButton.vue
@@ -1,7 +1,7 @@
 <template>
   <button
     type="submit"
-    class="inline-flex h-9 items-center justify-center rounded-md bg-blue-600 hover:bg-blue-500 disabled:text-zinc-500 disabled:bg-blue-900 disabled:hover:bg-blue-900 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600"
+    class="inline-flex h-9 items-center justify-center rounded-md px-3 py-1.5 text-sm font-semibold leading-6 shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600 text-white bg-blue-600 hover:bg-blue-500 disabled:text-zinc-400 disabled:bg-blue-600/10 disabled:hover:bg-blue-600/10"
   >
     <div v-if="props.loading" role="status">
       <svg
@@ -22,7 +22,9 @@
       </svg>
       <span class="sr-only">Loading...</span>
     </div>
-    <span v-else> <slot /> </span>
+    <span v-else>
+      <slot />
+    </span>
   </button>
 </template>