From 0da48660f42c4c23207a08812408e5b4b6ed133f Mon Sep 17 00:00:00 2001
From: Tianyang <tianyanggong17@gmail.com>
Date: Sat, 1 Aug 2026 18:59:44 +0800
Subject: [PATCH] fix: apply sidebar class for fixed width and document-editor
 flex layout for scrolling

---
 frontend/src/components/DocumentEditor.tsx | 2 +-
 frontend/src/components/FileExplorer.tsx   | 2 +-
 frontend/src/styles.css                    | 8 ++++++++
 3 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/DocumentEditor.tsx b/frontend/src/components/DocumentEditor.tsx
index f03a610..893970a 100644
--- a/frontend/src/components/DocumentEditor.tsx
+++ b/frontend/src/components/DocumentEditor.tsx
@@ -96,7 +96,7 @@ export default function DocumentEditor({ documentKey, onDirtyChange, onDeleted }
   }
 
   return (
-    <div data-testid="document-editor">
+    <div className="document-editor" data-testid="document-editor">
       <div className="doc-header">
         <div className="doc-path">
           <span className="current">{documentKey}</span>
diff --git a/frontend/src/components/FileExplorer.tsx b/frontend/src/components/FileExplorer.tsx
index 50528cd..eaf96fc 100644
--- a/frontend/src/components/FileExplorer.tsx
+++ b/frontend/src/components/FileExplorer.tsx
@@ -26,7 +26,7 @@ export default function FileExplorer({ onSelectFile, selectedKey, refreshKey }:
   }
 
   return (
-    <div data-testid="file-explorer">
+    <div className="sidebar" data-testid="file-explorer">
       {folders.map((folder) => (
         <FolderNode key={folder} name={folder} path={folder} onSelectFile={onSelectFile} selectedKey={selectedKey} />
       ))}
diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index 768a470..490482d 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -322,6 +322,14 @@ body {
   display: flex;
   flex-direction: column;
   min-width: 0;
+  overflow: hidden;
+}
+
+.document-editor {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
 }
 
 .empty-state {