feat: improve copilot (#2758)

apps/web/src/components/page-detail-editor.css.ts

@@ -1,5 +1,6 @@
-import { globalStyle } from '@vanilla-extract/css';
+import { style } from '@vanilla-extract/css';
 
-globalStyle('.mosaic.mosaic-blueprint-theme', {
-  backgroundColor: 'var(--background-color)',
+export const pluginContainer = style({
+  height: '100%',
+  width: '100%',
 });

apps/web/src/components/page-detail-editor.tsx

@@ -34,6 +34,7 @@ import { pageSettingFamily } from '../atoms';
 import { contentLayoutAtom } from '../atoms/layout';
 import type { AffineOfficialWorkspace } from '../shared';
 import { BlockSuiteEditor as Editor } from './blocksuite/block-suite-editor';
+import { pluginContainer } from './page-detail-editor.css';
 
 export type PageDetailEditorProps = {
   isPublic?: boolean;
@@ -122,7 +123,7 @@ const PluginContentAdapter = memo<{
   detailContent: PluginUIAdapter['detailContent'];
 }>(function PluginContentAdapter({ detailContent }) {
   return (
-    <div>
+    <div className={pluginContainer}>
       {detailContent({
         contentLayoutAtom,
       })}
@@ -153,7 +154,12 @@ const LayoutPanel = memo(function LayoutPanel(
     }
   } else {
     return (
-      <PanelGroup direction={node.direction}>
+      <PanelGroup
+        style={{
+          height: 'calc(100% - 52px)',
+        }}
+        direction={node.direction}
+      >
         <Panel defaultSize={node.splitPercentage}>
           <Suspense>
             <LayoutPanel