From 6ad48250f8726925f46eec6dd55dfe3dd1b0ffed Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=98=AD?= <81747598+lan-yonghui@users.noreply.github.com>
Date: Tue, 10 Dec 2024 15:57:38 +0800
Subject: [PATCH] style: Optimize input to disable background color (#7308)

---
 frontend/src/styles/element.scss               | 10 ++++++++++
 frontend/src/views/container/setting/index.vue |  2 +-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/frontend/src/styles/element.scss b/frontend/src/styles/element.scss
index cc049e2b8..db0ca58a9 100644
--- a/frontend/src/styles/element.scss
+++ b/frontend/src/styles/element.scss
@@ -56,6 +56,7 @@ html {
     --panel-pie-bg-color: #ffffff;
 
     --el-fill-color-light: #ffffff;
+    --el-disabled-bg-color: var(--panel-main-bg-color-9) !important;
 }
 
 .el-notification {
@@ -241,6 +242,10 @@ html {
     }
 }
 
+.el-input.is-disabled .el-input__wrapper {
+    --el-disabled-bg-color: var(--panel-main-bg-color-9);
+}
+
 .el-radio-button__inner {
     [class*='el-icon'] + span {
         margin-left: 6px;
@@ -253,3 +258,8 @@ html {
 .logo {
     color: var(--el-color-primary);
 }
+
+.custom-input-textarea {
+    background-color: #f5f7fa !important;
+    color: var(--el-color-info) !important;
+}
diff --git a/frontend/src/views/container/setting/index.vue b/frontend/src/views/container/setting/index.vue
index 7a39af674..b514ad63d 100644
--- a/frontend/src/views/container/setting/index.vue
+++ b/frontend/src/views/container/setting/index.vue
@@ -51,7 +51,7 @@
                                         v-model="form.mirrors"
                                         class="sm:calc(100% - 80px)"
                                     />
-                                    <el-button @click="onChangeMirrors" icon="Setting">
+                                    <el-button @click="onChangeMirrors" icon="Setting" class="custom-input-textarea">
                                         {{ $t('commons.button.set') }}
                                     </el-button>
                                 </div>