fix: inline copy icon at end of user query text, not a toolbar

This commit is contained in:
gramps
2026-07-13 16:04:24 -07:00
parent 6c214e46f5
commit 962003512f
+6 -2
View File
@@ -209,6 +209,8 @@ body { font-family: var(--font-body); background: var(--bg-primary); color: var(
.input-row textarea { flex:1; background:var(--bg-tertiary); border:1px solid var(--border); color:var(--text-primary); font-family:var(--font-body); font-size:14px; padding:12px 14px; border-radius:var(--radius); resize:none; min-height:44px; max-height:200px; line-height:1.5; }
.input-row textarea:focus { outline:none; border-color:var(--accent-dim); }
.input-row textarea::placeholder { color:var(--text-muted); }
.user-copy-btn { display:inline; cursor:pointer; font-size:13px; margin-left:6px; opacity:0.4; transition:opacity 0.15s; user-select:none; }
.user-copy-btn:hover { opacity:1; }
.paperclip-btn { padding:12px 12px; background:var(--bg-tertiary); border:1px solid var(--border); border-radius:var(--radius); color:var(--text-secondary); font-size:18px; cursor:pointer; transition:all 0.2s; line-height:1; }
.paperclip-btn:hover { background:var(--bg-hover); color:var(--accent); border-color:var(--accent-dim); }
.send-btn { padding:12px 20px; background:var(--accent-dim); border:none; border-radius:var(--radius); color:#fff; font-family:var(--font-mono); font-size:13px; font-weight:600; cursor:pointer; white-space:nowrap; }
@@ -1433,7 +1435,9 @@ function appendMessage(role, content, animate, isSearch = false, afterEl = null)
const months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
const ms = now.getMilliseconds();
const timeStr = months[now.getMonth()] + ' ' + String(now.getDate()).padStart(2,'0') + ', ' + now.getFullYear() + ' ' + String(now.getHours()).padStart(2,'0') + ':' + String(now.getMinutes()).padStart(2,'0') + ':' + String(now.getSeconds()).padStart(2,'0') + '.' + String(Math.floor(ms / 10)).padStart(2,'0');
div.innerHTML = `<div class="avatar">${role === 'user' ? 'YOU' : 'AI'}</div><div class="content"><div class="role-label">${role}${role === 'user' ? ' <span class="msg-time">' + timeStr + '</span>' : ''}</div><div class="text">${content ? renderMarkdown(content) : ''}</div><div class="msg-toolbar"></div></div>`;
const textHtml = content ? renderMarkdown(content) : '';
const copyIcon = role === 'user' && content ? `<span class="user-copy-btn" onclick="event.stopPropagation();navigator.clipboard.writeText(${JSON.stringify(content)}).then(()=>{this.textContent='✓';setTimeout(()=>this.innerHTML='📋',1500)})">📋</span>` : '';
div.innerHTML = `<div class="avatar">${role === 'user' ? 'YOU' : 'AI'}</div><div class="content"><div class="role-label">${role}${role === 'user' ? ' <span class="msg-time">' + timeStr + '</span>' : ''}</div><div class="text">${textHtml}${copyIcon}</div>${role === 'assistant' ? '<div class="msg-toolbar"></div>' : ''}</div>`;
if (role === 'user') {
const pair = document.createElement('div');
pair.className = 'msg-pair' + (isSearch ? ' search-pair' : '');
@@ -1449,7 +1453,7 @@ function appendMessage(role, content, animate, isSearch = false, afterEl = null)
} else {
container.prepend(div);
}
if (content) { addCopyButtons(div); addMessageToolbar(div); }
if (content && role === 'assistant') { addCopyButtons(div); addMessageToolbar(div); }
scrollToTop();
return div;
}