Update app.py

app.py

@@ -218,30 +218,8 @@ body {
 
 # Interface Gradio
 # Interface Gradio
-def toggle_visibility(is_hidden):
-    if is_hidden:
-        # CSS para mostrar a barra
-        css = """
-        <style>
-        header.from-gray-50-to-white.relative.z-40.border-b.border-gray-100.bg-gradient-to-t.via-white.pt-0\\.5.dark\\:via-gray-950 {
-            display: flex !important;
-        }
-        </style>
-        """
-        btn_text = "Ocultar Barra"
-    else:
-        # CSS para ocultar a barra
-        css = """
-        <style>
-        header.from-gray-50-to-white.relative.z-40.border-b.border-gray-100.bg-gradient-to-t.via-white.pt-0\\.5.dark\\:via-gray-950 {
-            display: none !important;
-        }
-        </style>
-        """
-        btn_text = "Mostrar Barra"
-    return css, btn_text, not is_hidden
-
 def demo():
+    # CSS básico
     custom_css = """
         #banner {
             display: none !important;
@@ -249,44 +227,52 @@ def demo():
         footer {
             display: none !important;
         }
-        .cover-button {
-            position: fixed !important;
-            top: 10px !important;
-            right: 10px !important;
-            z-index: 9999 !important;
-            font-size: 14px !important;
-            padding: 8px 16px !important;
-            background-color: #2563eb !important;
-            color: white !important;
-            border: none !important;
-            border-radius: 6px !important;
-            cursor: pointer !important;
-            transition: background-color 0.2s !important;
-        }
-        .cover-button:hover {
-            background-color: #1d4ed8 !important;
+    """
+
+    # JavaScript para controlar a barra
+    control_script = """
+        <script>
+        function hideHeader() {
+            let header = document.querySelector('header.from-gray-50-to-white');
+            if (header) {
+                if (header.style.display === 'none') {
+                    header.style.display = 'flex';
+                    document.getElementById('toggle_btn').textContent = 'Ocultar Barra';
+                } else {
+                    header.style.display = 'none';
+                    document.getElementById('toggle_btn').textContent = 'Mostrar Barra';
+                }
+            }
         }
+        </script>
+        <button id="toggle_btn" 
+                onclick="hideHeader()" 
+                style="position: fixed; 
+                       top: 10px; 
+                       right: 10px; 
+                       z-index: 9999; 
+                       background: #2563eb;
+                       color: white; 
+                       padding: 8px 16px; 
+                       border: none; 
+                       border-radius: 4px; 
+                       cursor: pointer;
+                       font-size: 14px;">
+            Ocultar Barra
+        </button>
     """
 
     with gr.Blocks(theme=gr.themes.Default(primary_hue="blue", secondary_hue="gray"), css=custom_css) as demo:
-        with gr.Row():
-            css_html = gr.HTML("")  # Para injetar o CSS dinamicamente
-            toggle_btn = gr.Button("Ocultar Barra", elem_classes="cover-button")
-            is_hidden = gr.State(False)
-            
-        # Conectar o evento do botão
-        toggle_btn.click(
-            fn=toggle_visibility,
-            inputs=[is_hidden],
-            outputs=[css_html, toggle_btn, is_hidden],
-            show_progress=False
-        )
-
+        # Adiciona o script e botão de controle
+        gr.HTML(control_script)
+        
         # Estado do sistema
         vector_db = gr.State()
         qa_chain = gr.State()
         collection_name = gr.State()
 
+        # Resto do seu código continua igual...
+    
         # Cabeçalho
         gr.Markdown(
             """<center><h2>Chatbot baseado em PDF</center></h2>