Commit Graph

4 Commits

Author SHA1 Message Date
admin c3316b9c45 Task 15: Accessibility audit complete
- Sidebar: Replace <aside role="navigation"> with <nav> to avoid conflicting roles
- Sidebar search: Add combobox role, aria-expanded, aria-controls, aria-autocomplete
- Search results: Add listbox/option roles, group labels for screen reader navigation
- PMRInterface: Remove redundant role="main", fix aria-label to use CV-friendly labels
- Mobile search: Add aria-label and type="search" for proper semantics
- Breadcrumb: Add aria-current="page" to current item, aria-hidden on separators
- Clinical alert: Add aria-label="Acknowledge clinical alert" on button per spec
- Patient banner: Change focus:ring to focus-visible:ring on action buttons
- Patient banner: Add role="img" to StatusDot for aria-label accessibility
- Login screen: Change role="status" to role="dialog" with aria-modal
- Login screen: Add loginButtonRef with auto-focus when typing completes
- Login screen: Add focus-visible ring style to Log In button
- Medications tabs: Add id="tab-{id}" to tab buttons, fix aria-labelledby on panels
- Consultations: Wrap entries in <article> per semantic HTML spec
- Problems: Change TrafficLight dot from role="img" to aria-hidden (text label handles it)
- App: Add sr-only live region announcing "Patient Record for Charlwood, Andrew" on PMR entry
- Skip button: Add focus-visible ring for keyboard users

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-13 01:42:05 +00:00
admin 2be346144c Task 8: Rebuild ConsultationsView (Experience view)
Rebuilt from ref-consultations.md spec with Clinical Luxury styling:
- Framer Motion height-only expand/collapse (no opacity fade)
- font-ui (Elvaro Grotesque) throughout, Geist Mono for dates/codes
- 3px left border color-coded by employer (NHS blue / Tesco teal)
- Multi-layered card shadows (shadow-pmr)
- Blue tint hover state (#EFF6FF)
- H/E/P section headers: uppercase, 12px, letter-spacing 0.05em
- Coded entries in Geist Mono with bracket codes
- Single-expand accordion behavior
- Chevron rotation via Framer Motion
- Proper font sizes per spec (13px body, 15px titles, 12px codes)
- Focus-visible ring on entry buttons

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-13 00:51:23 +00:00
admin f7f7e0db8c feat(a11y): Implement keyboard shortcuts and accessibility (Task 13)
- Create AccessibilityContext for global focus management and expanded state
- Add roving tabindex to sidebar with Up/Down/Enter/Home/End navigation
- Focus management: after login, after view change, after item expansion
- Global Escape closes expanded items across all views
- Add scope='col' to SummaryView table headers
- Add focus-after-expand to ConsultationsView
- Update ARIA roles: role='menu', role='menuitem', aria-current
2026-02-11 02:49:51 +00:00
admin 4272ca4dfe Task 7: Build ConsultationsView with History/Examination/Plan structure
- Create ConsultationsView with 5 expandable consultation entries
- Each entry has color-coded left border by employer (NHS blue vs Teal)
- Collapsed state shows date, org, role, key coded entry
- Expanded state shows Duration, HISTORY, EXAMINATION, PLAN, CODED ENTRIES
- Accordion behavior: only one entry expanded at a time
- Expand animation 200ms ease-out, respects reduced motion
- Section headers in uppercase with letter-spacing
- Coded entries in [XXX000] format with Geist Mono font
2026-02-11 01:40:56 +00:00