ryan-roemer.github.io

style_node

Restyle text on a slide — its colour, size, weight, alignment and so on — and a plural target like 'the bullets' or 'the takeaways' restyles the whole group in one call. Identify what to style by id (like 9.3) or by describing it ('the heading', 'the second bullet'). A description that names a group styles the whole group, so 'the bullets' or 'this list' restyles every bullet on the slide in one go. Give the styling as CSS declarations: "color: yellow", or "color: yellow; text-decoration: underline" to set several at once. You can set: color, background-color, font-size, font-weight, font-style, letter-spacing, line-height, text-align, text-transform, text-decoration, opacity, border-radius, display, visibility. Relative sizes like 'bigger' are resolved against the element's real size, and the receipt reports the value the slide actually got. To hide something use "display: none" or "visibility: hidden" — nothing is ever removed, so undo_edits brings it straight back. A value the browser will not accept is refused rather than silently dropped.

Page: /the-frontend-strikes-back/?slideIndex=0&stepIndex=0

Input schema

{
  "type": "object",
  "properties": {
    "target": {
      "type": "string",
      "description": "A node id like '9.3', or a description like 'the heading' or 'the bullets'."
    },
    "style": {
      "type": "string",
      "description": "CSS declarations, e.g. 'color: yellow' or 'color: yellow; text-decoration: underline'. For font-size, 'bigger' and 'smaller' also work."
    }
  },
  "required": [
    "target",
    "style"
  ]
}