css

app.py

@@ -1,105 +1,154 @@
-import gradio as gr  
-from PIL import Image  
+import gradio as gr
+from PIL import Image
 import time
 
-# Load the model from Hugging Face  
-model = gr.load("models/prashanth970/flux-lora-uncensored")
+# --- D&D Themed Image Generator ---
 
-# Define Gradio interface with a loading animation  
-def model_with_loading(prompt):
-    return model(prompt)
+# Load the model (using Gradio's recommended method)
+#  Make sure the model ID is correct!
+try:
+    model = gr.load("models/prashanth970/flux-lora-uncensored")
+except Exception as e:
+    print(f"Error loading model: {e}")
+    model = None  # Set model to None to prevent errors later
 
-# Custom CSS for D&D theme  
+# Function to generate the image (with error handling)
+def generate_image(prompt):
+    """Generates an image based on the prompt, handling potential errors."""
+    if model is None:
+        return "Error: Model could not be loaded.  Please check the model ID and your network connection."
+
+    try:
+        image = model(prompt)
+        return image
+    except Exception as e:
+        return f"An error occurred during image generation: {e}"
+
+
+# Custom CSS for a D&D theme
 custom_css = """
 @import url('https://fonts.googleapis.com/css2?family=MedievalSharp&display=swap');
 
-body {
-    background-color: #1a1a1a;
-    color: #f5f5f5;
-    font-family: 'MedievalSharp', cursive;
-}
-
-.gradio-container {
+/* General Styles */
+.dnd-container {
     background-color: #2c2c2c;
     border-radius: 15px;
     box-shadow: 0 8px 16px rgba(0, 0, 0, 0.4);
     padding: 20px;
+    font-family: 'MedievalSharp', cursive;
 }
 
-.gr-button {
-    background-color: #8b4513;
-    color: #f5f5f5;
-    border: none;
-    border-radius: 8px;
-    padding: 12px 24px;
-    font-size: 18px;
-    cursor: pointer;
-    transition: background-color 0.3s;
+.dnd-title {
+    color: #ffd700;
+    font-size: 32px;
+    font-weight: bold;
+    text-align: center;
+    margin-bottom: 20px;
 }
 
-.gr-button:hover {
-    background-color: #a0522d;
+.dnd-description {
+    color: #ffd700;
+    font-size: 20px;
+    text-align: center;
+    margin-bottom: 20px;
 }
 
-.gr-textbox {
+/* Input Textbox */
+.dnd-input textarea {
     background-color: #3c3c3c;
-    color: #f5f5f5;
+    color: #d1b579; /* Lighter text for better readability */
     border: 2px solid #8b4513;
     border-radius: 8px;
     padding: 12px;
     font-size: 18px;
     width: 100%;
     box-sizing: border-box;
+    font-family: 'MedievalSharp', cursive;
+    overflow-y: auto; /* Add scrollbar for long text */
+    resize: vertical; /* Allow vertical resizing */
+}
+
+.dnd-input textarea::placeholder {
+    color: #a39166; /* Slightly darker placeholder */
 }
 
-.gr-textbox::placeholder {
-    color: #d3d3d3;
+/* Generate Button */
+.dnd-button button {
+    background-color: #8b4513;
+    color: #f5f5f5;
+    border: none;
+    border-radius: 8px;
+    padding: 12px 24px;
+    font-size: 18px;
+    cursor: pointer;
+    transition: background-color 0.3s;
+    width: 100%; /* Make button fill the container */
+    font-family: 'MedievalSharp', cursive;
 }
 
-.gr-image {
+.dnd-button button:hover {
+    background-color: #a0522d;
+}
+
+/* Output Image */
+.dnd-output img {
     border: 4px solid #8b4513;
     border-radius: 15px;
     margin-top: 20px;
+    display: block; /* Ensure image is treated as a block for centering */
+    margin-left: auto;
+    margin-right: auto;
 }
 
-.gr-title {
+/* Output Label */
+.dnd-output div[data-testid='label'] {
+    text-align: center; /* Center the output label */
     color: #ffd700;
-    font-size: 32px;
-    font-weight: bold;
-    text-align: center;
-    margin-bottom: 20px;
-}
-
-.gr-description {
-    color: #ffd700;
-    font-size: 20px;
-    text-align: center;
-    margin-bottom: 20px;
+    font-size: 18px;
 }
 
-.gr-link {
+/* Links */
+.dnd-link {
     color: #ffd700;
     text-decoration: underline;
+     font-family: 'MedievalSharp', cursive;
     font-size: 18px;
+
 }
 
-.gr-link:hover {
+.dnd-link:hover {
     color: #ffa500;
+      font-family: 'MedievalSharp', cursive;
 }
+
 """
 
-# Define Gradio interface  
+# Gradio Interface
 iface = gr.Interface(
-    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"),
+    fn=generate_image,
+    inputs=gr.Textbox(
+        lines=3,
+        label="📜 Enter Your Quest:",
+        placeholder="Describe your scene, hero, or epic landscape...  Evoke the mists of Ravenloft, the sprawling city of Waterdeep, or the fiery depths of the Nine Hells!",
+        css=".dnd-input"  # Apply custom CSS to the input
+    ),
+    outputs=gr.Image(
+        type="pil",
+        label="🖼️ Your Legendary Vision",
+        css=".dnd-output"  # Apply custom CSS to the output
+    ),
     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)",
+    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.
+
+        [Visit Our Website](https://chatdnd.net) | [Support Us](https://buymeacoffee.com/watchoutformike)
+    """,
     css=custom_css,
-    live=False  
+    theme=gr.themes.Soft(), #Added a soft theme to catch any styling
+
 )
 
-# Launch the interface  
-iface.launch()
+# Launch the interface
+iface.launch()
+