fix(add example section and set theme spacing to small)

app.py

@@ -95,6 +95,10 @@ HEADER = """
 **Getting Started**: Provide a question and document or context given to your model in addition to the answer given by the model and then click submit. The output panel will indicate whether the reponse is a hallucination (Fail) or if it is faithful to the given document or context (Pass) through the score Pass or Fail and provide reasoning behind the score.
 """
 
+EXAMPLES_HEADER = """
+# Try it Yourself!
+"""
+
 UPLOADABLE_FILE_TYPES = [".pdf", ".txt", ".docx", ".doc"]
 
 css = """
@@ -198,7 +202,7 @@ def select_template(template):
 # def download_file():
 #     return [gr.UploadButton(visible=True), gr.DownloadButton(visible=False)]
 
-with gr.Blocks(css=css, theme=gr.themes.Default(font=[gr.themes.GoogleFont("Plus Jakarta Sans"), "Arial", "sans-serif"], primary_hue="indigo", secondary_hue="purple")) as demo:
+with gr.Blocks(css=css, theme=gr.themes.Default(font=[gr.themes.GoogleFont("Plus Jakarta Sans"), "Arial", "sans-serif"], primary_hue="indigo", secondary_hue="purple"), spacing_size="sm") as demo:
     base_url_state = gr.State(update_client_base_url("Patronus Lynx 8B v1.1"))
     gr.Markdown(HEADER)
     model_dropdown = gr.Dropdown(choices=["Patronus Lynx 8B v1.1", "Patronus Lynx 70B"], value="Patronus Lynx 8B v1.1", label="Model", interactive=True)
@@ -222,15 +226,16 @@ 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():
-                with gr.Column(spacing="sm"):
-                    for _, example in enumerate(EXAMPLES):
-                        template_btn = gr.Button(f"{example['emoji']} {example['question']}", elem_classes="example-button")
-                        template_btn.click(
-                            fn=select_template,
-                            inputs=[gr.State(example)],
-                            outputs=[question, document, answer]
-                        )
+    gr.Markdown(EXAMPLES_HEADER)
+    with gr.Row():
+        with gr.Column():
+            for _, example in enumerate(EXAMPLES):
+                template_btn = gr.Button(f"{example['emoji']} {example['question']}", elem_classes="example-button")
+                template_btn.click(
+                    fn=select_template,
+                    inputs=[gr.State(example)],
+                    outputs=[question, document, answer]
+                    )
 
     model_dropdown.change(fn=update_client_base_url, inputs=[model_dropdown], outputs=[base_url_state])
     u.upload(upload_file, u, [u, file_group, file_name, document])