Update app.py

app.py

@@ -470,50 +470,71 @@ with gr.Blocks(title="CLIP-ViT Image Analyzer", theme=gr.themes.Soft()) as demo:
     """
     
     # Add this JavaScript separately
+    # javascript = """
+    # <script>
+    # document.addEventListener('DOMContentLoaded', function() {
+    #     // Force container height immediately
+    #     const forceHeight = function() {
+    #         const containers = document.querySelectorAll('.gradio-container, .container, #blocks-container');
+    #         containers.forEach(container => {
+    #             container.style.height = '100vh';
+    #             container.style.maxHeight = '100vh';
+    #             container.style.overflowY = 'auto';
+    #         });
+    #     };
+        
+    #     // Run immediately
+    #     forceHeight();
+        
+    #     // Run again after a short delay to catch dynamic content
+    #     setTimeout(forceHeight, 100);
+    #     setTimeout(forceHeight, 500);
+        
+    #     // Monitor for ANY DOM changes
+    #     const observer = new MutationObserver(function(mutations) {
+    #         forceHeight();
+    #         // Constrain any new elements
+    #         mutations.forEach(function(mutation) {
+    #             mutation.addedNodes.forEach(function(node) {
+    #                 if (node.nodeType === 1) {
+    #                     node.style.maxHeight = '100%';
+    #                     if (node.querySelectorAll) {
+    #                         node.querySelectorAll('*').forEach(child => {
+    #                             child.style.maxHeight = '100%';
+    #                         });
+    #                     }
+    #                 }
+    #             });
+    #         });
+    #     });
+        
+    #     observer.observe(document.body, { 
+    #         childList: true, 
+    #         subtree: true,
+    #         attributes: true,
+    #         attributeFilter: ['style', 'class']
+    #     });
+    # });
+    # </script>
     javascript = """
     <script>
     document.addEventListener('DOMContentLoaded', function() {
-        // Force container height immediately
-        const forceHeight = function() {
-            const containers = document.querySelectorAll('.gradio-container, .container, #blocks-container');
-            containers.forEach(container => {
-                container.style.height = '100vh';
-                container.style.maxHeight = '100vh';
+    const stopExpansion = function() {
+        // More aggressive containment
+        document.body.style.maxHeight = '100vh';
+        document.body.style.overflow = 'hidden';
+        
+        const containers = document.querySelectorAll('div');
+        containers.forEach(container => {
+            if (container.scrollHeight > window.innerHeight) {
+                container.style.maxHeight = '95vh';
                 container.style.overflowY = 'auto';
-            });
-        };
-        
-        // Run immediately
-        forceHeight();
-        
-        // Run again after a short delay to catch dynamic content
-        setTimeout(forceHeight, 100);
-        setTimeout(forceHeight, 500);
-        
-        // Monitor for ANY DOM changes
-        const observer = new MutationObserver(function(mutations) {
-            forceHeight();
-            // Constrain any new elements
-            mutations.forEach(function(mutation) {
-                mutation.addedNodes.forEach(function(node) {
-                    if (node.nodeType === 1) {
-                        node.style.maxHeight = '100%';
-                        if (node.querySelectorAll) {
-                            node.querySelectorAll('*').forEach(child => {
-                                child.style.maxHeight = '100%';
-                            });
-                        }
-                    }
-                });
-            });
-        });
-        
-        observer.observe(document.body, { 
-            childList: true, 
-            subtree: true,
-            attributes: true,
-            attributeFilter: ['style', 'class']
+            }
         });
+    };
+    
+    stopExpansion();
+    setInterval(stopExpansion, 1000); // Keep checking every second
     });
     </script>
     """