Slide-Specific Deck Styles for Bespoke.js
JavaScript CSS HTML
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
demo
dist
lib
test/spec
.editorconfig
.gitattributes
.gitignore
.jshintrc
.travis.yml
CONTRIBUTING.md
LICENSE
README.md
bower.json
gulpfile.js
karma.conf.js
package.json

README.md

Build Status Coverage Status

bespoke-state

Slide-specific deck styles for Bespoke.js

Style your entire deck differently based on the active slide.

Classes specified in data-bespoke-state attributes will be added to the deck's parent element when the slide is activated.

Download

Download the production version or the development version, or use a package manager.

Usage

This plugin is shipped in a UMD format, meaning that it is available as a CommonJS/AMD module or browser global.

For example, when using CommonJS modules:

var bespoke = require('bespoke'),
  state = require('bespoke-state');

bespoke.from('article', [
  state()
]);

When using browser globals:

bespoke.from('article', [
  bespoke.plugins.state()
]);

Finally, add data-bespoke-state attributes to your slides.

<article>
  <section>
    Regular deck style
  </section>
  <section data-bespoke-state="special">
    Special deck style
  </section>
  <section data-bespoke-state="super special">
    Super special deck style
  </section>
  <section>
    Regular deck style
  </section>
</article>

Package managers

npm

$ npm install bespoke-state

Bower

$ bower install bespoke-state

Credits

This plugin was built with generator-bespokeplugin.

License

MIT License