fix: change colors to match dark theme for Network Profiling (#346)

src/views/dashboard/related/continuous-profiling/components/PolicyList.vue

@@ -198,6 +198,7 @@ limitations under the License. -->
 
   .new-task {
     float: right;
+    color: $font-color;
   }
 
   .reload {

src/views/dashboard/related/network-profiling/components/ProcessTopology.vue

@@ -18,7 +18,7 @@ limitations under the License. -->
       <g class="svg-graph" :transform="`translate(${diff[0]}, ${diff[1]})`">
         <g class="hex-polygon">
           <path :d="getHexPolygonVertices()" stroke="#D5DDF6" stroke-width="2" fill="none" />
-          <text :x="0" :y="radius - 15" fill="#000" text-anchor="middle">
+          <text :x="0" :y="radius - 15" :fill="appStore.theme === Themes.Dark ? '#eee' : '#000'" text-anchor="middle">
             {{ selectorStore.currentPod && selectorStore.currentPod.label }}
           </text>
         </g>
@@ -40,7 +40,12 @@ limitations under the License. -->
               :x="(node.x || 0) - 15"
               :y="(node.y || 0) - 15"
             />
-            <text :x="node.x" :y="(node.y || 0) + 28" fill="#000" text-anchor="middle">
+            <text
+              :x="node.x"
+              :y="(node.y || 0) + 28"
+              :fill="appStore.theme === Themes.Dark ? '#eee' : '#000'"
+              text-anchor="middle"
+            >
               {{ node.name.length > 10 ? `${node.name.substring(0, 10)}...` : node.name }}
             </text>
           </g>
@@ -122,6 +127,7 @@ limitations under the License. -->
   import TimeLine from "./TimeLine.vue";
   import { useAppStoreWithOut } from "@/store/modules/app";
   import icons from "@/assets/img/icons";
+  import { Themes } from "@/constants/data";
 
   /*global Nullable, defineProps */
   const props = defineProps({

src/views/dashboard/related/network-profiling/components/Settings.vue

@@ -15,7 +15,7 @@ limitations under the License. -->
 <template>
   <div class="label">{{ t("linkDashboard") }}</div>
   <Selector
-    :value="dashboardStore.selectedGrid.linkDashboard || ''"
+    :value="(dashboardStore.selectedGrid && dashboardStore.selectedGrid.linkDashboard) || ''"
     :options="linkDashboards"
     size="small"
     placeholder="Please input a dashboard name for calls"

src/views/dashboard/related/network-profiling/components/Tasks.vue

@@ -18,7 +18,11 @@ limitations under the License. -->
       <div class="profile-t-tool">
         <span>{{ t("taskList") }}</span>
         <span class="new-task cp" @click="createTask">
-          <Icon :style="{ color: inProcess ? '#ccc' : '#000' }" iconName="library_add" size="middle" />
+          <Icon
+            :style="{ color: inProcess ? '#ccc' : appStore.theme === Themes.Dark ? '#fff' : '#000' }"
+            iconName="library_add"
+            size="middle"
+          />
         </span>
       </div>
       <div class="profile-t-wrapper">
@@ -78,6 +82,7 @@ limitations under the License. -->
   import { useAppStoreWithOut } from "@/store/modules/app";
   import NewTask from "./NewTask.vue";
   import { EBPFProfilingTriggerType } from "@/store/data";
+  import { Themes } from "@/constants/data";
 
   /*global Nullable */
   const { t } = useI18n();