update styling of links (#77)

Co-authored-by: Smita <>

about.py

@@ -46,7 +46,7 @@ def build_page():
                 Plus: a large suite of integrated agents and leaderboards with results from extensive evaluation of agents and models.
             </p>
             <p>
-                🔍 Learn more in the AstaBench technical blog post
+                🔍 Learn more in the <a href="https://allenai.org/blog/astabench" target="_blank" class="primary-link-button">AstaBench technical blog post</a>
             </p>
             """
         )

content.py

@@ -318,28 +318,28 @@ nav.svelte-ti537g.svelte-ti537g {
 .padding.svelte-phx28p {
     padding: 0 !important;
 }
-.dark .sub-nav-link-button {
-    color: #0fcb8c !important;
-}
 .sub-nav-bar-container {
     display: flex !important;
     flex-wrap: nowrap !important; 
     align-items: center !important; 
     gap: 20px !important;
 }
-.sub-nav-link-button {
+.dark .primary-link-button {
+    color: var(--color-primary-green);
+}
+.primary-link-button {
     background: none;
     border: none;
     padding: 0;
     margin: 0;
     font-family: inherit;
     font-size: 16px;
-    color: #F263A6; 
+    color: var(--color-primary-pink);
     text-decoration: none;
     cursor: pointer;
     white-space: nowrap;
 }
-.sub-nav-link-button:hover {
+.primary-link-button:hover {
     text-decoration: underline;
 }
 .sub-nav-label {
@@ -491,13 +491,9 @@ span.wrap[tabindex="0"][role="button"][data-editable="false"] {
 .dark .benchmark-title{
     color: var(--color-primary-green);
 }
-.scroll-up-button {
+.benchmark-description {
     margin: 20px 0;
-    text-align: left;
-    text-decoration: underline;
-}
-.scroll-up-button:hover {
-    text-decoration: none;
+    max-width: 800px;
 }
 /*------ Submission Page CSS ------*/
 #submission-modal .modal-container {

ui_components.py

@@ -649,7 +649,7 @@ def create_benchmark_details_display(
         gr.HTML(f'''
             <h3 class="benchmark-title" id="{create_gradio_anchor_id(benchmark_name, validation)}">{benchmark_name} Leaderboard</h3>
             <div class="benchmark-description">{get_benchmark_description(benchmark_name, validation)}</div>
-            <button onclick="scroll_to_element('page-content-wrapper')" class="scroll-up-button">Return to the aggregate {category_name} leaderboard</button>
+            <button onclick="scroll_to_element('page-content-wrapper')" class="primary-link-button">Return to the aggregate {category_name} leaderboard</button>
         ''')
 
         # 3. Prepare the data for this specific benchmark's table and plot
@@ -837,7 +837,7 @@ def create_sub_navigation_bar(tag_map: dict, category_name: str, validation: boo
         # Note the mix of double and single quotes.
         button_str = f"""
             <button
-                class="sub-nav-link-button"
+                class="primary-link-button"
                 onclick="scroll_to_element('{target_id}')"
             >
                 {name}