cssContainerQuery constructor option

[yhatt]

Added cssContainerQuery constructor option to support CSS container queries, @container at-rule and cqw cqh cqi cqb cqmin cqmax units for child elements of the slide element section.

new Marpit({ cssContainerQuery: true })

div.marpit > :where(section) {
  container-type: size;
}

By enabling this option, Marpit will become able to use features that related to CSS container queries, within both of the theme and the tweaked styles by Markdown.

/* Container query */
@container (width > 1000px) {
  h1 {
    color: red;
  }
}

h1 {
  font-size: 5cqw; /* Container-based unit */
}

If passed string or array of strings to cssContainerQuery, Marpit will set the container name to identify the slide element in @container at-rule.

new Marpit({ cssContainerQuery: 'marpit-slide' })

div.marpit > :where(section) {
  container-type: size;
  container-name: marpit-slide;
}

If the container-size and container-name CSS declaration were already declared to section element through the theme CSS or tweaked styles, Marpit prefers them than the injected style by the constructor option. The injected style has low CSS specificity by using :where selector.

For keeping backward compatibillity, cssContainerQuery constructor option is false by default in Marpit v2. In downstream libraries and tools of Marp ecosystem, we may enable this option by default.

Resolves #355.