Codex UI Review for Keyboard Focus and Responsive Layout
Apply the repository's UI overlay to check design consistency, accessible controls and stable layouts.
中文Install in Codex
Open the project using cpp-agentic-development-frame and its base implementation skill. Provide similar controls and supported widths.
- Review `.agents/skills/ui-guidance/SKILL.md` and its requirements at the pinned GitHub commit.
- Create `.agents/skills/ui-guidance/` in your project and save the reviewed file as `.agents/skills/ui-guidance/SKILL.md`.
- Start Codex from that project's root, then type `$ui-guidance` and select the matching skill.
Example task
List the UI checks for this illustrative Search control.
{"control":"Search","existingStyle":"ToolbarButton","viewports":[360,1200],"checks":["keyboard focus","screen-reader name"]}What to check
Reuse `ToolbarButton`. Review layout at `360px` and `1200px` and record evidence for keyboard focus and the accessible name `Search`.
Original SKILL.md on GitHub · Updated
Frequently asked question
Where do I look if the repository has no design-token document?
Use the nearest similar control as a baseline and record the files and verification method.