From 5a15d7a42446a42b18a76b07ee3cdfff5e59c200 Mon Sep 17 00:00:00 2001
From: t8y2 <1156263951@qq.com>
Date: Sun, 10 May 2026 10:17:18 +0800
Subject: [PATCH] fix(ui): refine layout polish

---
 src/App.vue                                    |  4 ++--
 src/components/editor/EditorSettingsDialog.vue |  1 -
 src/components/grid/DataGrid.vue               |  5 ++++-
 src/components/layout/AppSidebar.vue           |  2 +-
 src/i18n/locales/en.ts                         |  1 -
 src/i18n/locales/zh-CN.ts                      |  1 -
 src/styles/globals.css                         | 15 +--------------
 7 files changed, 8 insertions(+), 21 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 1495f23fbd..51948e0617 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -607,7 +607,7 @@ onUnmounted(() => {
             :class="
               isClassicLayout
                 ? 'h-full shrink-0 relative bg-background'
-                : 'h-full shrink-0 relative overflow-hidden rounded-md border border-border/80 bg-background'
+                : 'h-full shrink-0 relative rounded-md border border-border/80 bg-background'
             "
             :style="{ width: aiPanelWidth + 'px' }"
           >
@@ -629,7 +629,7 @@ onUnmounted(() => {
             :class="
               isClassicLayout
                 ? 'h-full shrink-0 relative bg-background'
-                : 'h-full shrink-0 relative overflow-hidden rounded-md border border-border/80 bg-background'
+                : 'h-full shrink-0 relative rounded-md border border-border/80 bg-background'
             "
             :style="{ width: historyWidth + 'px' }"
           >
diff --git a/src/components/editor/EditorSettingsDialog.vue b/src/components/editor/EditorSettingsDialog.vue
index 6cde2b78c7..6b7a4517ed 100644
--- a/src/components/editor/EditorSettingsDialog.vue
+++ b/src/components/editor/EditorSettingsDialog.vue
@@ -399,7 +399,6 @@ watch(
         <TabsContent value="appearance" class="space-y-5 py-2">
           <div class="space-y-2">
             <Label>{{ t("settings.appLayout") }}</Label>
-            <p class="text-xs text-muted-foreground">{{ t("settings.appLayoutDescription") }}</p>
             <div class="grid grid-cols-2 gap-2">
               <Button
                 type="button"
diff --git a/src/components/grid/DataGrid.vue b/src/components/grid/DataGrid.vue
index 949b242e44..58e09ade84 100644
--- a/src/components/grid/DataGrid.vue
+++ b/src/components/grid/DataGrid.vue
@@ -2241,7 +2241,10 @@ defineExpose({
           <div class="flex-1 flex min-h-0 overflow-hidden">
             <div class="flex-1 flex flex-col min-w-0 overflow-hidden">
               <!-- Sticky header -->
-              <div ref="headerRef" class="shrink-0 bg-muted/60 z-10 border-y border-border overflow-hidden">
+              <div
+                ref="headerRef"
+                class="shrink-0 bg-[rgb(239_239_239)] dark:bg-muted/60 z-10 border-y border-border overflow-hidden"
+              >
                 <div class="flex text-xs font-semibold text-foreground" :style="{ width: 'var(--total-w)' }">
                   <div
                     class="shrink-0 px-2 py-1.5 border-r border-border text-center text-muted-foreground select-none"
diff --git a/src/components/layout/AppSidebar.vue b/src/components/layout/AppSidebar.vue
index 48f22c3899..8e438a2a59 100644
--- a/src/components/layout/AppSidebar.vue
+++ b/src/components/layout/AppSidebar.vue
@@ -34,7 +34,7 @@ async function refreshTree() {
 <template>
   <div
     class="h-full shrink-0 relative select-none"
-    :class="classicLayout ? '' : 'overflow-hidden rounded-md border border-border/80 bg-background'"
+    :class="classicLayout ? '' : 'rounded-md border border-border/80 bg-background'"
     :style="{ width: sidebarWidth + 'px' }"
   >
     <div class="h-full flex flex-col overflow-hidden">
diff --git a/src/i18n/locales/en.ts b/src/i18n/locales/en.ts
index 5a4206214c..d4f1dbc53f 100644
--- a/src/i18n/locales/en.ts
+++ b/src/i18n/locales/en.ts
@@ -793,7 +793,6 @@ export default {
     theme: "Theme",
     selectTheme: "Select theme...",
     appLayout: "Interface Layout",
-    appLayoutDescription: "Choose the main panel spacing, tab style, and header density.",
     appLayoutSeparated: "Modern separated",
     appLayoutSeparatedDescription: "Clear panel separation with block-style tabs.",
     appLayoutClassic: "Classic compact",
diff --git a/src/i18n/locales/zh-CN.ts b/src/i18n/locales/zh-CN.ts
index 0ecd1a0578..62d448e36d 100644
--- a/src/i18n/locales/zh-CN.ts
+++ b/src/i18n/locales/zh-CN.ts
@@ -780,7 +780,6 @@ export default {
     theme: "主题",
     selectTheme: "选择主题...",
     appLayout: "界面布局",
-    appLayoutDescription: "选择主界面的面板分隔、标签页和标题栏样式。",
     appLayoutSeparated: "现代分隔",
     appLayoutSeparatedDescription: "面板分隔更清晰，标签页为块状样式。",
     appLayoutClassic: "经典紧凑",
diff --git a/src/styles/globals.css b/src/styles/globals.css
index 02b4efc271..30ccc351b5 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -179,9 +179,6 @@
   left: 0;
   border-left: 1px solid var(--border);
 }
-.app-layout-classic .panel-resize-handle::before {
-  display: none;
-}
 .app-layout-classic .panel-resize-handle:hover,
 .app-layout-classic .panel-resize-handle:active {
   background: oklch(0.6 0.15 250);
@@ -203,17 +200,7 @@
   left: -4px;
 }
 .panel-resize-handle::before {
-  content: "";
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 3px;
-  width: 1px;
-  background: var(--border);
-}
-.panel-resize-handle:hover::before,
-.panel-resize-handle:active::before {
-  background: oklch(0.6 0.15 250);
+  display: none;
 }
 
 /* Frosted glass menus */