fix: inline copy icon at end of user query text, not a toolbar
This commit is contained in:
@@ -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 { 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:focus { outline:none; border-color:var(--accent-dim); }
|
||||||
.input-row textarea::placeholder { color:var(--text-muted); }
|
.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 { 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); }
|
.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; }
|
.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 months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
|
||||||
const ms = now.getMilliseconds();
|
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');
|
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') {
|
if (role === 'user') {
|
||||||
const pair = document.createElement('div');
|
const pair = document.createElement('div');
|
||||||
pair.className = 'msg-pair' + (isSearch ? ' search-pair' : '');
|
pair.className = 'msg-pair' + (isSearch ? ' search-pair' : '');
|
||||||
@@ -1449,7 +1453,7 @@ function appendMessage(role, content, animate, isSearch = false, afterEl = null)
|
|||||||
} else {
|
} else {
|
||||||
container.prepend(div);
|
container.prepend(div);
|
||||||
}
|
}
|
||||||
if (content) { addCopyButtons(div); addMessageToolbar(div); }
|
if (content && role === 'assistant') { addCopyButtons(div); addMessageToolbar(div); }
|
||||||
scrollToTop();
|
scrollToTop();
|
||||||
return div;
|
return div;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user