frontend-slides-editable
Create zero-dependency, animation-rich HTML presentations that run entirely in the browser with a built-in editor: move objects, multi-select with Ctrl+click, alignment snapping, simple text formatting with font family + size controls, undo/redo, a Pages sidebar (slide thumbnails, drag to reorder, delete), presentation tools (Laser pointer and Fullscreen), Ctrl+S persistence, and export HTML.
This skill is a copy of the frontend-slides skill extended with the editable deck runtime. For read-only decks without editor weight, use the original frontend-slides skill instead (same skills directory layout).
<preset_fidelity>
Parity with parent frontend-slides (style flexibility)
Adding edit mode must not replace preset authoring. The parent skill treats each choice in STYLE_PRESETS.md as a spec: per preset you implement its Layout prose, Signature Elements, typography, and colors — title slides and content slides differ across presets (e.g. Bold Signal’s card + big numerals vs. Notebook Tabs’ paper + edge tabs vs. Swiss Modern’s grid + red bar).
Normative behavior in Phase 3:
- Read STYLE_PRESETS for the chosen preset(s) and reflect layout + signatures in HTML/CSS, not only
:rootcolors and fonts. - The editable reference (examples/editable-deck-reference.html) supplies JS/CSS patterns (chrome, sidebar, objects, history) — not a frozen slide layout to paste on every deck. Do not reuse one generic “title + subtitle + corner rounded rectangle” geometry for every style.
examples/generated/presets/*.htmlare sample decks, not a layout shortcut. The 12 legacy samples are runtime smoke + visual previews; the 34 ported samples are real-template ports frombeautiful-html-templatesusing the shared Swiss/reference runtime plus locked slot editing. For real deliveries, match the chosen preset/template grammar instead of reusing a generic README deck.- Static chrome (decorations that should not be draggable) may live outside
.slide-edit-layer(e.g. background pseudo-elements, fixed nav chrome) per preset; movable copy and blocks stay as[data-slide-object]inside the layer.