Display short text prominently

Caption below the image

scss/canvas/slide-pattern/_display.scss

Usage

<!-- _class: display -->

Display short text prominently

<!-- _class: display -->

![](image.jpg)

Optional caption text
scss/canvas/slide-pattern/_display.scss

Structure

  • Text only: Large font, bold, centered
  • With image/iframe: Normal font size, media centered
  • Caption: Paragraph below media at normal size
scss/canvas/slide-pattern/_display.scss

CSS Variables

CSS Variable Default
--display-font-size var(--font-size-3xl) (100px)
--display-font-weight bold

Note: Font size is only applied when no image or iframe is present.

scss/canvas/slide-pattern/_display.scss

Customized Display

scss/canvas/slide-pattern/_display.scss

Customization Example

---
style: |
  section.display {
    --display-font-size: 3em;
    --display-font-weight: 900;
  }
---

Override font size and weight.

scss/canvas/slide-pattern/_display.scss

iframes are also supported

scss/canvas/slide-pattern/_display.scss