Update app.py

app.py

@@ -634,23 +634,30 @@ button.primary:active {
 }
 """
 
-with gr.Blocks(title="Face Attendance System", theme=gr.themes.Soft(), css=custom_css) as demo:
+# Create Gradio interface - compatible with different versions
+try:
+    # Try newer Gradio version with theme
+    demo = gr.Blocks(title="Face Attendance System", theme=gr.themes.Soft(), css=custom_css)
+except TypeError:
+    # Fallback for older Gradio versions without theme support
+    demo = gr.Blocks(title="Face Attendance System", css=custom_css)
+
+with demo:
     # Header
-    gr.Markdown("# 🎯 Face Recognition Attendance System", elem_classes=["main-header"])
-    gr.Markdown("### Powered by UniFace (RetinaFace + ArcFace)", elem_classes=["sub-header"])
+    gr.Markdown("# 🎯 Face Recognition Attendance System")
+    gr.Markdown("### Powered by UniFace (RetinaFace + ArcFace)")
     
     # Camera Tab
     with gr.Tab("📷 Camera"):
         gr.Markdown("## 📷 Camera Control")
-        with gr.Row(equal_height=True):
-            start_btn = gr.Button("▶️ Start Camera", variant="primary", size="lg")
-            stop_btn = gr.Button("⏹️ Stop Camera", variant="secondary", size="lg")
-            refresh_btn = gr.Button("🔄 Refresh Preview", variant="secondary", size="lg")
+        with gr.Row():
+            start_btn = gr.Button("▶️ Start Camera", variant="primary")
+            stop_btn = gr.Button("⏹️ Stop Camera", variant="secondary")
+            refresh_btn = gr.Button("🔄 Refresh Preview", variant="secondary")
         camera_status = gr.Textbox(
             label="📡 Status", 
             interactive=False, 
-            value="📷 Camera auto-started! Click 'Refresh Preview' to see the feed.",
-            lines=1
+            value="📷 Camera auto-started! Click 'Refresh Preview' to see the feed."
         )
         preview = gr.Image(label="📺 Live Preview", interactive=False)
     
@@ -659,33 +666,29 @@ with gr.Blocks(title="Face Attendance System", theme=gr.themes.Soft(), css=custo
         gr.Markdown("## 📝 Register New User")
         gr.Markdown("*Fill in details and capture your face to register*")
         
-        with gr.Row(equal_height=True):
-            with gr.Column(scale=1):
+        with gr.Row():
+            with gr.Column():
                 gr.Markdown("### 📋 User Details")
                 name_input = gr.Textbox(
                     label="👤 Full Name", 
-                    placeholder="Enter your full name...",
-                    lines=1
+                    placeholder="Enter your full name..."
                 )
                 roll_no_input = gr.Textbox(
                     label="🔢 Roll Number / ID", 
-                    placeholder="Enter roll number or ID...",
-                    lines=1
+                    placeholder="Enter roll number or ID..."
                 )
-                register_btn = gr.Button("📸 Capture & Register", variant="primary", size="lg")
+                register_btn = gr.Button("📸 Capture & Register", variant="primary")
             
-            with gr.Column(scale=1):
+            with gr.Column():
                 gr.Markdown("### 📊 Registration Status")
                 registration_output = gr.Textbox(
                     label="ℹ️ Status", 
                     interactive=False, 
-                    lines=5,
-                    placeholder="Status will appear here..."
+                    lines=5
                 )
                 registration_image = gr.Image(
                     label="📸 Captured Face", 
-                    interactive=False,
-                    height=250
+                    interactive=False
                 )
     
     # Attendance Tab
@@ -693,30 +696,23 @@ with gr.Blocks(title="Face Attendance System", theme=gr.themes.Soft(), css=custo
         gr.Markdown("## ✅ Mark Your Attendance")
         gr.Markdown("*Click the button below to detect your face and mark attendance*")
         
-        detect_btn = gr.Button(
-            "🔍 Detect & Mark Attendance", 
-            variant="primary", 
-            size="lg"
-        )
+        detect_btn = gr.Button("🔍 Detect & Mark Attendance", variant="primary")
         
-        with gr.Row(equal_height=True):
-            with gr.Column(scale=2):
+        with gr.Row():
+            with gr.Column():
                 detection_image = gr.Image(
                     label="📸 Detection Result", 
-                    interactive=False,
-                    height=400
+                    interactive=False
                 )
-            with gr.Column(scale=1):
+            with gr.Column():
                 detection_status = gr.Textbox(
                     label="📡 Status", 
-                    interactive=False,
-                    lines=2
+                    interactive=False
                 )
                 recognized_users = gr.Textbox(
                     label="🎯 Result", 
                     lines=8, 
-                    interactive=False,
-                    placeholder="Recognition result will appear here..."
+                    interactive=False
                 )
     
     # Reports Tab
@@ -724,61 +720,55 @@ with gr.Blocks(title="Face Attendance System", theme=gr.themes.Soft(), css=custo
         gr.Markdown("## 📊 Attendance Reports & Analytics")
         
         # Filter Section
-        with gr.Row(equal_height=True):
-            with gr.Column(scale=1):
+        with gr.Row():
+            with gr.Column():
                 gr.Markdown("### 📅 Select Date Range")
                 filter_type = gr.Radio(
                     choices=["Today", "This Week", "This Month", "Custom Range", "All Time"],
                     value="Today",
-                    label="Filter Period",
-                    interactive=True
+                    label="Filter Period"
                 )
-            with gr.Column(scale=1):
+            with gr.Column():
                 gr.Markdown("### 📆 Custom Date Range")
                 start_date = gr.Textbox(
                     label="Start Date", 
-                    placeholder="YYYY-MM-DD (e.g., 2024-01-01)",
-                    lines=1
+                    placeholder="YYYY-MM-DD (e.g., 2024-01-01)"
                 )
                 end_date = gr.Textbox(
                     label="End Date", 
-                    placeholder="YYYY-MM-DD (e.g., 2024-12-31)",
-                    lines=1
+                    placeholder="YYYY-MM-DD (e.g., 2024-12-31)"
                 )
         
         # Action Buttons
         gr.Markdown("### 🎛️ Actions")
-        with gr.Row(equal_height=True):
-            filter_btn = gr.Button("🔍 Apply Filter", variant="primary", size="lg")
-            users_btn = gr.Button("👥 All Users", variant="secondary", size="lg")
-            download_btn = gr.Button("📥 Download CSV", variant="secondary", size="lg")
+        with gr.Row():
+            filter_btn = gr.Button("🔍 Apply Filter", variant="primary")
+            users_btn = gr.Button("👥 All Users", variant="secondary")
+            download_btn = gr.Button("📥 Download CSV", variant="secondary")
         
         # Report Info
         report_info = gr.Textbox(
             label="📊 Report Summary", 
             interactive=False, 
-            value="👆 Select a filter and click 'Apply Filter' to view records",
-            lines=1
+            value="👆 Select a filter and click 'Apply Filter' to view records"
         )
         
         # Summary Stats
         gr.Markdown("### 📈 Quick Stats")
         summary_output = gr.Dataframe(
             label="Statistics", 
-            interactive=False, 
-            wrap=True
+            interactive=False
         )
         
         # Main Report Table
         gr.Markdown("### 📋 Attendance Records")
         report_output = gr.Dataframe(
             label="Records", 
-            interactive=False, 
-            wrap=True
+            interactive=False
         )
         
         # Download Section
-        download_file = gr.File(label="📥 Downloaded Report", visible=True)
+        download_file = gr.File(label="📥 Downloaded Report")
     
     # Event Handlers
     start_btn.click(start_camera_interface, inputs=None, outputs=camera_status)