Update app.py

app.py

@@ -657,10 +657,6 @@ use_web_search = gr.Checkbox(label="Use Web Search", value=False)
 
 custom_placeholder = "Ask a question (Note: You can toggle between Web Search and PDF Chat in Additional Inputs below)"
 
-# Update the demo interface
-# Update the Gradio interface
-import gradio as gr
-
 # Define a custom CSS for dark mode
 dark_mode_css = """
 .dark-mode {
@@ -676,6 +672,14 @@ dark_mode_css = """
 }
 """
 
+# JavaScript to toggle dark mode
+dark_mode_js = """
+function toggleDarkMode() {
+    document.body.classList.toggle('dark-mode');
+    return document.body.classList.contains('dark-mode');
+}
+"""
+
 # Create a function to toggle dark mode
 def toggle_dark_mode(dark_mode):
     return not dark_mode, gr.update(value="Light Mode" if dark_mode else "Dark Mode")
@@ -776,20 +780,8 @@ with demo:
     dark_mode_button.click(
         toggle_dark_mode,
         inputs=[dark_mode],
-        outputs=[dark_mode, dark_mode_button]
-    )
-    
-    # Add a function to update the CSS classes based on dark mode state
-    def update_dark_mode(dark_mode):
-        return {
-            "body": "dark-mode" if dark_mode else "",
-            ".gradio-container": "dark-mode" if dark_mode else "",
-        }
-    
-    dark_mode.change(
-        update_dark_mode,
-        inputs=[dark_mode],
-        outputs=[gr.HTMLClasses()]
+        outputs=[dark_mode, dark_mode_button],
+        _js=dark_mode_js
     )
 
 if __name__ == "__main__":