Slide State

reveal.js supports a data-state tag that can be added on slides which gets rendered into <section> tags. In AsciiDoc the data-state can be applied to a slide by adding a state attribute to a section like this:

[state=topic]
== Epic Topic

That state can be queried from JavaScript or used in CSS to apply further customization to your slide deck. For example, by combining this feature with the CSS override one, you can alter fonts for specific pages with this CSS:

@import 'https://fonts.googleapis.com/css?family=Baloo+Bhai';

section[data-state="topic"] h2 {
    font-family: 'Baloo Bhai', cursive;
    font-size: 4em;
}