Update app_ctrlx.py

app_ctrlx.py

@@ -85,8 +85,7 @@ title = """
         SDXL v1.0
     </h3>
 </div>
-"""
-description = """<div style="display: flex; align-items: center; justify-content: center;margin-bottom: 25px">
+<div style="display: flex; align-items: center; justify-content: center;margin-bottom: 25px">
     <h3 style="text-align: center">
         [<a href="https://genforce.github.io/ctrl-x/">Page</a>]
         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
@@ -95,7 +94,8 @@ description = """<div style="display: flex; align-items: center; justify-content
         [<a href="https://github.com/genforce/ctrl-x">Code</a>]
     </h3>
 </div>
-<div>
+"""
+description = """<div>
     <p>
         <b>Ctrl-X</b> is a simple training-free and guidance-free framework for text-to-image (T2I) generation with 
         structure and appearance control. Given structure and appearance images, Ctrl-X designs feedforward structure 
@@ -240,22 +240,11 @@ with gr.Blocks(theme=gr.themes.Default(), css=css, title="Ctrl-X (SDXL v1.0)") a
     with gr.Accordion("Instructions", open=False):
         gr.HTML(description)
     with gr.Row():
-        
-        with gr.Column(scale=55):
+        with gr.Column(scale=45):
             with gr.Group():
-                kwargs = {}  # {"width": 400, "height": 400}
                 with gr.Row():
                     structure_image = gr.Image(label="Upload structure image (optional)", type="pil", **kwargs)
                     appearance_image = gr.Image(label="Upload appearance image (optional)", type="pil", **kwargs)
-                with gr.Row():
-                    result = gr.Image(label="Output image", format="jpg", **kwargs)
-                    result_refiner = gr.Image(label="Output image w/ refiner", format="jpg", **kwargs)
-                with gr.Row():
-                    structure_recon = gr.Image(label="Structure image", format="jpg", **kwargs)
-                    appearance_recon = gr.Image(label="Style image", format="jpg", **kwargs)
-                
-        with gr.Column(scale=45):
-            with gr.Group():
                 with gr.Row():
                     structure_prompt = gr.Textbox(label="Structure prompt (optional)", placeholder="Describes the structure image")
                     appearance_prompt = gr.Textbox(label="Appearance prompt (optional)", placeholder="Describes the style image")
@@ -289,7 +278,17 @@ with gr.Blocks(theme=gr.themes.Default(), css=css, title="Ctrl-X (SDXL v1.0)") a
                         )
                 with gr.Row():
                     generate = gr.Button(value="Run")
-                    
+        
+        with gr.Column(scale=55):
+            with gr.Group():
+                kwargs = {}  # {"width": 400, "height": 400}
+                with gr.Row():
+                    result = gr.Image(label="Output image", format="jpg", **kwargs)
+                    result_refiner = gr.Image(label="Output image w/ refiner", format="jpg", **kwargs)
+                with gr.Row():
+                    structure_recon = gr.Image(label="Structure image", format="jpg", **kwargs)
+                    appearance_recon = gr.Image(label="Style image", format="jpg", **kwargs)
+                        
     inputs = [
         structure_image, appearance_image,
         prompt, structure_prompt, appearance_prompt,