From 6be176b4e3abff43c489f07a02ebd2a4f0517bfc 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 | 2 +-
 plugins/outline/src/app.tsx     | 9 ++++++++-
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/apps/core/src/atoms/settings.ts b/apps/core/src/atoms/settings.ts
index 10b430f003..6ea4af9177 100644
--- a/apps/core/src/atoms/settings.ts
+++ b/apps/core/src/atoms/settings.ts
@@ -49,7 +49,7 @@ export const fontStyleOptions = [
 }[];
 
 const appSettingBaseAtom = atomWithStorage<AppSetting>('affine-settings', {
-  clientBorder: environment.isDesktop ? !environment.isWindows : false,
+  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 55e6736c5f..328352df5c 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);