Upload app.py

app.py

@@ -477,49 +477,37 @@ body, .gradio-container {
 }
 """
 
-# Create the interface with password protection
+# Create the interface with custom login that SHOWS the boxes
 def create_interface():
     with gr.Blocks(css=modern_css, title="Python to C++ Code Optimizer", theme=gr.themes.Soft()) as app:
-        authorized = gr.State(False)
-        BANNER_URL = os.getenv("BANNER_URL", "")
-        BACKGROUND_URL = os.getenv("BACKGROUND_URL", "")
-        # Intentionally not rendering a banner image to avoid empty placeholders
-
+        
         def check_password(pw):
-            ok = pw == APP_PASSWORD
-            return (
-                gr.update(visible=not ok),  # login hidden when ok
-                gr.update(visible=ok),      # main shown when ok
-                gr.update(value="" if ok else "Invalid password", visible=not ok)
-            )
-
-        # Login gate
-        with gr.Group(visible=True) as login_group:
+            if pw == APP_PASSWORD:
+                return gr.update(visible=False), gr.update(visible=True), gr.update(visible=False)
+            else:
+                return gr.update(visible=True), gr.update(visible=False), gr.update(value="❌ Wrong password", visible=True)
+        
+        # Login Section - NO HTML wrapper around Gradio components!
+        with gr.Column(visible=True, elem_classes=["login-wrapper"]) as login_group:
             gr.HTML("""
-            <div class="login-wrapper">
-                <div class="login-card">
-                    <div class="login-icon">🔐</div>
-                    <div class="login-title">Private Access</div>
-                    <div class="login-subtitle">Enter password to continue</div>
+            <div style="text-align: center; margin: 60px auto 40px; max-width: 400px;">
+                <div style="font-size: 56px; margin-bottom: 16px;">🔐</div>
+                <div style="font-size: 28px; font-weight: 700; color: #1f2937; margin-bottom: 8px;">Private Access</div>
+                <div style="font-size: 15px; color: #6b7280; margin-bottom: 32px;">Enter password to continue</div>
+            </div>
             """)
             pw = gr.Textbox(
-                label="Password", 
-                type="password", 
-                placeholder="Enter password", 
-                elem_classes=["login-input"],
+                label="Password",
+                type="password",
+                placeholder="Enter password",
+                scale=1,
                 container=True
             )
-            login_btn = gr.Button("Continue", elem_classes=["modern-button"], size="lg")
-            login_error = gr.Markdown(visible=False, elem_classes=["login-error"])
-            gr.HTML("""
-                    <div class="freepik-credit">Background design inspired by <a href="https://www.freepik.com" target="_blank">Freepik</a></div>
-                </div>
-            </div>
-            """)
-
-        # Main UI wrapped for toggling visibility
-        with gr.Group(visible=False) as main_group:
-            main_group.elem_id = "main_group"
+            login_btn = gr.Button("Continue", variant="primary", size="lg")
+            login_error = gr.Markdown("", visible=False)
+        
+        # Main App Section
+        with gr.Column(visible=False) as main_group:
             # Header Section
             gr.HTML("""
             <div class="modern-header">
@@ -613,8 +601,8 @@ def create_interface():
                 inputs=cpp_output,
                 outputs=cpp_execution_output
             )
-
-        # Bind login after main_group is defined
+        
+        # Connect login button
         login_btn.click(
             fn=check_password,
             inputs=[pw],
@@ -638,7 +626,7 @@ if __name__ == "__main__":
     if is_huggingface:
         # Hugging Face Spaces configuration
         print("🚀 Launching Python to C++ Code Optimizer on Hugging Face Spaces")
-        print("🔐 Password protection enabled")
+        print("🔐 Custom in-app password protection enabled")
         app.launch(
             show_error=True
         )
@@ -658,7 +646,7 @@ if __name__ == "__main__":
         
         port = get_available_port()
         print(f"🚀 Launching Python to C++ Code Optimizer on port: {port}")
-        print(f"🔐 Password protection enabled. Password: {APP_PASSWORD}")
+        print(f"🔐 Custom in-app password protection enabled. Password: {APP_PASSWORD}")
         
         app.launch(
             server_name="127.0.0.1",