docs: define skill demo css variable migration

[gene9831]

• skill demo中的 vitepress css变量统一替换成 tiny-robot 的 css 变量(vitepress的css变量在playground未引入)
• 更新 playground 的 import map

Summary by CodeRabbit

• Style

  • Updated skill demo panels, controls, sidebars, badges, file trees, and code blocks to use the latest design tokens for more consistent theming.
  • Refined border, text, primary, secondary, tertiary, and error colors while preserving existing layout and interactions.

• Enhancements

  • Improved the playground’s support for YAML imports.
  • Updated Tiptap integrations to a newer version for improved compatibility and functionality.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: ff092b04-28ec-4549-a8f7-3d189094ad77

📥 Commits

Reviewing files that changed from the base of the PR and between 7648e33 and 5e3068a.

📒 Files selected for processing (3)

• docs/demos/tools/skill/SkillInspector.css
• docs/demos/tools/skill/VueSkillPlugin.css
• packages/playground/src/utils/import-map.ts

---

Walkthrough

The changes migrate two skill demo stylesheets to --tr-* design tokens and update the playground import map with a yaml mapping and Tiptap version 3.17.1 mappings.

Changes

Skill demo theme migration

Layer / File(s)	Summary
Skill inspector theme tokens docs/demos/tools/skill/SkillInspector.css	Panel, control, state, file-tree, text, and code-block colors now use --tr-* design tokens.
Vue skill plugin theme tokens docs/demos/tools/skill/VueSkillPlugin.css	Sidebar, option, summary, badge, title, and preview colors now use --tr-* design tokens.

Playground import map updates

Layer / File(s)	Summary
CDN dependency mappings packages/playground/src/utils/import-map.ts	The import map adds yaml and upgrades Tiptap CDN packages from 3.11.0 to 3.17.1.

Estimated code review effort: 2 (Simple) | ~10 minutes

Poem

I’m a rabbit with tokens in tow,
Through themed panels I hop and go.
YAML joins the map with cheer,
Tiptap grows a newer ear.
Clean colors bloom in every row.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly summarizes the migration of skill demo CSS variables and matches the main changes in the pull request.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[github-actions]

🧹 Preview Cleaned Up

The preview deployment has been removed.