Zakaria
a46764fb1b
ci / Validate workspace (push) Has been cancelled
landing-page-ci / Validate landing page (push) Has been cancelled
landing-page-deploy / Deploy landing page (push) Has been cancelled
github-metrics / Generate repository metrics SVG (push) Has been cancelled
refresh-contributors-wall / Refresh contributors wall cache bust (push) Waiting to run
73 lines
2.6 KiB
Markdown
73 lines
2.6 KiB
Markdown
# kami-deck
|
|
|
|
Sister skill to [`kami-landing`](../kami-landing/). Produces a single
|
|
self-contained HTML file: a horizontal magazine-style swipe deck in
|
|
the **kami (紙 / 纸)** design system — print rhythm, ink-blue accent,
|
|
serif at one weight, no italic, no cool grays.
|
|
|
|
> **Read first** — agent contract, schema, and self-check live in
|
|
> [`SKILL.md`](./SKILL.md). This README is the human quick-start.
|
|
|
|
## What you get
|
|
|
|
- N viewport-sized slides laid out horizontally on a transformed
|
|
flex track.
|
|
- **Cover / chapter / end slides** flip background to ink-blue
|
|
(`#1B365D`) with ivory text. **All other slides** stay on
|
|
parchment (`#f5f4ed`) with serif at weight 500.
|
|
- **Per-slide chrome strip**: brand mark · deck title · live
|
|
slide counter (`01 / 09`).
|
|
- **Tabular-nums** on every counter, metric, and date.
|
|
- **Ink-blue progress bar** at the bottom that fills as you advance.
|
|
- **Dot indicator** near the bottom; click to jump.
|
|
- **ESC overview grid** with scaled thumbnails.
|
|
- **Keyboard / wheel / touch nav** — same model as `guizang-ppt`.
|
|
- **Multilingual stack** — EN / zh-CN / ja, set on `:root` via the
|
|
`language` parameter.
|
|
|
|
## 30-second tour
|
|
|
|
The skill is "agent-driven, no script": there's no `compose.ts`. The
|
|
agent reads `SKILL.md`, gathers the brief, then writes
|
|
`out/index.html` directly using the tokens from
|
|
[`design-systems/kami/DESIGN.md`](../../design-systems/kami/DESIGN.md)
|
|
and the layout primitives in [`example.html`](./example.html).
|
|
|
|
To preview the canonical Open Design instance:
|
|
|
|
```bash
|
|
open example.html
|
|
```
|
|
|
|
To start a fresh project:
|
|
|
|
1. Open the skill in your agent (Claude · Cursor · Codex · …).
|
|
2. Answer two rounds of brief questions (identity + content).
|
|
3. Write the file. Done.
|
|
|
|
## Files
|
|
|
|
```text
|
|
skills/kami-deck/
|
|
├── SKILL.md # ← agent contract (read this first)
|
|
├── README.md # ← you are here
|
|
└── example.html # canonical Open Design rendering (9 slides)
|
|
```
|
|
|
|
## Boundaries
|
|
|
|
- No second accent color. No italic. No cool blue-grays. No hard
|
|
drop shadows.
|
|
- One self-contained HTML file. No router, no external JS bundle.
|
|
- Cover / chapter / end slides only — no other slide kind goes dark.
|
|
- Tag fills must be solid hex (kami's print invariant), not `rgba()`.
|
|
|
|
## See also
|
|
|
|
- [`kami-landing`](../kami-landing/) — long-form one-pager sister.
|
|
- [`design-systems/kami/DESIGN.md`](../../design-systems/kami/DESIGN.md) — token spec.
|
|
- [`open-design-landing-deck`](../open-design-landing-deck/) — same
|
|
swipe nav model, different visual language (Atelier Zero).
|
|
- Upstream: [`tw93/kami`](https://github.com/tw93/kami) — original
|
|
Claude skill (MIT) the design system adapts.
|