Add "Last Update" label

app.py

@@ -1033,43 +1033,49 @@ def create_gradio_interface():
                     best_multimodal_model = multimodal_df.loc[multimodal_df['Avg. Comb. Perf. ⬆️'].idxmax(), 'Model']
                     best_multimodal_score = multimodal_df['Avg. Comb. Perf. ⬆️'].max()
 
-                    
+                    last_update_date = "2025-12-07" 
 
                     with gr.Row():
                         gr.HTML(f"""
-        <div class="performance-metrics" style="display: flex; flex-wrap: wrap; gap: 8px; font-size: 10px;">
+    <div class="performance-metrics" style="display: flex; flex-wrap: wrap; gap: 8px; font-size: 10px;">
 
         <!-- MODEL COUNTS -->
-        <div class="metric-label" style="padding: 4px; font-weight: bold; display: flex; align-items: center;">
+        <div class="metric-label" style="padding: 4px; font-weight: bold; display: flex; align-items: center; background-color: #ffffff;">
             <span style="font-size: 12px; color: #4a90e2;">Model Configurations Tested:</span>
             <span style="display: inline-flex; justify-content: center; align-items: center; width: 20px; height: 20px; border-radius: 50%; background-color: #4a90e2; color: white; text-align: center; font-size: 10px; margin-left: 5px;">{num_total_models}</span>
         </div>
 
-        <div class="metric-label" style="padding: 4px; font-weight: bold; display: flex; align-items: center;">
+        <div class="metric-label" style="padding: 4px; font-weight: bold; display: flex; align-items: center; background-color: #ffffff;">
             <span style="font-size: 12px; color: #4a90e2;">Textual Model Configurations:</span>
             <span style="display: inline-flex; justify-content: center; align-items: center; width: 20px; height: 20px; border-radius: 50%; background-color: #4a90e2; color: white; text-align: center; font-size: 10px; margin-left: 5px;">{num_textual_models}</span>
         </div>
 
-        <div class="metric-label" style="padding: 4px; font-weight: bold; display: flex; align-items: center;">
+        <div class="metric-label" style="padding: 4px; font-weight: bold; display: flex; align-items: center; background-color: #ffffff;">
             <span style="font-size: 12px; color: #4a90e2;">Multimodal Model Configurations:</span>
             <span style="display: inline-flex; justify-content: center; align-items: center; width: 20px; height: 20px; border-radius: 50%; background-color: #4a90e2; color: white; text-align: center; font-size: 10px; margin-left: 5px;">{num_multimodal_models}</span>
         </div>
 
         <!-- BEST MODELS -->
-        <div class="metric-label" title="Best model evaluated on textual data (regardless of modality)" style="padding: 4px; display: flex; align-items: center;">
+        <div class="metric-label" title="Best model evaluated on textual data (regardless of modality)" style="padding: 4px; display: flex; align-items: center; background-color: #ffffff;">
             <span style="font-size: 12px; color: #4a90e2;">Best Textual Model:</span>
             <span style="font-size: 12px; color: #333333; margin-left: 5px;">{best_textual_model}</span>
             <span style="display: inline-flex; justify-content: center; align-items: center; width: 20px; height: 20px; border-radius: 50%; background-color: #e94e77; color: white; text-align: center; font-size: 10px; margin-left: 5px;">{best_textual_score:.2f}</span>
         </div>
 
-        <div class="metric-label" title="Best model evaluated on textual + visual/video data" style="padding: 4px; display: flex; align-items: center;">
+        <div class="metric-label" title="Best model evaluated on textual + visual/video data" style="padding: 4px; display: flex; align-items: center; background-color: #ffffff;">
             <span style="font-size: 12px; color: #4a90e2;">Best Multimodal Model:</span>
             <span style="font-size: 12px; color: #333333; margin-left: 5px;">{best_multimodal_model}</span>
             <span style="display: inline-flex; justify-content: center; align-items: center; width: 20px; height: 20px; border-radius: 50%; background-color: #e94e77; color: white; text-align: center; font-size: 10px; margin-left: 5px;">{best_multimodal_score:.2f}</span>
         </div>
 
+        <!-- LAST UPDATE -->
+        <div class="metric-label" style="padding: 4px; font-weight: bold; display: flex; align-items: center; background-color: #ffffff; border-radius: 5px; height: 40px;">
+            <span style="font-size: 12px; color: #4a90e2;">Last Update:</span>
+            <span style="font-size: 12px; color: #333333; margin-left: 5px;">{last_update_date}</span>
         </div>
-    """)
+
+    </div>
+""")
 
                     # Grafici affiancati
                     with gr.Row():