update all

json_formatter.html

@@ -15,12 +15,12 @@
         font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
         margin: 0;
         padding: 0;
-        background: white;
         color: #333;
+        overflow: hidden;
       }
 
       .container {
-        width: 100%;
+        width: 100vw;
         height: 100vh;
         display: flex;
         flex-direction: column;
@@ -28,9 +28,10 @@
 
       .header {
         background: #f5f5f5;
-        padding: 20px;
+        padding: 15px 20px;
         text-align: center;
         border-bottom: 1px solid #ddd;
+        flex-shrink: 0;
       }
 
       .header h1 {
@@ -46,7 +47,7 @@
       }
 
       .controls {
-        padding: 15px 20px;
+        padding: 10px 15px;
         background: #f9f9f9;
         border-bottom: 1px solid #ddd;
         display: flex;
@@ -54,6 +55,7 @@
         align-items: center;
         flex-wrap: wrap;
         gap: 10px;
+        flex-shrink: 0;
       }
 
       .control-group {
@@ -110,7 +112,8 @@
 
       .editor-container {
         display: flex;
-        height: 600px;
+        flex: 1;
+        min-height: 400px;
       }
 
       .editor-panel {
@@ -195,12 +198,13 @@
       .status-bar {
         background: #f5f5f5;
         border-top: 1px solid #ddd;
-        padding: 8px 15px;
+        padding: 6px 15px;
         display: flex;
         justify-content: space-between;
         align-items: center;
         font-size: 12px;
         color: #666;
+        flex-shrink: 0;
       }
 
       .char-count {