JSFiddle - React, Tailwind, and code Playground

by Ronny

HTML

<article>
    <section class="slide">
        <h2>Introducing MooPresent</h2>
        <p>MooPresent is a  MooTools class for turning your posts and articles into beautiful, accessible presentations.</p>
        <p>It is that awesome.</p>
    </section>
    <section class="slide">
        <h2>Why?</h2>
        <p>Reading articles takes time. Going over slideshows is easier.</p>
        <p>Because I can</p>
    </section>
</article>

CSS

.presenting .slide {border: 1px solid red;}

JavaScript

var MooPresent = new Class({
    Implements: [Options],
    options: {
        articleTag: 'article'
    },
    initialize: function(options){
        this.setOptions(options);
        $$(this.options.articleTag).addClass('presenting');
    }
});

var postPresentation = new MooPresent();