From 04c82501d503075edf7afd68157dce450491dc10 Mon Sep 17 00:00:00 2001
From: Pablo Hellmann <phtijger@gmail.com>
Date: Sun, 1 Dec 2024 02:19:47 +0100
Subject: [PATCH] darker colors and fancy live preview

---
 javascript/black-teal-reimagined.css | 28 ++++++++++++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)

diff --git a/javascript/black-teal-reimagined.css b/javascript/black-teal-reimagined.css
index 25f4a3f2c..7b3a281ee 100644
--- a/javascript/black-teal-reimagined.css
+++ b/javascript/black-teal-reimagined.css
@@ -54,8 +54,8 @@ html {
 
   /* Background Colors */
   --background-color: var(--neutral-950);
-  --background-fill-primary: var(--neutral-700);
-  --input-background-fill: var(--neutral-800);
+  --background-fill-primary: var(--neutral-800);
+  --input-background-fill: var(--neutral-900);
 
   /* Padding and Borders */
   --input-padding: 4px;
@@ -402,6 +402,30 @@ div.form, #txt2img_seed_row, #txt2img_subseed_row {
   margin: 1px;
 }
 
+/* Image preview styling*/
+#txt2img_gallery {
+  background: var(--background-fill-primary);
+  padding: 5px;
+  margin: 0px;
+}
+
+@keyframes colorChange {
+  0% {
+    background-color: var(--neutral-800);
+  }
+  50% {
+    background-color: var(--neutral-700);
+  }
+  100% {
+    background-color: var(--neutral-800);
+  }
+}
+
+.livePreview {
+  animation: colorChange 3s ease-in-out infinite; /* Adjust the duration as needed */
+  padding: 5px;
+}
+
 /* Gradio Style Classes */
 fieldset .gr-block.gr-box,
 label.block span {