Visual edits

README.md

@@ -1,8 +1,8 @@
 ---
-title: DocQuery — Document Query Engine
-emoji: 🦉
-colorFrom: purple
-colorTo: purple
+title: DocQuery for Invoices
+emoji: 💸
+colorFrom: gray
+colorTo: green
 sdk: gradio
 sdk_version: 3.1.7
 app_file: app.py

app.py

@@ -321,6 +321,12 @@ gradio-app h2, .gradio-app h2 {
 #url-error input {
     color: red;
 }
+
+#results-table {
+    max-height: 600px;
+    overflow-y: scroll;
+}
+
 """
 
 with gr.Blocks(css=CSS) as demo:
@@ -343,7 +349,7 @@ with gr.Blocks(css=CSS) as demo:
     with gr.Row(equal_height=True):
         with gr.Column():
             with gr.Row():
-                gr.Markdown("## 1. Select an invoice", elem_id="select-a-file")
+                gr.Markdown("## Select an invoice", elem_id="select-a-file")
                 img_clear_button = gr.Button(
                     "Clear", variant="secondary", elem_id="file-clear", visible=False
                 )
@@ -374,16 +380,17 @@ with gr.Blocks(css=CSS) as demo:
             )
 
         with gr.Column() as col:
+            gr.Markdown("## Results")
             with gr.Tabs():
                 with gr.TabItem("Table"):
                     output_table = gr.Dataframe(
-                        headers=["Field", "Value"], **empty_table(fields.value)
+                        headers=["Field", "Value"], **empty_table(fields.value),
+                        elem_id="results-table"
                     )
 
                 with gr.TabItem("JSON"):
-                    output = gr.JSON(label="Output", visible=False)
+                    output = gr.JSON(label="Output", visible=True)
 
-            gr.Markdown("## 2. Ask a question")
             model = gr.Radio(
                 choices=list(CHECKPOINTS.keys()),
                 value=list(CHECKPOINTS.keys())[0],
@@ -391,6 +398,7 @@ with gr.Blocks(css=CSS) as demo:
                 visible=False,
             )
 
+            gr.Markdown("### Ask a question")
             with gr.Row():
                 question = gr.Textbox(
                     label="Question",
@@ -411,7 +419,7 @@ with gr.Blocks(css=CSS) as demo:
                 gr.update(visible=False, value=None),  # image
                 None,  # document
                 # {**FIELDS},  # fields
-                gr.update(visible=False, value=None),  # output
+                gr.update(value=None),  # output
                 gr.update(**empty_table(fields.value)),  # output_table
                 gr.update(visible=False),
                 None,