From f3a3a299e081b29a6680016c4b8c18e9ddc5a11c Mon Sep 17 00:00:00 2001
From: Alex <49969959+alexzhang1030@users.noreply.github.com>
Date: Tue, 17 Jan 2023 02:04:51 +0800
Subject: [PATCH] fix(ui): translation button loading style issue in light
 theme (#1218)

---
 components/status/StatusTranslation.vue | 2 +-
 styles/vars.css                         | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/components/status/StatusTranslation.vue b/components/status/StatusTranslation.vue
index 56e022f6..a7667de8 100644
--- a/components/status/StatusTranslation.vue
+++ b/components/status/StatusTranslation.vue
@@ -27,7 +27,7 @@ const toggleTranslation = async () => {
   <div>
     <button
       v-if="isTranslationEnabled && status.language !== languageCode" pl-0 flex="~ center" gap-2
-      :disabled="translating" disabled-bg-transparent btn-text @click="toggleTranslation"
+      :disabled="translating" disabled-bg-transparent btn-text class="disabled-text-$c-text-btn-disabled-deeper" @click="toggleTranslation"
     >
       <span v-if="translating" block animate-spin preserve-3d>
         <span block i-ri:loader-2-fill />
diff --git a/styles/vars.css b/styles/vars.css
index ea82106a..a64555d7 100644
--- a/styles/vars.css
+++ b/styles/vars.css
@@ -19,6 +19,7 @@
 
   --c-bg-btn-disabled: #a1a1a1;
   --c-text-btn-disabled: #fff;
+  --c-text-btn-disabled-deeper: #a1a1a1;
   --c-text-btn: #232323;
 
   --c-success: #67C23A;