From ace6173aa97200819f3da6a2a27baa58c6046baf Mon Sep 17 00:00:00 2001
From: t8y2 <1156263951@qq.com>
Date: Mon, 14 Sep 2026 23:31:48 +0800
Subject: [PATCH] fix(ui): remove duplicate top borders from classic tabs

---
 .../layout/__tests__/EditorGroupTabBar.groups.spec.ts       | 1 +
 apps/desktop/src/components/layout/appTabBar.css            | 6 ++++++
 2 files changed, 7 insertions(+)

diff --git a/apps/desktop/src/components/layout/__tests__/EditorGroupTabBar.groups.spec.ts b/apps/desktop/src/components/layout/__tests__/EditorGroupTabBar.groups.spec.ts
index 8df2df29fd..a33e19d3b3 100644
--- a/apps/desktop/src/components/layout/__tests__/EditorGroupTabBar.groups.spec.ts
+++ b/apps/desktop/src/components/layout/__tests__/EditorGroupTabBar.groups.spec.ts
@@ -190,6 +190,7 @@ describe("EditorGroupTabBar semantic tab groups", () => {
     expect(sharedStyles).toMatch(/\.horizontal-fixed-tabs-scroll\.wrap-mode\.classic-wrap\s*\{[^}]*row-gap:\s*0\.25rem !important;/s);
     expect(sharedStyles).toMatch(/\.app-tab-bar\.classic-tab-layout:not\(\.vertical-tab-layout\):not\(:has\(\.wrap-mode\)\) \.tab-group-entry\s*\{[^}]*height:\s*100%;[^}]*max-height:\s*none;/s);
     expect(sharedStyles).toMatch(/\.app-tab-bar:not\(\.vertical-tab-layout\):has\(\.wrap-mode\) \.tab-group-entry:has\(\.tab-group-tab\)::after\s*\{[^}]*bottom:\s*0;/s);
+    expect(sharedStyles).toMatch(/\.app-tab-bar\.classic-tab-layout:not\(\.vertical-tab-layout\):not\(:has\(\.wrap-mode\)\)\[data-placement="top"\] \.app-tab-pill\s*\{[^}]*border-top-width:\s*0;/s);
     expect(sharedStyles).toContain("scroll-margin-inline-end: 1px;");
   });
 
diff --git a/apps/desktop/src/components/layout/appTabBar.css b/apps/desktop/src/components/layout/appTabBar.css
index 0b73e04070..ac37912b15 100644
--- a/apps/desktop/src/components/layout/appTabBar.css
+++ b/apps/desktop/src/components/layout/appTabBar.css
@@ -670,6 +670,12 @@
   border-left-color: transparent;
 }
 
+/* The app toolbar already supplies the shared top edge. Pills must not draw
+ * a second line against it in the classic top placement. */
+.app-tab-bar.classic-tab-layout:not(.vertical-tab-layout):not(:has(.wrap-mode))[data-placement="top"] .app-tab-pill {
+  border-top-width: 0;
+}
+
 .app-tab-bar:not(.vertical-tab-layout) .tab-group-header:hover .tab-group-header-content,
 .app-tab-bar:not(.vertical-tab-layout) .tab-group-header--active .tab-group-header-content {
   background: color-mix(in srgb, var(--tab-group-color) 18%, transparent);