Design QA checklist + visual regression targets

[1nonlypiece]

Description

Establish a repeatable QA checklist (contrast, focus, breakpoints) and suggest Percy/Chromatic or manual snapshot list.

Requirements and context

• Covers Home, Vaults, Create, modals

• Release gate for design-approved builds

• Deliverables must be reviewable in Figma (or equivalent) and traceable to Disciplr-Frontend / design-system/

• Should respect WCAG 2.1 AA targets for default theme unless explicitly scoped otherwise

Suggested execution

1. Fork Disciplr-Org/Disciplr-Frontend and branch: git checkout -b design/qa-checklist-visual-regression
2. Produce frames + specs (spacing, type, color, motion) before deep UI code changes
3. Share a short Loom or PR description with before/after for stakeholder review

Design deliverables

• Checklist markdown in repo or Notion link
• Owner and cadence

Handoff

• Link Figma file + node IDs in the PR (or attach exports if Figma is not used)
• Note any updates needed in design-system/tokens/*.json

Test and review

1. Run a design critique (internal) with eng + design
2. Validate keyboard + screen reader on affected flows (smoke level)
3. Capture screenshots for light mode; note dark mode gaps if applicable

Example commit message

design: design QA checklist and regression targets

Guidelines

Item	Target
Figma / specs	Named layers, intent documented
Accessibility	Focus order, contrast, touch targets (min 44×44 px where applicable)
Timeframe	96 hours from assignment

[barry01-hash]

@barry01-hash has applied to work on this issue as part of the Stellar Wave Program's 3rd wave.

I would like to provide u with instant solution

ℹ️ Repo Maintainers: To accept this application, review their application or assign @barry01-hash to this issue.