Make it forgiving for small monitors and fix it on mobile (#1)

- Make it forgiving for small monitors and fix it on mobile (da1d245e60a4378d4cc65d5ce74fee4e831bb2b9)


Co-authored-by: Apolinário from multimodal AI art <multimodalart@users.noreply.huggingface.co>

app.py

@@ -158,8 +158,8 @@ def choose(choice, embs, ys, calibrate_prompts):
     img, embs, ys, calibrate_prompts = next_image(embs, ys, calibrate_prompts)
     return img, embs, ys, calibrate_prompts
 
-css = "div#output-image {height: 768px !important; width: 768px !important; margin:auto;}"
-with gr.Blocks(css=css) as demo:
+#css = "div#output-image {height: 768px !important; width: 768px !important; margin:auto; max-width: 100% !important;}"
+with gr.Blocks() as demo:
     embs = gr.State([])
     ys = gr.State([])
     calibrate_prompts = gr.State([
@@ -175,7 +175,7 @@ with gr.Blocks(css=css) as demo:
     ])
 
     with gr.Row(elem_id='output-image'):
-        img = gr.Image(interactive=False, elem_id='output-image',)
+        img = gr.Image(interactive=False, elem_id='output-image',width=700)
     with gr.Row(equal_height=True):
         b3 = gr.Button(value='Dislike', interactive=False,)
         b2 = gr.Button(value='Neither', interactive=False,)