JSFiddle - React, Tailwind, and code Playground

by homer2

HTML

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css">
<script src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/base/jquery-ui.css">
<div data-role="page" id="docFilter" data-theme="b" >
    
    <div data-role="header" data-position="fixed" data-theme="c">
        <a href="Docs.aspx" data-icon="home" class="ui-btn-right" rel="external" data-iconpos="notext"></a><img src="https://lh4.googleusercontent.com/-YmO1lC3qy-k/TrBeuF2Do_I/AAAAAAAAMWU/AYEFssqMnYg/s800/Sport-ea_mobile.png" height="45" width="272" />
    </div><!-- /header -->
    
    <div data-role="content">    
        <h3>
            Doc Search</h3>
        <p>
            <div data-role="fieldcontain">
                <label for="m_ListBoxOrg" class="select">Plant:</label>
                <select id="m_ListBoxOrg">
                    <option>(all plants)</option>
                    <option>Barry</option>
                    <option>Gaston</option>
                    <option>Wilson</option>
                </select>
            </div>
            <div data-role="fieldcontain">
                <label for="m_ListBoxDocClasses" class="select">Doc Class:</label>
                <select id="m_ListBoxDocClasses">
                    <option>(all doc classes)</option>
                    <option>Shift</option>
                    <option>Daily</option>
                    <option>Weekly</option>
                    <option>Monthly</option>
                </select>
            </div>
            <div data-role="fieldcontain">
                <label for="m_ListBoxDocStatus" class="select">
                    Status:</label>
                <select id="m_ListBoxDocStatus">
                    <option>(all statuses)</option>
                    <option>Open</option>
                    <option>Closed</option>
                   ...