Skip to content

v0.2.0 — Tailwind v4 + Brand Color Detection

Pre-release
Pre-release

Choose a tag to compare

View all tags
@Rosalina7515 Rosalina7515 released this 17 May 10:55
· 9 commits to main since this release
v0.2.0
2785f06

What's new

Added

  • Tailwind v4 support. detect-stack.mjs now reports tailwind.flavor (v3 | v4) by parsing both the tailwindcss dependency version and the @import "tailwindcss" / @theme directives in
    globals.css. The Skill workflow branches on this:

    • v3 projects continue to use templates/globals.css.tpl + tailwind.config.tpl.
    • v4 projects use the new templates/globals.v4.css.tpl and skip the JS config entirely (CSS-first).

  • Custom brand color detection. New scripts/detect-brand.mjs looks for an existing brand / primary / accent color across:

    • tailwind.config.{js,ts,mjs} — object form and string form.
    • globals.css — plain CSS variables (--brand, --primary-600).
    • globals.css v4 @theme blocks (--color-brand-600).

    Output classPrefix (one of brand / primary / accent / indigo fallback) is substituted everywhere the Skill would otherwise hard-code indigo.

  • New reference: references/tailwind-v4.md — v3 → v4 class deltas and the v4 idioms.

  • New reference: references/brand-color-strategy.md — exact rules for when to substitute, when to preserve, edge cases.

  • New template: templates/globals.v4.css.tpl — v4-flavor globals.

Changed

  • SKILL.md step 1 now runs two detection scripts in sequence and announces both results.
  • SKILL.md step 5 branches on tailwind.flavor and always reads brand-color-strategy.md before emitting any indigo class.
  • references/tailwind-modernization.md — added a top-of-file note declaring indigo as a placeholder for the detected classPrefix, and a pointer to the v4 reference.
  • README roadmap and "supported stacks" table updated to reflect v4 support.

新增

  • Tailwind v4 支持。detect-stack.mjs 通过解析 tailwindcss 依赖版本号 + globals.css 里的 @import "tailwindcss" / @theme 指令，输出 tailwind.flavor（v3 | v4）。Skill 工作流据此分支:
    • v3 项目继续使用 templates/globals.css.tpl + tailwind.config.tpl。
    • v4 项目使用新增的 templates/globals.v4.css.tpl,完全跳过 JS 配置（CSS-first）。
  • 自动检测品牌色。新增脚本 scripts/detect-brand.mjs,跨 tailwind.config、普通 CSS 变量、v4 @theme 块查找已有的 brand / primary / accent 颜色。检测到的 classPrefix 会替换 Skill
    默认硬编码的 indigo。
  • 新增参考文档:references/tailwind-v4.md、references/brand-color-strategy.md。
  • 新增模板:templates/globals.v4.css.tpl。

改动

  • SKILL.md Step 1 依次跑两个检测脚本;Step 5 按 tailwind.flavor 分支。
  • README roadmap 和"支持栈"表更新。
Assets 2
Loading