Scott.Idem/Cortex-Inara
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Lucide icons on edit/del/copy and inline edit save/cancel buttons

Browse Source 
pencil → edit, trash-2 → del, copy → copy, check → copied feedback,
check → Save, x → Cancel. All small action buttons get inline-flex
alignment for consistent icon+label layout.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Scott Idem
2026-03-26 23:32:19 -04:00
parent 826bd6cfe3
commit 4f09823afe
2 changed files with 23 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
cortex/static/app.js
View File

@@ -541,20 +541,21 @@
const editBtn = document.createElement('button'); const editBtn = document.createElement('button');
editBtn.className = 'msg-act-btn'; editBtn.className = 'msg-act-btn';
editBtn.textContent = 'edit'; editBtn.innerHTML = icon_html('pencil', 12) + ' edit';
editBtn.addEventListener('click', () => { editBtn.addEventListener('click', () => {
startEdit(msgDiv); startEdit(msgDiv);
}); });
const delBtn = document.createElement('button'); const delBtn = document.createElement('button');
delBtn.className = 'msg-act-btn del'; delBtn.className = 'msg-act-btn del';
delBtn.textContent = 'del'; delBtn.innerHTML = icon_html('trash-2', 12) + ' del';
delBtn.addEventListener('click', () => { delBtn.addEventListener('click', () => {
deleteMsg(wrapper); deleteMsg(wrapper);
}); });
actionsDiv.appendChild(editBtn); actionsDiv.appendChild(editBtn);
actionsDiv.appendChild(delBtn); actionsDiv.appendChild(delBtn);
render_icons();
} }
// After any currentHistory splice, renumber all wrapper data-hist-idx attributes. // After any currentHistory splice, renumber all wrapper data-hist-idx attributes.
@@ -587,17 +588,18 @@
ta.rows = Math.min(originalText.split('\n').length + 1, 12); ta.rows = Math.min(originalText.split('\n').length + 1, 12);
const saveBtn = document.createElement('button'); const saveBtn = document.createElement('button');
saveBtn.textContent = 'Save'; saveBtn.innerHTML = icon_html('check', 13) + ' Save';
saveBtn.className = 'edit-save-btn'; saveBtn.className = 'edit-save-btn';
const cancelBtn = document.createElement('button'); const cancelBtn = document.createElement('button');
cancelBtn.textContent = 'Cancel'; cancelBtn.innerHTML = icon_html('x', 13) + ' Cancel';
cancelBtn.className = 'edit-cancel-btn'; cancelBtn.className = 'edit-cancel-btn';
const btnRow = document.createElement('div'); const btnRow = document.createElement('div');
btnRow.className = 'edit-btns'; btnRow.className = 'edit-btns';
btnRow.appendChild(saveBtn); btnRow.appendChild(saveBtn);
btnRow.appendChild(cancelBtn); btnRow.appendChild(cancelBtn);
render_icons();
msgDiv.innerHTML = ''; msgDiv.innerHTML = '';
msgDiv.appendChild(ta); msgDiv.appendChild(ta);
@@ -672,7 +674,8 @@
function makeCopyBtn(div) { function makeCopyBtn(div) {
const btn = document.createElement('button'); const btn = document.createElement('button');
btn.className = 'copy-btn'; btn.className = 'copy-btn';
btn.textContent = 'copy'; btn.innerHTML = icon_html('copy', 12) + ' copy';
render_icons();
btn.addEventListener('click', (e) => { btn.addEventListener('click', (e) => {
e.stopPropagation(); e.stopPropagation();
const text = div.dataset.raw || ''; const text = div.dataset.raw || '';
@@ -681,11 +684,13 @@
} else { } else {
fallbackCopy(text); fallbackCopy(text);
} }
btn.textContent = '✓'; btn.innerHTML = icon_html('check', 12) + ' copied';
render_icons();
btn.classList.add('copied'); btn.classList.add('copied');
setTimeout(() => { setTimeout(() => {
btn.textContent = 'copy'; btn.innerHTML = icon_html('copy', 12) + ' copy';
btn.classList.remove('copied'); btn.classList.remove('copied');
render_icons();
}, 1500); }, 1500);
}); });
return btn; return btn;

9
cortex/static/style.css
View File

@@ -454,6 +454,9 @@
.message.assistant { position: relative; } .message.assistant { position: relative; }
.copy-btn { .copy-btn {
display: inline-flex;
align-items: center;
gap: 4px;
position: absolute; position: absolute;
top: 7px; top: 7px;
right: 8px; right: 8px;
@@ -714,6 +717,9 @@
.msg-wrapper:hover .msg-actions { opacity: 1; } .msg-wrapper:hover .msg-actions { opacity: 1; }
.msg-act-btn { .msg-act-btn {
display: inline-flex;
align-items: center;
gap: 4px;
background: none; background: none;
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: 4px; border-radius: 4px;
@@ -751,6 +757,9 @@
} }
.edit-save-btn, .edit-cancel-btn { .edit-save-btn, .edit-cancel-btn {
display: inline-flex;
align-items: center;
gap: 4px;
background: none; background: none;
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: 4px; border-radius: 4px;