SuperAPI AI 工具集

touch-ipad-review

前端与建站

查看项目

更新于 10-15 21:42

技能介绍

用途:审查 React + Tailwind 应用在 iPad 和触屏设备上的手指优先交互,跳过通用建议,只标记非显而易见的缺口。

主要能力:扫描按钮、链接、图标按钮、标签页、地图控件、下拉菜单/Listbox、可选中侧栏行、拖拽手柄、表单控件及自定义点击目标;按清单将列表分为 Headless UI/Radix 与自定义 button 行两类;从 iPad 视角检查分屏宽度变化、粘滞悬停、触控高亮、双击缩放、键盘遮挡输入、拇指可达性;按模板输出报告,每条发现含位置、问题与具体 Tailwind/React 修复,并按 Critical、Warning、Nice to have 分级。

使用方式:当用户提出“review app for touch/iPad usage”等触屏语境请求时运行。工作流为扫描交互 UI、对照 references/tailwind-touch-checklist.md 清单、模拟 iPad 测试、按模板输出报告。可用 rg 辅助排查,例如 rg 'hover:' --glob '.{tsx,jsx}'、rg 'onClick' --glob '.tsx' | rg -v '<button|<a '。

默认检查项:链接与按钮加 cursor-pointer;控件加 select-none 避免 iOS 文本选择闪烁;必要悬停用 [@media(hover:hover)and(pointer:fine)]:hover:… 而非裸 hover:;菜单/列表行用 data-focus: 或 data-[highlighted]: 实现触控高亮。

限制:仅针对 React + Tailwind 项目;不列通用通过项,重复问题合并;具体命令与清单内容以资料为准,未提供的细节暂未提供。