JSFiddle - React, Tailwind, and code Playground

by burkeholland

HTML

<script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.all.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/css/kendo.rtl.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.default.min.css">
<div class="wrapper k-content">
    <form>
        <ul>
            <li>
                <label class="k-label" for="email">Email:</label>
                <input class="k-input" type="text" name="email" />
            </li>
            <li>
                <label class="k-label" for="name">Name:</label>
                <input class="k-input" type="text" name="name" />
            </li>
             <li>
                <label class="k-label" for="name">Birthday:</label>
                <input data-role="datepicker" name="name" />
            </li>
        </ul>
    </form>
</div>

CSS

body, html {
    width: 100%;
    height: 100%;
}

.wrapper {
    width: 100%;
    height: 100%;
}    

FORM {
    margin: auto;
    padding-top: 20px;
    width: 400px;
}

input {
    font-size: 1.5em;
    width: 195px;
}

li {
    margin-bottom: 10px;
}

label {
    display: inline-block;
    width: 200px;
}

JavaScript

$(function() {

    kendo.bind(document.body);
    
});