css

app.py

@@ -1,55 +1,97 @@
-import gradio as gr
-
-# Define the CSS for the D&D theme
-dnd_css = """
-    body {
-        background-color: #1f1f1f;
-        color: #e0e0e0;
-        font-family: 'Cinzel', serif;
-    }
-    .gradio-container {
-        background-color: #2c2c2c;
-        border: 2px solid #8b5a2b;
-        border-radius: 10px;
-        padding: 20px;
-    }
-    .gradio-input, .gradio-output {
-        background-color: #3a3a3a;
-        color: #e0e0e0;
-        border: 1px solid #8b5a2b;
-        border-radius: 5px;
-        padding: 10px;
-    }
-    .gradio-button {
-        background-color: #8b5a2b;
-        color: #e0e0e0;
-        border: none;
-        border-radius: 5px;
-        padding: 10px 20px;
-        font-family: 'Cinzel', serif;
-    }
-    .gradio-button:hover {
-        background-color: #a8673f;
-    }
-    .gradio-title {
-        color: #e0e0e0;
-        font-family: 'Cinzel', serif;
-        font-size: 24px;
-        text-align: center;
-        margin-bottom: 20px;
-    }
-"""
+import gradio as gr  
+from PIL import Image  
+import time
+
+# Dummy model function for demonstration purposes  
+def model(prompt):
+    # Simulate a model processing time  
+    time.sleep(2)
+    # Return a placeholder image  
+    return Image.new('RGB', (512, 512), color = (73, 109, 137))
+
+# Define Gradio interface with a loading animation  
+def model_with_loading(prompt):
+    return model(prompt)
+
+# Custom CSS for D&D theme  
+custom_css = """
+body {
+    background-color: #231f20;
+    color: #f5f5f5;
+    font-family: 'Arial', sans-serif;
+}
+
+.gradio-container {
+    background-color: #3c2a21;
+    border-radius: 10px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+}
+
+.gr-button {
+    background-color: #8b4513;
+    color: #f5f5f5;
+    border: none;
+    border-radius: 5px;
+    padding: 10px 20px;
+    font-size: 16px;
+    cursor: pointer;
+}
+
+.gr-button:hover {
+    background-color: #a0522d;
+}
 
-# Load the model
-model = gr.load("models/prashanth970/flux-lora-uncensored")
+.gr-textbox {
+    background-color: #4a3728;
+    color: #f5f5f5;
+    border: 1px solid #8b4513;
+    border-radius: 5px;
+    padding: 10px;
+    font-size: 16px;
+}
+
+.gr-textbox::placeholder {
+    color: #d3d3d3;
+}
+
+.gr-image {
+    border: 2px solid #8b4513;
+    border-radius: 10px;
+}
+
+.gr-title {
+    color: #ffd700;
+    font-size: 24px;
+    font-weight: bold;
+}
+
+.gr-description {
+    color: #ffd700;
+    font-size: 18px;
+}
+
+.gr-link {
+    color: #ffd700;
+    text-decoration: underline;
+}
+
+.gr-link:hover {
+    color: #ffa500;
+}
+"""
 
-# Launch the Gradio app with the D&D theme
+# Define Gradio interface  
 iface = gr.Interface(
-    fn=model,
-    inputs="text",
-    outputs="text",
-    title="Dungeons & Dragons Theme",
-    css=dnd_css
+    fn=model_with_loading,
+    inputs=gr.Textbox(lines=3, label="🎲 Enter Your Quest:", placeholder="Describe your scene, hero, or epic landscape..."),
+    outputs=gr.Image(type="pil", label="🖼️ Your Legendary Vision"),
+    title="🛡️ Dungeons & Dragons Image Generator ⚔️",
+    description="**Unleash Your Imagination!** Create heroes, maps, quests, and epic scenes to bring your campaigns to life. "
+                "Tailored for adventurers seeking inspiration or Dungeon Masters constructing their next grand story. <br>"
+                "[Visit Our Website](https://chatdnd.net) | [Support Us](https://buymeacoffee.com/watchoutformike)",
+    css=custom_css,
+    live=False  
 )
 
+# Launch the interface  
 iface.launch()