Update app.py

app.py

@@ -55,63 +55,98 @@ def send_it2(inputs, noise_level, proc1=proc1):
     output2 = proc1(prompt_with_noise)
     return output2
 
-def send_it3(inputs, noise_level, proc1=proc1):
-    prompt_with_noise = add_random_noise(inputs, noise_level)
-    output3 = proc1(prompt_with_noise)
-    return output3
+#def send_it3(inputs, noise_level, proc1=proc1):
+    #prompt_with_noise = add_random_noise(inputs, noise_level)
+    #output3 = proc1(prompt_with_noise)
+    #return output3
 
 #def send_it4(inputs, noise_level, proc1=proc1):
     #prompt_with_noise = add_random_noise(inputs, noise_level)
     #output4 = proc1(prompt_with_noise)
     #return output4
 
-
-
-
-with gr.Blocks() as myface:
-    with gr.Row():
-
-        input_text=gr.Textbox(label="Short Prompt")
-        see_prompts=gr.Button("Magic Prompt")
-    with gr.Row():
-
-        prompt=gr.Textbox(label="Enter Prompt")
-        noise_level=gr.Slider(minimum=0.0, maximum=3, step=0.1, label="Noise Level: Controls how much randomness is added to the input before it is sent to the model. Higher noise level produces more diverse outputs, while lower noise level produces similar outputs.")
-        run=gr.Button("Generate")
-
-    with gr.Row():
-        like_message = gr.Button("❤️❤️❤️ Press the Like Button if you enjoy my space! ❤️❤️❤️")
+css = '''
+    #col-container {max-width: 800px; margin-left: auto; margin-right: auto;}
+    a {
+            color: inherit;
+            text-decoration: underline;
+        }
+'''
+
+
+with gr.Blocks(css=css) as demo:
+    gr.HTML(
+        """
+            <div style="text-align: center; max-width: 650px; margin: 0 auto;">
+              <div>
+                <h1 style="font-weight: 900; font-size: 3rem; margin-bottom:20px;">
+                  Dreamlike Photoreal 2.0
+                </h1>
+              </div>
+              <p style="margin-bottom: 10px; font-size: 96%">
+              Noise Level: Controls how much randomness is added to the input before it is sent to the model. Higher noise level produces more diverse outputs, while lower noise level produces similar outputs,
+                <a href="https://twitter.com/DavidJohnstonxx/">created by Phenomenon1981</a>.
+              </p>
+              <p style="margin-bottom: 10px; font-size: 98%">
+              ❤️ Press the Like Button if you enjoy my space! ❤️</a>.
+              </p>
+            </div>
+        """
+    )
+    with gr.Column(elem_id="col-container"):
+        with gr.Row(variant="compact"):
+            input_text = gr.Textbox(
+                label="Short Prompt",
+                show_label=False,
+                max_lines=2,
+                placeholder="Enter a basic idea and click 'Magic Prompt'",
+            ).style(
+                container=False,
+            )
+            see_prompts = gr.Button("✨ Magic Prompt ✨").style(full_width=False)
 
         
-    with gr.Row():
-        output1=gr.Image(label="Dreamlike-photoreal-2.0")
-        output2=gr.Image(label="Dreamlike-photoreal-2.0")
-        output3=gr.Image(label="Dreamlike-photoreal-2.0")
-        #output4=gr.Image(label="Dreamlike-photoreal-2.0")
-    #with gr.Row():
-        #output5=gr.Image(label="Dreamlike-photoreal-2.0")
-        #output6=gr.Image(label="Dreamlike-photoreal-2.0")
+        with gr.Row(variant="compact"):
+            prompt = gr.Textbox(
+                label="Enter your prompt",
+                show_label=False,
+                max_lines=2,
+                placeholder="Full Prompt",
+            ).style(
+                container=False,
+            )
+            run = gr.Button("Generate Images").style(full_width=False)
+        
+        with gr.Row():
+            with gr.Row():
+                noise_level = gr.Slider(minimum=0.1, maximum=3, step=0.1, label="Noise Level")
+        with gr.Row():
+            with gr.Row():
+                output1=gr.Image(label="Dreamlike-photoreal-2.0",show_label=False)
+                output2=gr.Image(label="Dreamlike-photoreal-2.0",show_label=False)
+        
     #with gr.Row():
-        #output7=gr.Image(label="Dreamlike-photoreal-2.0")
-        #output8=gr.Image(label="Dreamlike-photoreal-2.0")
-
-    see_prompts.click(get_prompts, inputs=[input_text], outputs=[prompt], queue=False)
-    run.click(send_it1, inputs=[prompt, noise_level], outputs=[output1])
-    run.click(send_it2, inputs=[prompt, noise_level], outputs=[output2])
-    run.click(send_it3, inputs=[prompt, noise_level], outputs=[output3])
-    #run.click(send_it4, inputs=[prompt, noise_level], outputs=[output4])
-    #run.click(send_it5, inputs=[prompt, noise_level], outputs=[output5])
-    #run.click(send_it6, inputs=[prompt, noise_level], outputs=[output6])
-    #run.click(send_it7, inputs=[prompt, noise_level], outputs=[output7])
-    #run.click(send_it8, inputs=[prompt, noise_level], outputs=[output8])
-
-    with gr.Row():
-        # other components
-        article = gr.HTML("""
-        Demo for <a href="https://huggingface.co/dreamlike-art/dreamlike-photoreal-2.0">Dreamlike Photoreal 2.0</a> Stable Diffusion model.
-        """)
-
-
-
-myface.launch(enable_queue=True, inline=True)
-block.queue(concurrency_count=100)
+        #output1=gr.Image()
+
+        run.click(send_it1, inputs=[prompt, noise_level], outputs=[output1])
+        run.click(send_it2, inputs=[prompt, noise_level], outputs=[output2])
+        see_prompts.click(get_prompts, inputs=[input_text], outputs=[prompt])
+
+
+        with gr.Row():
+                gr.HTML(
+    """
+        <div class="footer" style="margin-bottom: 45px; margin-top: 15px; text-align: center; border-bottom: 1px solid #e5e5e5;">
+        <p style="font-size: .8rem; display: inline-block; padding: 0 10px; transform: translateY(10px); background: #0b0f19;"> Demo for <a href="https://huggingface.co/dreamlike-art/dreamlike-photoreal-2.0">Dreamlike Photoreal 2.0</a> Stable Diffusion model
+</p>
+</div>
+        <div class="acknowledgments" style="margin: 1.25em 0 .25em 0; font-size: 115%;">
+            <p style="margin: 1.25em 0 .25em 0; font-size: 115%;"> Unleash your creative side and generate mesmerizing images with just a few clicks! Enter a spark of inspiration in the "Basic Idea" text box and click the "Magic Prompt" button to elevate it to a polished masterpiece. Make any final tweaks in the "Full Prompt" box and hit the "Generate Images" button to watch your vision come to life. Experiment with the "Noise Level" for a diverse range of outputs, from similar to wildly unique. Let the fun begin!
+            </p>
+        </div>
+    """
+)
+
+
+    demo.queue(concurrency_count=8)
+    demo.launch(enable_queue=True, inline=True)