fix: layout

AElfProject · Jul 23, 2024 · 58c4c0e · 58c4c0e
1 parent 5fa79b9
commit 58c4c0e
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 15 deletions.
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -4,6 +4,7 @@ import "./globals.css";
 import { ThemeProvider } from "@/components/theme-provider";
 import { PropsWithChildren } from "react";
 import TopMenu from "@/components/top-menu";
+import clsx from "clsx";
 
 const font = Poppins({
   weight: ["100", "200", "300", "400", "500", "600", "700", "800", "900"],
@@ -18,15 +19,15 @@ export const metadata: Metadata = {
 export default function RootLayout({ children }: PropsWithChildren) {
   return (
     <html lang="en">
-      <body className={font.className}>
+      <body className={clsx(font.className, "overflow-hidden")}>
         <ThemeProvider
           attribute="class"
           defaultTheme="system"
           enableSystem
           disableTransitionOnChange
         >
           <TopMenu />
-          {children}
+          <main className="h-[calc(100vh-66px)] overflow-auto">{children}</main>
         </ThemeProvider>
       </body>
     </html>

diff --git a/app/workspace/[id]/page.tsx b/app/workspace/[id]/page.tsx
@@ -10,16 +10,14 @@ import FileExplorer from "@/components/workspace/file-explorer";
 
 export default function Page() {
   return (
-    <div className="h-[calc(100vh-40px)]">
-      <ResizablePanelGroup direction="horizontal" className="border">
-        <ResizablePanel defaultSize={25}>
-          <TopBottom top={<FileExplorer />} bottom={<p>Chat component</p>} />
-        </ResizablePanel>
-        <ResizableHandle />
-        <ResizablePanel defaultSize={75}>
-          <TopBottom top={<Editor />} bottom={<Cli />} />
-        </ResizablePanel>
-      </ResizablePanelGroup>
-    </div>
+    <ResizablePanelGroup direction="horizontal" className="border">
+      <ResizablePanel defaultSize={25}>
+        <TopBottom top={<FileExplorer />} bottom={<p>Chat component</p>} />
+      </ResizablePanel>
+      <ResizableHandle />
+      <ResizablePanel defaultSize={75}>
+        <TopBottom top={<Editor />} bottom={<Cli />} />
+      </ResizablePanel>
+    </ResizablePanelGroup>
   );
 }
diff --git a/app/workspaces/page.tsx b/app/workspaces/page.tsx
@@ -5,7 +5,7 @@ import { getTemplateNames } from "@/data/template";
 export default async function Page() {
   const templateOptions = await getTemplateNames();
   return (
-    <main className="container grid grid-cols-1 gap-8 px-4 py-12 md:grid-cols-3 md:gap-12 md:px-6 lg:py-16">
+    <div className="container grid grid-cols-1 gap-8 px-4 py-12 md:grid-cols-3 md:gap-12 md:px-6 lg:py-16">
       <div>
         <h1 className="text-2xl mb-2">Create a new workspace</h1>
         <WorkspaceForm templateOptions={templateOptions} />
@@ -14,6 +14,6 @@ export default async function Page() {
         <h1 className="text-2xl mb-2">Open an existing workspace</h1>
         <Existing />
       </div>
-    </main>
+    </div>
   );
 }