March 14: UX Sprint Day One
The recipe fixes stabilized. Time to shift gears — the UX sprint officially kicked off today with six issues closed and a wave of dependency updates.
Developer Journal
The accessibility batch
Started with the accessibility issues from the Phase 5b audit. These are the kind of fixes that individually seem small but collectively determine whether keyboard and assistive technology users can use the app at all.
Focus-visible states (#821, closes #665): The app had outline: none scattered across component CSS files — the classic "make it look clean" move that silently breaks keyboard navigation. Added :focus-visible rules to every interactive element across 11 component CSS files, with a global baseline in index.css. Convention: outline-offset: 2px for buttons (outward blue ring), -2px for inputs (inset). One PR, 11 files, WCAG 2.1 AA compliance restored.
Disabled state standardization (#822, closes #666): Disabled buttons and inputs had inconsistent styling — some dimmed text, some reduced opacity, some did nothing. Standardized to opacity: 0.5 + cursor: not-allowed + muted colors across the design system.
Badge contrast (closes #667): Instrument badges (MIRI, NIRCam, etc.) were failing WCAG AA contrast ratios against the dark background. Adjusted the badge color palette to meet 4.5:1 minimum.
Visual polish
Empty state for dashboard (#823, closes #670): The Library page with zero files just showed... nothing. Blank space. Added an illustrated empty state with a telescope icon and guidance to either upload data or search MAST. Small thing, but it's the first impression for new users.
UserMenu dropdown (#824, closes #677): The user menu dropdown was nearly invisible — dark background on dark background with no border or shadow. Added border: 1px solid var(--border-default) and box-shadow. Obvious in hindsight.
Ready state visibility (#826, closes #673): The composite and mosaic buttons' "ready" state was indistinguishable from disabled. Both were neutral gray text with default borders. Now composite lights up teal when you have 3+ files selected, mosaic goes blue at 2+. The color change gives immediate feedback that you've unlocked an action.
Dependency maintenance
Eight dependabot PRs merged — a mix of CI tooling (dorny/paths-filter v3→v4), linting (ruff, eslint-parser), type definitions (@types/node), and backend packages (AWSSDK.S3, JwtBearer, Resilience, NetAnalyzers). Nothing breaking, all CI-green. Keeping dependencies current is less glamorous than feature work but it's the difference between a smooth upgrade path and a "we're 47 versions behind" crisis.
What shipped
| PR | Title |
|---|---|
| #821 | fix: add focus-visible states to all interactive elements |
| #822 | fix: standardize disabled state styling across components |
| #823 | feat: add empty state for dashboard card list |
| #824 | fix: UserMenu dropdown blends into dark background |
| #826 | fix: composite/mosaic ready state too subtle |
| #809 | chore(deps): Bump dorny/paths-filter from 3 to 4 |
| #810 | chore(deps-dev): Bump @typescript-eslint/parser 8.56.1 → 8.57.0 |
| #811 | chore(deps): Bump ruff 0.15.5 → 0.15.6 |
| #812 | chore(deps-dev): Bump @types/node 25.3.5 → 25.5.0 |
| #815 | Bump AWSSDK.S3 4.0.18.7 → 4.0.19 |
| #817 | Bump JwtBearer 10.0.3 → 10.0.5 |
| #819 | Bump NetAnalyzers 10.0.103 → 10.0.201 |
| #820 | Bump Http.Resilience 10.3.0 → 10.4.0 |