Merge pull request AUTOMATIC1111#3 from BinaryQuantumSoul/BinaryQuantumSoul-patch-3

New colorful noPreview images

Author: BinaryQuantumSoul

html/card-no-preview.png

@@ -104,6 +104,7 @@ table.settings-value-table td { padding: 0.4em; border: 1px solid #ccc; max-widt
 .extra-network-cards .card:hover .actions { display: block; }
 .extra-network-cards .card:hover .overlay .tags { display: block; }
 .extra-network-cards .card .actions { font-size: 3em; display: none; text-align-last: right; cursor: pointer; font-variant: unicase; position: absolute; z-index: 100; right: 0; height: 0.7em; width: 100%; background: rgba(0, 0, 0, 0.40); }
+.extra-network-cards .card:has(>img[src*="card-no-preview.png"])::after { content: ''; position: absolute; width: 100%; height: 100%; opacity: 0.5; mix-blend-mode: multiply; background-color: var(--data-color); }
 #txt2img_description, #img2img_description { max-height: 63px; overflow-y: auto !important; }
 #txt2img_description > label > textarea, #img2img_description > label > textarea { font-size: 0.9em }
 

javascript/base.css

@@ -1,5 +1,6 @@
 import os
 import io
+import random
 import re
 import time
 import json
@@ -26,7 +27,7 @@
 debug = shared.log.trace if os.environ.get('SD_EN_DEBUG', None) is not None else lambda *args, **kwargs: None
 debug('Trace: EN')
 card_full = '''
-    <div class='card' onclick={card_click} title='{name}' data-tab='{tabname}' data-page='{page}' data-name='{name}' data-filename='{filename}' data-tags='{tags}' data-mtime='{mtime}' data-size='{size}' data-search='{search}'>
+    <div class='card' onclick={card_click} title='{name}' data-tab='{tabname}' data-page='{page}' data-name='{name}' data-filename='{filename}' data-tags='{tags}' data-mtime='{mtime}' data-size='{size}' data-search='{search}' style='--data-color: {color}'>
         <div class='overlay'>
             <div class='tags'></div>
             <div class='name'>{title}</div>
@@ -279,6 +280,12 @@ def allowed_directories_for_previews(self):
         return []
 
     def create_html(self, item, tabname):
+        def random_bright_color():
+            r = random.randint(100, 255)
+            g = random.randint(100, 255)
+            b = random.randint(100, 255)
+            return '#{:02x}{:02x}{:02x}'.format(r, g, b)
+
         try:
             args = {
                 "tabname": tabname,
@@ -297,6 +304,7 @@ def create_html(self, item, tabname):
                 "card_click": item.get("onclick", '"' + html.escape(f'return cardClicked({item.get("prompt", None)}, {"true" if self.allow_negative_prompt else "false"})') + '"'),
                 "mtime": item.get("mtime", 0),
                 "size": item.get("size", 0),
+                "color": random_bright_color(),
             }
             alias = item.get("alias", None)
             if alias is not None: