diff options
| author | Peter Stone <thepeterstone@gmail.com> | 2026-03-13 03:17:04 +0000 |
|---|---|---|
| committer | Peter Stone <thepeterstone@gmail.com> | 2026-03-13 03:17:04 +0000 |
| commit | fe414fac958330c2302d9175d66e1b338e5b1864 (patch) | |
| tree | ef4941f5d01e84e7868e6b92bd0e6cecdcc2a64f /web/style.css | |
| parent | d5f83f8662c9f9c0fb52b206b06d4dd54a7788b4 (diff) | |
| parent | 55c20922cc7a671787fe94fdd53a7eb72ebd2596 (diff) | |
merge: resolve conflicts with local/master (stats tab + summary styles)
Keep file-based summary approach (CLAUDOMATOR_SUMMARY_FILE) from HEAD.
Combine Q&A History and Stats tab CSS from both branches.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Diffstat (limited to 'web/style.css')
| -rw-r--r-- | web/style.css | 182 |
1 files changed, 182 insertions, 0 deletions
diff --git a/web/style.css b/web/style.css index 342e0b3..67e4962 100644 --- a/web/style.css +++ b/web/style.css @@ -1170,6 +1170,29 @@ dialog label select:focus { margin-top: 0.5rem; } +.task-summary-text { + padding: 0.75rem 1rem; + background: var(--surface-1, #f8f9fa); + border-radius: 6px; + line-height: 1.5; + white-space: pre-wrap; +} +.qa-timeline { + display: flex; + flex-direction: column; + gap: 0.75rem; +} +.qa-item { + padding: 0.5rem 0.75rem; + border-left: 3px solid; + border-radius: 0 4px 4px 0; +} +.qa-question { border-color: #3b82f6; background: rgba(59,130,246,0.05); } +.qa-answer { border-color: #10b981; background: rgba(16,185,129,0.05); } +.qa-label { font-weight: 600; font-size: 0.85em; display: block; margin-bottom: 0.25rem; } +.qa-content { white-space: pre-wrap; } +.qa-timestamp { font-size: 0.75em; color: var(--text-muted, #6b7280); margin-top: 0.25rem; display: block; } + .inline-edit-success { color: var(--state-completed); font-size: 0.82rem; @@ -1214,3 +1237,162 @@ dialog label select:focus { color: var(--accent, #60a5fa); font-style: italic; } + +/* ── Stats tab ────────────────────────────────────────────────────────────── */ + +[data-panel="stats"] { + padding: 1rem 1.5rem; + max-width: 900px; +} + +.stats-section { + margin-bottom: 2rem; +} + +.stats-section h2 { + font-size: 1rem; + font-weight: 600; + color: var(--text-muted); + text-transform: uppercase; + letter-spacing: 0.05em; + margin: 0 0 0.75rem; +} + +/* Task state count boxes */ +.stats-counts { + display: flex; + flex-wrap: wrap; + gap: 0.5rem; +} + +.stats-count-box { + display: flex; + flex-direction: column; + align-items: center; + padding: 0.75rem 1.25rem; + border-radius: 8px; + background: var(--card-bg); + border: 1px solid var(--border); + min-width: 80px; +} + +.stats-count-box[data-state="RUNNING"] { border-color: var(--state-running); } +.stats-count-box[data-state="QUEUED"] { border-color: var(--state-queued); } +.stats-count-box[data-state="READY"] { border-color: var(--state-running); } +.stats-count-box[data-state="BLOCKED"] { border-color: var(--state-blocked); } +.stats-count-box[data-state="PENDING"] { border-color: var(--state-pending); } +.stats-count-box[data-state="COMPLETED"] { border-color: var(--state-completed); } +.stats-count-box[data-state="FAILED"] { border-color: var(--state-failed); } +.stats-count-box[data-state="TIMED_OUT"] { border-color: var(--state-timed-out); } +.stats-count-box[data-state="CANCELLED"] { border-color: var(--state-cancelled); } +.stats-count-box[data-state="BUDGET_EXCEEDED"] { border-color: var(--state-budget-exceeded); } + +.stats-count-number { + font-size: 1.75rem; + font-weight: 700; + line-height: 1; +} + +.stats-count-label { + font-size: 0.7rem; + text-transform: uppercase; + letter-spacing: 0.04em; + color: var(--text-muted); + margin-top: 0.25rem; + white-space: nowrap; +} + +/* KPI row */ +.stats-kpis { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 0.75rem; + margin-bottom: 1.25rem; +} + +@media (max-width: 600px) { + .stats-kpis { + grid-template-columns: repeat(2, 1fr); + } +} + +.stats-kpi-box { + display: flex; + flex-direction: column; + align-items: center; + padding: 1rem; + border-radius: 8px; + background: var(--card-bg); + border: 1px solid var(--border); + text-align: center; +} + +.stats-kpi-value { + font-size: 1.5rem; + font-weight: 700; + line-height: 1; +} + +.stats-kpi-label { + font-size: 0.75rem; + color: var(--text-muted); + margin-top: 0.25rem; + white-space: nowrap; +} + +/* Outcome bar chart */ +.stats-bar-chart-label { + font-size: 0.8rem; + color: var(--text-muted); + margin: 0 0 0.5rem; +} + +.stats-bars { + display: flex; + flex-direction: column; + gap: 0.4rem; +} + +.stats-bar-row { + display: flex; + align-items: center; + gap: 0.5rem; +} + +.stats-bar-row-label { + font-size: 0.78rem; + text-transform: uppercase; + color: var(--text-muted); + width: 120px; + flex-shrink: 0; + white-space: nowrap; +} + +.stats-bar-track { + flex: 1; + height: 16px; + background: var(--border); + border-radius: 4px; + overflow: hidden; +} + +.stats-bar-fill { + height: 100%; + border-radius: 4px; + background: var(--state-pending); + transition: width 0.3s ease; +} + +.stats-bar-fill[data-state="COMPLETED"] { background: var(--state-completed); } +.stats-bar-fill[data-state="FAILED"] { background: var(--state-failed); } +.stats-bar-fill[data-state="CANCELLED"] { background: var(--state-cancelled); } +.stats-bar-fill[data-state="TIMED_OUT"] { background: var(--state-timed-out); } +.stats-bar-fill[data-state="BUDGET_EXCEEDED"] { background: var(--state-budget-exceeded); } +.stats-bar-fill[data-state="RUNNING"] { background: var(--state-running); } + +.stats-bar-count { + font-size: 0.75rem; + color: var(--text-muted); + width: 80px; + flex-shrink: 0; +} |
