diff options
| -rw-r--r-- | html/extra-networks-card.html | 5 | ||||
| -rw-r--r-- | modules/ui_extra_networks.py | 5 | ||||
| -rw-r--r-- | style.css | 7 |
3 files changed, 12 insertions, 5 deletions
diff --git a/html/extra-networks-card.html b/html/extra-networks-card.html index ef4b613a..fe90b028 100644 --- a/html/extra-networks-card.html +++ b/html/extra-networks-card.html @@ -1,6 +1,6 @@ -<div class='card' style={style} onclick={card_clicked}> +<div class='card' onclick={card_clicked}> + {background_image} {metadata_button} - <div class='actions'> <div class='additional'> <ul> @@ -12,4 +12,3 @@ <span class='description'>{description}</span> </div> </div> - diff --git a/modules/ui_extra_networks.py b/modules/ui_extra_networks.py index daea03d6..1488445e 100644 --- a/modules/ui_extra_networks.py +++ b/modules/ui_extra_networks.py @@ -149,14 +149,15 @@ class ExtraNetworksPage: height = f"height: {shared.opts.extra_networks_card_height}px;" if shared.opts.extra_networks_card_height else ''
width = f"width: {shared.opts.extra_networks_card_width}px;" if shared.opts.extra_networks_card_width else ''
- background_image = f"background-image: url(\"{html.escape(preview)}\");" if preview else ''
+ background_image = f'<img src="{html.escape(preview)}" class="preview" loading="lazy">' if preview else ''
metadata_button = ""
metadata = item.get("metadata")
if metadata:
metadata_button = f"<div class='metadata-button' title='Show metadata' onclick='extraNetworksRequestMetadata(event, {json.dumps(self.name)}, {json.dumps(item['name'])})'></div>"
args = {
- "style": f"'{height}{width}{background_image}'",
+ "background_image": background_image,
+ "style": f"'{height}{width}'",
"prompt": item.get("prompt", None),
"tabname": json.dumps(tabname),
"local_preview": json.dumps(item["local_preview"]),
@@ -784,3 +784,10 @@ footer { .extra-network-cards .card ul a:hover{
color: red;
}
+
+.extra-network-cards .card .preview{
+ position: absolute;
+ object-fit: cover;
+ width: 100%;
+ height:100%;
+}
|