feat: add trash-can icon to left of each conversation in sidebar
Replace the hover-reveal × on the right with an always-visible 🗑 icon positioned to the left of the conversation title. Clicking it triggers the existing deleteConversation() which shows a confirm dialog and enforces admin-only access.
This commit is contained in:
@@ -47,13 +47,12 @@ body { font-family: var(--font-body); background: var(--bg-primary); color: var(
|
|||||||
.delete-all-btn { padding: 10px 12px; background: transparent; border: 1px solid var(--danger); border-radius: var(--radius); color: var(--danger); font-size: 14px; cursor: pointer; transition: all 0.2s; }
|
.delete-all-btn { padding: 10px 12px; background: transparent; border: 1px solid var(--danger); border-radius: var(--radius); color: var(--danger); font-size: 14px; cursor: pointer; transition: all 0.2s; }
|
||||||
.delete-all-btn:hover { background: var(--danger); color: #fff; }
|
.delete-all-btn:hover { background: var(--danger); color: #fff; }
|
||||||
.conversation-list { flex: 1; overflow-y: auto; padding: 8px; }
|
.conversation-list { flex: 1; overflow-y: auto; padding: 8px; }
|
||||||
.conv-item { padding: 10px 12px; border-radius: var(--radius); cursor: pointer; margin-bottom: 2px; display: flex; justify-content: space-between; align-items: center; transition: background 0.15s; font-size: 13px; color: var(--text-secondary); }
|
.conv-item { padding: 10px 12px; border-radius: var(--radius); cursor: pointer; margin-bottom: 2px; display: flex; align-items: center; gap: 8px; transition: background 0.15s; font-size: 13px; color: var(--text-secondary); }
|
||||||
.conv-item:hover { background: var(--bg-hover); color: var(--text-primary); }
|
.conv-item:hover { background: var(--bg-hover); color: var(--text-primary); }
|
||||||
.conv-item.active { background: var(--bg-tertiary); color: var(--text-primary); }
|
.conv-item.active { background: var(--bg-tertiary); color: var(--text-primary); }
|
||||||
.conv-item .conv-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
|
.conv-item .conv-trash { color: var(--text-muted); cursor: pointer; padding: 2px 2px; font-size: 13px; flex-shrink: 0; opacity: 0.5; transition: opacity 0.15s, color 0.15s; }
|
||||||
.conv-item .conv-delete { opacity: 0; color: var(--danger); cursor: pointer; padding: 2px 6px; font-size: 16px; }
|
.conv-item .conv-trash:hover { opacity: 1; color: var(--danger); }
|
||||||
.conv-item:hover .conv-delete { opacity: 0.7; }
|
.conv-item .conv-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; min-width: 0; }
|
||||||
.conv-item .conv-delete:hover { opacity: 1; }
|
|
||||||
.sidebar-footer { padding: 12px 16px; border-top: 1px solid var(--border); font-size: 11px; color: var(--text-muted); font-family: var(--font-mono); }
|
.sidebar-footer { padding: 12px 16px; border-top: 1px solid var(--border); font-size: 11px; color: var(--text-muted); font-family: var(--font-mono); }
|
||||||
.sidebar-footer .status-row { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
|
.sidebar-footer .status-row { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
|
||||||
.stats-panel { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); }
|
.stats-panel { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); }
|
||||||
@@ -983,8 +982,7 @@ async function loadConversations() {
|
|||||||
convs.forEach(c => {
|
convs.forEach(c => {
|
||||||
const div = document.createElement('div');
|
const div = document.createElement('div');
|
||||||
div.className = 'conv-item' + (c.id === currentConvId ? ' active' : '');
|
div.className = 'conv-item' + (c.id === currentConvId ? ' active' : '');
|
||||||
const delBtn = currentRole === 'admin' ? `<span class="conv-delete" onclick="event.stopPropagation();deleteConversation('${c.id}')">×</span>` : '';
|
div.innerHTML = `<span class="conv-trash" onclick="event.stopPropagation();deleteConversation('${c.id}')" title="Delete conversation">🗑</span><span class="conv-title" onclick="loadConversation('${c.id}')">${c.title}</span>`;
|
||||||
div.innerHTML = `<span class="conv-title" onclick="loadConversation('${c.id}')">${c.title}</span>${delBtn}`;
|
|
||||||
list.appendChild(div);
|
list.appendChild(div);
|
||||||
});
|
});
|
||||||
} catch(e) {}
|
} catch(e) {}
|
||||||
|
|||||||
Reference in New Issue
Block a user