alphard/ComfyUI-Lora-Manager
1
0
Fork 0
mirror of https://github.com/willmiao/ComfyUI-Lora-Manager.git synced 2026-03-23 22:22:11 -03:00
Code Issues Packages Projects Releases Wiki Activity

feat: Update sidebar breadcrumb styles and enhance dropdown functionality

Browse Source
This commit is contained in:
Will Miao
2025-08-26 17:13:04 +08:00
parent d7949fbc30
commit 522a3ea88b
3 changed files with 69 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
static/css/base.css
View File

@@ -46,7 +46,7 @@ html, body {
/* Composed Colors */
--lora-accent: oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h));
--lora-surface: oklch(100% 0 0 / 0.98);
--lora-surface: oklch(97% 0 0 / 0.95);
--lora-border: oklch(90% 0.02 256 / 0.15);
--lora-text: oklch(95% 0.02 256);
--lora-error: oklch(75% 0.32 29);

36
static/css/components/sidebar.css
View File

@@ -238,19 +238,32 @@
align-items: center;
}
.breadcrumb-dropdown-toggle {
margin-left: 4px;
.breadcrumb-dropdown-indicator {
margin-left: 6px;
color: inherit;
opacity: 0.7;
transition: transform 0.2s ease;
opacity: 0.6;
transition: all 0.2s ease;
pointer-events: none;
font-size: 0.9em;
}
.breadcrumb-dropdown:hover .breadcrumb-dropdown-toggle {
opacity: 1;
.sidebar-breadcrumb-item:hover .breadcrumb-dropdown-indicator {
opacity: 0.9;
}
.breadcrumb-dropdown.open .breadcrumb-dropdown-toggle {
.sidebar-breadcrumb-item.placeholder {
color: var(--text-muted);
font-style: italic;
}
.sidebar-breadcrumb-item.placeholder:hover {
background: var(--lora-surface);
color: var(--text-color);
}
.breadcrumb-dropdown.open .breadcrumb-dropdown-indicator {
transform: rotate(180deg);
opacity: 1;
}
.breadcrumb-dropdown-menu {
@@ -265,7 +278,7 @@
box-shadow: 0 3px 8px rgba(0,0,0,0.15);
z-index: calc(var(--z-overlay) + 20);
overflow-y: auto;
max-height: 260px;
max-height: 450px;
display: none;
margin-top: 4px;
}
@@ -290,12 +303,7 @@
.breadcrumb-dropdown-item.active {
background: oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h) / 0.1);
color: var(--lora-accent);
}
.breadcrumb-dropdown-placeholder {
color: var(--text-muted);
font-style: italic;
padding: 6px 12px;
font-weight: 500;
}
/* Responsive Design */