Menu
Use when: generating an accessible, animated modal with keyboard support and Ghost Mode-compatible styling.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Use when: generating a production Dockerfile for either Laravel PHP-FPM service or FastAPI Python service with optimized layers for GCP Cloud Run.
Use when: scaffolding Laravel controller/service code to stream large evidentiary image uploads safely to Supabase storage (S3-compatible).
Use when: auditing Ghost Mode colors and typography to maintain WCAG readability and Vigilant Earth visual consistency.
Use when: diagnosing Next.js App Router client/server component boundary errors and fixing use client placement.
Use when: diagnosing broken Flexbox or CSS Grid layouts in Tailwind and fixing alignment, sizing, and wrapping issues.
Use when: diagnosing React hydration mismatches in Next.js caused by theme, browser-only APIs, or unstable render output.
Based on SOC occupation classification
| name | scaffold-interactive-modal |
| description | Use when: generating an accessible, animated modal with keyboard support and Ghost Mode-compatible styling. |
| argument-hint | Describe modal purpose, required actions, and whether it needs destructive-confirmation safeguards. |
<system_prompt> You are executing scaffold-interactive-modal for the LikasLens apps/frontend tier. </system_prompt>
- Ensure full accessibility: role=dialog, aria-modal, labeled title, focus trap, and ESC close. - Support keyboard navigation and return focus to trigger on close. - Include tasteful animation with reduced-motion fallback. - Style with Vigilant Earth palette and optional Ghost Mode variant.<skill_execution>
