mirror of
https://github.com/willmiao/ComfyUI-Lora-Manager.git
synced 2026-03-21 21:22:11 -03:00
feat(ui): improve filter preset delete button visibility and layout
- Hide delete button by default and show on hover for inactive presets - Show delete button on active presets only when hovering over the preset - Add ellipsis truncation for long preset names to prevent layout breakage - Remove checkmark icon from active preset names for cleaner visual design
This commit is contained in:
@@ -512,6 +512,10 @@
|
||||
|
||||
.filter-preset.active .preset-delete-btn {
|
||||
color: white;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.filter-preset:hover.active .preset-delete-btn {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
@@ -529,13 +533,16 @@
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
white-space: nowrap;
|
||||
max-width: 120px; /* Prevent long names from breaking layout */
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.preset-delete-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
color: var(--text-color);
|
||||
opacity: 0.5;
|
||||
opacity: 0; /* Hidden by default */
|
||||
cursor: pointer;
|
||||
padding: 4px;
|
||||
display: flex;
|
||||
@@ -546,6 +553,10 @@
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.filter-preset:hover .preset-delete-btn {
|
||||
opacity: 0.5; /* Show on hover */
|
||||
}
|
||||
|
||||
.preset-delete-btn:hover {
|
||||
opacity: 1;
|
||||
color: var(--lora-error, #e74c3c);
|
||||
|
||||
@@ -751,12 +751,7 @@ export class FilterPresetManager {
|
||||
|
||||
const presetName = document.createElement('span');
|
||||
presetName.className = 'preset-name';
|
||||
|
||||
if (isActive) {
|
||||
presetName.innerHTML = `<i class="fas fa-check"></i> ${preset.name}`;
|
||||
} else {
|
||||
presetName.textContent = preset.name;
|
||||
}
|
||||
presetName.title = translate('header.filter.presetClickTooltip', { name: preset.name }, `Click to apply preset "${preset.name}"`);
|
||||
|
||||
const deleteBtn = document.createElement('button');
|
||||
|
||||
Reference in New Issue
Block a user