giorgio/read.markets
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

ui: fix chat pending class, invented CSS vars, .pf-secondary scope

Browse source 
- chat.js: pending indicator class was wrong (.pending instead of
  chat-msg--pending) so the … waiting message never got italic/dim
- settings.html + cassandra.css: three invented CSS vars (--panel-bg,
  --ok, --surface-1) had hardcoded fallbacks that broke dark mode;
  replaced with real tokens (--surface, --positive)
- cassandra.css: .pf-secondary was scoped to .pf-actions but used
  standalone in 4 places (sync modal, disable-sync, import cancel,
  forget-pie button) — hoisted to a top-level selector

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Giorgio Gilestro 2026-05-27 19:19:42 +02:00
parent fb71854238
commit e807e58629
3 changed files with 7 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

6
app/static/css/cassandra.css
View file

@ -593,8 +593,8 @@ table.dense tr.row-stale td { color: var(--dim); }
} }
.pf-actions button:hover { border-color: var(--accent); } .pf-actions button:hover { border-color: var(--accent); }
.pf-actions button:disabled { opacity: 0.5; cursor: not-allowed; } .pf-actions button:disabled { opacity: 0.5; cursor: not-allowed; }
.pf-actions .pf-secondary { color: var(--muted); } .pf-secondary { color: var(--muted); }
.pf-actions .pf-secondary:hover { color: var(--negative); border-color: var(--negative); } .pf-secondary:hover { color: var(--negative); border-color: var(--negative); }
/* Settings-page action button — same visual language as .pf-actions /* Settings-page action button — same visual language as .pf-actions
button so buttons across /settings (Manage subscription, future button so buttons across /settings (Manage subscription, future
@ -1265,7 +1265,7 @@ details[open] .pf-analysis__head-left::before { content: "▾ "; }
top: calc(100% + 6px); top: calc(100% + 6px);
right: 0; right: 0;
min-width: 160px; min-width: 160px;
background: var(--surface-1, var(--surface-2)); background: var(--surface);
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: 6px; border-radius: 6px;
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);

3
app/static/js/chat.js
View file

@ -37,7 +37,8 @@
append('user', text); append('user', text);
input.value = ''; input.value = '';
send.disabled = true; send.disabled = true;
const thinking = append('assistant pending', '…'); const thinking = append('assistant', '…');
thinking.classList.add('chat-msg--pending');
try { try {
const r = await fetch('/api/chat', { const r = await fetch('/api/chat', {
method: 'POST', method: 'POST',

4
app/templates/settings.html
View file

@ -301,7 +301,7 @@
<div id="sync-modal" class="modal" <div id="sync-modal" class="modal"
style="position:fixed;inset:0;background:rgba(0,0,0,0.45); style="position:fixed;inset:0;background:rgba(0,0,0,0.45);
display:none;align-items:center;justify-content:center;z-index:1000;"> display:none;align-items:center;justify-content:center;z-index:1000;">
<div style="background:var(--panel-bg,#fff);color:var(--text,#000); <div style="background:var(--surface);color:var(--text);
padding:22px 26px;border-radius:8px;max-width:440px;width:90%;"> padding:22px 26px;border-radius:8px;max-width:440px;width:90%;">
<div class="result__head" id="sync-modal-title" style="margin-bottom:8px;"> <div class="result__head" id="sync-modal-title" style="margin-bottom:8px;">
Enable cloud sync Enable cloud sync
@ -355,7 +355,7 @@
const errEl = $('sync-modal-err'); const errEl = $('sync-modal-err');
function setFeedback(msg, ok) { function setFeedback(msg, ok) {
feedbackEl.style.color = ok ? 'var(--ok,#2a9d57)' : ''; feedbackEl.style.color = ok ? 'var(--positive)' : '';
feedbackEl.textContent = msg || ''; feedbackEl.textContent = msg || '';
} }
// External callers (the Import section above) can pass a callback // External callers (the Import section above) can pass a callback