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>
21 行
1.1 KiB
CSS
21 行
1.1 KiB
CSS
/* theme: aurora — 极光渐变 */
|
|
:root{
|
|
--bg:#06091c;--bg-soft:#0a1130;--surface:rgba(255,255,255,.05);--surface-2:rgba(255,255,255,.08);
|
|
--border:rgba(180,220,255,.14);--border-strong:rgba(180,220,255,.28);
|
|
--text-1:#e8f0ff;--text-2:#b4c4e4;--text-3:#6a7a9e;
|
|
--accent:#5ef2c6;--accent-2:#7aa2ff;--accent-3:#c984ff;
|
|
--good:#5ef2c6;--warn:#ffd27a;--bad:#ff8ab0;
|
|
--grad:linear-gradient(135deg,#5ef2c6,#7aa2ff 50%,#c984ff);
|
|
--grad-soft:linear-gradient(135deg,rgba(94,242,198,.2),rgba(201,132,255,.2));
|
|
--radius:20px;--radius-sm:14px;--radius-lg:28px;
|
|
--shadow:0 20px 60px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08);
|
|
--shadow-lg:0 30px 80px rgba(0,0,0,.55);
|
|
--font-sans:'Inter','Noto Sans SC',sans-serif;
|
|
}
|
|
body{background:
|
|
radial-gradient(60% 50% at 20% 10%,rgba(94,242,198,.35),transparent 70%),
|
|
radial-gradient(55% 50% at 80% 20%,rgba(122,162,255,.32),transparent 70%),
|
|
radial-gradient(70% 60% at 50% 100%,rgba(201,132,255,.3),transparent 70%),
|
|
#06091c}
|
|
.card{backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%)}
|