From 720974b1186eb974cd81d33ef19b8e7e3c0c63e6 Mon Sep 17 00:00:00 2001 From: "Dr.Lt.Data" Date: Thu, 7 Dec 2023 20:49:28 +0900 Subject: [PATCH] layout update --- __init__.py | 2 +- js/a1111-alter-downloader.js | 4 +++- js/comfyui-manager.js | 24 +++++++++++++++++++++--- js/common.js | 2 +- js/custom-nodes-downloader.js | 6 ++++-- js/model-downloader.js | 6 ++++-- js/snapshot.js | 6 ++++-- 7 files changed, 38 insertions(+), 12 deletions(-) diff --git a/__init__.py b/__init__.py index 79ea65b..a35ae88 100644 --- a/__init__.py +++ b/__init__.py @@ -17,7 +17,7 @@ import http.client import re import signal -version = "V1.6.5" +version = "V1.7" print(f"### Loading: ComfyUI-Manager ({version})") diff --git a/js/a1111-alter-downloader.js b/js/a1111-alter-downloader.js index 36285f7..4f75ccb 100644 --- a/js/a1111-alter-downloader.js +++ b/js/a1111-alter-downloader.js @@ -502,7 +502,7 @@ export class AlternativesInstaller extends ComfyDialog { createHeaderControls() { let self = this; - this.search_box = $el('input', {type:'text', id:'manager-alternode-search-box', placeholder:'input search keyword', value:this.search_keyword}, []); + this.search_box = $el('input.cm-search-filter', {type:'text', id:'manager-alternode-search-box', placeholder:'input search keyword', value:this.search_keyword}, []); this.search_box.style.height = "25px"; this.search_box.onkeydown = (event) => { if (event.key === 'Enter') { @@ -516,6 +516,7 @@ export class AlternativesInstaller extends ComfyDialog { }; let search_button = document.createElement("button"); + search_button.className = "cm-small-button"; search_button.innerHTML = "Search"; search_button.onclick = () => { self.search_keyword = self.search_box.value; @@ -539,6 +540,7 @@ export class AlternativesInstaller extends ComfyDialog { async createBottomControls() { var close_button = document.createElement("button"); + close_button.className = "cm-small-button"; close_button.innerHTML = "Close"; close_button.onclick = () => { this.close(); } close_button.style.display = "inline-block"; diff --git a/js/comfyui-manager.js b/js/comfyui-manager.js index 1727c71..3e44e2d 100644 --- a/js/comfyui-manager.js +++ b/js/comfyui-manager.js @@ -13,7 +13,7 @@ var docStyle = document.createElement('style'); docStyle.innerHTML = ` #cm-manager-dialog { width: 1000px; - height: 360px; + height: 410px; box-sizing: content-box; z-index: 10000; } @@ -136,9 +136,27 @@ const style = ` .cm-button { width: 310px; - height: 27px; + height: 30px; + position: relative; + overflow: hidden; + font-size: 17px !important; +} + +.cm-small-button { + width: 120px; + height: 30px; + position: relative; + overflow: hidden; + box-sizing: border-box; + font-size: 17px !important; +} + +.cm-search-filter { + width: 200px; + height: 30px !important; position: relative; overflow: hidden; + box-sizing: border-box; } #cm-close-button { @@ -336,7 +354,7 @@ async function updateAll(update_check_checkbox, manager_dialog) { return false; } if(response1.status == 201 || response2.status == 201) { - app.ui.dialog.show("ComfyUI and all extensions have been updated to the latest version.
To apply the updated custom node, please ComfyUI. And refresh browser."); + app.ui.dialog.show("ComfyUI and all extensions have been updated to the latest version.
To apply the updated custom node, please ComfyUI. And refresh browser."); const rebootButton = document.getElementById('cm-reboot-button'); rebootButton.onclick = function() { diff --git a/js/common.js b/js/common.js index 1cbd837..aa7c7b1 100644 --- a/js/common.js +++ b/js/common.js @@ -65,7 +65,7 @@ export async function install_checked_custom_node(grid_rows, target_i, caller, m } await caller.invalidateControl(); - caller.updateMessage("
To apply the installed/updated/disabled/enabled custom node, please ComfyUI. And refresh browser.", 'cm-reboot-button'); + caller.updateMessage("
To apply the installed/updated/disabled/enabled custom node, please ComfyUI. And refresh browser.", 'cm-reboot-button'); } }; diff --git a/js/custom-nodes-downloader.js b/js/custom-nodes-downloader.js index 40d6a7d..6ad0ab4 100644 --- a/js/custom-nodes-downloader.js +++ b/js/custom-nodes-downloader.js @@ -669,7 +669,7 @@ export class CustomNodesInstaller extends ComfyDialog { createHeaderControls() { let self = this; - this.search_box = $el('input', {type:'text', id:'manager-customnode-search-box', placeholder:'input search keyword', value:this.search_keyword}, []); + this.search_box = $el('input.cm-search-filter', {type:'text', id:'manager-customnode-search-box', placeholder:'input search keyword', value:this.search_keyword}, []); this.search_box.style.height = "25px"; this.search_box.onkeydown = (event) => { if (event.key === 'Enter') { @@ -684,6 +684,7 @@ export class CustomNodesInstaller extends ComfyDialog { let search_button = document.createElement("button"); + search_button.className = "cm-small-button"; search_button.innerHTML = "Search"; search_button.onclick = () => { self.search_keyword = self.search_box.value; @@ -714,7 +715,8 @@ export class CustomNodesInstaller extends ComfyDialog { } async createBottomControls() { - let close_button = document.createElement("button"); + var close_button = document.createElement("button"); + close_button.className = "cm-small-button"; close_button.innerHTML = "Close"; close_button.onclick = () => { this.close(); } close_button.style.display = "inline-block"; diff --git a/js/model-downloader.js b/js/model-downloader.js index c27d987..9616ae7 100644 --- a/js/model-downloader.js +++ b/js/model-downloader.js @@ -64,7 +64,7 @@ export class ModelInstaller extends ComfyDialog { createControls() { return [ - $el("button", { + $el("button.cm-small-button", { type: "button", textContent: "Close", onclick: () => { this.close(); } @@ -326,7 +326,7 @@ export class ModelInstaller extends ComfyDialog { createHeaderControls() { let self = this; - this.search_box = $el('input', {type:'text', id:'manager-model-search-box', placeholder:'input search keyword', value:this.search_keyword}, []); + this.search_box = $el('input.cm-search-filter', {type:'text', id:'manager-model-search-box', placeholder:'input search keyword', value:this.search_keyword}, []); this.search_box.style.height = "25px"; this.search_box.onkeydown = (event) => { if (event.key === 'Enter') { @@ -340,6 +340,7 @@ export class ModelInstaller extends ComfyDialog { }; let search_button = document.createElement("button"); + search_button.className = "cm-small-button"; search_button.innerHTML = "Search"; search_button.onclick = () => { self.search_keyword = self.search_box.value; @@ -363,6 +364,7 @@ export class ModelInstaller extends ComfyDialog { async createBottomControls() { var close_button = document.createElement("button"); + close_button.className = "cm-small-button"; close_button.innerHTML = "Close"; close_button.onclick = () => { this.close(); } close_button.style.display = "inline-block"; diff --git a/js/snapshot.js b/js/snapshot.js index ba379dd..e4a720e 100644 --- a/js/snapshot.js +++ b/js/snapshot.js @@ -23,7 +23,7 @@ async function restore_snapshot(target) { } finally { await SnapshotManager.instance.invalidateControl(); - SnapshotManager.instance.updateMessage("
To apply the snapshot, please ComfyUI. And refresh browser.", 'cm-reboot-button'); + SnapshotManager.instance.updateMessage("
To apply the snapshot, please ComfyUI. And refresh browser.", 'cm-reboot-button'); } } } @@ -102,7 +102,7 @@ export class SnapshotManager extends ComfyDialog { createControls() { return [ - $el("button", { + $el("button.cm-small-button", { type: "button", textContent: "Close", onclick: () => { this.close(); } @@ -258,11 +258,13 @@ export class SnapshotManager extends ComfyDialog { async createBottomControls() { var close_button = document.createElement("button"); + close_button.className = "cm-small-button"; close_button.innerHTML = "Close"; close_button.onclick = () => { this.close(); } close_button.style.display = "inline-block"; var save_button = document.createElement("button"); + save_button.className = "cm-small-button"; save_button.innerHTML = "Save snapshot"; save_button.onclick = () => { save_current_snapshot(); } save_button.style.display = "inline-block";