From 286eb6bb427e8b21212d7f24838359e34a908d2e Mon Sep 17 00:00:00 2001
From: Fine <fanxue0830@gmail.com>
Date: Mon, 13 Nov 2023 11:45:07 +0800
Subject: [PATCH] feat: update trace table

---
 src/styles/theme.scss                                     | 8 +++++---
 .../continuous-profiling/components/InstanceList.vue      | 2 +-
 src/views/dashboard/related/log/LogTable/Index.vue        | 2 +-
 .../related/profile/components/Stack/Container.vue        | 2 +-
 .../related/trace/components/Table/TableContainer.vue     | 2 +-
 5 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/styles/theme.scss b/src/styles/theme.scss
index b89ffef9..a4497035 100644
--- a/src/styles/theme.scss
+++ b/src/styles/theme.scss
@@ -44,6 +44,7 @@ html {
   --sw-trace-success: rgb(46 47 51 / 10%);
   --sw-trace-list-border: rgb(0 0 0 / 7%);
   --sw-trace-list-hover: #ededed;
+  --sw-table-header: #f3f4f9;
 }
 
 html.dark {
@@ -56,7 +57,7 @@ html.dark {
   --border-color: #262629;
   --border-color-primary: #4b4b52;
   --layout-background: #000;
-  --box-shadow-color: #666;
+  --box-shadow-color: #606266;
   --sw-bg-color-overlay: #1d1e1f;
   --sw-border-color-light: #414243;
   --popper-hover-bg: rgb(64, 158, 255, 0.1);
@@ -64,7 +65,7 @@ html.dark {
   --sw-icon-btn-color: #ccc;
   --sw-icon-btn-border: #999;
   --sw-table-col: none;
-  --sw-config-header: #333;
+  --sw-config-header: #303133;
   --sw-topology-color: #ccc;
   --vis-tooltip-bg: #414243;
   --sw-topology-switch-icon: #aaa;
@@ -72,8 +73,9 @@ html.dark {
   --sw-topology-setting-bg: #333;
   --sw-topology-border: 1px solid #666;
   --sw-trace-success: #aaa;
-  --sw-trace-list-border: #333;
+  --sw-trace-list-border: #333133;
   --sw-trace-list-hover: #3d444f;
+  --sw-table-header: #303133;
 }
 
 .el-table tr {
diff --git a/src/views/dashboard/related/continuous-profiling/components/InstanceList.vue b/src/views/dashboard/related/continuous-profiling/components/InstanceList.vue
index 57da33c9..61428a58 100644
--- a/src/views/dashboard/related/continuous-profiling/components/InstanceList.vue
+++ b/src/views/dashboard/related/continuous-profiling/components/InstanceList.vue
@@ -149,7 +149,7 @@ limitations under the License. -->
     font-weight: bold;
     border-bottom: 1px solid rgb(0 0 0 / 7%);
     padding: 10px 20px;
-    background-color: #f3f4f9;
+    background-color: var(--sw-table-header);
   }
 
   .settings {
diff --git a/src/views/dashboard/related/log/LogTable/Index.vue b/src/views/dashboard/related/log/LogTable/Index.vue
index 8dfe77c1..8cb63fce 100644
--- a/src/views/dashboard/related/log/LogTable/Index.vue
+++ b/src/views/dashboard/related/log/LogTable/Index.vue
@@ -109,7 +109,7 @@ limitations under the License. -->
     border: 1px solid transparent;
     border-right: 1px dotted silver;
     line-height: 30px;
-    background-color: #f3f4f9;
+    background-color: var(--sw-table-header);
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
diff --git a/src/views/dashboard/related/profile/components/Stack/Container.vue b/src/views/dashboard/related/profile/components/Stack/Container.vue
index e510eddd..e6ea52c7 100644
--- a/src/views/dashboard/related/profile/components/Stack/Container.vue
+++ b/src/views/dashboard/related/profile/components/Stack/Container.vue
@@ -115,7 +115,7 @@ limitations under the License. -->
     padding: 0 4px;
     border-right: 1px dotted silver;
     line-height: 30px;
-    background-color: #f3f4f9;
+    background-color: var(--sw-table-header);
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
diff --git a/src/views/dashboard/related/trace/components/Table/TableContainer.vue b/src/views/dashboard/related/trace/components/Table/TableContainer.vue
index b396de92..1961cc1a 100644
--- a/src/views/dashboard/related/trace/components/Table/TableContainer.vue
+++ b/src/views/dashboard/related/trace/components/Table/TableContainer.vue
@@ -170,7 +170,7 @@ limitations under the License. -->
 
   .trace-header div {
     display: inline-block;
-    background-color: #f3f4f9;
+    background-color: var(--sw-table-header);
     padding: 0 4px;
     border: 1px solid transparent;
     border-right: 1px dotted silver;