Salastil/odysseus
1
0
Fork 0
mirror of https://github.com/pewdiepie-archdaemon/odysseus.git synced 2026-06-17 02:05:22 -04:00
Code Issues Packages Projects Releases Wiki Activity

Match task status pills to cookbook style

Browse Source
This commit is contained in:
pewdiepie-archdaemon
2026-06-01 15:01:24 +09:00
parent f1817fd560
commit 30594b4e0b
2 changed files with 28 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/js/tasks.js
+3 -3
View File
@@ -623,8 +623,8 @@ function _renderList() {
card.className = 'memory-item task-card' + (task.status === 'paused' ? ' task-paused' : ''); card.className = 'memory-item task-card' + (task.status === 'paused' ? ' task-paused' : '');
card.dataset.id = task.id; card.dataset.id = task.id;
// Title row: icon + name (left); paused badge, chevron (expanded only) + // Title row: icon + name (left); status pill + chevron/actions (right).
// status dot (right). Click to expand. // The status pill replaces the old dot and doubles as pause/resume.
const titleRow = document.createElement('div'); const titleRow = document.createElement('div');
titleRow.style.cssText = 'display:flex;align-items:center;gap:6px;cursor:pointer;'; titleRow.style.cssText = 'display:flex;align-items:center;gap:6px;cursor:pointer;';
const statusBadge = task.status === 'paused' const statusBadge = task.status === 'paused'
@@ -635,7 +635,7 @@ function _renderList() {
const builtinBadge = task.is_builtin const builtinBadge = task.is_builtin
? `<span class="task-builtin-badge${task.is_modified ? ' modified' : ''}" title="${task.is_modified ? 'Built-in task — edited from its default' : 'Built-in task'}">built-in${task.is_modified ? ' · edited' : ''}</span>` ? `<span class="task-builtin-badge${task.is_modified ? ' modified' : ''}" title="${task.is_modified ? 'Built-in task — edited from its default' : 'Built-in task'}">built-in${task.is_modified ? ' · edited' : ''}</span>`
: ''; : '';
titleRow.innerHTML = `${_taskIcon(task)}<span class="memory-item-title">${_esc(task.name)}</span>${builtinBadge}<span style="flex:1;"></span>${statusBadge}${_statusDot(task.status)}`; titleRow.innerHTML = `${_taskIcon(task)}<span class="memory-item-title">${_esc(task.name)}</span>${builtinBadge}<span style="flex:1;"></span>${statusBadge}`;
// ... menu button (hover to show) // ... menu button (hover to show)
const actionsWrap = document.createElement('div'); const actionsWrap = document.createElement('div');
static/style.css
+25 -7
View File
@@ -9959,22 +9959,40 @@ textarea.memory-add-input {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
gap: 3px; gap: 3px;
font-size: 10px; font-size: 9px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.5px; letter-spacing: 0.3px;
padding: 2px 6px; padding: 1px 6px;
border-radius: 10px; border-radius: 3px;
flex-shrink: 0; flex-shrink: 0;
cursor: pointer; cursor: pointer;
border: 1px solid transparent;
line-height: 16px;
font-family: 'Fira Code', monospace;
transition: transform 0.12s ease, border-color 0.12s ease, background 0.12s ease, filter 0.12s ease;
user-select: none;
} }
.task-paused-badge { .task-paused-badge {
color: var(--orange, #ff9800); color: var(--orange, #ffb86c);
background: color-mix(in srgb, var(--orange, #ff9800) 12%, transparent); background: color-mix(in srgb, var(--orange, #ffb86c) 22%, transparent);
border-color: color-mix(in srgb, var(--orange, #ffb86c) 35%, transparent);
} }
.task-active-badge { .task-active-badge {
color: var(--green, #50fa7b); color: var(--green, #50fa7b);
background: color-mix(in srgb, var(--green, #50fa7b) 12%, transparent); background: color-mix(in srgb, var(--green, #50fa7b) 20%, transparent);
border-color: color-mix(in srgb, var(--green, #50fa7b) 35%, transparent);
}
.task-status-badge:hover {
filter: brightness(1.08) saturate(1.15);
}
.task-paused-badge:hover {
background: color-mix(in srgb, var(--orange, #ffb86c) 30%, transparent);
border-color: color-mix(in srgb, var(--orange, #ffb86c) 55%, transparent);
}
.task-active-badge:hover {
background: color-mix(in srgb, var(--green, #50fa7b) 28%, transparent);
border-color: color-mix(in srgb, var(--green, #50fa7b) 55%, transparent);
} }
.task-builtin-badge { .task-builtin-badge {