make button work better (#36)

app.py

@@ -23,7 +23,7 @@ PROJECT_NAME = "asta-bench" + ("-internal" if IS_INTERNAL else "")
 LEADERBOARD_PATH = f"{OWNER}/{PROJECT_NAME}-leaderboard"
 api = HfApi()
 LOGO_PATH = "assets/logo.svg"
-#    This function will be available on ALL pages of your app.
+# JavaScripts
 scroll_script = """
 <script>
 function scroll_to_element(id) {
@@ -38,8 +38,11 @@ function scroll_to_element(id) {
 }
 </script>
 """
-
-
+redirect_script = """
+<script>
+    if (window.location.pathname === '/') { window.location.replace('/home'); }
+</script>
+"""
 
 # --- Theme Definition ---
 theme = gr.themes.Base(
@@ -97,13 +100,6 @@ except FileNotFoundError:
     print(f"Warning: Home icon file not found at {LOGO_PATH}.")
     home_icon_data_uri = "none"
 
-# --- This part creates the JavaScript redirect. It is correct. ---
-redirect_script = """
-<script>
-    if (window.location.pathname === '/') { window.location.replace('/home'); }
-</script>
-"""
-
 # --- This is the final CSS ---
 final_css = css + f"""
 /* --- Find the "Home" button and replace its text with an icon --- */

content.py

@@ -411,6 +411,11 @@ span.wrap[tabindex="0"][role="button"][data-editable="false"] {
     display: flex !important;
     align-items: center !important;
     gap: 20px !important;
+    width: 100% !important;
+}
+.scroll-up-container .prose {
+    display: flex;
+    justify-content: flex-end; 
 }
 .scroll-up-button {
     flex-grow: 0;

ui_components.py

@@ -379,28 +379,19 @@ def create_benchmark_details_display(
 
     gr.Markdown("---")
     gr.Markdown("## Detailed Benchmark Results")
-    scroll_to_top_js = """
-() => {
-    console.log("Scroll button clicked. Checking for HF iframe environment...");
-    if ('parentIFrame' in window) {
-        console.log("HF iframe detected. Using window.parentIFrame.scrollTo().");
-        window.parentIFrame.scrollTo({top: 0, behavior: 'smooth'});
-    } else {
-        console.log("No HF iframe detected. Using standard window.scrollTo().");
-        window.scrollTo({top: 0, behavior: 'smooth'});
-    }
-}
-"""
     # 2. Loop through each benchmark and create its UI components
     for benchmark_name in benchmark_names:
         with gr.Row(elem_classes=["benchmark-header"]):
             gr.Markdown(f"### {benchmark_name} Leaderboard", header_links=True)
-            scroll_up_button = gr.Button(
-                value="⬆",
-                elem_classes="scroll-up-button",
-            )
-            # When the button is clicked, it runs our JavaScript function. No Python needed.
-            scroll_up_button.click(fn=None, js=scroll_to_top_js)
+            button_str = f"""
+            <button
+                class="scroll-up-button"
+                onclick="scroll_to_element('page-content-wrapper')"
+            >
+                {"⬆"}
+            </button>
+            """
+            gr.HTML(button_str,elem_classes="scroll-up-container")
 
         # 3. Prepare the data for this specific benchmark's table and plot
         benchmark_score_col = f"{benchmark_name} Score"