Update app.py

app.py

@@ -58,7 +58,7 @@ def infer(prompt, seed=42, randomize_seed=False, width=1024, height=1024, guidan
 
 
 examples = [
-    "a man walking a in the forest",
+    "a man walking in the forest",
     "a viking ship sailing down a river",
     "a woman resting by an open fire",
 ]
@@ -70,29 +70,49 @@ css = """
 }
 """
 
-with gr.Blocks(css=css) as demo:
-    with gr.Column(elem_id="col-container"):
-        gr.Markdown("# FLUX.1 [Natalie LoRA]\nModel prompt-augmented with `XTON`, adapted from [FLUX.1-dev](https://huggingface.co/black-forest-labs/FLUX.1-dev)")
+with gr.Blocks(css=css) as natalie_diffusion:
+    with gr.Row():
+        with gr.Column(scale=1, elem_id="left-column"):
+            gr.Markdown("""
+# ХТОНЬ: Natalie LoRA Image Generator
 
-        with gr.Row():
-            prompt = gr.Text(label="Prompt", show_label=False, max_lines=1, placeholder="Enter your prompt", container=False)
-            run_button = gr.Button("Run", scale=0)
+Generate images in the surreal style of artist [Natalie Kav](https://www.behance.net/nataliKav), adapted using a custom LoRA on the FLUX.1 [dev] model.
 
-        result = gr.Image(label="Result", show_label=False)
-
-        with gr.Accordion("Advanced Settings", open=False):
-            seed = gr.Slider(label="Seed", minimum=0, maximum=MAX_SEED, step=1, value=0)
-            randomize_seed = gr.Checkbox(label="Randomize seed", value=True)
-
-            with gr.Row():
-                width = gr.Slider(label="Width", minimum=256, maximum=MAX_IMAGE_SIZE, step=32, value=1024)
-                height = gr.Slider(label="Height", minimum=256, maximum=MAX_IMAGE_SIZE, step=32, value=1024)
+> This space is designed for prototyping concept art for a forthcoming game called **ХТОНЬ**. All outputs are generated locally in the browser using GPU acceleration.
+""")
 
             with gr.Row():
-                guidance_scale = gr.Slider(label="Guidance Scale", minimum=1, maximum=15, step=0.1, value=3.5)
-                num_inference_steps = gr.Slider(label="Number of inference steps", minimum=1, maximum=50, step=1, value=28)
-
-        gr.Examples(examples=examples, fn=infer, inputs=[prompt], outputs=[result, seed], cache_examples="lazy")
+                prompt = gr.Text(
+                    label="Prompt",
+                    show_label=False,
+                    max_lines=1,
+                    placeholder="Enter your prompt...",
+                    container=False,
+                )
+                run_button = gr.Button("🎨 Generate", scale=0)
+
+            with gr.Accordion("Advanced Settings", open=False):
+                seed = gr.Slider(label="Seed", minimum=0, maximum=MAX_SEED, step=1, value=0)
+                randomize_seed = gr.Checkbox(label="Randomize seed", value=True)
+
+                with gr.Row():
+                    width = gr.Slider(label="Width", minimum=256, maximum=MAX_IMAGE_SIZE, step=32, value=1024)
+                    height = gr.Slider(label="Height", minimum=256, maximum=MAX_IMAGE_SIZE, step=32, value=1024)
+
+                with gr.Row():
+                    guidance_scale = gr.Slider(label="Guidance Scale", minimum=1, maximum=15, step=0.1, value=3.5)
+                    num_inference_steps = gr.Slider(label="Number of inference steps", minimum=1, maximum=50, step=1, value=28)
+
+            gr.Examples(
+                examples=examples,
+                fn=infer,
+                inputs=[prompt],
+                outputs=[result, seed],
+                cache_examples="lazy"
+            )
+
+        with gr.Column(scale=1, elem_id="right-column"):
+            result = gr.Image(label="", show_label=False, elem_id="generated-image")
 
     gr.on(
         triggers=[run_button.click, prompt.submit],
@@ -101,5 +121,26 @@ with gr.Blocks(css=css) as demo:
         outputs=[result, seed],
     )
 
+css = """
+#left-column {
+    padding: 1rem;
+}
+
+#right-column {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 1rem;
+}
+
+#generated-image > img {
+    border-radius: 12px;
+    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
+    max-width: 100%;
+    height: auto;
+}
+"""
+
+
 if __name__ == "__main__":
-    demo.launch()
+    natalie_diffusion.launch()