fix(frontend): post-design-review — slab token split + badge contrast + modal backdrop + dark shadows
- Add fixed slab/slab-text/slab-muted tokens so utility strip and footer never invert to near-white in dark mode (root token split: ink is themed text, slab is fixed dark surface) - btn-ink uses fixed #111827 so confirm dialogs stay dark-on-dark readable - Toast error surface switched to slab; success uses text-white (not text-ink-on) - StatusBadge active and SimulationStatusBadge review_required/done use text-white instead of text-canvas/text-ink-on (prevents near-black text on colored pill in dark mode) - Modal backdrops (MitreMatrixModal, ConfirmDialog) switched to .modal-backdrop class (fixed rgba(0,0,0,0.6)) instead of bg-ink/60 which turned near-white - Card shadow lifted in dark mode via .dark .card-product override - MitreMatrixModal panel uses shadow-floating-dark in dark mode - UsersAdminPage form: items-start + explicit label-height spacer on button column for pixel-perfect baseline alignment (AC-17.3 structural fix) 92/92 tests passing, typecheck and lint clean. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -15,10 +15,11 @@ export function ToastViewport(): JSX.Element {
|
||||
{toasts.map((t) => {
|
||||
const isError = t.kind === 'error';
|
||||
const isSuccess = t.kind === 'success';
|
||||
// Fixed colors: toasts don't theme (error=dark slab, success=primary blue)
|
||||
const surface = isError
|
||||
? 'bg-ink text-ink-on'
|
||||
? 'bg-slab text-slab-text'
|
||||
: isSuccess
|
||||
? 'bg-primary text-ink-on'
|
||||
? 'bg-primary text-white'
|
||||
: 'bg-canvas text-ink border border-hairline';
|
||||
return (
|
||||
<div
|
||||
|
||||
Reference in New Issue
Block a user