본문으로 건너뛰기
cccskills
무료GitHub에 공개

light-dark-integrity

Light/dark theme violation repair for Pattern Patrol P4. Use when you find raw bg-white/text-black classes or a state invisible in one theme, or when running a P4 patrol.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

설치 방법 보기

포함된 파일(5)

  • SKILL.md6.1 KB
  • agents/openai.yaml230 B
  • exceptions.json426 B
  • scripts/detect-light-dark.mjs12.6 KB
  • scripts/detect-light-dark.test.mjs4.9 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

Light/Dark Integrity

Apply this skill only after reading the Pattern Patrol system, the P4 registry row, the repo CLAUDE.md, the pattern-patrol skill, and ui-dense/data-dense-rules.md section 1. Those safety rules remain binding.

Detect

Run the deterministic detector from the repository root:

node .claude/skills/light-dark-integrity/scripts/detect-light-dark.mjs

Pass explicit .tsx paths to scan a structural-novelty scope. Use --json for a machine-readable report and --strict to fail on pending or invalid exceptions. A candidate is not automatically a defect, compliant, or exempt.

The detector reports every source line containing bg-white or text-black, whether a dark: token exists on that line, and a possible exception hint. Review the whole component and every place a shared component renders. Never clear a candidate from a file-level dark: token elsewhere in the file.

Classify each candidate

Choose exactly one surface class:

  1. Theme surface — page, panel, card, row, menu, popover, dialog, input, or control whose appearance must follow the active theme. Raw white/black is a defect unless an explicit paired design is necessary.
  2. Proposed fixed/on-color exception — chrome over a photo, video, gradient, canvas, crop handle, camera, code block, or other surface whose local contrast may be independent of the app theme. Propose it to Arman; never preserve or clear it on agent judgment alone.
  3. Non-app output — print rules, HTML/iframe matte, exported image/PDF, email, or an authored visual specimen. If the raw palette is deliberate, propose it to Arman unless the source is truly non-rendered test/comment text.
  4. Explicit theme selection — the opposite theme is selected through a theme prop, conditional class, variable, or multiline construction. Verify both branches. A real two-theme branch is compliant, not an exception.

If the class is unclear, the finding is Tier R. Report it; do not mutate.

Mechanical repair table

For a verified theme surface, use the narrowest semantic token:

MeaningRequired class
Page/application backgroundbg-background
Card or bounded content surfacebg-card
Subdued section or rowbg-muted
Floating menu/popoverbg-popover
Primary texttext-foreground
Secondary texttext-muted-foreground
Normal boundaryborder-border
Neutral hover/focus fillhover:bg-accent / focus-visible:bg-accent

Keep a raw palette plus a dark: pair only when no semantic token expresses an intentional two-theme design and both exact colors are already established by the surrounding component. Do not invent a new pair during a patrol.

For a shared primitive used on both theme surfaces and fixed/on-color surfaces, add an explicit, narrowly named surface variant. The default must use semantic theme tokens; the fixed/on-color call site opts into its established overlay classes. Do not force either side's styling onto the other.

Do not change layout, interaction, wording, component boundaries, imports, or chunking. Do not create a new global token during a patrol. If the repair needs design judgment or a new token, downgrade it to Tier R.

Required false-positive review

Before counting or fixing, review all candidates against:

  • print: rules and printed/exported documents;
  • iframe, HTML preview, page-preview, and white-paper mattes;
  • media, camera, crop, canvas, image, video, and gradient overlays;
  • fixed visual specimens, games, loaders, and immersive authored designs;
  • explicit theme props/conditionals and multiline dark: pairing;
  • comments, fixtures, samples, and non-rendered strings;
  • deliberately chosen contrast where the semantic foreground would fail.

Record the reason for every excluded class in the patrol report. Never add a suppression or detector allowlist merely to make the output smaller.

Human-owned exception approval

Agents propose; Arman approves. A plausible fixed palette is still an open finding until Arman explicitly approves that exact surface. No certifier, maintainer, prior styling, or “intentional” code comment substitutes for his decision.

Every proposal must include:

  • exact file, line, raw token(s), and visual state;
  • a stable production URL plus precise click/state instructions;
  • what would change if semantic tokens replaced it;
  • an Approve or Reject decision request.

If no stable URL or reproducible artifact exists, the item cannot be approved. Keep it open and create a Tier-C review-harness task. End any run containing proposals with this unmistakable envelope:

EXCEPTION APPROVAL REQUIRED
<complete numbered proposal list>
ARMAN, WE NEED YOU: approve or reject every listed P4 exception.

Only after approval, add one entry to exceptions.json with approvedBy set to Arman, the approval date/reference, review URL, exact token list, file, line, and reason. Add a source comment within two lines of that exact line:

patrol-exception:P4-EX-###

The detector validates ledger ↔ source agreement and exact line/token identity. It reports approved exceptions separately forever; it never silently removes them from totals. An unapproved comment, missing comment, moved token, stale pair, or one-to-many annotation is an invalid exception and a loud finding. Rejection means fix it; never record the rejection as an exemption.

Tier-M batch and certification

Keep each batch at 15 files or fewer. Run pnpm type-check and relevant gates. Then spawn a second adversarial agent with the exact brief:

assume this broke something; find it.

The certifier reruns the detector and gates, inspects every changed surface in light and dark at desktop and mobile viewports, reviews the exception classes, and returns only CERTIFIED or REJECTED with evidence. Fix or fully revert a rejected batch. Nothing ships mostly.

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

Admin debug system wiring for the floating AdminIndicator's live debug data and Copy Full Context. Use when adding debug visibility to a route or feature, wiring useDebugContext or the debug panel, capturing console errors, or enabling the copy-context workflow for a page.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

armanisadeghi/ai-matrx32026년 10월 20일 업데이트

Compact two-icon Copy / Copy-for-AI controls (components/agent-copy). Use when adding copy buttons to a row, card, list, or record; merging duplicate Copy/JSON/AI controls; continuing the copy rollout; or writing a Copy-for-AI payload. NOT for markdown content actions (use rich-document-actions).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

armanisadeghi/ai-matrx32026년 10월 20일 업데이트

Disclosing a surface's existing fixed AI jobs in the shell's top Agents menu. Use when a page, panel, overlay, or window already runs a mandate behind a button, assist, automatic action, or mode; when the agent-disclosure guard names a file; or during a surface check.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

armanisadeghi/ai-matrx32026년 10월 20일 업데이트

The watch-fix-rerun method for making an existing platform agent or automated process efficient and correct: baseline its ledger, run one unit yourself, fix the class behind every wasted call, rerun, record. Use when asked to improve, optimize, watch, or 'make efficient' an agent, a sandbox session, a sync job, or any recurring automated process.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

armanisadeghi/ai-matrx32026년 10월 20일 업데이트

Redux state for agent execution and firing agent shortcuts. Use when editing features/agents/redux/, building agent UI, creating a conversation, touching assembleRequest or NDJSON stream state, wiring agent-state selectors, adding a per-conversation capability, or triggering a shortcut from a button, menu, or code (useShortcutTrigger, launchAgentExecution).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

armanisadeghi/ai-matrx32026년 10월 20일 업데이트

The provision for a call site: the exhaustive menu of values that place in the code can realistically produce. Use before creating or fixing a mandate or agent that reasons about more than its own input, when deciding whether an agent can answer at all with what it is sent, or when its output 'looks right' but nobody checked it could be. NOT for building the agent (use create-agent).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

armanisadeghi/ai-matrx32026년 10월 20일 업데이트

armanisadeghi의 스킬 모두 보기

이 스킬의 문제 신고