一键导入
css-class-usage
Get a report on CSS class usage by classname (prefix or full name) across the helsingborg-stad GitHub org, including counts and file locations.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
菜单
Get a report on CSS class usage by classname (prefix or full name) across the helsingborg-stad GitHub org, including counts and file locations.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Migrate a component SCSS file from raw var_default variables to the design token mixin pattern, then verify visually with Playwright. Usage: /implement-design-tokens {ComponentScssName} {PreviewUrl}
Remove the $extras parameter from tokens.create() in a component SCSS file, moving the extra tokens into the component selector as CSS custom properties. Usage: /remove-tokens-extras {ComponentPath}
Automatically identify and add missing usage examples for a component in the styleguide. Usage: /create-usage-example {ComponentName}
| name | css-class-usage |
| description | Get a report on CSS class usage by classname (prefix or full name) across the helsingborg-stad GitHub org, including counts and file locations. |
| argument-hint | <ClassName> |
Search for usages of a CSS class name (or prefix) across all repositories in the helsingborg-stad GitHub organisation and return:
u-color__bg, u-color__bg--primary, …){ClassName} — the full class name or prefix to search for (e.g. u-color__bg or c-card)GitHub code search requires authentication. Try the methods below in order until one succeeds.
gh search code "{ClassName}" --owner helsingborg-stad --limit 200 --json repository,path,url
Ignore all matches found in: https://github.com/helsingborg-stad/styleguide
curl -s \
-H "Authorization: Bearer $GITHUB_TOKEN" \
-H "Accept: application/vnd.github+json" \
"https://api.github.com/search/code?q={ClassName}+org:helsingborg-stad&per_page=100&page=1"
Ignore all matches found in: https://github.com/helsingborg-stad/styleguide
If total_count exceeds 100, repeat with page=2, page=3, … until all results are collected.
Each item in the items array contains:
repository.name — repository namepath — file path within the repohtml_url — direct link to the fileIf neither gh nor GITHUB_TOKEN is available, stop and tell the user:
Authentication required. Set
GITHUB_TOKENin your environment or install theghCLI and rungh auth login.
For each file returned in Step 1, fetch its raw content via the GitHub API:
gh api repos/helsingborg-stad/{repo}/contents/{path} --jq '.content' | base64 -d
From the content, extract every CSS class that matches the search term using this regex pattern:
{ClassName}(--[\w-]+)?
This captures both:
u-color__bg)u-color__bg--primary, u-color__bg--complementary-lighter)Collect all matches across all files, deduplicated per file.
Print a sorted, deduplicated plain-text list of every class name found across all files:
u-color__bg
u-color__bg--complementary
u-color__bg--complementary-lighter
u-color__bg--danger
…
Print a Markdown reference table sorted by class name, then by repository, then by file path:
| Class | Repository | File | Link |
|---|---|---|---|
u-color__bg--primary | repo-name | path/to/file.php | view |
End with a single summary line:
Total: {N} unique class names across {M} repositories ({F} files)