Update app.py

app.py

@@ -136,6 +136,7 @@ intro = """
 css='''
 #strip, #interactive{max-height: 256px; min-height: 65px}
 #strip img{object-fit: cover}
+.gradio-container{max-width: 850px !important}
 '''
 examples = [["a dog in the park", "winter", "summer", 1.5], ["a house", "USA suburb", "Europe", 2.5], ["a tomato", "rotten", "super fresh", 2.5]]
 
@@ -159,19 +160,13 @@ with gr.Blocks(css=css) as demo:
             prompt = gr.Textbox(label="Prompt", info="Describe what you to be steered by the directions", placeholder="A dog in the park")
             x = gr.Slider(minimum=0, value=1.75, step=0.1, maximum=4.0, label="Strength", info="maximum strength on each direction (unstable beyond 2.5)")
             submit = gr.Button("Generate directions")
-            
+            image_seq = gr.Image(label="Strip", elem_id="strip", height=65)
         with gr.Column():
             output_image = gr.Video(label="Looping video", elem_id="video", loop=True, autoplay=True)
-            
-    with gr.Row():
-        with gr.Column(scale=3, min_width=50):
-            image_seq = gr.Image(label="Strip", elem_id="strip", height=65)
-            
-        with gr.Column(scale=2, min_width=50):
             with gr.Group(elem_id="group"):
                 post_generation_image = gr.Image(label="Generated Images", type="filepath", elem_id="interactive")
                 post_generation_slider = gr.Slider(minimum=-10, maximum=10, value=0, step=1, label="From 1st to 2nd direction")
-    
+            
     with gr.Accordion(label="Advanced options", open=False):
         interm_steps = gr.Slider(label = "Num of intermediate images", minimum=3, value=7, maximum=65, step=2)
         with gr.Row():