Merge branch 'dev' of ssh://git.commumedia.org:2222/alex/headquarter into dev

apps/web/src/components/terminal.tsx

@@ -216,17 +216,29 @@ export const TerminalComponent: React.FC<TerminalProps> = ({
 
     // Fit terminal and notify backend
     const fitTerminal = () => {
-      if (!fitAddonRef.current || !termRef.current) return;
+      if (!fitAddonRef.current || !termRef.current) {
+        console.log('[Terminal] fitTerminal: refs not ready');
+        return;
+      }
       const oldCols = termRef.current.cols;
       const oldRows = termRef.current.rows;
+      
+      console.log('[Terminal] fitTerminal called, container dims:', container?.offsetWidth, container?.offsetHeight);
+      
       fitAddonRef.current.fit();
       const { cols, rows } = termRef.current;
-      // Force refresh if dimensions changed
-      if (cols !== oldCols || rows !== oldRows) {
-        termRef.current.refresh(0, rows - 1);
-      }
+      console.log('[Terminal] fitTerminal result:', cols, rows, '(was:', oldCols, oldRows + ')');
+      
+      // Always refresh on initial load or when dimensions change
+      requestAnimationFrame(() => {
+        termRef.current?.refresh(0, rows - 1);
+      });
+      
       if (ws.readyState === WebSocket.OPEN) {
+        console.log('[Terminal] Sending resize:', cols, rows);
         ws.send(JSON.stringify({ type: "resize", cols, rows }));
+      } else {
+        console.log('[Terminal] WebSocket not open, state:', ws.readyState);
       }
     };
 
@@ -284,6 +296,19 @@ export const TerminalComponent: React.FC<TerminalProps> = ({
     });
     resizeObserver.observe(container);
 
+    // Also listen for window resize as fallback (ResizeObserver might miss some cases)
+    let windowResizeTimeout: ReturnType<typeof setTimeout>;
+    const handleWindowResize = () => {
+      clearTimeout(windowResizeTimeout);
+      windowResizeTimeout = setTimeout(() => {
+        requestAnimationFrame(() => {
+          if (!container.isConnected) return;
+          fitTerminal();
+        });
+      }, 250);
+    };
+    window.addEventListener("resize", handleWindowResize);
+
     // Refit after mobile header auto-hides (3s delay + 0.3s transition)
     const headerHideTimeout = setTimeout(() => {
       fitTerminal();
@@ -316,8 +341,10 @@ export const TerminalComponent: React.FC<TerminalProps> = ({
 
     return () => {
       clearTimeout(resizeTimeout);
+      clearTimeout(windowResizeTimeout);
       clearTimeout(headerHideTimeout);
       resizeObserver.disconnect();
+      window.removeEventListener("resize", handleWindowResize);
       document.removeEventListener("visibilitychange", handleVisibilityChange);
       if (ws) {
         ws.close();

apps/web/src/styles.css

@@ -3220,21 +3220,15 @@ a.nav-item,
   position: relative;
 }
 
-/* xterm fills container */
+/* xterm fills container - reset position for mobile */
 .terminal-wrapper.mobile .terminal-container .xterm {
+  position: relative !important;
+  top: auto !important;
+  left: auto !important;
+  right: auto !important;
+  bottom: auto !important;
   width: 100%;
   height: 100%;
-  max-height: 100%;
-  display: flex;
-  flex-direction: column;
-}
-
-.terminal-wrapper.mobile .terminal-container .xterm-viewport {
-  flex: 1;
-  width: 100% !important;
-  height: 100% !important;
-  max-height: 100% !important;
-  overflow-y: auto !important;
 }
 
 /* Special Keys Strip */