refactor: Modularize UI components and utilities

- Extract UI components into separate JS files
- Centralize configuration values in config.js
- Introduce a dedicated logger module
- Improve file tree drag-and-drop and undo functionality
- Refactor modal handling to a single manager
- Add URL routing support for SPA navigation
- Implement view mode for read-only access

static/css/editor.css

@@ -6,6 +6,8 @@
     display: flex;
     gap: 10px;
     align-items: center;
+    flex-shrink: 0;
+    /* Prevent header from shrinking */
 }
 
 .editor-header input {
@@ -19,18 +21,42 @@
 
 .editor-container {
     flex: 1;
+    /* Take remaining space */
     overflow: hidden;
+    /* Prevent container overflow, CodeMirror handles its own scrolling */
+    display: flex;
+    flex-direction: column;
+    min-height: 0;
+    /* Important: allows flex child to shrink below content size */
+    position: relative;
+}
+
+#editor {
+    flex: 1;
+    /* Take all available space */
+    min-height: 0;
+    /* Allow shrinking */
+    overflow: hidden;
+    /* CodeMirror will handle scrolling */
 }
 
 /* CodeMirror customization */
 .CodeMirror {
-    height: 100%;
+    height: 100% !important;
+    /* Force full height */
     font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
     font-size: 14px;
     background-color: var(--bg-primary);
     color: var(--text-primary);
 }
 
+.CodeMirror-scroll {
+    overflow-y: auto !important;
+    /* Ensure vertical scrolling is enabled */
+    overflow-x: auto !important;
+    /* Ensure horizontal scrolling is enabled */
+}
+
 body.dark-mode .CodeMirror {
     background-color: #1c2128;
     color: #e6edf3;
@@ -71,5 +97,4 @@ body.dark-mode .CodeMirror-gutters {
     color: var(--info-color);
     pointer-events: none;
     z-index: 1000;
-}
-
+}