Skill 详情
make-revealjs-presentation
Creates and updates RevealJS slide decks.
使用前先检查
自动化审核只检查相关性，不代表安全审查或推荐。使用前请阅读来源中的说明。
SKILL.md
这段内容是审核时保存的快照。外部来源才是完整且最新的版本。
---
name: make-revealjs-presentation
description: >-
Create or update a RevealJS HTML presentation using the repository's bundled slide template.
USE FOR: create RevealJS talks, make HTML slide decks, build presentation slides, start a new conference talk deck, convert a talk outline into RevealJS slides.
argument-hint: <output_html_path>
---
# Make a RevealJS presentation
Use this skill when the user wants a RevealJS-based slide deck or wants to start a new talk from the repository's house template.
## Default approach
Start from the bundled template asset instead of rebuilding the RevealJS shell from scratch:
- Template asset: `./assets/index.html`
- Copy that file to the requested output path, then edit the copied file.
- Keep the RevealJS CDN includes and `Reveal.initialize(...)` block unless the user explicitly asks to change them.
## What to customize first
After copying the template, replace these placeholders before expanding the deck:
- `Talk Title`
- `Conference Name · Month Year`
- `Your Name`
- `Role · Company · website.example`
- Example links like `filename.html` and `example.com/...`
Then rewrite or remove the example slides so the deck matches the user's topic.
## Template conventions
- The template is intentionally simple and close to stock RevealJS.
- Section divider slides use `class="heading-only"`.
- Code slides are just normal sections with a `<pre><code>` block.
- If a code badge or copy-button plugin is in use and should be suppressed for one slide, add `class="no-code-badge"` to that section.
## Customization tips
### Body font
Change the body font in the `.reveal` rule near the top of the template:
```css
.reveal {
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
```
Examples:
- Minimal/system default: keep the existing stack
- Sans-serif web font: `font-family: 'Work Sans', sans-serif;`
- Serif deck: `font-family: 'Source Serif 4', serif;`
If using a web font, also add the corresponding `<link rel="stylesheet">` in `<head>`.
### Heading font
Change headings separately in:
```css
.reveal h1,
.reveal h2,
.reveal h3 {
font-family: inherit;
}
```
Examples:
- Match body text: keep `inherit`
- Distinct headings: `font-family: 'Roboto', sans-serif;`
- Editorial style: `font-family: 'Fraunces', serif;`
### Text sizing
Adjust the default body sizing here:
```css
.reveal p,
.reveal li,
.reveal td,
.reveal th {
font-size: 1em;
}
```
Increase or decrease that `font-size` when the user wants a generally larger or smaller deck.
### Code block styling
Global code block styling lives in:
```css
.reveal pre { ... }
.reveal pre code { ... }
```
Adjust those rules for larger code, different padding, or lighter/heavier borders.
### Divider slides
The divider slide look is controlled by `section.heading-only` and the underline rule:
```css
.reveal section.heading-only h1::after,
.reveal section.heading-only h2::after,
.reveal section.heading-only h3::after { ... }
```
Remove that block if the user wants divider slides to look more like plain RevealJS headings.
### Color contrast
If the user customizes colors, keep text/background combinations at accessible contrast.
- Prefer dark text on a light background or light text on a dark background.
- Be especially careful with body text, slide numbers, links, and code blocks.
- Recheck contrast after changing theme colors, background fills, or heading styles.
## Accessibility
Preserve accessibility basics when creating or customizing decks.
- Keep text/background contrast accessible, especially after theme changes.
- Make sure links have discernible text.
- Make sure images have alt text if they convey meaning.
- Treat plugin-generated UI separately from slide content when reviewing issues. `RevealMenu` currently has a known accessibility issue: its generated menu trigger may lack a discernible accessible name. If the user keeps the plugin, note that this can remain as an axe violation even w在 GitHub 阅读完整来源 （打开外部页面）