Troubles setting a default background & background classes [revealjs]

[agerlach]

Description

I am trying to port a corporate pptx template to Quarto + RevealJS. This template has a default background image but also a separate image for "section breaks".

Based on https://github.com/EmilHvitfeldt/quarto-revealjs-cinco-de-mayo/blob/main/_extensions/cinco-de-mayo/cinco.scss I was able to implement classes that set the appropriate background images

@mixin background-full {
    background-size: 100%, auto;
    background-position: center;
    background-repeat: no-repeat;
}

.theme-main {
    &:is(.slide-background) {
        background-image: url('../../../../../_extensions/xxx/figures/main_bg.png');
        @include background-full;
      }
}

.theme-break {
    &:is(.slide-background) {
        background-image: url('../../../../../_extensions/xxx/figures/section_break_bg.png');
        @include background-full;
      }
}

.theme-main uses the main / default background image, while .theme-break uses the one for the section break. This works as expected. However, the user needs to explicitly set the class for all slides.

I would prefer that the user only need to specify the class when needing something other than the default background. I implemented the following lua filter based on link to address this

function Header(el)
    if not el.attributes['background-image'] then
      el.attributes['background-image'] = '_extensions/xxx/figures/main_bg.png'
      el.attributes['background-size'] = '100%, auto'
      el.attributes['background-position'] = 'center'
      el.attributes['background-repeat'] = 'no-repeat'
    end
    
    return el
end

This works at setting a default background. The issue though is that if you try to specify a section break background (## Title {.theme-break}) the main / default background is used instead of that from .theme-break.

Does anybody have any suggestions of how to correct this? My expectation was that since the background image is set by the .theme-break class that the Lau filter would do nothing.

[mcanouil]

Could you share a small self-contained "working" (reproducible) example to work with, i.e., a complete Quarto document or a Git repository? Thanks.

You can share a Quarto document using the following syntax, i.e., using more backticks than you have in your document (usually four ````).

````qmd
---
title: "Reproducible Quarto Document"
format: html
---

This is a reproducible Quarto document using `format: html`.
It is written in Markdown and contains embedded R code.
When you run the code, it will produce a plot.

```{r}
plot(cars)
```

![A placeholder image](https://placehold.co/600x400.png)

The end.
````