change ui to vertical

app.py

@@ -517,55 +517,55 @@ with gr.Blocks(css=css) as demo:
         base_model_to_use = gr.Dropdown(label="Which base model would you like to use?", choices=["alt", "alt_m9"], value="alt_m9", interactive=True)
     
     #Very hacky approach to emulate dynamically created Gradio components   
-    with gr.Row() as upload_your_concept:
+    with gr.Column() as upload_your_concept:
         with gr.Column():
             thing_description = gr.Markdown("You are going to train an `object`, please upload 5-10 images of the object you are planning on training on from different angles/perspectives. You must have the right to do so and you are liable for the images you use, example")
             thing_experimental = gr.Checkbox(label="Improve faces (prior preservation) - can take longer training but can improve faces", visible=False, value=False)
             thing_image_example = gr.HTML('''<img src="file/cat-toy.png" />''')
             things_naming = gr.Markdown("You should name your concept with a unique made up word that has low chance of the model already knowing it (e.g.: `cttoy` here). Images will be automatically cropped to 512x512.")
             
-        with gr.Column():
-            file_collection = []
-            concept_collection = []
-            buttons_collection = []
-            delete_collection = []
-            is_visible = []
+        # with gr.Column():
+        file_collection = []
+        concept_collection = []
+        buttons_collection = []
+        delete_collection = []
+        is_visible = []
 
-            row = [None] * maximum_concepts
-            for x in range(maximum_concepts):
-                ordinal = lambda n: "%d%s" % (n, "tsnrhtdd"[(n // 10 % 10 != 1) * (n % 10 < 4) * n % 10::4])
-                if(x == 0):
-                    visible = True
-                    is_visible.append(gr.State(value=True))
-                else:
-                    visible = False
-                    is_visible.append(gr.State(value=False))
+        row = [None] * maximum_concepts
+        for x in range(maximum_concepts):
+            ordinal = lambda n: "%d%s" % (n, "tsnrhtdd"[(n // 10 % 10 != 1) * (n % 10 < 4) * n % 10::4])
+            if(x == 0):
+                visible = True
+                is_visible.append(gr.State(value=True))
+            else:
+                visible = False
+                is_visible.append(gr.State(value=False))
 
-                file_collection.append(gr.File(label=f'''Upload the images for your {ordinal(x+1) if (x>0) else ""} concept''', file_count="multiple", interactive=True, visible=visible))
-                with gr.Column(visible=visible) as row[x]:
-                    concept_collection.append(gr.Textbox(label=f'''{ordinal(x+1) if (x>0) else ""} concept prompt - use a unique, made up word to avoid collisions'''))  
-                    with gr.Row():
-                        if(x < maximum_concepts-1):
-                            buttons_collection.append(gr.Button(value="Add +1 concept", visible=visible))
-                        if(x > 0):
-                            delete_collection.append(gr.Button(value=f"Delete {ordinal(x+1)} concept"))
-            
-            counter_add = 1
-            for button in buttons_collection:
-                if(counter_add < len(buttons_collection)):
-                    button.click(lambda:
-                    [gr.update(visible=True),gr.update(visible=True), gr.update(visible=False), gr.update(visible=True), True, None],
-                    None, 
-                    [row[counter_add], file_collection[counter_add], buttons_collection[counter_add-1], buttons_collection[counter_add], is_visible[counter_add], file_collection[counter_add]], queue=False)
-                else:
-                    button.click(lambda:[gr.update(visible=True),gr.update(visible=True), gr.update(visible=False), True], None, [row[counter_add], file_collection[counter_add], buttons_collection[counter_add-1], is_visible[counter_add]], queue=False)
-                counter_add += 1
-            
-            counter_delete = 1
-            for delete_button in delete_collection:
-                if(counter_delete < len(delete_collection)+1):
-                    delete_button.click(lambda:[gr.update(visible=False),gr.update(visible=False), gr.update(visible=True), False], None, [file_collection[counter_delete], row[counter_delete], buttons_collection[counter_delete-1], is_visible[counter_delete]], queue=False)
-                counter_delete += 1
+            file_collection.append(gr.File(label=f'''Upload the images for your {ordinal(x+1) if (x>0) else ""} concept''', file_count="multiple", interactive=True, visible=visible))
+            with gr.Column(visible=visible) as row[x]:
+                concept_collection.append(gr.Textbox(label=f'''{ordinal(x+1) if (x>0) else ""} concept prompt - use a unique, made up word to avoid collisions'''))  
+                with gr.Row():
+                    if(x < maximum_concepts-1):
+                        buttons_collection.append(gr.Button(value="Add +1 concept", visible=visible))
+                    if(x > 0):
+                        delete_collection.append(gr.Button(value=f"Delete {ordinal(x+1)} concept"))
+        
+        counter_add = 1
+        for button in buttons_collection:
+            if(counter_add < len(buttons_collection)):
+                button.click(lambda:
+                [gr.update(visible=True),gr.update(visible=True), gr.update(visible=False), gr.update(visible=True), True, None],
+                None, 
+                [row[counter_add], file_collection[counter_add], buttons_collection[counter_add-1], buttons_collection[counter_add], is_visible[counter_add], file_collection[counter_add]], queue=False)
+            else:
+                button.click(lambda:[gr.update(visible=True),gr.update(visible=True), gr.update(visible=False), True], None, [row[counter_add], file_collection[counter_add], buttons_collection[counter_add-1], is_visible[counter_add]], queue=False)
+            counter_add += 1
+        
+        counter_delete = 1
+        for delete_button in delete_collection:
+            if(counter_delete < len(delete_collection)+1):
+                delete_button.click(lambda:[gr.update(visible=False),gr.update(visible=False), gr.update(visible=True), False], None, [file_collection[counter_delete], row[counter_delete], buttons_collection[counter_delete-1], is_visible[counter_delete]], queue=False)
+            counter_delete += 1
                   
     with gr.Accordion("Custom Settings", open=False):
         swap_auto_calculated = gr.Checkbox(label="Use custom settings")