Update app.py

app.py

@@ -119,24 +119,7 @@ def process_workflow(image, text_prompt, use_vlm, use_enhancer, model_choice, ne
     return generated_image, prompt, used_seed
 
 
-css = """
-body {
-    font-family: 'Arial', sans-serif;
-    background-color: #f0f4f8;
-}
-.container {
-    max-width: 1200px;
-    margin: 0 auto;
-    padding: 20px;
-    background-color: white;
-    border-radius: 10px;
-    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-}
-h1 {
-    color: #2c3e50;
-    text-align: center;
-    margin-bottom: 20px;
-}
+custom_css = """
 .input-group, .output-group {
     border: 1px solid #e0e0e0;
     border-radius: 10px;
@@ -144,49 +127,32 @@ h1 {
     margin-bottom: 20px;
     background-color: #f9f9f9;
 }
-.input-box, .output-box {
-    border: 1px solid #bdc3c7;
-    border-radius: 5px;
-    padding: 10px;
-    margin-bottom: 10px;
-}
-.input-box:focus, .output-box:focus {
-    border-color: #3498db;
-    box-shadow: 0 0 5px rgba(52, 152, 219, 0.5);
-}
 .submit-btn {
-    background-color: #2980b9;
-    color: white;
-    border: none;
-    padding: 10px 20px;
-    border-radius: 5px;
-    cursor: pointer;
-    transition: background-color 0.3s;
+    background-color: #2980b9 !important;
+    color: white !important;
 }
 .submit-btn:hover {
-    background-color: #3498db;
+    background-color: #3498db !important;
 }
 """
 
-# ... (keep the helper functions as before)
-
 # Gradio Interface
-with gr.Blocks(css=css) as demo:
+with gr.Blocks(theme=gr.themes.Soft(primary_hue="blue", secondary_hue="gray")) as demo:
     gr.Markdown("# VLM Captioner + Prompt Enhancer + SD3 Image Generator")
     
     with gr.Row():
         with gr.Column(scale=1):
             with gr.Group(elem_classes="input-group"):
-                input_image = gr.Image(label="Input Image for VLM", elem_classes="input-box")
+                input_image = gr.Image(label="Input Image for VLM")
                 use_vlm = gr.Checkbox(label="Use VLM Captioner", value=False)
             
             with gr.Group(elem_classes="input-group"):
-                text_prompt = gr.Textbox(label="Text Prompt", elem_classes="input-box")
+                text_prompt = gr.Textbox(label="Text Prompt")
                 use_enhancer = gr.Checkbox(label="Use Prompt Enhancer", value=False)
                 model_choice = gr.Radio(["Medium", "Long"], label="Enhancer Model", value="Long")
             
             with gr.Accordion("Advanced Settings", open=False):
-                negative_prompt = gr.Textbox(label="Negative Prompt", elem_classes="input-box")
+                negative_prompt = gr.Textbox(label="Negative Prompt")
                 seed = gr.Slider(label="Seed", minimum=0, maximum=MAX_SEED, step=1, value=0)
                 randomize_seed = gr.Checkbox(label="Randomize Seed", value=True)
                 width = gr.Slider(label="Width", minimum=256, maximum=MAX_IMAGE_SIZE, step=64, value=1024)
@@ -198,9 +164,9 @@ with gr.Blocks(css=css) as demo:
         
         with gr.Column(scale=1):
             with gr.Group(elem_classes="output-group"):
-                output_image = gr.Image(label="Generated Image", elem_classes="output-box")
-                final_prompt = gr.Textbox(label="Final Prompt Used", elem_classes="output-box")
-                used_seed = gr.Number(label="Seed Used", elem_classes="output-box")
+                output_image = gr.Image(label="Generated Image")
+                final_prompt = gr.Textbox(label="Final Prompt Used")
+                used_seed = gr.Number(label="Seed Used")
     
     generate_btn.click(
         fn=process_workflow,
@@ -211,4 +177,4 @@ with gr.Blocks(css=css) as demo:
         outputs=[output_image, final_prompt, used_seed]
     )
 
-demo.launch()
+demo.launch(css=custom_css)