Update app.py

app.py

@@ -557,15 +557,15 @@ def Generate_Speech(  # <-- MCP tool #4 (Generate Speech)
 fetch_interface = gr.Interface(
     fn=Fetch_Webpage,  # connect the function to the UI
     inputs=[
-        gr.Textbox(label="URL", placeholder="https://example.com/article"),
-        gr.Dropdown(label="Verbosity", choices=["Brief", "Standard", "Full"], value="Standard"),
-        gr.Checkbox(value=True, label="Include Metadata"),
-        gr.Checkbox(value=True, label="Include Main Text"),
-        gr.Checkbox(value=True, label="Include Links"),
-        gr.Slider(400, 12000, value=3000, step=100, label="Max Characters (body text)"),
-        gr.Slider(0, 100, value=20, step=1, label="Max Links"),
+        gr.Textbox(label="URL", placeholder="https://example.com/article", scale=2, min_width=300),
+        gr.Dropdown(label="Verbosity", choices=["Brief", "Standard", "Full"], value="Standard", scale=1, min_width=150),
+        gr.Checkbox(value=True, label="Include Metadata", scale=1, min_width=120),
+        gr.Checkbox(value=True, label="Include Main Text", scale=1, min_width=120),
+        gr.Checkbox(value=True, label="Include Links", scale=1, min_width=120),
+        gr.Slider(400, 12000, value=3000, step=100, label="Max Characters (body text)", scale=2, min_width=200),
+        gr.Slider(0, 100, value=20, step=1, label="Max Links", scale=1, min_width=150),
     ],
-    outputs=gr.Markdown(label="Extracted Summary"),
+    outputs=gr.Markdown(label="Extracted Summary", scale=1),
     title="Fetch Webpage",
     description=(
         "<div style=\"text-align:center\">Extract title, key metadata, readable text, and links from webpages. No noisy HTML.</div>"
@@ -584,14 +584,14 @@ fetch_interface = gr.Interface(
 concise_interface = gr.Interface(
     fn=Search_DuckDuckGo,
     inputs=[
-        gr.Textbox(label="Query", placeholder="topic OR site:example.com"),
-        gr.Slider(minimum=1, maximum=20, value=5, step=1, label="Max results"),
-        gr.Checkbox(value=False, label="Include snippets (adds tokens)"),
-        gr.Slider(minimum=20, maximum=200, value=80, step=5, label="Max snippet chars"),
-        gr.Checkbox(value=True, label="Dedupe by domain"),
-        gr.Slider(minimum=20, maximum=120, value=80, step=5, label="Max title chars"),
+        gr.Textbox(label="Query", placeholder="topic OR site:example.com", scale=2, min_width=300),
+        gr.Slider(minimum=1, maximum=20, value=5, step=1, label="Max results", scale=1, min_width=150),
+        gr.Checkbox(value=False, label="Include snippets (adds tokens)", scale=1, min_width=180),
+        gr.Slider(minimum=20, maximum=200, value=80, step=5, label="Max snippet chars", scale=1, min_width=150),
+        gr.Checkbox(value=True, label="Dedupe by domain", scale=1, min_width=150),
+        gr.Slider(minimum=20, maximum=120, value=80, step=5, label="Max title chars", scale=1, min_width=150),
     ],
-    outputs=gr.Textbox(label="Results (JSONL)", interactive=False),
+    outputs=gr.Textbox(label="Results (JSONL)", interactive=False, scale=1),
     title="DuckDuckGo Search",
     description=(
         "<div style=\"text-align:center\">Very concise web search to avoid unnecessary context. Emits JSONL with short keys (t,u[,s]). Defaults avoid snippets and duplicate domains.</div>"
@@ -611,8 +611,8 @@ concise_interface = gr.Interface(
 # --- Execute Python tab (simple code interpreter) ---
 code_interface = gr.Interface(
     fn=Execute_Python,
-    inputs=gr.Code(label="Python Code", language="python"),
-    outputs=gr.Textbox(label="Output"),
+    inputs=gr.Code(label="Python Code", language="python", scale=1, min_width=400),
+    outputs=gr.Textbox(label="Output", scale=1, min_width=400),
     title="Python Code Executor",
     description=(
         "<div style=\"text-align:center\">Execute Python code and see the output.</div>"
@@ -628,67 +628,15 @@ code_interface = gr.Interface(
     fill_width=True,
 )
 
-CSS_STYLES = """
-    .gradio-container h1 {
-        text-align: center;
-        /* Ensure main title appears first, then our two subtitle lines */
-        display: grid;
-        justify-items: center;
-    }
-    /* Place bold tools list on line 2, normal auth note on line 3 (below title) */
-    .gradio-container h1::before {
-        grid-row: 2;
-        content: "Fetch Webpage | Search DuckDuckGo | Code Interpreter | Kokoro TTS | Image Generation | Video Generation";
-        display: block;
-        font-size: 1rem;
-        font-weight: 700;
-        opacity: 0.9;
-        margin-top: 6px;
-        white-space: pre-wrap;
-    }
-    .gradio-container h1::after {
-        grid-row: 3;
-        content: "Authentication is optional but Image/Video Generation require a `HF_READ_TOKEN` in env variables. They are hidden otherwise.";
-        display: block;
-        font-size: 1rem;
-        font-weight: 400;
-        opacity: 0.9;
-        margin-top: 2px;
-        white-space: pre-wrap;
-    }
-
-    /* Remove inside tab panels so it doesn't duplicate under each tool title */
-    .gradio-container [role=\"tabpanel\"] h1::before,
-    .gradio-container [role=\"tabpanel\"] h1::after {
-        content: none !important;
-    }
-    
-    /* Force full width for the container and all interfaces */
-    .gradio-container, 
-    .gradio-container > div,
-    .gradio-container .tab-nav,
-    .gradio-container .tabitem,
-    .gradio-container .interface-wrapper {
-        width: 100% !important;
-        max-width: none !important;
-    }
-    
-    /* Ensure tab content fills available width */
-    .gradio-container .tabitem > div {
-        width: 100% !important;
-        max-width: none !important;
-    }
-"""
-
 # --- Kokoro TTS tab (text to speech) ---
 kokoro_interface = gr.Interface(
     fn=Generate_Speech,
     inputs=[
-        gr.Textbox(label="Text", placeholder="Type text to synthesize…", lines=4),
-        gr.Slider(minimum=0.5, maximum=2.0, value=1.0, step=0.1, label="Speed"),
-        gr.Textbox(label="Voice", value="af_heart", placeholder="e.g., af_heart"),
+        gr.Textbox(label="Text", placeholder="Type text to synthesize…", lines=4, scale=2, min_width=300),
+        gr.Slider(minimum=0.5, maximum=2.0, value=1.0, step=0.1, label="Speed", scale=1, min_width=150),
+        gr.Textbox(label="Voice", value="af_heart", placeholder="e.g., af_heart", scale=1, min_width=150),
     ],
-    outputs=gr.Audio(label="Audio", type="numpy"),
+    outputs=gr.Audio(label="Audio", type="numpy", scale=1),
     title="Kokoro TTS",
     description=(
         "<div style=\"text-align:center\">Generate English speech with Kokoro-82M. 30 second max output. Runs on CPU or CUDA if available.</div>"
@@ -793,8 +741,8 @@ def Generate_Image(  # <-- MCP tool #5 (Generate Image)
 image_generation_interface = gr.Interface(
     fn=Generate_Image,
     inputs=[
-        gr.Textbox(label="Prompt", placeholder="Enter a prompt", lines=2),
-        gr.Textbox(label="Model", value="black-forest-labs/FLUX.1-Krea-dev", placeholder="creator/model-name"),
+        gr.Textbox(label="Prompt", placeholder="Enter a prompt", lines=2, scale=2, min_width=300),
+        gr.Textbox(label="Model", value="black-forest-labs/FLUX.1-Krea-dev", placeholder="creator/model-name", scale=2, min_width=250),
         gr.Textbox(
             label="Negative Prompt",
             value=(
@@ -803,17 +751,19 @@ image_generation_interface = gr.Interface(
                 "mutated, ugly, disgusting, blurry, amputation, misspellings, typos"
             ),
             lines=2,
+            scale=2,
+            min_width=300,
         ),
-        gr.Slider(minimum=1, maximum=100, value=35, step=1, label="Steps"),
-        gr.Slider(minimum=1.0, maximum=20.0, value=7.0, step=0.1, label="CFG Scale"),
+        gr.Slider(minimum=1, maximum=100, value=35, step=1, label="Steps", scale=1, min_width=150),
+        gr.Slider(minimum=1.0, maximum=20.0, value=7.0, step=0.1, label="CFG Scale", scale=1, min_width=150),
         gr.Radio(label="Sampler", value="DPM++ 2M Karras", choices=[
             "DPM++ 2M Karras", "DPM++ SDE Karras", "Euler", "Euler a", "Heun", "DDIM"
-        ]),
-        gr.Slider(minimum=-1, maximum=1_000_000_000, value=-1, step=1, label="Seed (-1 = random)"),
-        gr.Slider(minimum=64, maximum=1216, value=1024, step=32, label="Width"),
-        gr.Slider(minimum=64, maximum=1216, value=1024, step=32, label="Height"),
+        ], scale=1, min_width=200),
+        gr.Slider(minimum=-1, maximum=1_000_000_000, value=-1, step=1, label="Seed (-1 = random)", scale=1, min_width=180),
+        gr.Slider(minimum=64, maximum=1216, value=1024, step=32, label="Width", scale=1, min_width=150),
+        gr.Slider(minimum=64, maximum=1216, value=1024, step=32, label="Height", scale=1, min_width=150),
     ],
-    outputs=gr.Image(label="Generated Image"),
+    outputs=gr.Image(label="Generated Image", scale=1),
     title="Image Generation",
     description=(
         "<div style=\"text-align:center\">Generate images via Hugging Face Inference. "
@@ -981,18 +931,18 @@ def Generate_Video(  # <-- MCP tool #6 (Generate Video)
 video_generation_interface = gr.Interface(
     fn=Generate_Video,
     inputs=[
-        gr.Textbox(label="Prompt", placeholder="Enter a prompt for the video", lines=2),
-    gr.Textbox(label="Model", value="Wan-AI/Wan2.2-T2V-A14B", placeholder="creator/model-name"),
-        gr.Textbox(label="Negative Prompt", value="", lines=2),
-        gr.Slider(minimum=1, maximum=100, value=25, step=1, label="Steps"),
-        gr.Slider(minimum=1.0, maximum=20.0, value=3.5, step=0.1, label="CFG Scale"),
-        gr.Slider(minimum=-1, maximum=1_000_000_000, value=-1, step=1, label="Seed (-1 = random)"),
-        gr.Slider(minimum=64, maximum=1920, value=768, step=8, label="Width"),
-        gr.Slider(minimum=64, maximum=1920, value=768, step=8, label="Height"),
-        gr.Slider(minimum=4, maximum=60, value=24, step=1, label="FPS"),
-        gr.Slider(minimum=1.0, maximum=10.0, value=4.0, step=0.5, label="Duration (s)"),
+        gr.Textbox(label="Prompt", placeholder="Enter a prompt for the video", lines=2, scale=2, min_width=300),
+    gr.Textbox(label="Model", value="Wan-AI/Wan2.2-T2V-A14B", placeholder="creator/model-name", scale=2, min_width=250),
+        gr.Textbox(label="Negative Prompt", value="", lines=2, scale=2, min_width=300),
+        gr.Slider(minimum=1, maximum=100, value=25, step=1, label="Steps", scale=1, min_width=150),
+        gr.Slider(minimum=1.0, maximum=20.0, value=3.5, step=0.1, label="CFG Scale", scale=1, min_width=150),
+        gr.Slider(minimum=-1, maximum=1_000_000_000, value=-1, step=1, label="Seed (-1 = random)", scale=1, min_width=180),
+        gr.Slider(minimum=64, maximum=1920, value=768, step=8, label="Width", scale=1, min_width=150),
+        gr.Slider(minimum=64, maximum=1920, value=768, step=8, label="Height", scale=1, min_width=150),
+        gr.Slider(minimum=4, maximum=60, value=24, step=1, label="FPS", scale=1, min_width=120),
+        gr.Slider(minimum=1.0, maximum=10.0, value=4.0, step=0.5, label="Duration (s)", scale=1, min_width=150),
     ],
-    outputs=gr.Video(label="Generated Video"),
+    outputs=gr.Video(label="Generated Video", scale=1),
     title="Video Generation",
     description=(
     "<div style=\"text-align:center\">Generate short videos via Hugging Face Inference Providers. "
@@ -1032,7 +982,6 @@ demo = gr.TabbedInterface(
     tab_names=_tab_names,
     title="Tools MCP",
     theme="Nymbo/Nymbo_Theme",
-    css=CSS_STYLES,
 )
 
 # Launch the UI and expose all functions as MCP tools in one server