Update app.py

app.py

@@ -109,16 +109,17 @@ def compute_efficiency_ratio(df):
     ratio = max_val / min_val if min_val > 0 else 1
     return ratio
 
-def generate_callout(ratio, scope_text):
+def generate_info_callout(ratio, scope_text):
     """
-    Returns a right-aligned callout where the inner box is shrink-wrapped to its text.
-    The ratio is formatted with a comma for thousands.
+    Returns an inline, right-aligned "did you know" callout using a lightbulb emoji.
+    The callout uses a light green background, a small font, and states:
+      "💡 did you know: XXXx energy use difference between most and least efficient model in [scope_text]."
     """
     return (
         f'<div style="text-align: right;">'
-        f'  <div style="display: inline-block; background-color: #f2f2f2; padding: 10px; '
-        f'       border-radius: 5px; margin-bottom:10px;">'
-        f'    Energy efficiency difference of <strong>{ratio:,.1f}x</strong> for {scope_text}.'
+        f'  <div style="display: inline-block; background-color: #e6ffe6; padding: 8px; '
+        f'       border-radius: 5px; font-size: 0.8em;">'
+        f'    💡 did you know: <strong>{ratio:,.1f}x</strong> energy use difference between most and least efficient model in {scope_text}.'
         f'  </div>'
         f'</div>'
     )
@@ -132,7 +133,7 @@ def get_global_callout():
         df['gpu_energy_numeric'] = pd.to_numeric(df['total_gpu_energy'], errors='raise') * 1000
         all_df = pd.concat([all_df, df], ignore_index=True)
     ratio = compute_efficiency_ratio(all_df)
-    return generate_callout(ratio, "all models in leaderboard")
+    return generate_info_callout(ratio, "this leaderboard")
 
 ### ZIP DOWNLOAD FUNCTIONS ###
 
@@ -174,70 +175,70 @@ def update_text_generation(selected_display, sort_order):
         return df
     df = process_df('text_generation.csv', sort_order, filter_fn)
     ratio = compute_efficiency_ratio(df)
-    callout = generate_callout(ratio, "all models in task")
+    callout = generate_info_callout(ratio, "this task")
     table_html = generate_html_table_from_df(df)
     return callout, table_html
 
 def update_image_generation(sort_order):
     df = process_df('image_generation.csv', sort_order)
     ratio = compute_efficiency_ratio(df)
-    callout = generate_callout(ratio, "all models in task")
+    callout = generate_info_callout(ratio, "this task")
     table_html = generate_html_table_from_df(df)
     return callout, table_html
 
 def update_text_classification(sort_order):
     df = process_df('text_classification.csv', sort_order)
     ratio = compute_efficiency_ratio(df)
-    callout = generate_callout(ratio, "all models in task")
+    callout = generate_info_callout(ratio, "this task")
     table_html = generate_html_table_from_df(df)
     return callout, table_html
 
 def update_image_classification(sort_order):
     df = process_df('image_classification.csv', sort_order)
     ratio = compute_efficiency_ratio(df)
-    callout = generate_callout(ratio, "all models in task")
+    callout = generate_info_callout(ratio, "this task")
     table_html = generate_html_table_from_df(df)
     return callout, table_html
 
 def update_image_captioning(sort_order):
     df = process_df('image_captioning.csv', sort_order)
     ratio = compute_efficiency_ratio(df)
-    callout = generate_callout(ratio, "all models in task")
+    callout = generate_info_callout(ratio, "this task")
     table_html = generate_html_table_from_df(df)
     return callout, table_html
 
 def update_summarization(sort_order):
     df = process_df('summarization.csv', sort_order)
     ratio = compute_efficiency_ratio(df)
-    callout = generate_callout(ratio, "all models in task")
+    callout = generate_info_callout(ratio, "this task")
     table_html = generate_html_table_from_df(df)
     return callout, table_html
 
 def update_asr(sort_order):
     df = process_df('asr.csv', sort_order)
     ratio = compute_efficiency_ratio(df)
-    callout = generate_callout(ratio, "all models in task")
+    callout = generate_info_callout(ratio, "this task")
     table_html = generate_html_table_from_df(df)
     return callout, table_html
 
 def update_object_detection(sort_order):
     df = process_df('object_detection.csv', sort_order)
     ratio = compute_efficiency_ratio(df)
-    callout = generate_callout(ratio, "all models in task")
+    callout = generate_info_callout(ratio, "this task")
     table_html = generate_html_table_from_df(df)
     return callout, table_html
 
 def update_sentence_similarity(sort_order):
     df = process_df('sentence_similarity.csv', sort_order)
     ratio = compute_efficiency_ratio(df)
-    callout = generate_callout(ratio, "all models in task")
+    callout = generate_info_callout(ratio, "this task")
     table_html = generate_html_table_from_df(df)
     return callout, table_html
 
 def update_extractive_qa(sort_order):
     df = process_df('question_answering.csv', sort_order)
     ratio = compute_efficiency_ratio(df)
-    callout = generate_callout(ratio, "all models in task")
+    callout = generate_info_callout(ratio, "this task")
     table_html = generate_html_table_from_df(df)
     return callout, table_html
 
@@ -257,7 +258,7 @@ def update_all_tasks(sort_order):
     ascending = True if sort_order == "Low to High" else False
     all_df = all_df.sort_values(by='gpu_energy_numeric', ascending=ascending)
     ratio = compute_efficiency_ratio(all_df)
-    callout = generate_callout(ratio, "all models in leaderboard")
+    callout = generate_info_callout(ratio, "this leaderboard")
     table_html = generate_html_table_from_df(all_df)
     return callout, table_html
 
@@ -294,28 +295,25 @@ with demo:
     </div>
     ''')
 
-    # --- Centered Logo ---
-    gr.HTML('''
-    <div style="text-align: center; margin-top: 0px;">
-        <img src="https://huggingface.co/spaces/AIEnergyScore/Leaderboard/resolve/main/logo.png" 
-             alt="Logo" 
-             style="display: inline-block; max-width: 300px; height: auto;">
-    </div>
-    ''')
-
-    # --- Global Welcome & Callout Row ---
+    # --- Logo & Global Callout Row ---
     with gr.Row():
-        with gr.Column(scale=8):
-            gr.Markdown("<div style='text-align: left; font-size: 1.2em; margin-top: 10px;'>Select different tasks to see scored models.</div>")
-        with gr.Column(scale=4):
+        with gr.Column(scale=6):
+            gr.HTML('''
+            <div style="text-align: left; margin-top: 0px;">
+                <img src="https://huggingface.co/spaces/AIEnergyScore/Leaderboard/resolve/main/logo.png" 
+                     alt="Logo" 
+                     style="display: inline-block; max-width: 300px; height: auto;">
+            </div>
+            ''')
+        with gr.Column(scale=6):
             global_callout = gr.HTML(get_global_callout())
 
     # --- Tabs for the different tasks ---
     with gr.Tabs():
-        # --- Text Generation Tab ---
+        # --- Text Generation Tab (two dropdowns side by side with task callout to the right) ---
         with gr.TabItem("Text Generation 💬"):
             with gr.Row():
-                with gr.Column(scale=8):
+                with gr.Column(scale=4):
                     model_class_options = [
                         "A (Single Consumer GPU) <20B parameters",
                         "B (Single Cloud GPU) 20-66B parameters",
@@ -326,6 +324,7 @@ with demo:
                         label="Select Model Class",
                         value=model_class_options[0]
                     )
+                with gr.Column(scale=4):
                     sort_dropdown_tg = gr.Dropdown(
                         choices=["Low to High", "High to Low"],
                         label="Sort",