alphard/ComfyUI-Lora-Manager
1
0
Fork 0
mirror of https://github.com/willmiao/ComfyUI-Lora-Manager.git synced 2026-06-09 20:39:25 -03:00
Code Issues Packages Projects Releases Wiki Activity

refactor(phase-4): standardize remaining transitions and box-shadows

Browse Source 
- Replace all remaining 'transition: all' with specific token-based transitions
- Replace 80+ hardcoded box-shadow rgba values with semantic tokens
- Add new tokens: --shadow-side, --shadow-elevated, --shadow-dialog, --shadow-inset-top
- Update dark theme overrides for new shadow tokens
- 32 files changed, net +8 lines (more consistent, less duplication)
This commit is contained in:
Will Miao
2026-06-09 14:27:53 +08:00
parent 5797ce9408
commit 18577fa336
32 changed files with 177 additions and 169 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
static/css/components/lora-modal/lora-modal.css
View File

@@ -483,7 +483,7 @@
color: var(--text-color);
cursor: pointer;
font-size: 0.95em;
transition: all 0.2s;
transition: var(--transition-base);
opacity: 0.7;
position: relative;
}
@@ -893,7 +893,7 @@
border-radius: var(--border-radius-sm);
max-width: fit-content;
cursor: pointer;
transition: all 0.2s;
transition: var(--transition-base);
}
[data-theme="dark"] .creator-info,
@@ -965,7 +965,7 @@
cursor: pointer;
font-weight: 500;
font-size: 0.9em;
transition: all 0.2s;
transition: var(--transition-base);
}
.civitai-view i {
@@ -988,7 +988,7 @@
cursor: pointer;
font-weight: 500;
font-size: 0.9em;
transition: all 0.2s;
transition: var(--transition-base);
}
[data-theme="dark"] .modal-send-btn {

4
static/css/components/lora-modal/preset-tags.css
View File

@@ -28,7 +28,7 @@
border-radius: var(--border-radius-xs);
padding: calc(var(--space-1) * 0.5) var(--space-1);
gap: var(--space-1);
transition: all 0.2s ease;
transition: var(--transition-base);
}
.preset-tag span {
@@ -40,7 +40,7 @@
color: var(--text-color);
opacity: 0.5;
cursor: pointer;
transition: all 0.2s ease;
transition: var(--transition-base);
}
.preset-tag:hover {

16
static/css/components/lora-modal/showcase.css
View File

@@ -111,8 +111,8 @@
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.2s ease;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
transition: var(--transition-base);
box-shadow: var(--shadow-md);
padding: 0;
position: relative;
overflow: hidden;
@@ -120,7 +120,7 @@
.media-control-btn:hover {
transform: translateY(-2px);
box-shadow: 0 3px 7px rgba(0, 0, 0, 0.2);
box-shadow: var(--shadow-lg);
}
.media-control-btn.set-preview-btn:hover {
@@ -205,7 +205,7 @@
z-index: 5;
max-height: 50%; /* Reduced to take less space */
overflow-y: auto;
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
box-shadow: var(--shadow-inset-top);
opacity: 0;
pointer-events: none;
}
@@ -220,7 +220,7 @@
/* Adjust to dark theme */
[data-theme="dark"] .image-metadata-panel {
background: var(--card-bg);
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.3);
box-shadow: var(--shadow-inset-top);
}
.metadata-content {
@@ -312,7 +312,7 @@
opacity: 0.6;
cursor: pointer;
padding: 3px;
transition: all 0.2s ease;
transition: var(--transition-base);
}
.copy-prompt-btn:hover {
@@ -409,7 +409,7 @@
border-radius: var(--border-radius-sm);
padding: var(--space-4);
text-align: center;
transition: all 0.3s ease;
transition: var(--transition-slow);
background: var(--lora-surface);
cursor: pointer;
}
@@ -471,7 +471,7 @@
display: flex;
align-items: center;
gap: 8px;
transition: all 0.2s;
transition: var(--transition-base);
}
.select-files-btn:hover {

6
static/css/components/lora-modal/tag.css
View File

@@ -73,14 +73,14 @@
background: var(--card-bg);
border: 1px solid var(--border-color);
border-radius: var(--border-radius-sm);
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15);
box-shadow: var(--shadow-lg);
padding: 10px 14px;
max-width: 400px;
z-index: 10;
opacity: 0;
visibility: hidden;
transform: translateY(-4px);
transition: all 0.2s ease;
transition: var(--transition-base);
pointer-events: none;
}
@@ -130,7 +130,7 @@
cursor: pointer;
padding: 2px 5px;
border-radius: var(--border-radius-xs);
transition: all 0.2s ease;
transition: var(--transition-base);
margin-left: var(--space-1);
}

2
static/css/components/lora-modal/triggerwords.css
View File

@@ -48,7 +48,7 @@
border-radius: var(--border-radius-xs);
padding: 4px 8px;
cursor: pointer;
transition: all 0.2s ease;
transition: var(--transition-base);
gap: 6px;
position: relative;
}

4
static/css/components/lora-modal/versions.css
View File

@@ -146,7 +146,7 @@
background: color-mix(in oklch, var(--card-bg) 92%, var(--bg-color) 8%);
border: 1px solid var(--lora-border);
border-radius: var(--border-radius-sm);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
box-shadow: var(--shadow-xs);
transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
@@ -156,7 +156,7 @@
.model-version-row:hover {
transform: translateY(-1px);
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
box-shadow: var(--shadow-xl);
}
.model-version-row.is-clickable {