JSFiddle - React, Tailwind, and code Playground

by sampottinger

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<div id="intro">
     <h1>Make multi-platform builds suck less.</h1>

    <div id="subtext"><span class="mild-importance">LabJack Remote Orchestration Build (ROB):</span> With 10 builds and counting, LJ-ROB speeds cross-platform development by enouraging frequent releases through easier deployments and automated testing over multiple operating systems.</div>
</div>
<div id="content">
    <div class="big-form">
        <form role="form">
            <div class="form-group">
                <label for="email">Email address</label>
                <input type="email" class="form-control" placeholder="[email protected]">
            </div>
            <button type="submit" class="btn btn-primary">Login with Open-ID</button>
        </form>
        <div class="promotion">
            <div>As influential computer scientist <a href="http://en.wikipedia.org/wiki/Eric_S._Raymond">Eric S. Raymond</a> says,</div><div class="mild-importance">ship early and ship often. :)</div>
            </div>
    </div>
</div>

CSS

.mild-importance {
    font-weight: bold;
}
.promotion {
    color: #707070;
    padding: 10px;
    margin: 30px 0;
    text-align: center;
}
.sub-text {
    font-size: 16px;
}
.big-form {
    border: 1px solid #C0C0C0;
    padding: 15px;
    width: 500px;
    margin: 0 auto;
}
#intro {
    padding: 50px;
    background-color: #E0E0E0;
    margin-bottom: 30px;
}
#intro h1 {
    font-size: 41px;
    margin-bottom: 15px;
}
#content {
    margin: 50px;
}