Double width

app.py

@@ -61,17 +61,21 @@ with image_blocks as demo:
     gr.HTML(read_content("header.html"))
     with gr.Group():
         with gr.Box():
-            image = gr.Image(source='upload', tool='sketch', elem_id="image_upload", type="pil", label="Upload").style(height=400)
-
-            with gr.Row(elem_id="prompt-container").style(mobile_collapse=False, equal_height=True):
-                prompt = gr.Textbox(label = 'Your prompt (what you want in place of what is erased)')
-                btn = gr.Button("Generate image").style(
-                    margin=False,
-                    rounded=(False, True, True, False),
-                    full_width=False,
-                )
-
-            btn.click(fn=predict, inputs=[image, prompt], outputs=image)
+            with gr.Row():
+                with gr.Column():
+                    image = gr.Image(source='upload', tool='sketch', elem_id="image_upload", type="pil", label="Upload").style(height=400)
+                    with gr.Row(elem_id="prompt-container").style(mobile_collapse=False, equal_height=True):
+                        prompt = gr.Textbox(placeholder = 'Your prompt (what you want in place of what is erased)', show_label=False)
+                        btn = gr.Button("Inpaint!").style(
+                            margin=False,
+                            rounded=(False, True, True, False),
+                            full_width=False,
+                        )
+                with gr.Column():
+                    image_out = gr.Image(label="Output").style(height=400)
+            
+
+            btn.click(fn=predict, inputs=[image, prompt], outputs=image_out)
 
 
 

header.html

@@ -4,11 +4,12 @@
         gap: 0.8rem;
         font-size: 1.75rem;
         justify-content: center;
+        margin-bottom: 10px;
       ">
     <img
       src="https://aeiljuispo.cloudimg.io/v7/https://s3.amazonaws.com/moonup/production/uploads/1665970599545-634cb15a4abe8405758d2e7e.jpeg"
       alt="RunwayML" width="64px">
-    <h1 style="font-weight: 900; align-items: center; margin-bottom: 7px; margin-top: 12px;">
+    <h1 style="font-weight: 900; align-items: center; margin-bottom: 7px; margin-top: 20px;">
       RunwayML Stable Diffusion Inpainting 🎨
     </h1>
   </div>