From 5c7fab8f013cb5c23b14fc07ccb6ccff63d7fff2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=98=AD?= <81747598+lan-yonghui@users.noreply.github.com>
Date: Wed, 13 Nov 2024 14:30:00 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E9=9D=A2=E6=9D=BF=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96=20(#7026)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/system-upgrade/index.vue   |  8 ++---
 .../Sidebar/components/Collapse.vue           |  1 +
 .../src/views/database/mysql/check/index.vue  | 36 +++++++++++++++----
 3 files changed, 33 insertions(+), 12 deletions(-)

diff --git a/frontend/src/components/system-upgrade/index.vue b/frontend/src/components/system-upgrade/index.vue
index c04c0e645..cccd1c2d9 100644
--- a/frontend/src/components/system-upgrade/index.vue
+++ b/frontend/src/components/system-upgrade/index.vue
@@ -54,11 +54,6 @@
             <DrawerHeader :header="$t('commons.button.upgrade')" :back="handleClose" />
         </template>
         <div class="panel-MdEditor">
-            <el-alert :closable="false">
-                <span class="line-height">{{ $t('setting.versionHelper') }}</span>
-                <li class="line-height">{{ $t('setting.versionHelper1') }}</li>
-                <li class="line-height">{{ $t('setting.versionHelper2') }}</li>
-            </el-alert>
             <div class="default-theme" style="margin-left: 20px">
                 <h2 class="inline-block">{{ $t('app.version') }}</h2>
             </div>
@@ -229,4 +224,7 @@ onMounted(() => {
 :deep(.el-link__inner) {
     font-weight: 400;
 }
+:deep(.md-editor-dark) {
+    background-color: var(--panel-main-bg-color-9);
+}
 </style>
diff --git a/frontend/src/layout/components/Sidebar/components/Collapse.vue b/frontend/src/layout/components/Sidebar/components/Collapse.vue
index 9050c91d7..77d84494d 100644
--- a/frontend/src/layout/components/Sidebar/components/Collapse.vue
+++ b/frontend/src/layout/components/Sidebar/components/Collapse.vue
@@ -23,6 +23,7 @@ const isCollapse = computed(() => menuStore.isCollapse);
 }
 
 .collapse-icon {
+    color: var(--panel-main-bg-color-1);
     margin-left: 25px;
     &:hover {
         color: $primary-color;
diff --git a/frontend/src/views/database/mysql/check/index.vue b/frontend/src/views/database/mysql/check/index.vue
index 96f1451a0..9d31ec5fa 100644
--- a/frontend/src/views/database/mysql/check/index.vue
+++ b/frontend/src/views/database/mysql/check/index.vue
@@ -2,7 +2,7 @@
     <el-dialog
         v-model="open"
         :title="$t('app.checkTitle')"
-        width="50%"
+        width="40%"
         :close-on-click-modal="false"
         :destroy-on-close="true"
     >
@@ -10,18 +10,17 @@
             <el-col :span="20" :offset="2" v-if="open">
                 <el-alert
                     type="error"
-                    :description="$t('app.deleteHelper', [$t('app.database')])"
+                    :title="$t('app.deleteHelper', [$t('app.database')])"
                     center
                     show-icon
                     :closable="false"
                 />
-                <br />
-                <el-descriptions border :column="1">
-                    <el-descriptions-item>
+                <el-descriptions :column="1" border>
+                    <el-descriptions-item label-class-name="label" class-name="content" min-width="60px">
                         <template #label>
-                            <a href="javascript:void(0);" @click="toApp()">{{ $t('app.app') }}</a>
+                            <a href="javascript:void(0);" class="content-a" @click="toApp()">{{ $t('app.app') }}</a>
                         </template>
-                        {{ installData.join(',') }}
+                        <pre>{{ installData.join('\n') }}</pre>
                     </el-descriptions-item>
                 </el-descriptions>
             </el-col>
@@ -41,6 +40,7 @@ let open = ref(false);
 
 const acceptParams = (props: InstallProps) => {
     installData.value = props.items;
+    installData.value.push('sdsfhjdghjdgfhsdgfhjsgfkhjsdgfhjasgdfhjasgdfjhsagdfhjsagdfashdfgaskhjdfgaskjhdf');
     open.value = true;
 };
 
@@ -52,3 +52,25 @@ defineExpose({
     acceptParams,
 });
 </script>
+
+<style scoped>
+:deep(.label) {
+    background: var(--panel-main-bg-color-10) !important;
+}
+:deep(.content) {
+    background: var(--panel-main-bg-color-10);
+}
+:deep(.content-a) {
+    color: var(--panel-color-primary);
+}
+pre {
+    margin: 0;
+    width: 350px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+:deep(.el-descriptions) {
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+</style>