From 1a82560fb6c84d39e2177ee2f09425c8287f0585 Mon Sep 17 00:00:00 2001
From: Fine <fanxue0830@gmail.com>
Date: Thu, 20 Feb 2025 11:55:11 +0800
Subject: [PATCH] update node version

---
 .github/workflows/nodejs.yml                  |  2 +-
 .../related/topology/service/ServiceMap.vue   | 20 +++++++++----------
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/.github/workflows/nodejs.yml b/.github/workflows/nodejs.yml
index 4f7f664d..d9bfe635 100644
--- a/.github/workflows/nodejs.yml
+++ b/.github/workflows/nodejs.yml
@@ -37,7 +37,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [16.x, 18.x, 20.x]
+        node-version: [18.x, 20.x, 22.x]
     steps:
       - uses: actions/checkout@v1
       - name: Use Node.js ${{ matrix.node-version }}
diff --git a/src/views/dashboard/related/topology/service/ServiceMap.vue b/src/views/dashboard/related/topology/service/ServiceMap.vue
index 79a34bfc..cf3b1707 100644
--- a/src/views/dashboard/related/topology/service/ServiceMap.vue
+++ b/src/views/dashboard/related/topology/service/ServiceMap.vue
@@ -99,16 +99,16 @@ limitations under the License. -->
       <Settings @update="updateSettings" @updateNodes="freshNodes" />
     </div>
     <div class="tool flex-h">
-      <span v-show="graphConfig.showDepth">
+      <div class="flex-h" v-show="graphConfig.showDepth">
         <span class="label">{{ t("currentDepth") }}</span>
         <Selector class="inputs" :value="depth" :options="DepthList" @change="changeDepth" />
-      </span>
-      <span class="switch-icon ml-5" title="Settings" @click="setConfig" v-if="dashboardStore.editMode">
+      </div>
+      <div class="switch-icon ml-5" title="Settings" @click="setConfig" v-if="dashboardStore.editMode">
         <Icon size="middle" iconName="settings" />
-      </span>
-      <span class="switch-icon ml-5" title="Back to overview topology" @click="backToTopology">
+      </div>
+      <div class="switch-icon ml-5" title="Back to overview topology" @click="backToTopology">
         <Icon size="middle" iconName="keyboard_backspace" />
-      </span>
+      </div>
     </div>
     <div
       class="operations-list"
@@ -674,8 +674,8 @@ limitations under the License. -->
 
     .label {
       color: var(--sw-topology-color);
-      display: inline-block;
-      margin-right: 5px;
+      line-height: 32px;
+      width: 120px;
     }
 
     .operations-list {
@@ -713,8 +713,8 @@ limitations under the License. -->
       background: var(--sw-topology-switch-icon);
       color: $text-color;
       display: inline-block;
-      padding: 2px 4px;
-      border-radius: 3px;
+      padding: 5px 4px;
+      border-radius: 2px;
     }
 
     .topo-line {