ui refactor

app.py

@@ -159,11 +159,11 @@ with gr.Blocks(css=css) as app:
         gr.Markdown("Upload left and right images to create 3D images using different methods.")
         
         with gr.Row():
-            left_input = gr.Image(label="Left Image")
-            right_input = gr.Image(label="Right Image")
-        
-        with gr.Row():
-            with gr.Column(): 
+            with gr.Column():
+                with gr.Row():
+                    left_input = gr.Image(label="Left Image")
+                    right_input = gr.Image(label="Right Image")
+
                 method = gr.Radio(
                             ["anaglyph", "parallel", "crossed"], 
                             label="Method", 
@@ -178,22 +178,24 @@ with gr.Blocks(css=css) as app:
                             info="Select the color processing method"
                 )
 
-            gr.Markdown("""
-                ### Methods:
-                - **anaglyph**: Creates a red-cyan 3D image (requires 3D glasses)
-                - **parallel**: Creates side-by-side images for parallel viewing
-                - **crossed**: Creates side-by-side images for cross-eyed viewing
+                with gr.Accordion("Details about methods", open=False):
+                    gr.Markdown("""
+                    ### Methods:
+                    - **anaglyph**: Creates a red-cyan 3D image (requires 3D glasses)
+                    - **parallel**: Creates side-by-side images for parallel viewing
+                    - **crossed**: Creates side-by-side images for cross-eyed viewing
+                
+                    ### Color Methods:
+                    - **optimized**: Best for most images (default)
+                    - **true**: True color anaglyph
+                    - **mono**: Monochrome output
+                    - **color**: Full color (may cause ghosting)
+                    - **halfcolor**: Balance between color and depth
+                    """)
                 
-                ### Color Methods:
-                - **optimized**: Best for most images (default)
-                - **true**: True color anaglyph
-                - **mono**: Monochrome output
-                - **color**: Full color (may cause ghosting)
-                - **halfcolor**: Balance between color and depth
-            """)
+                generate_btn = gr.Button("Generate 3D Image", variant="primary")
         
-        generate_btn = gr.Button("Generate 3D Image", variant="primary")
-        output = gr.Image(label="Generated 3D Anaglyph Image")
+            output = gr.Image(label="Generated 3D Anaglyph Image")
         
     generate_btn.click(
         fn=process_images,