Update app.py

app.py

@@ -441,43 +441,26 @@ class VideoClassifier:
         return "Model selected: " + model_name
 
     def launch_interface(self):
-        css_code = """
-        /* Highlight the second tab in the tabbed interface */
-        .gradio-container .tab-labels {
-            background-color: #d9d9d9;
-        }
-
-        /* Highlight the second tab specifically */
-        .gradio-container .tab-label:nth-child(2) {
-            background-color: #ffcc00; /* Yellow color for the second tab */
-        }
-
-        /* Bounding box for inputs and outputs */
-        .gradio-container .gr-box {
-            border: 2px solid #333333; /* Dark border for inputs and outputs */
-            padding: 10px;
-            border-radius: 5px;
-        }
-
-        .gradio-container .input-section {
-            border: 2px solid #009688; /* Teal border for input section */
-            padding: 10px;
-            border-radius: 5px;
-            margin-bottom: 10px;
-        }
-
-        .gradio-container .output-section {
-            border: 2px solid #ff5722; /* Orange border for output section */
-            padding: 10px;
-            border-radius: 5px;
-            margin-bottom: 10px;
-        }
-
-        /* Alignments for clean design */
-        .gradio-container .gr-row {
-            justify-content: center;
-            text-align: center;
-        }
+            css_code = """
+            .gradio-container {
+                background-color: #d6cbd6;
+            }
+        
+            /* Button styling for all buttons */
+            button {
+                background-color: #d6cbd6; /* Default color for all other buttons */
+                color: black;
+                border: 1px solid black;
+                padding: 10px;
+                margin-right: 10px;
+                font-size: 16px; /* Increase font size */
+                font-weight: bold; /* Make text bold */
+            }
+        
+            /* Style for the second button */
+            button:nth-child(2) {
+                background-color: #927fc7; /* Red color for the second button */
+            }
         """
 
         # First interface for model selection
@@ -521,7 +504,8 @@ class VideoClassifier:
         # Tabbed interface with the custom CSS and highlighting
         gr.TabbedInterface(
             [gr.Row([gr.Column([interface_1], size=12), gr.Column([demo], size=12)])],
-            ["Model Selection", "Video Classification"]
+            ["Model Selection", "Video Classification"],
+            css=css_code,
         ).launch(debug=True, share=True)
         
         # css_code = """