CSS

app.py

@@ -2143,6 +2143,7 @@ loras = [
 
 #--------------------------------------------------Model Initialization-----------------------------------------------------------------------------------------#
 
+
 dtype = torch.bfloat16
 device = "cuda" if torch.cuda.is_available() else "cpu"
 base_model = "black-forest-labs/FLUX.1-dev"
@@ -2375,8 +2376,17 @@ def remove_custom_lora():
 
 run_lora.zerogpu = True
 
-# ─── UPDATED CSS FOR A D&D THEME ─────────────────────────────────────────────────────────────
+# ─── UPDATED CSS WITH YOUR SITE COLORS ─────────────────────────────────────────────────────────────
 css = '''
+/* Force our background with !important */
+body {
+    background: #f4ecd8 url('https://www.transparenttextures.com/patterns/purty-wood.png') repeat !important;
+    font-family: 'Cinzel', serif;
+    color: #543d29;
+    margin: 0;
+    padding: 0;
+}
+
 /* Button & Layout */
 #gen_btn { height: 100%; }
 #gen_column { align-self: stretch; }
@@ -2387,33 +2397,33 @@ css = '''
     font-size: 3em;
     display: inline-flex;
     align-items: center;
-    color: #d4af37; /* Antique gold */
-    text-shadow: 2px 2px 4px #000000;
+    color: #795548; /* medium brown */
+    text-shadow: 2px 2px 4px #543d29; /* dark brown */
 }
 #title img { width: 100px; margin-right: 0.5em; }
 
 /* Gallery & LoRA List */
 #gallery .grid-wrap { height: 10vh; }
 #lora_list {
-    background: var(--block-background-fill);
+    background: #f0e6d2;
     padding: 0 1em 0.3em;
     font-size: 90%;
-    color: #d4af37;
-    border: 1px solid #8b4513;
+    color: #795548;
+    border: 1px solid #543d29;
 }
 .card_internal {
     display: flex;
     height: 100px;
     margin-top: 0.5em;
-    border: 2px solid #8b4513;
-    background: #f5f5dc; /* light parchment */
+    border: 2px solid #543d29;
+    background: #f0e6d2;
     border-radius: 8px;
     padding: 5px;
 }
 .card_internal img {
     margin-right: 1em;
     border-radius: 5px;
-    border: 1px solid #8b4513;
+    border: 1px solid #543d29;
 }
 
 /* Progress Bar */
@@ -2422,27 +2432,17 @@ css = '''
 .progress-container {
     width: 100%;
     height: 30px;
-    background-color: #deb887; /* burlywood */
+    background-color: #795548;
     border-radius: 15px;
     overflow: hidden;
     margin-bottom: 20px;
 }
 .progress-bar {
     height: 100%;
-    background-color: #a0522d; /* sienna */
+    background-color: #543d29;
     width: calc(var(--current) / var(--total) * 100%);
     transition: width 0.5s ease-in-out;
 }
-
-/* Body / Overall Page Background */
-body {
-    /* A parchment/wood background for that medieval feel */
-    background: #fdf6e3 url('https://www.transparenttextures.com/patterns/purty-wood.png') repeat;
-    font-family: 'Cinzel', serif;
-    color: #4b3621;
-    margin: 0;
-    padding: 0;
-}
 '''
 
 with gr.Blocks(theme="YTheme/Minecraft", css=css, delete_cache=(60, 60)) as app: