JSFiddle - React, Tailwind, and code Playground

by Nick Hulea

HTML

<link rel="stylesheet" href="http://hulea.org/heart/css/default.css">
<link rel="stylesheet" href="http://hulea.org/heart/css/component.css">
<link rel="stylesheet" href="http://hulea.org/heart/css/animations.css">
<script src="http://hulea.org/heart/js/jquery.dlmenu.js"></script>
<script src="http://hulea.org/heart/js/modernizr.custom.js"></script>
<script src="http://hulea.org/heart/js/modernizr.custom.js"></script>
<div class="pt-triggers">
    <button id="iterateEffects" class="pt-touch-button">Show next page transition</button>
    <div id="dl-menu" class="dl-menuwrapper"></div>
    <!-- /dl-menu-wrapper-->
</div>
<!-- /triggers -->
<div id="pt-main" class="pt-perspective">
    <div class="pt-page pt-page-1">
        <h1><span>A collection of</span><strong>Page</strong> Transitions</h1>
    </div>
    <div class="pt-page pt-page-2">
        <h1><span>A collection of</span><strong>Page</strong> Transitions</h1>
    </div>
    <div class="pt-page pt-page-3">
        <h1><span>A collection of</span><strong>Page</strong> Transitions</h1>
    </div>
    <div class="pt-page pt-page-4">
        <h1><span>A collection of</span><strong>Page</strong> Transitions</h1>
    </div>
    <div class="pt-page pt-page-5">
        <h1><span>A collection of</span><strong>Page</strong> Transitions</h1>
    </div>
    <div class="pt-page pt-page-6">
        <h1><span>A collection of</span><strong>Page</strong> Transitions</h1>
    </div>
</div>