Update app.py

app.py

@@ -49,21 +49,18 @@ def infer_gradio(prompt: str):
         return None  # Return nothing if an error occurs
 
 # Define Gradio Interface
-with gr.Blocks() as demo:
-    with gr.Row():  # Use a Row to place the prompt input and the button side by side
-        prompt_input = gr.Textbox(
-            placeholder="Type your prompt for image generation here",
-            lines=1,  # Set the input to be only one line tall
-            interactive=True,  # Allow user to interact with the textbox
-            elem_id="prompt-input"  # Optional: For CSS styling
-        ).style(
-            width="80%"  # Set the prompt input width to 4/5
-        )
-        
-        # Change the button text to "RUN:" and align it with the prompt input
-        run_button = gr.Button("RUN:").style(
-            width="20%"  # Set the button width to 1/5
-        )
+with gr.Blocks(css=".input-container { display: flex; align-items: center; justify-content: space-between; } .input-container .textbox { width: 80%; } .input-container .button { width: 20%; }") as demo:
+    with gr.Column():
+        # Use a Row with CSS class to control layout
+        with gr.Row(elem_id="input-container"):
+            prompt_input = gr.Textbox(
+                placeholder="Type your prompt for image generation here",
+                lines=1,  # Set the input to be only one line tall
+                interactive=True  # Allow user to interact with the textbox
+            ).style(class_name="textbox")  # Assign CSS class for width control
+            
+            # Change the button text to "RUN:" and align it with the prompt input
+            run_button = gr.Button("RUN").style(class_name="button")  # Assign CSS class for width control
     
     # Output image display area
     output_image = gr.Image(label="Generated Image")