Update app.py

app.py

@@ -97,128 +97,8 @@ Format your answer with clear headings and subheadings. Use markdown formatting
     except Exception as e:
         return f"Error: {str(e)}"
 
-# Custom CSS for dark mode toggle and styling
-custom_css = """
-.dark-mode {
-    --color-background: #1a1a1a;
-    --color-text: #ffffff;
-    --color-border: #444444;
-    --color-accent: #3d85c6;
-    --color-input-background: #2d2d2d;
-    --color-button: #3d85c6;
-    --color-button-hover: #5699d8;
-}
-
-.light-mode {
-    --color-background: #ffffff;
-    --color-text: #333333;
-    --color-border: #dddddd;
-    --color-accent: #2e67a9;
-    --color-input-background: #f9f9f9;
-    --color-button: #2e67a9;
-    --color-button-hover: #4a7dbd;
-}
-
-body.dark-mode {
-    background-color: var(--color-background);
-    color: var(--color-text);
-}
-
-body.light-mode {
-    background-color: var(--color-background);
-    color: var(--color-text);
-}
-
-.theme-toggle {
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-    padding: 8px 16px;
-}
-
-.theme-toggle button {
-    background-color: var(--color-button);
-    color: white;
-    border: none;
-    padding: 8px 16px;
-    border-radius: 4px;
-    cursor: pointer;
-    transition: background-color 0.3s;
-}
-
-.theme-toggle button:hover {
-    background-color: var(--color-button-hover);
-}
-
-.gradio-container {
-    background-color: var(--color-background) !important;
-    color: var(--color-text) !important;
-}
-
-.dark-mode .gradio-container textarea,
-.dark-mode .gradio-container input {
-    background-color: var(--color-input-background) !important;
-    color: var(--color-text) !important;
-    border-color: var(--color-border) !important;
-}
-
-.dark-mode .gradio-markdown {
-    color: var(--color-text) !important;
-}
-
-.dark-mode .gradio-button {
-    background-color: var(--color-button) !important;
-}
-
-.dark-mode .gradio-button:hover {
-    background-color: var(--color-button-hover) !important;
-}
-"""
-
-# JavaScript for theme toggle functionality
-theme_toggle_js = """
-function toggleTheme() {
-    const body = document.body;
-    if (body.classList.contains('light-mode')) {
-        body.classList.remove('light-mode');
-        body.classList.add('dark-mode');
-        localStorage.setItem('theme', 'dark');
-        document.getElementById('theme-toggle-btn').textContent = '☀️ Light Mode';
-    } else {
-        body.classList.remove('dark-mode');
-        body.classList.add('light-mode');
-        localStorage.setItem('theme', 'light');
-        document.getElementById('theme-toggle-btn').textContent = '🌙 Dark Mode';
-    }
-}
-
-document.addEventListener('DOMContentLoaded', function() {
-    const savedTheme = localStorage.getItem('theme') || 'light';
-    document.body.classList.add(savedTheme + '-mode');
-    
-    const themeToggleBtn = document.getElementById('theme-toggle-btn');
-    if (themeToggleBtn) {
-        themeToggleBtn.textContent = savedTheme === 'dark' ? '☀️ Light Mode' : '🌙 Dark Mode';
-        themeToggleBtn.addEventListener('click', toggleTheme);
-    }
-});
-"""
-
-# Create a Gradio interface with theme support
-with gr.Blocks(title="Competitive Programming Assistant", 
-               theme=gr.themes.Soft(), 
-               css=custom_css) as app:
-    
-    # Add JavaScript for theme toggle
-    gr.HTML(f"""
-    <script>
-    {theme_toggle_js}
-    </script>
-    <div class="theme-toggle">
-        <button id="theme-toggle-btn">🌙 Dark Mode</button>
-    </div>
-    """)
-    
+# Create a Gradio interface
+with gr.Blocks(title="Competitive Programming Assistant", theme=gr.themes.Soft()) as app:
     gr.Markdown("""
     # 🏆 Competitive Programming Assistant
     
@@ -289,30 +169,6 @@ with gr.Blocks(title="Competitive Programming Assistant",
         inputs=[problem_input, language, api_key_input],
         outputs=solution_output
     )
-    
-    # Initialize theme based on user preference or system default
-    gr.HTML("""
-    <script>
-        document.addEventListener('DOMContentLoaded', function() {
-            const prefersDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
-            const savedTheme = localStorage.getItem('theme');
-            
-            if (savedTheme) {
-                document.body.classList.add(savedTheme + '-mode');
-                if (savedTheme === 'dark') {
-                    document.getElementById('theme-toggle-btn').textContent = '☀️ Light Mode';
-                }
-            } else if (prefersDarkMode) {
-                document.body.classList.add('dark-mode');
-                localStorage.setItem('theme', 'dark');
-                document.getElementById('theme-toggle-btn').textContent = '☀️ Light Mode';
-            } else {
-                document.body.classList.add('light-mode');
-                localStorage.setItem('theme', 'light');
-            }
-        });
-    </script>
-    """)
 
 # Launch the app
 if __name__ == "__main__":