JSFiddle - React, Tailwind, and code Playground

by dpaluy

HTML

<script src="http://foundation.zurb.com/page-templates4/js/vendor/custom.modernizr.js"></script>
<script src="http://foundation.zurb.com/page-templates4/js/foundation.min.js"></script>
<link rel="stylesheet" href="http://foundation.zurb.com/page-templates4/css/normalize.css">
<link rel="stylesheet" href="http://foundation.zurb.com/page-templates4/css/foundation.css">
<header>
  <nav class="top-bar">
    <div class="row">
      <div class="large-12 columns">
        <ul class="title-area">
          <li class="name">
            <h1>
              <a href="#">
                Top Bar Title
              </a>
            </h1>
          </li>
        </ul>

        <section class="top-bar-section">
          <ul class="left">
            <li><a href="#">Link 1</a></li>
            <li><a href="#">Link 2</a></li>
          </ul>

          <ul class="right">
            <li><a href="#">Link 3</a></li>
            <li><a href="#">Link 4</a></li>
          </ul>
        </section>
     </div>
    </div>
  </nav>
</header>

  <div class="row">
    <div class="large-12 columns">
      <div class="row">

    <!-- Content -->

        <div class="large-8 columns">
          <div class="panel radius">

          <div class="row">
          <div class="large-6 small-6 columns">

            <h4>Header</h4><hr/>
            <h5 class="subheader">Risus ligula, aliquam nec fermentum vitae, sollicitudin eget urna. Donec dignissim nibh fermentum odio ornare sagittis.
            </h5>

          <div class="show-for-small" align="center">
            <a href="#" class="small radius button">Call To Action!</a><br>

            <a href="#" class="small radius button">Call To Action!</a>
          </div>

          </div>
          <div class="large-6 small-6 columns">

            <p>Suspendisse ultrices ornare tempor. Aenean eget ultricies libero. Phasellus non ipsum eros. Vivamus at dignissim massa. Aenean dolor libero, blandit quis interdum et, malesuada nec ligula. Nullam erat...

JavaScript

$(document).foundation();