correcting width for huggingface space website

MM-REACT/app.py

@@ -407,7 +407,8 @@ def init_and_kick_off():
         
         reset_btn = gr.Button(value="!!!CLICK to wake up MM-REACT!!!", variant="primary", elem_id="resetbtn").style(full_width=True)
 
-        example_image_size = 110
+        example_image_size = 90
+        col_min_width = 80
         button_variant = "primary"
         with gr.Row():
             with gr.Column(scale=1.0, min_width=100):
@@ -416,43 +417,42 @@ def init_and_kick_off():
                 with gr.Row():
                     grExampleTitle = gr.HTML(exampleTitle, visible=False)
                 with gr.Row():
-                    with gr.Column(scale=0.50, min_width=100):
+                    with gr.Column(scale=0.50, min_width=col_min_width):
                         example3Image = gr.Image("images/receipt.png", interactive=False).style(height=example_image_size, width=example_image_size)
-                    with gr.Column(scale=0.50, min_width=100):
+                    with gr.Column(scale=0.50, min_width=col_min_width):
                         example3ImageButton = gr.Button(elem_id="tryButton", value="Try it!", variant=button_variant).style(full_width=True)
                         # dummy text field to hold the path
                         example3ImagePath = gr.Text("images/receipt.png", interactive=False, visible=False)
                 with gr.Row():
-                    with gr.Column(scale=0.50, min_width=100):
+                    with gr.Column(scale=0.50, min_width=col_min_width):
                         example1Image = gr.Image("images/money.png", interactive=False).style(height=example_image_size, width=example_image_size)
-                    with gr.Column(scale=0.50, min_width=100):
+                    with gr.Column(scale=0.50, min_width=col_min_width):
                         example1ImageButton = gr.Button(elem_id="tryButton", value="Try it!", variant=button_variant).style(full_width=True)
                         # dummy text field to hold the path
                         example1ImagePath = gr.Text("images/money.png", interactive=False, visible=False)               
                 with gr.Row():
-                    with gr.Column(scale=0.50, min_width=100):
+                    with gr.Column(scale=0.50, min_width=col_min_width):
                         example2Image = gr.Image("images/bar_plot.png", interactive=False).style(height=example_image_size, width=example_image_size)
-                    with gr.Column(scale=0.50, min_width=100):
+                    with gr.Column(scale=0.50, min_width=col_min_width):
                         example2ImageButton = gr.Button(elem_id="tryButton", value="Try it!", variant=button_variant).style(full_width=True)
                         # dummy text field to hold the path
                         example2ImagePath = gr.Text("images/bar_plot.png", interactive=False, visible=False)
                 with gr.Row():
-                    with gr.Column(scale=0.50, min_width=100):
-                        example4Image = gr.Image("images/sign.png", interactive=False).style(height=100, width=100)
-                    with gr.Column(scale=0.50, min_width=100):
+                    with gr.Column(scale=0.50, min_width=col_min_width):
+                        example4Image = gr.Image("images/sign.png", interactive=False).style(height=example_image_size, width=example_image_size)
+                    with gr.Column(scale=0.50, min_width=col_min_width):
                         example4ImageButton = gr.Button(elem_id="tryButton", value="Try it!", variant=button_variant).style(full_width=True)
                         # dummy text field to hold the path
                         example4ImagePath = gr.Text("images/sign.png", interactive=False, visible=False)
                 with gr.Row():                        
-                    with gr.Column(scale=0.50, min_width=100):
+                    with gr.Column(scale=0.50, min_width=col_min_width):
                         example5Image = gr.Image("images/face.jpg", interactive=False).style(height=example_image_size, width=example_image_size)
-                    with gr.Column(scale=0.50, min_width=100):
+                    with gr.Column(scale=0.50, min_width=col_min_width):
                         example5ImageButton = gr.Button(elem_id="tryButton", value="Try it!", variant=button_variant).style(full_width=True)
                         # dummy text field to hold the path
                         example5ImagePath = gr.Text("images/face.jpg", interactive=False, visible=False)
 
 
-
         with gr.Row():
             with gr.Column(scale=0.75):
                 message = gr.Textbox(label="Upload a pic and ask!",
@@ -495,4 +495,4 @@ if __name__ == '__main__':
     ARGS = parser.parse_args()
 
     init_and_kick_off()
-    
+