From e2523788987f13589bcd160475e4d949754dde90 Mon Sep 17 00:00:00 2001
From: MaysWind <i@mayswind.net>
Date: Fri, 26 Dec 2025 00:46:23 +0800
Subject: [PATCH] update query area style

---
 src/styles/desktop/global.scss                      |  1 +
 src/views/desktop/insights/tabs/ExploreQueryTab.vue | 13 +++++++------
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/styles/desktop/global.scss b/src/styles/desktop/global.scss
index 147280fe..2144383c 100644
--- a/src/styles/desktop/global.scss
+++ b/src/styles/desktop/global.scss
@@ -83,6 +83,7 @@ input[type=number] {
     background-color: var(--v-expand-panel-title-bg);
 }
 
+.card-title-with-bg > .v-card-title,
 .card-title-with-bg > .v-card-item {
     background-color: var(--v-card-title-bg);
 }
diff --git a/src/views/desktop/insights/tabs/ExploreQueryTab.vue b/src/views/desktop/insights/tabs/ExploreQueryTab.vue
index f1b6e1f0..e285f690 100644
--- a/src/views/desktop/insights/tabs/ExploreQueryTab.vue
+++ b/src/views/desktop/insights/tabs/ExploreQueryTab.vue
@@ -12,10 +12,11 @@
     </v-card-subtitle>
     <v-card-text class="pt-0">
         <div :key="queryIndex" v-for="(query, queryIndex) in queries">
-            <v-card class="mt-4" variant="outlined">
-                <v-card-title class="d-flex align-center py-2 px-4">
-                    <span class="text-subtitle-1" v-if="editingQuery !== query">{{ query.name || `${tt('Query')} #${queryIndex + 1}` }}</span>
-                    <div class="query-name-edit" v-if="editingQuery === query">
+            <v-card border class="card-title-with-bg mt-4">
+                <v-card-title class="d-flex align-center py-2 px-5">
+                    <v-icon :icon="mdiTextBoxSearchOutline" size="20" />
+                    <span class="text-subtitle-1 ms-2" v-if="editingQuery !== query">{{ query.name || `${tt('Query')} #${queryIndex + 1}` }}</span>
+                    <div class="query-name-edit ms-2" v-if="editingQuery === query">
                         <v-text-field type="text" density="compact" variant="underlined"
                                       :disabled="loading"
                                       :placeholder="`${tt('Query')} #${queryIndex + 1}`"
@@ -312,8 +313,7 @@
                                 </div>
                             </div>
 
-                            <v-btn color="primary" density="comfortable"
-                                   variant="text" size="small"
+                            <v-btn class="px-2" density="comfortable" color="primary" variant="text" size="small"
                                    :prepend-icon="mdiPlus"
                                    :disabled="loading || !!editingQuery || showExpression[queryIndex]"
                                    @click="addCondition(queryIndex)">
@@ -397,6 +397,7 @@ import {
 import logger from '@/lib/logger.ts';
 
 import {
+    mdiTextBoxSearchOutline,
     mdiPlus,
     mdiPencilOutline,
     mdiContentCopy,