Mirror/stable-diffusion-webui
1
0
Fork 0
mirror of https://github.com/AUTOMATIC1111/stable-diffusion-webui.git synced 2024-06-07 21:20:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

move clear filters button

Browse Source
This commit is contained in:
Sj-Si 2024-05-12 12:37:58 -04:00
parent f179df322c
commit 998e574ac4
3 changed files with 22 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
html/extra-networks-pane.html
View File

@ -16,6 +16,20 @@
</svg>
</button>
</div>
<div class="extra-network-controls--container">
<div class="extra-network-controls--header">Clear Filters</div>
<div class="extra-network-controls--buttons">
<button class="extra-network-control extra-network-control--clear-filters"
title="Clear all directory filters">
<svg class="extra-network-control--icon" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"
fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
stroke-width="1">
<path d="M 2 2 V 4 L 6 8 V 13 L 9 14 V 12 M 12 5 L 13 4 V 2 H 2" />
<path d="M 9 10 L 12 7 M 9 7 L 12 10" />
</svg>
</button>
</div>
</div>
<div class="extra-network-controls--container">
<div class="extra-network-controls--header">Sort Mode</div>
<div class="extra-network-controls--buttons">
@ -135,7 +149,8 @@
{dirs_html}
</div>
<div class="extra-network-content--tree-and-cards-view resize-handle-row">
<div class="extra-network-content extra-network-content--tree-view resize-handle-col" style="{tree_view_style}">
<div class="extra-network-content extra-network-content--tree-view resize-handle-col"
style="{tree_view_style}">
<div id='{tabname}_{extra_networks_tabname}_tree_list_loading_splash' class='extra-network-list-splash'>
{tree_list_loading_splash_content}</div>
<div id='{tabname}_{extra_networks_tabname}_tree_list_no_data_splash'
@ -146,18 +161,8 @@
class='extra-network-tree-content clusterize-content'></div>
</div>
</div>
<div class="extra-network-content extra-network-content--card-view extra-network-cards resize-handle-col" style="{card_view_style}">
<div class="extra-network-controls--buttons">
<button class="extra-network-control extra-network-control--clear-filters hidden"
title="Clear all directory filters">
<svg class="extra-network-control--icon" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"
fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
stroke-width="1">
<path d="M 2 2 V 4 L 6 8 V 13 L 9 14 V 12 M 12 5 L 13 4 V 2 H 2" />
<path d="M 9 10 L 12 7 M 9 7 L 12 10" />
</svg>
</button>
</div>
<div class="extra-network-content extra-network-content--card-view extra-network-cards resize-handle-col"
style="{card_view_style}">
<div id='{tabname}_{extra_networks_tabname}_card_list_loading_splash' class='extra-network-list-splash'>
{card_list_loading_splash_content}</div>
<div id='{tabname}_{extra_networks_tabname}_card_list_no_data_splash'

13
javascript/extraNetworks.js
View File

@ -437,17 +437,11 @@ class ExtraNetworksTab {
recurse = recurse === true || recurse === false ? recurse : false;
this.card_list.addDirectoryFilter(div_id, filter_str, recurse);
this.directory_filters[div_id] = {filter_str: filter_str, recurse: recurse};
const clear_btn = this.container_elem.querySelector(".extra-network-control--clear-filters");
clear_btn.classList.toggle("hidden", !Object.keys(this.directory_filters).length);
}
removeDirectoryFilter(div_id) {
this.card_list.removeDirectoryFilter(div_id);
delete this.directory_filters[div_id];
const clear_btn = this.container_elem.querySelector(".extra-network-control--clear-filters");
clear_btn.classList.toggle("hidden", !Object.keys(this.directory_filters).length);
}
clearDirectoryFilters({excluded_div_ids} = {}) {
@ -466,9 +460,6 @@ class ExtraNetworksTab {
}
delete this.directory_filters[div_id];
}
const clear_btn = this.container_elem.querySelector(".extra-network-control--clear-filters");
clear_btn.classList.toggle("hidden", !Object.keys(this.directory_filters).length);
}
setDirectoryFilters() {
@ -1136,8 +1127,8 @@ function extraNetworksControlSearchClearOnClick(event) {
function extraNetworksControlClearFiltersOnClick(event) {
/** Clears all directory filters applied to the cards list. */
const btn = event.target.closest(".extra-network-control--clear-filters");
const pane = btn.closest(".extra-network-pane");
const tab = extra_networks_tabs[pane.dataset.tabnameFull];
const controls = btn.closest(".extra-network-controls");
const tab = extra_networks_tabs[controls.dataset.tabnameFull];
tab.clearSelectedButtons();
tab.clearDirectoryFilters();

9
style.css
View File

@ -1378,6 +1378,7 @@ body.resizing .resize-handle {
gap: var(--spacing-sm);
box-sizing: border-box;
background: var(--input-background-fill);
overflow: hidden;
}
/* Add outline to the contianer when the inner search-text <input> has focus. */
@ -1425,8 +1426,7 @@ body.resizing .resize-handle {
/* "Clear" button on right of container. Invisible until user enters text in <input>. */
.extra-network-control--search .extra-network-control--search-clear {
visibility: hidden;
border-radius: 0 var(--input-radius) var(--input-radius) 0;
border: var(--input-border-width) solid transparent;
border-radius: 0;
transition: background var(--button-transition);
user-select: none;
cursor: pointer;
@ -1462,11 +1462,6 @@ body.resizing .resize-handle {
stroke: var(--input-placeholder-color);
}
.extra-network-control--clear-filters {
margin: 0 !important;
padding: 0 !important;
}
/* ==== ICONS ==== */
.extra-network-control--refresh:hover .extra-network-control--icon {
animation: extra-network-control--refresh-keyframe-rotate 3s infinite;