Update app.py

app.py

@@ -53,68 +53,82 @@ with gr.Blocks() as demo:
     with gr.Column():
         gr.Markdown("# Expression Editor")
         gr.Markdown("Demo for expression-editor cog image by fofr")
+        gr.HTML("""
+            <p style="display: flex;gap: 6px;">
+                <a href="https://huggingface.co/spaces/fffiloni/expression-editor?duplicate=true">
+                    <img src="https://huggingface.co/datasets/huggingface/badges/resolve/main/duplicate-this-space-md.svg" alt="Duplicate this Space">
+                </a> to skip the queue and enjoy faster inference on the GPU of your choice 
+            </p>
+        """)
         with gr.Row():
             with gr.Column():
                 image = gr.Image(
                     label="Image", 
                     type="filepath"
                 )
+            with gr.Column():
+                result_image = gr.Image()
 
+        submit_btn = gr.Button("Submit")
+
+        with gr.Row():
+            rotate_pitch = gr.Slider(
+                label="Rotate Pitch", info='''Rotation pitch: Adjusts the up and down tilt of the face''', 
+                value=0,
+                minimum=-20, maximum=20
+            )
+            rotate_yaw = gr.Slider(
+                label="Rotate Yaw", info='''Rotation yaw: Adjusts the left and right turn of the face''', 
+                value=0,
+                 minimum=-20, maximum=20
+            )
+            rotate_roll = gr.Slider(
+                label="Rotate Roll", info='''Rotation roll: Adjusts the tilt of the face to the left or right''', value=0,
+                minimum=-20, maximum=20
+            )
+        with gr.Row():
+            
+            blink = gr.Slider(
+                label="Blink", info='''Blink: Controls the degree of eye closure''', value=0,
+                minimum=-20, maximum=5
+            )
+            eyebrow = gr.Slider(
+                label="Eyebrow", info='''Eyebrow: Adjusts the height and shape of the eyebrows''', value=0,
+                minimum=-10, maximum=15
+            )
+            wink = gr.Slider(
+                label="Wink", info='''Wink: Controls the degree of one eye closing''', value=0,
+                minimum=0, maximum=25
+            )
+        
+            pupil_x = gr.Slider(
+                label="Pupil X", info='''Pupil X: Adjusts the horizontal position of the pupils''', value=0,
+                minimum=-15, maximum=15
+            )
+            pupil_y = gr.Slider(
+                label="Pupil Y", info='''Pupil Y: Adjusts the vertical position of the pupils''', value=0,
+                minimum=-15, maximum=15
+            )
+        with gr.Row():
+            aaa = gr.Slider(
+                label="Aaa", info='''AAA: Controls the mouth opening for 'aaa' sound''', value=0,
+                minimum=-30, maximum=120
+            )
+            eee = gr.Slider(
+                label="Eee", info='''EEE: Controls the mouth shape for 'eee' sound''', value=0,
+                minimum=-20, maximum=15
+            )
+            woo = gr.Slider(
+                label="Woo", info='''WOO: Controls the mouth shape for 'woo' sound''', value=0,
+                minimum=-20, maximum=15
+            )
+            smile = gr.Slider(
+                label="Smile", info='''Smile: Adjusts the degree of smiling''', value=0,
+                minimum=-0.3, maximum=1.3
+            )
+        with gr.Accordion("More Settings", open=False):
+            with gr.column():
                 with gr.Row():
-                    rotate_pitch = gr.Slider(
-                        label="Rotate Pitch", info='''Rotation pitch: Adjusts the up and down tilt of the face''', 
-                        value=0,
-                        minimum=-20, maximum=20
-                    )
-                    rotate_yaw = gr.Slider(
-                        label="Rotate Yaw", info='''Rotation yaw: Adjusts the left and right turn of the face''', 
-                        value=0,
-                        minimum=-20, maximum=20
-                    )
-                    rotate_roll = gr.Slider(
-                        label="Rotate Roll", info='''Rotation roll: Adjusts the tilt of the face to the left or right''', value=0,
-                        minimum=-20, maximum=20
-                    )
-                with gr.Row():
-                    blink = gr.Slider(
-                        label="Blink", info='''Blink: Controls the degree of eye closure''', value=0,
-                        minimum=-20, maximum=5
-                    )
-                    eyebrow = gr.Slider(
-                        label="Eyebrow", info='''Eyebrow: Adjusts the height and shape of the eyebrows''', value=0,
-                        minimum=-10, maximum=15
-                    )
-                    wink = gr.Slider(
-                        label="Wink", info='''Wink: Controls the degree of one eye closing''', value=0,
-                        minimum=0, maximum=25
-                    )
-                with gr.Row():
-                    pupil_x = gr.Slider(
-                        label="Pupil X", info='''Pupil X: Adjusts the horizontal position of the pupils''', value=0,
-                        minimum=-15, maximum=15
-                    )
-                    pupil_y = gr.Slider(
-                        label="Pupil Y", info='''Pupil Y: Adjusts the vertical position of the pupils''', value=0,
-                        minimum=-15, maximum=15
-                    )
-                with gr.Row():
-                    aaa = gr.Slider(
-                        label="Aaa", info='''AAA: Controls the mouth opening for 'aaa' sound''', value=0,
-                        minimum=-30, maximum=120
-                    )
-                    eee = gr.Slider(
-                        label="Eee", info='''EEE: Controls the mouth shape for 'eee' sound''', value=0,
-                        minimum=-20, maximum=15
-                    )
-                    woo = gr.Slider(
-                        label="Woo", info='''WOO: Controls the mouth shape for 'woo' sound''', value=0,
-                        minimum=-20, maximum=15
-                    )
-                smile = gr.Slider(
-                    label="Smile", info='''Smile: Adjusts the degree of smiling''', value=0,
-                    minimum=-0.3, maximum=1.3
-                )
-                with gr.Accordion("More Settings", open=False):
                     src_ratio = gr.Number(
                         label="Src Ratio", info='''Source ratio''', value=1
                     )
@@ -126,24 +140,14 @@ with gr.Blocks() as demo:
                         label="Crop Factor", info='''Crop factor''', value=1.7,
                         minimum=1.5, maximum=2.5
                     )
+                with gr.Row():
                     output_format = gr.Dropdown(
                         choices=['webp', 'jpg', 'png'], label="output_format", info='''Format of the output images''', value="webp"
                     )
                     output_quality = gr.Number(
                         label="Output Quality", info='''Quality of the output images, from 0 to 100. 100 is best quality, 0 is lowest quality.''', value=95
                     )
-                submit_btn = gr.Button("Submit")
-            with gr.Column():
-                result_image = gr.Image()
-                gr.HTML("""
-                <div style="display: flex; justify-content: center; align-items: center; text-align: center;">
-                    <p style="display: flex;gap: 6px;">
-                         <a href="https://huggingface.co/spaces/fffiloni/expression-editor?duplicate=true">
-                            <img src="https://huggingface.co/datasets/huggingface/badges/resolve/main/duplicate-this-space-md.svg" alt="Duplicate this Space">
-                        </a> to skip the queue and enjoy faster inference on the GPU of your choice 
-                    </p>
-                </div>
-                """)
+                
 
     inputs = [image, rotate_pitch, rotate_yaw, rotate_roll, blink, eyebrow, wink, pupil_x, pupil_y, aaa, eee, woo, smile, src_ratio, sample_ratio, crop_factor, output_format, output_quality]
     outputs = [result_image]