Minor styling changes.

app.py

@@ -76,29 +76,36 @@ judge_options = df_response_judging["llm_judge"].unique().tolist()
 
 st.set_page_config(page_title="Language Model Council", page_icon="🏛️", layout="wide")
 
-# Create three columns
-col1, col2, col3 = st.columns(3)
-
-# Define CSS to make buttons take full space
-full_width_button_css = """
+# Custom CSS to center title and header
+center_css = """
 <style>
-div.stButton > button {
-    width: 100%;
+h1, h2, h3, h6{
+    text-align: center;
 }
 </style>
 """
-st.markdown(full_width_button_css, unsafe_allow_html=True)
 
-# Create a button that triggers the JavaScript function
-# if st.button(button_text):
-#     st.markdown('<script type="text/javascript">openUrl()</script>', unsafe_allow_html=True)
+st.markdown(center_css, unsafe_allow_html=True)
+
+# Title and subtitle.
+st.title("Language Model Council")
+st.markdown(
+    "### Benchmarking Foundation Models on Highly Subjective Tasks by Consensus :classical_building:"
+)
+st.markdown(
+    "###### [Justin Zhao](https://www.justinxzhao.com/)¹, [Flor Miriam Plaza-del-Arco](https://fmplaza.github.io/)², [Amanda Cercas Curry](https://amandacurry.github.io/)²"
+)
+st.markdown("###### ¹ Predibase, ² Bocconi University")
+
+# Create three columns
+_, col1, col2, col3, col4, _ = st.columns([0.3, 0.1, 0.1, 0.1, 0.1, 0.3])
 
-# Place a button in each column
 with col1:
     st.link_button(
         "Data",
         "https://huggingface.co/datasets/llm-council/emotional_application",
         use_container_width=True,
+        type="primary",
     )
 
 with col2:
@@ -106,6 +113,7 @@ with col2:
         "Paper",
         "https://openreview.net/forum?id=EgEMEYECXz",
         use_container_width=True,
+        type="primary",
     )
 
 with col3:
@@ -113,34 +121,13 @@ with col3:
         "Github",
         "https://github.com/llm-council/llm-council",
         use_container_width=True,
+        type="primary",
     )
 
-# Custom CSS to center title and header
-center_css = """
-<style>
-h1, h2, h6{
-    text-align: center;
-}
-</style>
-"""
-
-st.markdown(center_css, unsafe_allow_html=True)
-
-# Centered icon.
-# image = Image.open("img/lmc_icon.png")
-# img_base64 = pil_to_base64(image)
-# centered_image_html = f"""
-# <div style="text-align: center;">
-#     <img src="data:image/png;base64,{img_base64}" width="50"/>
-# </div>
-# """
-# st.markdown(centered_image_html, unsafe_allow_html=True)
-
-# Title and subtitle.
-st.title("Language Model Council")
-st.markdown(
-    "###### Benchmarking Foundation Models on Highly Subjective Tasks by Consensus :classical_building:"
-)
+with col4:
+    st.link_button(
+        "Website", "https://llm-council.com/", use_container_width=True, type="primary"
+    )
 
 # Render hero image.
 with open("img/hero.svg", "r") as file:
@@ -238,10 +225,13 @@ with tabs[1]:
     # Add randomize button at the top of the app
     _, mid_column, _ = st.columns([0.4, 0.2, 0.4])
     mid_column.button(
-        ":game_die: Randomize!", on_click=randomize_selection, type="primary"
+        ":game_die: Randomize!",
+        on_click=randomize_selection,
+        type="primary",
+        use_container_width=True,
     )
 
-    st.markdown("### 1. Select a scenario.")
+    st.markdown("#### 1. Select a scenario.")
     # Create the selectors
     st.session_state.selected_scenario = st.selectbox(
         "Select Scenario",
@@ -284,7 +274,7 @@ with tabs[1]:
 
     st.divider()
 
-    st.markdown("### 2. View responses.")
+    st.markdown("#### 2. View responses.")
 
     # Create two columns for model selectors
     col1, col2 = st.columns(2)
@@ -344,10 +334,8 @@ with tabs[1]:
 
     st.divider()
 
-    # Add bar charts for value counts of pairwise choices over all judges
-    st.markdown("### 3. Response judging")
-
-    st.markdown("#### All council members")
+    st.markdown("#### 3. Response judging")
+    st.markdown("##### All council members")
     col1, col2 = st.columns(2)
 
     with col1:
@@ -373,7 +361,7 @@ with tabs[1]:
         st.bar_chart(pairwise_counts_right)
 
     # Create the llm_judge selector
-    st.markdown("#### Individual LLM judges")
+    st.markdown("##### Individual LLM judges")
     st.session_state.selected_judge = st.selectbox(
         "Select Judge",
         judge_options,
@@ -459,7 +447,7 @@ with tabs[1]:
 
 with tabs[2]:
     st.markdown("### Battles (Respondent vs. Respondent)")
-    st.write("Expected win rates based on Terry-Bradley coefficients:")
+    st.markdown("###### Expected win rates based on Terry-Bradley coefficients")
     image = Image.open("img/llm_vs_llm_win_rates.png")
     img_base64 = pil_to_base64(image)
     centered_image_html = f"""
@@ -469,9 +457,11 @@ with tabs[2]:
     """
     st.markdown(centered_image_html, unsafe_allow_html=True)
 
+    st.divider()
+
     st.markdown("### Affinities (Judge vs. Respondent)")
 
-    st.write("Raw affinities:")
+    st.markdown("###### Raw affinities")
     image = Image.open("img/raw.png")
     img_base64 = pil_to_base64(image)
     centered_image_html = f"""
@@ -481,7 +471,12 @@ with tabs[2]:
     """
     st.markdown(centered_image_html, unsafe_allow_html=True)
 
-    st.write("Council-Normalized:")
+    # Some extra space.
+    st.text("")
+    st.text("")
+    st.text("")
+
+    st.markdown("###### Council-Normalized")
     image = Image.open("img/council_normalized.png")
     img_base64 = pil_to_base64(image)
     centered_image_html = f"""
@@ -491,9 +486,11 @@ with tabs[2]:
     """
     st.markdown(centered_image_html, unsafe_allow_html=True)
 
+    st.divider()
+
     st.markdown("### Agreement (Judge vs. Judge)")
 
-    st.write("Sidewise Cohen's Kappa:")
+    st.markdown("###### Sidewise Cohen's Kappa:")
     image = Image.open("img/judge_agreement.sidewise_cohen_kappa.png")
     img_base64 = pil_to_base64(image)
     centered_image_html = f"""