Skip to content

Support background image via slide front matter #66

Description

@tilucasoli

Summary

There is currently no way to set an image as a slide background from the markdown file. Users writing slides in markdown cannot specify a background image that renders full-bleed behind the slide content.

Current Behavior

  • SlideOptions only supports title, style, and template as known front matter fields.
  • The BackgroundPart in the superdeck package renders an empty SizedBox.shrink().
  • SlideView supports a backgroundWidget via SlideParts, but this is a programmatic Dart API — not configurable from markdown.
  • The @image block is a content block that takes up layout space, so it cannot be used as a background.

Expected Behavior

Users should be able to specify a background image directly in markdown front matter, for example:

---
title: My Slide
background: assets/hero-image.jpg
---

# Welcome

The image should render full-bleed behind all slide content (sections, header, footer), supporting common BoxFit options (e.g., cover, contain).

Proposed Approach

  1. Add background as a known field in SlideOptions (in core).
  2. When a slide has a background value, the rendering layer should resolve it as an image source (asset path, file path, or URL) and render it as a positioned background behind the slide content.
  3. Consider supporting an extended syntax for fit and alignment:
---
background:
  src: assets/hero-image.jpg
  fit: cover
  alignment: center
  opacity: 0.5
---

Additional Context

  • The test fixture complete_config.yaml already has a background: background.jpg entry, suggesting this was anticipated but never implemented.
  • The SlideParts.background widget slot already exists in SlideView, so the rendering plumbing is partially in place — it just needs a markdown-driven path.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions