lewislulu--html-ppt-skill
lewis
a93138e1bf
World-class HTML presentation skill with keyboard navigation, theme/animation switching, headless Chrome rendering, and showcase decks for themes/layouts/animations. - 24 themes (minimal-white, dracula, catppuccin, tokyo-night, xiaohongshu-white, …) - 31 single-page layouts (cover, code, charts, timeline, gantt, mindmap, …) - 20+ named animations (rise-in, typewriter, confetti-burst, card-flip-3d, …) - theme/layout/animation showcase decks - runtime.js: arrow/space/F/S/O/T/A keybinds, hash routing, progress bar - render.sh headless Chrome PNG export - MIT, author lewis <sudolewis@gmail.com>
20 行
1.3 KiB
HTML
20 行
1.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN"><head><meta charset="utf-8"><title>Bullets</title>
|
|
<link rel="stylesheet" href="../../assets/fonts.css">
|
|
<link rel="stylesheet" href="../../assets/base.css">
|
|
<link rel="stylesheet" id="theme-link" href="../../assets/themes/minimal-white.css">
|
|
<link rel="stylesheet" href="../../assets/animations/animations.css">
|
|
</head><body class="single">
|
|
<div class="deck"><section class="slide is-active" data-title="Why">
|
|
<p class="kicker">Why · 为什么</p>
|
|
<h2 class="h2">好的演讲系统，帮你做三件事</h2>
|
|
<p class="lede mb-l">不是做不出漂亮的 slide，是每次都要重新做。</p>
|
|
<ul class="grid g1 anim-stagger-list" style="list-style:none;padding:0;margin:0;gap:14px" data-anim-target>
|
|
<li class="card card-accent"><h4>① 统一设计语言</h4><p class="dim">所有页共用同一套 tokens，字号、颜色、阴影不会跑偏。</p></li>
|
|
<li class="card card-accent"><h4>② 降低复用成本</h4><p class="dim">下一次讲同类话题，复制 deck、换数据、换主题即可。</p></li>
|
|
<li class="card card-accent"><h4>③ 可切换，可演示</h4><p class="dim">按 T 即可循环切主题、按 A 可切动效，汇报现场加分。</p></li>
|
|
</ul>
|
|
</section></div>
|
|
<script src="../../assets/runtime.js"></script>
|
|
</body></html>
|