From af3abe8a68bd5b0423915d84df81b4fd5537be84 Mon Sep 17 00:00:00 2001
From: JimmFly <yangjinfei001@gmail.com>
Date: Fri, 1 Sep 2023 02:15:22 +0800
Subject: [PATCH] fix: the web version should not display client borders
 (#4040)

Co-authored-by: Alex Yang <himself65@outlook.com>
---
 apps/core/src/atoms/settings.ts | 3 +--
 plugins/outline/src/app.tsx     | 9 ++++++++-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/apps/core/src/atoms/settings.ts b/apps/core/src/atoms/settings.ts
index 84b4ffacef..6ea4af9177 100644
--- a/apps/core/src/atoms/settings.ts
+++ b/apps/core/src/atoms/settings.ts
@@ -1,4 +1,3 @@
-import { isDesktop } from '@affine/env/constant';
 import { atom, useAtom } from 'jotai';
 import { atomWithStorage } from 'jotai/utils';
 
@@ -50,7 +49,7 @@ export const fontStyleOptions = [
 }[];
 
 const appSettingBaseAtom = atomWithStorage<AppSetting>('affine-settings', {
-  clientBorder: isDesktop,
+  clientBorder: environment.isDesktop && globalThis.platform !== 'win32',
   fullWidthLayout: false,
   windowFrameStyle: 'frameless',
   fontStyle: 'Sans',
diff --git a/plugins/outline/src/app.tsx b/plugins/outline/src/app.tsx
index 2e3deca44e..73648a5d83 100644
--- a/plugins/outline/src/app.tsx
+++ b/plugins/outline/src/app.tsx
@@ -50,10 +50,17 @@ export const HeaderItem = ({
   const [open, setOpen] = useState(false);
   const pushLayout = useSetAtom(pushLayoutAtom);
   const deleteLayout = useSetAtom(deleteLayoutAtom);
+  const [container, setContainer] = useState<HTMLButtonElement | null>(null);
 
   return (
-    <Tooltip content={`${open ? 'Collapse' : 'Expand'} table of contents`}>
+    <Tooltip
+      content={`${open ? 'Collapse' : 'Expand'} table of contents`}
+      portalOptions={{
+        container,
+      }}
+    >
       <IconButton
+        ref={setContainer}
         onClick={useCallback(() => {
           if (!open) {
             setOpen(true);