JSFiddle - React, Tailwind, and code Playground

by alfredopacino

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/css/materialize.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/js/materialize.min.js"></script>
<body>
<nav class="light-blue lighten-1" role="navigation">
    <div class="nav-wrapper container"><a id="logo-container" href="#" class="brand-logo">Logo</a>
        <ul class="right hide-on-med-and-down">
            <li><a href="#">Navbar Link</a></li>
        </ul>



        <ul id="nav-mobile" class="side-nav left">
            <li><a href="#">Navbar Link</a></li>
        </ul>

        <ul id="nav-mobile-nr" class="side-nav right">
            <li><a href="#">Navbar Link</a></li>
        </ul>

        <a href="#" data-activates="nav-mobile" class="button-collapse">menu-left </a>

        <a href="#" style="margin-left:10px" data-activates="nav-mobile-nr" class="button-collapse nr"> menu-right</i></a>

    </div>
</nav>
<div class="section no-pad-bot" id="index-banner">
    <div class="container">
        <br><br>
        <h1 class="header center orange-text">Starter Template</h1>
        <div class="row center">
            <h5 class="header col s12 light">A modern responsive front-end framework based on Material Design</h5>
        </div>
        <div class="row center">
            <a href="http://materializecss.com/getting-started.html" id="download-button" class="btn-large waves-effect waves-light orange">Get Started</a>
        </div>
        <br><br>

    </div>
</div>


<div class="container">

    <div class="section">

    </div>
</div>

<footer class="page-footer orange">
    <div class="container">
        <div class="row">
            <div class="col l6 s12">
                <h5 class="white-text">Company Bio</h5>
                <p class="grey-text text-lighten-4">We are a team of college students working on this project like it's our full time job. Any amount would help support and continue development on this project and is...

JavaScript

$('.button-collapse').sideNav();
    $('.button-collapse.nr').sideNav({
                menuWidth: 300, // Default is 240
                edge: 'right', // Choose the horizontal origin
            }
    );