fix(make examples fill own row & background color priority in css)

app.py

@@ -100,12 +100,13 @@ UPLOADABLE_FILE_TYPES = [".pdf", ".txt", ".docx", ".doc"]
 css = """
 .example-button {
     font-size: .75rem;
-    background-color: #fff;
+    font-weight: 400 !important;
+    background-color: #fff !important;
     border: 1px solid #564fe6;
     color: #564fe6;
 }
 .example-button:hover {
-    background-color: #564fe6;
+    background-color: #564fe6 !important;
     color: #fff;
 }
 """
@@ -228,8 +229,8 @@ with gr.Blocks(css=css, theme=gr.themes.Default(font=[gr.themes.GoogleFont("Plus
         with gr.Column(scale=1):
             reasoning = gr.Textbox(label="Reasoning")
             score = gr.Textbox(label="Score (FAIL if Hallucinated, PASS if not)")
-            with gr.Row():
-                for idx, example in enumerate(EXAMPLES):
+            for idx, example in enumerate(EXAMPLES):
+                with gr.Row():
                     template_btn = gr.Button(f"{example['emoji']} {example['question']}", elem_classes="example-button")
                     template_btn.click(
                         fn=select_template,