improve styles, better logging

This commit is contained in:
Vladimir Mandic
2023-09-09 13:47:46 -04:00
parent c98a4ddb6a
commit 7bda411738
21 changed files with 215 additions and 133 deletions
+1 -1
View File
@@ -77,7 +77,7 @@ svg.feather.feather-image, .feather .feather-image { display: none }
.py-6 { padding-bottom: 0; }
.tabs { background-color: var(--background-color); }
.block.token-counter span { background-color: var(--input-background-fill) !important; box-shadow: 2px 2px 2px #111; border: none !important; font-size: 0.8rem; }
.tab-nav { zoom: 120%; margin-bottom: 10px; border-bottom: 2px solid var(--highlight-color) !important; padding-bottom: 2px; }
.tab-nav { zoom: 120%; margin-top: 10px; margin-bottom: 10px; border-bottom: 2px solid var(--highlight-color) !important; padding-bottom: 2px; }
.label-wrap { margin: 16px 0px 8px 0px; }
.gradio-slider input[type="number"] { width: 4.5em; font-size: 0.8rem; height: 20px; }
.gradio-button.tool { border: none; background: none; box-shadow: none; filter: hue-rotate(340deg) saturate(0.5); }
+1 -1
View File
@@ -284,7 +284,7 @@ function extraNetworksSearchButton(event) {
updateInput(searchTextarea);
}
function extraNetworksRefreshButton() {
function getENActivePage() {
const tabname = getENActiveTab();
const page = gradioApp().querySelector(`#${tabname}_extra_networks > .tabs > .tab-nav > .selected`);
return page ? page.innerText : '';
+1 -1
View File
@@ -77,7 +77,7 @@ svg.feather.feather-image, .feather .feather-image { display: none }
.py-6 { padding-bottom: 0; }
.tabs { background-color: var(--background-color); }
.block.token-counter span { background-color: var(--input-background-fill) !important; box-shadow: 2px 2px 2px #111; border: none !important; font-size: 0.8rem; }
.tab-nav { zoom: 120%; margin-bottom: 10px; border-bottom: 2px solid var(--highlight-color) !important; padding-bottom: 2px; }
.tab-nav { zoom: 120%; margin-top: 10px; margin-bottom: 10px; border-bottom: 2px solid var(--highlight-color) !important; padding-bottom: 2px; }
.label-wrap { margin: 16px 0px 8px 0px; }
.gradio-slider input[type="number"] { width: 4.5em; font-size: 0.8rem; height: 20px; }
.gradio-button.tool { border: none; background: none; box-shadow: none; filter: hue-rotate(340deg) saturate(0.5); }
@@ -3,15 +3,17 @@
// Counts open and closed brackets (round, square, curly) in the prompt and negative prompt text boxes in the txt2img and img2img tabs.
// If there's a mismatch, the keyword counter turns red and if you hover on it, a tooltip tells you what's wrong.
let promptCheckerInitialized = false;
function checkBrackets(textArea, counterElt) {
const counts = {};
(textArea.value.match(/[(){}[\]]/g) || []).forEach((bracket) => { counts[bracket] = (counts[bracket] || 0) + 1; });
const errors = [];
function checkPair(open, close, kind) {
if (counts[open] !== counts[close]) errors.push(`${open}...${close} - Detected ${counts[open] || 0} opening and ${counts[close] || 0} closing ${kind}.`);
}
(textArea.value.match(/[(){}[\]]/g) || []).forEach((bracket) => { counts[bracket] = (counts[bracket] || 0) + 1; });
checkPair('(', ')', 'round brackets');
checkPair('[', ']', 'square brackets');
checkPair('{', '}', 'curly brackets');
@@ -22,10 +24,14 @@ function checkBrackets(textArea, counterElt) {
function setupBracketChecking(idPrompt, idCounter) {
const textarea = gradioApp().querySelector(`#${idPrompt} > label > textarea`);
const counter = gradioApp().getElementById(idCounter);
if (textarea && counter) textarea.addEventListener('input', () => checkBrackets(textarea, counter));
if (!textarea || !counter) return;
if (!promptCheckerInitialized) log('promptChecker');
promptCheckerInitialized = true;
textarea.addEventListener('input', () => checkBrackets(textarea, counter));
}
onAfterUiUpdate(() => {
if (promptCheckerInitialized) return;
setupBracketChecking('txt2img_prompt', 'txt2img_token_counter');
setupBracketChecking('txt2img_neg_prompt', 'txt2img_negative_token_counter');
setupBracketChecking('img2img_prompt', 'img2img_token_counter');
+1 -1
View File
@@ -19,7 +19,7 @@ div.gradio-html.min{ min-height: 0; }
.gradio-dropdown label span:not(.has-info), .gradio-textbox label span:not(.has-info), .gradio-number label span:not(.has-info) { margin-bottom: 0; }
.gradio-dropdown ul.options li.item { padding: 0.05em 0; }
.gradio-dropdown ul.options li.item:not(:has(.hide)) { background-color: var(--neutral-100); }
.gradio-dropdown ul.options{ z-index: 3000; min-width: fit-content; max-width: inherit; white-space: nowrap; }
.gradio-dropdown ul.options { z-index: 3000; min-width: fit-content; max-width: inherit; max-height: 25vh !important; white-space: nowrap; }
.gradio-dropdown:not(.multiselect) .wrap-inner.wrap-inner.wrap-inner{ flex-wrap: unset; }
.gradio-dropdown.multiselect .token-remove.remove-all.remove-all{ display: flex; }
.gradio-dropdown.multiselect div.wrap-inner { overflow-x: hidden; overflow-y: auto; max-height: 50vh; overflow-wrap: anywhere; }