JSFiddle - React, Tailwind, and code Playground

by sampottinger

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">
<form data-validate="parsley" class="papel-section form" id="section-General" role="form">
    <h1>General</h1> 
    <div class="papel-subsection form-group">
        <div class="form-group">
            <label for="undefinedGeneral-text-input-First_Name" class="control-label">First Name *</label>
            <input type="text" data-required="true" class="input-medium papel-text-input form-control" id="undefinedGeneral-text-input-First_Name">
        </div>
        <div class="form-group">
            <label for="undefinedGeneral-text-input-Middle_Name" class="control-label">Middle Name</label>
            <input type="text" class="input-medium papel-text-input form-control" id="undefinedGeneral-text-input-Middle_Name">
        </div>
        <div class="form-group">
            <label for="undefinedGeneral-text-input-Last_Name" class="control-label">Last Name *</label>
            <input type="text" data-required="true" class="input-medium papel-text-input form-control" id="undefinedGeneral-text-input-Last_Name">
        </div>
    </div>
    <div class="papel-subsection form-group">
        <div class="form-group">
            <label for="undefinedGeneral-dropdown-Gender" class="control-label">Gender *</label>
            <select class="papel-dropdown form-control" id="undefinedGeneral-dropdown-Gender">
                <option>Female</option>
                <option>Male</option>
                <option>Intersex</option>
                <option>Other</option>
                <option>Choose not to disclose</option>
            </select>
        </div>
    </div>
    <div class="papel-subsection form-group">
        <div class="form-group">
            <label for="undefinedGeneral-text-input-Email" class="control-label">Email *</label>
            <input type="text" data-required="true" class="input-medium papel-text-input form-control"...

CSS

.papel-subsection {
    margin-bottom: 45px;
}

.papel-enumeration-table {
    margin: 15px 0 50px 0;
}

.default-checkbox {
    margin-top: 5px;
}

.instructions {
    font-size: 13px;
    color: #505050;
    margin: 20px;
}