Adds a mandatory pre-step to the frontend-builder agent prompt: invoke the
frontend-design skill at sprint start before creating or modifying any
visible UI component. DESIGN.md rules project-specific tokens; the skill
covers universal principles (typographic hierarchy, alignment, contrast,
focus, density, motion). Skip allowed only for pure logic/data-layer work
with no visual change.
Authored locally during sprint 6 (uncommitted in worktree), bundled into
sprint 7 hygiene as the first commit so it takes effect immediately for
the design refresh work.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
9 binding decisions locked with user 2026-06-09 (4-question + 4-question
+ 3-question rounds). Visual direction Bloomberg / terminal SOC. Border
radius 0 except status pills and avatars. Palette kept (primary blue +
slab + canvas/paper/cloud/fog/ink), ADD success/warn semantic tokens.
Scope: 8 pages + 17 components + tokens + DESIGN.md rewrite, all in one
sprint. JetBrains Mono for data only (Inter stays for body/headers).
Light + dark both kept. Zero transitions (brutalist).
Plan validated by spec-reviewer pre-pass: APPROVED with 3 findings
addressed inline (D9 added, R2 reworded, semantic tokens promoted from
optional to locked).
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
F1: MitreTechniqueTag inline classes replaced with className="tag-mitre gap-xxs"
(index.css .tag-mitre is now the single source of truth for technique tags).
F2: boxShadow block removed from tailwind.config.ts — no component referenced
shadow-soft-lift / shadow-floating / *-dark; DESIGN.md §Don'ts prohibits shadows.
F4: StatusBadge.test.tsx gains 3 class assertions (bg-warn-soft / bg-primary-soft / bg-cloud)
mirroring SimulationStatusBadge.test.tsx pattern. Test count: 136 → 139.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Wrap RT and SOC form cards in a responsive 2-column grid
(grid gap-xl lg:grid-cols-2 items-start) on the simulation edit view.
Drop the max-w-3xl constraint from the outer container so the grid
can use full page width (matching EngagementDetailPage). Header,
banners, submitError, and sticky action bar remain full-width above
the grid. The isNew create form keeps its current narrow layout.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
knacky
merged commit 6ca614a3f3 into main2026-06-10 16:40:20 +00:00
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.
Summary
success/warnsemantic color tokens (WCAG AA light+dark), JetBrains Mono Variable font family,borderRadiusreduced tonone+pillonly,display-*scale reduced (xxl 72→40px etc.),sectionspacing 40→48px@fontsource-variable/jetbrains-mono— no CDNrounded-*→rounded-none(status pills keeprounded-pill), alltransition-colorsremoved,font-monoon data cells (IDs, dates, MITRE codes, commands)font-monoon dates/IDs/metrics, banners squaredTest plan
npm run typecheck— 0 errorsnpm run lint— 0 warnings (--max-warnings=0)npm run test -- --run— 136/136 passinggit diff origin/main -- backend/is empty)Screenshots
All screenshots saved to
/home/user/.claude/jobs/9e6bc162/tmp/screenshots/:Login page
01-login-light.png01-login-dark.pngEngagements list
02-engagements-list-light.png02-engagements-list-dark.pngEngagement detail
03-engagement-detail-light.png03-engagement-detail-dark.pngEngagement form (new)
04-engagement-form-new-light.png04-engagement-form-new-dark.pngSimulation form (new)
05-simulation-form-new-light.png05-simulation-form-new-dark.pngTemplates list
06-templates-list-light.png06-templates-list-dark.pngTemplate form (new)
07-template-form-new-light.png07-template-form-new-dark.pngUsers admin
08-users-admin-light.png08-users-admin-dark.pngExport dropdown (open)
09-export-dropdown-open-light.png09-export-dropdown-open-dark.pngSimulation list — status badges
10-sim-list-badges-light.png10-sim-list-badges-dark.png🤖 Generated with Claude Code
F3: nav-bar-top bg-paper → bg-slab text-slab-text (3-band slab anchoring restored). NavLinks: text-slab-muted default, text-slab-text + border-primary active. Logo span: text-ink → text-slab-text. F2: (you) label extracted from font-mono td into adjacent font-sans span. F1: Loader2 circular spinner → EXPORTING… text with animate-pulse (terminal-SOC compatible). Screenshots regenerated: - All 8 pages light+dark (01→10) - 05-simulation-form-edit light+dark (F6) - 11-mitre-matrix-modal light+dark (F6) - 12-toast-success light+dark (F6) - 13-confirm-dialog light+dark (F6) - admin-light/dark-open/closed regenerated from HEAD (F4) F4: StatusBadge.tsx confirmed single code path — planned → bg-warn-soft (no divergence in code). Divergence in prior captures was stale cache; regenerated admin-* confirm consistency. F5: Simulations seeded (pending/in_progress/review_required/done) via API; 10-sim-list-badges shows all 4 semantic badge colors. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>F1: MitreTechniqueTag inline classes replaced with className="tag-mitre gap-xxs" (index.css .tag-mitre is now the single source of truth for technique tags). F2: boxShadow block removed from tailwind.config.ts — no component referenced shadow-soft-lift / shadow-floating / *-dark; DESIGN.md §Don'ts prohibits shadows. F4: StatusBadge.test.tsx gains 3 class assertions (bg-warn-soft / bg-primary-soft / bg-cloud) mirroring SimulationStatusBadge.test.tsx pattern. Test count: 136 → 139. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>