Generates self-contained HTML dashboard from portfolio assessment Markdown files: level distributions, repo tables, shared gaps, improvement plans, and trend visualizations across multiple quarters.
npx claudepluginhub habitat-thinking/ai-literacy-superpowers --plugin ai-literacy-superpowersThis skill uses the workspace's default tool permissions.
Generate a self-contained HTML dashboard from portfolio assessment
Generates static, responsive HTML dashboards from DESIGN-OPS data via Notion, Linear, Figma, GitHub, Vercel. Uses Tailwind CSS, Chart.js from CDNs for zero-dependency browser output.
Creates or updates timestamped GitHub portfolio Markdown files by fetching and analyzing repository READMEs and structure via /github-portfolio <repo-url>. Use for career documentation snapshots.
Aggregates AI literacy assessments across multiple repositories into a portfolio view with level distributions, shared gaps, outliers, and prioritized improvement plans by organizational impact. Discovers repos from local paths, GitHub orgs, or topics.
Share bugs, ideas, or general feedback.
Generate a self-contained HTML dashboard from portfolio assessment data. The dashboard visualises AI literacy levels across repos with trend tracking from multiple quarterly assessments.
The output is a single HTML file with inline CSS and no external dependencies. It opens in any browser, works offline, and can be shared as an email attachment or Slack file.
The skill reads portfolio assessment files from the assessments/
directory in the current repo. It looks for files matching
*-portfolio-assessment.md.
If no portfolio assessment files exist, tell the user to run
/portfolio-assess first.
ls assessments/*-portfolio-assessment.md 2>/dev/null | sort
Report what was found:
/portfolio-assessFor each portfolio assessment file, extract:
YYYY-MM-DD)For trend data (2+ files), also track per-repo level changes across assessments to show trajectories (e.g. L1 → L2 → L3).
Produce a self-contained HTML file with these panels:
1. Summary header. Portfolio name (derived from the source description in the most recent assessment), date, total repo count, median level.
2. Level distribution. Colour-coded visualisation showing how many repos are at each level. Use the standard level colours:
| Level | Colour | Hex |
|---|---|---|
| L0 — Awareness | Grey | #808080 |
| L1 — Prompting | Light blue | #87CEEB |
| L2 — Verification | Blue | #4682B4 |
| L3 — Habitat Engineering | Teal | #20B2AA |
| L4 — Specification Architecture | Green | #2E8B57 |
| L5 — Sovereign Engineering | Gold | #DAA520 |
3. Trends (if 2+ assessments). Show how the portfolio has changed over time:
4. Repo table. Each repo as a row with:
5. Shared gaps. Table of gaps affecting 3+ repos with repo count and recommended action.
6. Improvement plan. Grouped by impact scope:
Save to assessments/portfolio-dashboard.html.
If a previous dashboard exists, overwrite it — the dashboard is regenerated from source data each time.
Dashboard generated: assessments/portfolio-dashboard.html
Repos: N (N assessed, N estimated, N not assessed)
Median level: LN
Trend data: N quarterly assessments
Shared gaps: N
Open with: open assessments/portfolio-dashboard.html
<style> block.
No external stylesheets, no CDN links, no JavaScript libraries.After generating the initial dashboard, the user may ask for refinements. Common requests:
Apply these as modifications to the existing file. Keep the self-contained constraint — do not add external dependencies.