Update table cells with tooltips and LLM count (#23)

content.py

@@ -300,11 +300,28 @@ html:not(.dark) #legend-markdown .light-mode-icon,
     display: none;
 }
 
-/* Column description tooltip styles */
+/*------ Openness label tooltip styles ------*/
+.styler,
+#openness-label-html,
+#agent-tooling-label-html {
+    overflow: visible !important;
+}
+/*------ Table cell tooltip styles ------*/
+.wrap.default.full,
+span.wrap[tabindex="0"][role="button"][data-editable="false"] {
+  overflow: visible !important;
+}
+.table-container button,
+.table-container table {
+    overflow: visible !important;
+}
+/*------ Table column description tooltip styles ------*/
 #legend-markdown,
 #leaderboard-accordion {
     overflow: visible !important;
 }
+
+/*------ Global tooltip styles ------*/
 .tooltip-icon {
     display: inline-block;
     margin-left: 6px;
@@ -317,7 +334,7 @@ html:not(.dark) #legend-markdown .light-mode-icon,
     bottom: 125%;
     background-color: #105257;
     color: #fff;
-    padding: 0px 10px 15px;
+    padding: 10px;
     border-radius: 4px;
     font-size: 12px;
     opacity: 0;
@@ -416,10 +433,4 @@ html:not(.dark) #legend-markdown .light-mode-icon,
     background: none;
 }
 
-/*------ This specific styles allows openness label tooltips to be visible ------*/
-.styler,
-#openness-label-html,
-#agent-tooling-label-html {
-    overflow: visible !important;
-}
 """

submission.py

@@ -298,8 +298,7 @@ openness_label_html = """
 agent_tooling_label_html = """
 <div class="form-label-with-tooltip">
     Agent Tooling
-    <span class="tooltip-icon" data-tooltip="
-        • Standard: Only uses tools explicitly provided in state.tools
+    <span class="tooltip-icon" data-tooltip="• Standard: Only uses tools explicitly provided in state.tools
         • Equivalent: Uses custom tools with identical or more restricted capabilities
         • Fully Custom: Uses tools beyond constraints of Standard or Equivalent"
     >

ui_components.py

@@ -186,8 +186,7 @@ legend_markdown = f"""
         <div style="display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 4px;">{tooling_html}</div>
     </div>
     
-     <div><b>Column Descriptions</b><span class="tooltip-icon" data-tooltip="
-        • Overall Score: Performance across all benchmarks
+     <div><b>Column Descriptions</b><span class="tooltip-icon" data-tooltip="• Overall Score: Performance across all benchmarks
         • Overall Cost: Cost per task in USD
         • Literature Understanding Score: Performance on scientific literature tasks
         • Literature Understanding Cost: Cost per literature understanding task in USD
@@ -600,7 +599,7 @@ def format_llm_base_with_html(value):
             # Join the list items with a newline character for a clean tooltip
             tooltip_text = "\n".join(map(str, value))
             # Return an HTML span with the title attribute for the tooltip
-            return f'<span style="cursor: help;" title="{tooltip_text}">Multiple ⓘ</span>'
+            return f'<span class="tooltip-icon" style="cursor: help;" data-tooltip="{tooltip_text}">{value[0]} (+ {len(value) - 1}) ⓘ</span>'
         if len(value) == 1:
             # If only one item, just return that item
             return value[0]