UI refinements (#5)

- UI refinements (81d45ed659b17aa38b06dd826498efb5ebeeadac)


Co-authored-by: Apolinário from multimodal AI art <[email protected]>

app.py

@@ -123,20 +123,24 @@ def regenerate(_chatbot, task_history):
     print("After:", task_history, _chatbot)
     return predict(_chatbot, task_history)
 
-with gr.Blocks() as demo:
-    gr.Markdown("<center><font size=8>Qwen-VL-Chat Bot</center>")
-    gr.Markdown("<center><font size=3>Qwen-VL: A Multimodal Large Vision Language Model by Alibaba Cloud **Space by [@Artificialguybr](https://twitter.com/artificialguybr)</center>")
-    gr.Markdown("### Key Features:\n- **Strong Performance**: Surpasses existing LVLMs on multiple English benchmarks including Zero-shot Captioning and VQA.\n- **Multi-lingual Support**: Supports English, Chinese, and multi-lingual conversation.\n- **High Resolution**: Utilizes 448*448 resolution for fine-grained recognition and understanding.")
-    chatbot = gr.Chatbot(label='Qwen-VL-Chat', elem_classes="control-height", height=750)
+css = '''
+.gradio-container{max-width:800px}
+'''
+
+with gr.Blocks(css) as demo:
+    gr.Markdown("# Qwen-VL-Chat Bot")
+    gr.Markdown("## Qwen-VL: A Multimodal Large Vision Language Model by Alibaba Cloud **Space by [@Artificialguybr](https://twitter.com/artificialguybr)</center>")
+    chatbot = gr.Chatbot(label='Qwen-VL-Chat', elem_classes="control-height", height=520)
     query = gr.Textbox(lines=2, label='Input')
     task_history = gr.State([])
 
     with gr.Row():
-        empty_bin = gr.Button("🧹 Clear History")
+        addfile_btn = gr.UploadButton("📁 Upload", file_types=["image"])
         submit_btn = gr.Button("🚀 Submit")
         regen_btn = gr.Button("🤔️ Regenerate")
-        addfile_btn = gr.UploadButton("📁 Upload", file_types=["image"])
-
+        empty_bin = gr.Button("🧹 Clear History")
+    
+    gr.Markdown("### Key Features:\n- **Strong Performance**: Surpasses existing LVLMs on multiple English benchmarks including Zero-shot Captioning and VQA.\n- **Multi-lingual Support**: Supports English, Chinese, and multi-lingual conversation.\n- **High Resolution**: Utilizes 448*448 resolution for fine-grained recognition and understanding.")
     submit_btn.click(add_text, [chatbot, task_history, query], [chatbot, task_history]).then(
         predict, [chatbot, task_history], [chatbot], show_progress=True
     )