Update app_lora1.py

app_lora1.py

@@ -147,134 +147,123 @@ def generate_image(prompt, height, width, steps, seed, guidance_scale):
 # GRADIO UI
 # ============================================================
 css = """
-#container {
-    max-width: 1200px;
-    margin: auto;
+.gradio-container {
+    max-width: 100% !important;
+    padding: 16px 32px !important;
 }
 
 .section {
-    margin-top: 16px;
-    margin-bottom: 8px;
+    margin-bottom: 12px;
 }
 
 .generate-btn {
     background: linear-gradient(90deg, #4b6cb7, #182848) !important;
     color: white !important;
-    border-radius: 8px !important;
     font-weight: 600;
-    height: 44px;
+    height: 46px;
+    border-radius: 10px;
 }
 
 .secondary-btn {
-    border-radius: 8px !important;
-    height: 44px;
+    height: 42px;
+    border-radius: 10px;
 }
 
-input, textarea {
-    border-radius: 8px !important;
+textarea, input {
+    border-radius: 10px !important;
 }
 """
 
 with gr.Blocks(
-    title="Z-Image-Turbo (LoRA Safe)",
+    title="Z-Image-Turbo (Runtime LoRA)",
     css=css,
 ) as demo:
 
     gr.Markdown(
         """
         # 🎨 Z-Image-Turbo  
-        **Runtime LoRA · Safe Mode · Production UI**
-        """,
-        elem_classes="section"
+        **Runtime LoRA · Safe Mode · Full-Width UI**
+        """
     )
 
-    with gr.Column(elem_id="container"):
+    # ======================================================
+    # MAIN LAYOUT
+    # ======================================================
+    with gr.Row():
+
+        # ================= LEFT PANEL =================
+        with gr.Column(scale=5):
 
-        # ===============================
-        # PROMPT
-        # ===============================
-        with gr.Column(elem_classes="section"):
+            # -------- Prompt --------
             prompt = gr.Textbox(
                 label="Prompt",
                 value="boat in ocean",
-                lines=3,
-                placeholder="Describe what you want to generate…",
-            )
-
-        # ===============================
-        # PARAMETERS
-        # ===============================
-        with gr.Row(elem_classes="section"):
-            width = gr.Slider(256, 2048, value=1024, step=8, label="Width")
-            height = gr.Slider(256, 2048, value=1024, step=8, label="Height")
-
-        with gr.Row():
-            steps = gr.Slider(1, 50, value=20, step=1, label="Inference Steps")
-            guidance = gr.Slider(0, 10, value=0.0, step=0.5, label="Guidance Scale")
-            seed = gr.Number(value=42, label="Seed", precision=0)
-
-        # ===============================
-        # ACTION BUTTON
-        # ===============================
-        with gr.Row(elem_classes="section"):
-            run_btn = gr.Button("🚀 Generate Image", elem_classes="generate-btn")
-
-        # ===============================
-        # OUTPUT
-        # ===============================
-        with gr.Row(elem_classes="section"):
-            final_image = gr.Image(
-                label="Final Image",
-                height=420,
+                lines=4,
+                placeholder="Describe the image you want to generate…",
             )
 
-        gallery = gr.Gallery(
-            label="Generation Steps",
-            columns=4,
-            height=260,
-        )
-
-        # ===============================
-        # LORA CONTROLS
-        # ===============================
-        gr.Markdown("## 🧩 LoRA Controls", elem_classes="section")
+            # -------- LoRA Controls (NEXT TO PROMPT) --------
+            gr.Markdown("### 🧩 LoRA Controls")
 
-        with gr.Row():
             lora_repo = gr.Textbox(
                 label="LoRA Repository",
                 value=DEFAULT_LORA_REPO,
-                placeholder="username/repo",
+                lines=2,
+                placeholder="username/repo (e.g. rahul7star/ZImageLora)",
             )
 
-        with gr.Row():
             lora_dropdown = gr.Dropdown(
-                label="Available LoRA Files",
+                label="LoRA File",
                 choices=[],
                 interactive=True,
             )
 
-        with gr.Row():
-            refresh_btn = gr.Button("🔄 Refresh LoRA List", elem_classes="secondary-btn")
-            clear_lora_btn = gr.Button("❌ Clear LoRA", elem_classes="secondary-btn")
-
-        # ===============================
-        # LOGS
-        # ===============================
-        logs_box = gr.Textbox(
-            label="Logs",
-            lines=14,
-            interactive=False,
-        )
+            with gr.Row():
+                refresh_btn = gr.Button("🔄 Refresh LoRA List", elem_classes="secondary-btn")
+                clear_lora_btn = gr.Button("❌ Clear LoRA", elem_classes="secondary-btn")
 
-    # ==================================================
-    # CALLBACKS
-    # ==================================================
+            # -------- Generation Controls --------
+            gr.Markdown("### ⚙️ Generation Settings")
+
+            with gr.Row():
+                width = gr.Slider(256, 2048, value=1024, step=8, label="Width")
+                height = gr.Slider(256, 2048, value=1024, step=8, label="Height")
+
+            with gr.Row():
+                steps = gr.Slider(1, 50, value=20, step=1, label="Steps")
+                guidance = gr.Slider(0, 10, value=0.0, step=0.5, label="Guidance")
+                seed = gr.Number(value=42, label="Seed", precision=0)
 
+            run_btn = gr.Button("🚀 Generate Image", elem_classes="generate-btn")
+
+            logs_box = gr.Textbox(
+                label="Logs",
+                lines=10,
+                interactive=False,
+            )
+
+        # ================= RIGHT PANEL =================
+        with gr.Column(scale=7):
+
+            final_image = gr.Image(
+                label="Final Image",
+                height=520,
+            )
+
+            gallery = gr.Gallery(
+                label="Generation Steps",
+                columns=4,
+                height=260,
+            )
+
+    # ======================================================
+    # CALLBACKS
+    # ======================================================
     def refresh_loras(repo):
         files = list_loras_from_repo(repo)
         return gr.update(
             choices=files,
-            value=files[0] if files else None
+            value=files[0] if files else None,
         )
 
     refresh_btn.click(
@@ -305,7 +294,7 @@ with gr.Blocks(
             pass
         return (
             gr.update(value=None),
-            "🧹 LoRA cleared. Next generation will be base model only."
+            "🧹 LoRA cleared — base model will be used."
         )
 
     clear_lora_btn.click(
@@ -321,6 +310,8 @@ with gr.Blocks(
 
 demo.launch()
 
+demo.launch()
+
 # with gr.Blocks(title="Z-Image-Turbo (LoRA Safe)") as demo:
 #     gr.Markdown("# 🎨 Z-Image-Turbo — Runtime LoRA (SAFE MODE)")