diff --git a/static/css/base.css b/static/css/base.css index 4ad7452b..3619dd85 100644 --- a/static/css/base.css +++ b/static/css/base.css @@ -29,6 +29,7 @@ html, body { :root { --bg-color: #ffffff; --text-color: #333333; + --text-muted: #6c757d; --card-bg: #ffffff; --border-color: #e0e0e0; @@ -84,6 +85,7 @@ html[data-theme="light"] { [data-theme="dark"] { --bg-color: #1a1a1a; --text-color: #e0e0e0; + --text-muted: #a0a0a0; --card-bg: #2d2d2d; --border-color: #404040; diff --git a/static/css/components/menu.css b/static/css/components/menu.css index 108f50e3..566f71db 100644 --- a/static/css/components/menu.css +++ b/static/css/components/menu.css @@ -195,4 +195,26 @@ .send-all-item i { width: 16px; text-align: center; +} + +/* Node Selector Header */ +.node-selector-header { + padding: 10px 15px; + border-bottom: 1px solid var(--border-color); + background: var(--card-bg); + display: flex; + flex-direction: column; + gap: 4px; +} + +.selector-action-type { + font-weight: 600; + font-size: 14px; + color: var(--lora-accent); +} + +.selector-instruction { + font-size: 12px; + color: var(--text-muted); + font-style: italic; } \ No newline at end of file diff --git a/static/js/utils/uiHelpers.js b/static/js/utils/uiHelpers.js index a74b0aa5..a9ba3335 100644 --- a/static/js/utils/uiHelpers.js +++ b/static/js/utils/uiHelpers.js @@ -434,7 +434,15 @@ function showNodeSelector(nodes, loraSyntax, replaceMode, syntaxType) { `; }).join(''); + // Add header with action mode indicator + const actionType = syntaxType === 'recipe' ? 'Recipe' : 'LoRA'; + const actionMode = replaceMode ? 'Replace' : 'Append'; + selector.innerHTML = ` +
+ ${actionMode} ${actionType} + Select target node +
${nodeItems}