From 08067320f8a2651d9bbffbdd7dbf9061fdae617f Mon Sep 17 00:00:00 2001
From: zipg <geeky@foxmail.com>
Date: Wed, 8 Jul 2026 22:51:33 +0800
Subject: [PATCH] fix(desktop): restore Windows top border

---
 apps/desktop/src/App.vue                       |  4 +++-
 .../__tests__/useWindowControls.spec.ts        |  8 +++++++-
 .../src/composables/useWindowControls.ts       |  4 ++++
 apps/desktop/src/styles/globals.css            | 18 ++++++++++++++++++
 4 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/apps/desktop/src/App.vue b/apps/desktop/src/App.vue
index 40728d491..6f921da53 100644
--- a/apps/desktop/src/App.vue
+++ b/apps/desktop/src/App.vue
@@ -31,6 +31,7 @@ import { useTauriEvents } from "@/composables/useTauriEvents";
 import { useCloseActionPrompt, type AppCloseAction, type AppCloseRequestOptions } from "@/composables/useCloseActionPrompt";
 import { useVisibilityChange } from "@/composables/useVisibilityChange";
 import { useWebDavAutoUpload } from "@/composables/useWebDavAutoUpload";
+import { shouldDrawDesktopWindowFrame } from "@/composables/useWindowControls";
 import "@/i18n";
 import { translateBackendError } from "@/i18n/backend-errors";
 import * as api from "@/lib/backend/api";
@@ -113,6 +114,7 @@ const { checkingUpdates, updateInfo, updateCheckMessage, showUpdateDialog, isDow
 const { setupFileDrop } = useFileDrop();
 
 const isDesktop = isTauriRuntime();
+const drawDesktopWindowFrame = shouldDrawDesktopWindowFrame(isMacOS(), isDesktop);
 const UPDATE_CHECK_INTERVAL_MS = 60 * 60 * 1000;
 let updateCheckTimer: ReturnType<typeof setInterval> | undefined;
 const needsAuth = ref(!isDesktop);
@@ -1719,7 +1721,7 @@ onUnmounted(() => {
   <LoginPage v-if="setupRequired || (needsAuth && !authenticated)" :setup-mode="setupRequired" @authenticated="onLoginSuccess" />
   <div v-show="!setupRequired && (!needsAuth || authenticated)" class="fixed inset-0 h-screen w-screen overflow-hidden">
     <TooltipProvider :delay-duration="300">
-      <div class="h-screen w-screen max-w-full min-w-[760px] min-h-[600px] flex flex-col bg-background text-foreground overflow-hidden" :style="appUiFontFamilyStyle">
+      <div class="h-screen w-screen max-w-full min-w-[760px] min-h-[600px] flex flex-col bg-background text-foreground overflow-hidden" :class="{ 'dbx-desktop-window-frame': drawDesktopWindowFrame }" :style="appUiFontFamilyStyle">
         <AppToolbar
           :is-dark="isDark"
           :theme-mode="themeMode"
diff --git a/apps/desktop/src/composables/__tests__/useWindowControls.spec.ts b/apps/desktop/src/composables/__tests__/useWindowControls.spec.ts
index 12850155f..6cd19c2da 100644
--- a/apps/desktop/src/composables/__tests__/useWindowControls.spec.ts
+++ b/apps/desktop/src/composables/__tests__/useWindowControls.spec.ts
@@ -1,5 +1,5 @@
 import { describe, expect, it } from "vitest";
-import { shouldReserveMacTrafficLightInset, shouldShowWindowControls } from "@/composables/useWindowControls";
+import { shouldDrawDesktopWindowFrame, shouldReserveMacTrafficLightInset, shouldShowWindowControls } from "@/composables/useWindowControls";
 
 describe("window controls", () => {
   it("shows custom controls for non-macOS desktop windows", () => {
@@ -14,6 +14,12 @@ describe("window controls", () => {
     expect(shouldShowWindowControls(false, false)).toBe(false);
   });
 
+  it("draws an app frame only for self-decorated desktop windows", () => {
+    expect(shouldDrawDesktopWindowFrame(false, true)).toBe(true);
+    expect(shouldDrawDesktopWindowFrame(true, true)).toBe(false);
+    expect(shouldDrawDesktopWindowFrame(false, false)).toBe(false);
+  });
+
   it("reserves traffic light inset only for non-fullscreen macOS desktop windows", () => {
     expect(shouldReserveMacTrafficLightInset(true, false, true)).toBe(true);
     expect(shouldReserveMacTrafficLightInset(true, true, true)).toBe(false);
diff --git a/apps/desktop/src/composables/useWindowControls.ts b/apps/desktop/src/composables/useWindowControls.ts
index 0917d94d7..1b5bfbd69 100644
--- a/apps/desktop/src/composables/useWindowControls.ts
+++ b/apps/desktop/src/composables/useWindowControls.ts
@@ -11,6 +11,10 @@ export function shouldShowWindowControls(isMac: boolean, isDesktop = true): bool
   return isDesktop && !isMac;
 }
 
+export function shouldDrawDesktopWindowFrame(isMac: boolean, isDesktop = true): boolean {
+  return isDesktop && !isMac;
+}
+
 export function useWindowControls() {
   const isMaximized = ref(false);
   const isFullscreen = ref(false);
diff --git a/apps/desktop/src/styles/globals.css b/apps/desktop/src/styles/globals.css
index 2dc72f27e..4688833bc 100644
--- a/apps/desktop/src/styles/globals.css
+++ b/apps/desktop/src/styles/globals.css
@@ -119,6 +119,7 @@
   --sidebar-accent-foreground: rgb(23 23 23);
   --sidebar-border: rgb(229 229 229);
   --sidebar-ring: rgb(161 161 161);
+  --dbx-window-top-border: rgb(0 0 0 / 0.35);
 }
 
 .dark {
@@ -154,6 +155,7 @@
   --sidebar-accent-foreground: rgb(221 221 226);
   --sidebar-border: rgb(110 110 114 / 0.28);
   --sidebar-ring: rgb(133 134 139);
+  --dbx-window-top-border: rgb(255 255 255 / 0.18);
 }
 
 html.theme-soft {
@@ -1314,6 +1316,22 @@ body.dbx-table-reference-dragging * {
   }
 }
 
+.dbx-desktop-window-frame {
+  position: relative;
+}
+
+.dbx-desktop-window-frame::before {
+  content: "";
+  position: absolute;
+  z-index: 80;
+  top: 0;
+  right: 0;
+  left: 0;
+  height: 1px;
+  pointer-events: none;
+  background: var(--dbx-window-top-border);
+}
+
 .dbx-editor-font-family {
   font-family: var(--dbx-editor-font-family, var(--font-mono, monospace));
 }