Releases: seacen/deckify
v1.0.1 — Mobile flow + foot-caption-outside-absorber
Two new engineering-DNA rules baked into both ds-template.md and ds-template.zh.md, surfaced from the Xiaomi end-to-end pass. hard_checks.py learns the new anchor so every future brand DS is required to carry the rule.
What changed / 这次改了什么
1. Mobile flow — overflow:visible flip + absorber release
Desktop is a fixed 1280×720 canvas with the three-layer overflow:hidden safety net guarding against runaway content. On mobile the deck is a flow document — every slide gives up its fixed height and grows with its content.
The fix: desktop's overflow:hidden has to be explicitly flipped to overflow:visible in the mobile media query. Otherwise content beyond 720px gets silently clipped, every hard check passes, and the deck looks broken.
Absorbers (.body-grid, .fr, .chart-row, .chart-wrap, .tl-wrap, .dt-wrap, .flip-row) all switch to flex: 0 0 auto on mobile so content drives height. Tables stay the exception — keep horizontal scroll.
桌面三层 overflow:hidden 安全网在移动端反而成了凶手。修复:mobile media query 里显式把 overflow:hidden 翻成 overflow:visible,absorber 全部 flex: 0 0 auto,表格保留横向滚动作为唯一例外。
2. foot-caption-outside-absorber
Source / footnote rows (.dt-foot / .tl-foot / .chart-foot) must be siblings of the absorber inside .sc, not children of the absorber.
- Inside the absorber → top-aligned on desktop (visually "pushed up" with a large dead band below), and on mobile table absorbers (
overflow-x: auto) the foot scrolls horizontally out of view. - Outside (correct) → bottom-anchors on desktop, sits immediately under the main content on mobile.
hard_checks.py now requires the <!-- ENGINEERING-DNA: foot-caption-outside-absorber --> anchor in every brand DS.
数据来源 / 注脚行必须是 absorber 的同级 flex: 0 0 auto,而不是 absorber 的子元素。否则桌面被推到顶、移动端表格里随横向滚动消失。
3. Xiaomi DS + deck regenerated
The Xiaomi reference deck was the brand that surfaced both rules — it's been regenerated against the updated template and now passes mobile rendering at 375px.
Upgrade notes / 升级说明
If you've previously generated a brand DS with deckify and run hard_checks against it, the new foot-caption-outside-absorber anchor will fail. Regenerate the brand DS from the latest template — the engineering-DNA rule will be carried in automatically.
如果之前用 deckify 生成过品牌 DS 并跑过 hard_checks,新版会因为缺少 foot-caption-outside-absorber anchor 报 fail。从最新模板重新生成 DS 即可,新规则会自动带入。
Full diff
v1.0.0 — Public release
First public release of deckify on GitHub.
Tagged retroactively at fac82f7 — the last stable commit of the public release before the v1.0.1 mobile-flow + foot-caption engineering-DNA additions.
What's in this release / 这个版本里有什么
- Eight reference brands shipping / 八个参考品牌跑通: Tiffany, Stripe, Unilever, P&G, P&G alt, Coca-Cola, Mars, L'Oréal — every one passing both deterministic hard checks and visual review.
- Bilingual README (English + 中文) — the install instructions are written for any AI coding agent (Claude Code, Codex, OpenClaw, Cursor, etc.) to figure out itself.
- PolyForm Noncommercial 1.0.0 license — free for personal, educational, research, and noncommercial use.
- Plugin marketplace metadata — installable via
claude plugin install deckifyonce the marketplace entry is added. - Canonical slogan banners + closing message baked into SKILL.md ("The next deck writes itself. / PPT 翻篇了,AI 用 HTML 接管讲故事的边界。").
What deckify does / deckify 做什么
You give deckify any brand's website. A few minutes later you have two things that compound:
- A complete Design System — the brand's colors, fonts, logo, voice, plus 40+ engineering rules every slide should follow. One
.mdfile. Reusable forever. - A 9-slide demo deck — already in that brand's visual language. Living HTML, opens in any browser.
The first one is the asset that compounds. Every future deck for that brand is generated by AI from that one Design System file, in seconds.
你给 deckify 一个品牌网址,几分钟后你拿到两份会复利的产物:一份可复用的 Design System markdown + 一份 9 页 HTML demo deck。之后每一份 deck 都基于这一份 DS 文件由 AI 几秒生成。
See the README for the full story.