# Skills Index

Lightweight catalog for skill discovery. Load the full SKILL.md only when needed.

## Mawidi Editorial Design System

**IMPORTANT**: All frontend skills now include the Mawidi Editorial Design System. Key patterns:

- **Numbered sections**: `01`, `02`, `03` with green accent lines
- **Light backgrounds only**: `bg-white`, `bg-[#FAFAFA]` - NO dark backgrounds
- **Square bullets**: Small green squares, not checkmarks
- **Hover animations**: Expanding green underlines (`w-0 group-hover:w-12`)
- **CSS transitions only**: No Framer Motion
- **Colors**: `#10B981` (green), `#1E293B` (ink), `#FAFAFA` (sand)

## Available Skills

| Skill                     | Description                                         | Triggers                                                           | Path                                 |
| ------------------------- | --------------------------------------------------- | ------------------------------------------------------------------ | ------------------------------------ |
| frontend-design           | Editorial UI system, numbered sections              | landing page, dashboard, component                                 | `frontend-design/SKILL.md`           |
| frontend-artifact-builder | React + shadcn/ui with Editorial patterns           | complex artifact, multi-component                                  | `frontend-artifact-builder/SKILL.md` |
| brand-guidelines          | Mawidi Editorial visual identity                    | brand colors, Mawidi branded                                       | `brand-guidelines/SKILL.md`          |
| blog-post-design          | Stunning blog articles                              | blog post, article design                                          | `blog-post-design/SKILL.md`          |
| onboarding-ux             | Signup & activation flows                           | signup flow, onboarding                                            | `onboarding-ux/SKILL.md`             |
| staff-dashboard           | Data-rich clinic dashboards                         | dashboard, staff view, metrics                                     | `staff-dashboard/SKILL.md`           |
| api-development           | Production API endpoints                            | create API, new endpoint                                           | `api-development/SKILL.md`           |
| i18n-management           | Arabic/English, RTL/LTR                             | translation, RTL, bilingual                                        | `i18n-management/SKILL.md`           |
| email-composer            | Professional email drafts                           | write email, compose message                                       | `email-composer/SKILL.md`            |
| database-migration        | Safe Prisma + Supabase changes                      | add column, migration                                              | `database-migration/SKILL.md`        |
| testing-patterns          | Unit, integration, E2E tests                        | write tests, test coverage                                         | `testing-patterns/SKILL.md`          |
| seo-optimization          | Meta tags, structured data                          | SEO, meta tags                                                     | `seo-optimization/SKILL.md`          |
| error-handling            | Consistent error patterns                           | error handling, validation                                         | `error-handling/SKILL.md`            |
| gemini-cli-assistant      | Large-scale codebase analysis with 2M token context | analyze 50+ files, security audit, pattern detection               | `gemini-cli-assistant/SKILL.md`      |
| codex-mcp-assistant       | Local data processing with 8 MCP servers            | database queries, testing workflows, 100+ records                  | `codex-mcp-assistant/SKILL.md`       |
| ai-code-review            | Multi-AI review with Gemini + Codex                 | review my work, check code, validate changes, suggest improvements | `ai-code-review/SKILL.md`            |
| security-audit            | Vulnerability scanning                              | security check, audit                                              | `security-audit.ts`                  |
| deploy-checklist          | Pre-deployment validation                           | ready to deploy                                                    | `deploy-checklist.ts`                |

## Usage

1. **Scan triggers** to identify relevant skill
2. **Load full SKILL.md** only for skills you'll use
3. **Follow skill instructions** for the task

## Skill Locations

```
.claude/mcp/skills/
├── SKILLS_INDEX.md          ← You are here
├── frontend-design/SKILL.md
├── frontend-artifact-builder/SKILL.md
├── brand-guidelines/SKILL.md
├── blog-post-design/SKILL.md
├── onboarding-ux/SKILL.md
├── staff-dashboard/SKILL.md
├── api-development/SKILL.md
├── i18n-management/SKILL.md
├── email-composer/SKILL.md
├── database-migration/SKILL.md
├── testing-patterns/SKILL.md
├── seo-optimization/SKILL.md
├── error-handling/SKILL.md
├── gemini-cli-assistant/SKILL.md
├── codex-mcp-assistant/SKILL.md
├── ai-code-review/SKILL.md
├── security-audit.ts
└── deploy-checklist.ts
```
