Update app.py

app.py

@@ -62,7 +62,28 @@ def generate_output(image, text, button_click):
         print(f"Error: {e}")
         yield f"Error occurred: {str(e)}"
 
-with gr.Blocks() as demo:
+Css = """
+#output-markdown {
+    overflow-y: auto;
+    white-space: pre-wrap; 
+    word-wrap: break-word;
+}
+
+#output-markdown .math {
+    overflow-x: auto;
+    max-width: 100%;
+}
+.markdown-text {
+    white-space: pre-wrap;
+    word-wrap: break-word;
+}
+#qwen-md .katex-display { display: inline; }
+#qwen-md .katex-display>.katex { display: inline; }
+#qwen-md .katex-display>.katex>.katex-html { display: inline; }
+"""
+
+
+with gr.Blocks(css=Css) as demo:
     gr.HTML("""<center><font size=8>🦖 R1-OneVision Demo</center>""")
 
     with gr.Row():
@@ -74,41 +95,7 @@ with gr.Blocks() as demo:
                 submit_btn = gr.Button("Submit", variant="primary")
 
         with gr.Column():
-            output_text = gr.Markdown(
-                label="Generated Response",
-                max_height="80vh",
-                min_height="50vh",
-                container=True,
-                latex_delimiters=[{
-                                        "left": "\\(",
-                                        "right": "\\)",
-                                        "display": True
-                                    }, {
-                                        "left": "\\begin\{equation\}",
-                                        "right": "\\end\{equation\}",
-                                        "display": True
-                                    }, {
-                                        "left": "\\begin\{align\}",
-                                        "right": "\\end\{align\}",
-                                        "display": True
-                                    }, {
-                                        "left": "\\begin\{alignat\}",
-                                        "right": "\\end\{alignat\}",
-                                        "display": True
-                                    }, {
-                                        "left": "\\begin\{gather\}",
-                                        "right": "\\end\{gather\}",
-                                        "display": True
-                                    }, {
-                                        "left": "\\begin\{CD\}",
-                                        "right": "\\end\{CD\}",
-                                        "display": True
-                                    }, {
-                                        "left": "\\[",
-                                        "right": "\\]",
-                                        "display": True
-                                    }],
-                elem_id="qwen-md")
+            output_text = gr.Markdown(elem_id="qwen-md", container=True)
 
     submit_btn.click(fn=generate_output, inputs=[input_image, input_text], outputs=output_text)