Summary
Several navigation and icon-only controls violate basic semantic/accessibility expectations: clickable cards/spans are used for navigation, and some icon-only buttons lack accessible labels.
Evidence
Clickable non-button/non-link navigation:
src/app/(main)/admin/page.tsx:36 uses clickable Card for task navigation.
src/app/(main)/reviewer/page.tsx:15 uses clickable Card for task navigation.
src/app/(main)/worker/page.tsx:13 uses clickable Card for task navigation.
src/components/common/RoleTabNav.tsx:40-43 uses a clickable span for home navigation.
Icon-only buttons missing aria-label:
src/components/common/RoleTabNav.tsx:74-76 sign-out button.
src/app/(main)/admin/tasks/create/page.tsx:367-373 remove option button.
src/app/(main)/admin/groups/[groupId]/page.tsx:197-203 remove member button.
Impact
Keyboard users and screen-reader users may not be able to discover or operate these controls reliably. Navigation via clickable cards/spans also loses standard link behavior such as keyboard activation, focus semantics, and open-in-new-tab support where applicable.
Minimal Fix
- Use
<Link> for navigation where possible.
- Use
<button> for actions and ensure keyboard/focus states are visible.
- Add
aria-label to icon-only buttons.
- Preserve existing visual styling while changing semantics.
Acceptance Criteria
- Task cards and app title navigation are reachable and operable by keyboard.
- Icon-only controls have meaningful accessible names.
- Visual appearance remains materially unchanged.
npm run lint remains clean after changes.
Summary
Several navigation and icon-only controls violate basic semantic/accessibility expectations: clickable cards/spans are used for navigation, and some icon-only buttons lack accessible labels.
Evidence
Clickable non-button/non-link navigation:
src/app/(main)/admin/page.tsx:36uses clickableCardfor task navigation.src/app/(main)/reviewer/page.tsx:15uses clickableCardfor task navigation.src/app/(main)/worker/page.tsx:13uses clickableCardfor task navigation.src/components/common/RoleTabNav.tsx:40-43uses a clickablespanfor home navigation.Icon-only buttons missing
aria-label:src/components/common/RoleTabNav.tsx:74-76sign-out button.src/app/(main)/admin/tasks/create/page.tsx:367-373remove option button.src/app/(main)/admin/groups/[groupId]/page.tsx:197-203remove member button.Impact
Keyboard users and screen-reader users may not be able to discover or operate these controls reliably. Navigation via clickable cards/spans also loses standard link behavior such as keyboard activation, focus semantics, and open-in-new-tab support where applicable.
Minimal Fix
<Link>for navigation where possible.<button>for actions and ensure keyboard/focus states are visible.aria-labelto icon-only buttons.Acceptance Criteria
npm run lintremains clean after changes.