From 99a246173484ac0da32dd67ea10925dd61939308 Mon Sep 17 00:00:00 2001
From: Fine0830 <fanxue0830@gmail.com>
Date: Thu, 28 Nov 2024 21:35:44 +0800
Subject: [PATCH] update style (#435)

---
 src/views/dashboard/panel/Tool.vue            | 23 ++++++++-----------
 .../async-profiling/components/TaskList.vue   |  2 +-
 src/views/dashboard/related/ebpf/Header.vue   |  2 +-
 .../related/profile/components/TaskList.vue   |  2 +-
 4 files changed, 13 insertions(+), 16 deletions(-)

diff --git a/src/views/dashboard/panel/Tool.vue b/src/views/dashboard/panel/Tool.vue
index 4f9a6504..d05d9bc6 100644
--- a/src/views/dashboard/panel/Tool.vue
+++ b/src/views/dashboard/panel/Tool.vue
@@ -105,11 +105,11 @@ limitations under the License. -->
       </div>
     </div>
     <div class="flex-h tools" v-loading="loading" v-if="!appStore.isMobile">
-      <div class="tool-icons" v-if="dashboardStore.editMode">
+      <div class="flex-h" v-if="dashboardStore.editMode">
         <el-dropdown content="Controls" placement="bottom" :persistent="false">
-          <i>
-            <Icon class="icon-btn" size="sm" iconName="control" />
-          </i>
+          <div class="icon-btn">
+            <Icon size="sm" iconName="control" />
+          </div>
           <template #dropdown>
             <el-dropdown-menu>
               <el-dropdown-item @click="clickIcons(t)" v-for="(t, index) in toolIcons" :key="index" :title="t.content">
@@ -120,9 +120,9 @@ limitations under the License. -->
           </template>
         </el-dropdown>
         <el-tooltip content="Apply" placement="bottom">
-          <i @click="applyDashboard">
-            <Icon class="icon-btn" size="sm" iconName="save" />
-          </i>
+          <div class="icon-btn" @click="applyDashboard">
+            <Icon size="sm" iconName="save" />
+          </div>
         </el-tooltip>
       </div>
       <div class="ml-5">
@@ -693,10 +693,6 @@ limitations under the License. -->
     padding: 4px 2px;
   }
 
-  .tool-icons {
-    margin-top: 2px;
-  }
-
   .tools {
     justify-content: space-between;
     align-items: center;
@@ -704,9 +700,10 @@ limitations under the License. -->
   }
 
   .icon-btn {
-    display: inline-block;
-    padding: 3px;
+    width: 22px;
+    height: 22px;
     text-align: center;
+    line-height: 18px;
     border: 1px solid var(--sw-icon-btn-border);
     border-radius: 3px;
     margin-left: 6px;
diff --git a/src/views/dashboard/related/async-profiling/components/TaskList.vue b/src/views/dashboard/related/async-profiling/components/TaskList.vue
index 205bf594..ff629260 100644
--- a/src/views/dashboard/related/async-profiling/components/TaskList.vue
+++ b/src/views/dashboard/related/async-profiling/components/TaskList.vue
@@ -203,7 +203,7 @@ limitations under the License. -->
 <style lang="scss" scoped>
   .profile-task-list {
     width: 300px;
-    height: 100%;
+    height: calc(100% - 20px);
     overflow: auto;
     border-right: 1px solid var(--sw-trace-list-border);
   }
diff --git a/src/views/dashboard/related/ebpf/Header.vue b/src/views/dashboard/related/ebpf/Header.vue
index 0c3c10df..68468faa 100644
--- a/src/views/dashboard/related/ebpf/Header.vue
+++ b/src/views/dashboard/related/ebpf/Header.vue
@@ -15,7 +15,7 @@ limitations under the License. -->
 <template>
   <div class="flex-h header">
     <div class="title">eBPF Profiling</div>
-    <el-button type="primary" size="small" @click="createTask">
+    <el-button class="mr-10 mt-10" type="primary" size="small" @click="createTask">
       {{ t("newTask") }}
     </el-button>
   </div>
diff --git a/src/views/dashboard/related/profile/components/TaskList.vue b/src/views/dashboard/related/profile/components/TaskList.vue
index a95d04df..39a26249 100644
--- a/src/views/dashboard/related/profile/components/TaskList.vue
+++ b/src/views/dashboard/related/profile/components/TaskList.vue
@@ -160,6 +160,7 @@ limitations under the License. -->
     width: 300px;
     height: calc((100% - 60px) / 2);
     overflow: auto;
+    border-right: 1px solid var(--sw-trace-list-border);
   }
 
   .item span {
@@ -183,7 +184,6 @@ limitations under the License. -->
   .profile-t-wrapper {
     overflow: auto;
     flex-grow: 1;
-    border-right: 1px solid var(--sw-trace-list-border);
   }
 
   .profile-t {