eaa28b20e8
Workstream B of the usability wave (#2 hints, #3 conditions, #4 errors): - GET /api/conditions (new backend/app/routes/conditions.py): composes celestial veil_thinness with the cached NOAA Kp reading; lenient lon parsing (junk degrades to moon-only, never 422); geomagnetic may be null on a cold cache. Route tests stub the cache — no live NOAA calls. - VeilConditions strip in the séance side column: moon glyph + phase, % lit, veil-thinness phrase, Kp line only when data exists. Polls every 10 min; renders nothing while loading; no error state. - ModeHint: per-mode in-fiction one-liner after ~15s idle, suppressed once the mode's sensor runs this session, dismissal persisted in localStorage (qm_hint_<mode>). One mount line per panel. - Error copy upgraded to detect-and-redirect: mic denied points at site settings and the ouija board/wire; WebUSB-unsupported suggests EVP. - i18n en/es parity for every new string; coverage-check template domains extended for the new template-key call sites. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
55 lines
1.0 KiB
CSS
55 lines
1.0 KiB
CSS
/* VeilConditions — compact sky/field strip in the séance side column.
|
|
Tokens follow SeancePage.css: phosphor #7cffb2 · violet #b26bff ·
|
|
panel rgba(16,16,26,0.85) · border rgba(124,255,178,0.18). */
|
|
|
|
.veil-conditions {
|
|
padding: 0.6rem 0.7rem;
|
|
border: 1px solid rgba(124, 255, 178, 0.18);
|
|
border-radius: 4px;
|
|
background: rgba(16, 16, 26, 0.85);
|
|
font-size: 0.76rem;
|
|
line-height: 1.5;
|
|
color: #d3e9db;
|
|
}
|
|
|
|
.veil-conditions-title {
|
|
margin: 0 0 0.35rem;
|
|
font-size: 0.68rem;
|
|
font-weight: 400;
|
|
letter-spacing: 0.18em;
|
|
color: #7cffb2;
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.veil-conditions-line {
|
|
display: flex;
|
|
align-items: baseline;
|
|
gap: 0.5rem;
|
|
min-width: 0;
|
|
flex-wrap: wrap; /* stays legible at 390px */
|
|
}
|
|
|
|
.veil-moon-glyph {
|
|
flex: none;
|
|
filter: drop-shadow(0 0 4px rgba(178, 107, 255, 0.5));
|
|
}
|
|
|
|
.veil-moon-name {
|
|
min-width: 0;
|
|
}
|
|
|
|
.veil-thinness {
|
|
color: #b26bff;
|
|
font-style: italic;
|
|
opacity: 0.9;
|
|
}
|
|
|
|
.veil-field-quiet {
|
|
opacity: 0.75;
|
|
}
|
|
|
|
.veil-field-storm {
|
|
color: #b26bff;
|
|
text-shadow: 0 0 8px rgba(178, 107, 255, 0.6);
|
|
}
|