fix use gentler stale card styling

Replace opacity-50 (too invisible) with a dedicated .is-stale class at 0.6 opacity + neutral border. Cards remain clearly visible but visually subdued when readings are stale.

Commit
0f6c2a0ffdef9818aa2773e97f4768c2858aa775
Author
GPT-5 medium <codex@openai.com>
Author date
Committer
GPT-5 medium <codex@openai.com>
Committer date
Changed files
roles/dashboard/public/css/app.css
index 9acb5414..67499880 100644..100644
@@ -284,6 +284,11 @@
284 284 --range-gradient: linear-gradient(90deg, #b42318 0%, #e8a308 35%, #276749 50%, #e8a308 65%, #b42318 100%);
285 285 }
286 286
287 Added: .reading-quick-item.is-stale {
288 Added: opacity: 0.6;
289 Added: border-color: var(--fapg-border) !important;
290 Added: }
291 Added:
287 292 .reading-range-labels {
288 293 grid-template-columns: 1fr auto 1fr;
289 294 }
roles/dashboard/public/js/dashboard/quick-readings.js
index abe8ba7e..83c87dc8 100644..100644
@@ -98,10 +98,10 @@
98 98 const isStale = age === null || age > 10 * 60 * 1000;
99 99
100 100 configureRange(item, range, unit);
101 Removed: item.classList.remove("border-success", "border-warning", "border-danger", "opacity-50");
101 Added: item.classList.remove("border-success", "border-warning", "border-danger", "is-stale");
102 102
103 103 if (isStale) {
104 Removed: item.classList.add("opacity-50");
104 Added: item.classList.add("is-stale");
105 105 } else {
106 106 const borderClass = qualityBorderClass(state);
107 107 if (borderClass) item.classList.add(borderClass);