JSFiddle - React, Tailwind, and code Playground

by fredrik

HTML

<link href="http://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet" type="text/css">
    
<div data-ng-app>
        <div data-ng-controller="ListController" class="ng-scope">
            <h1>Angular Demo</h1>
            <p>It's like magic</p>
            
    </div>
</div>

CSS

body, button {
    font-family: 'Ubuntu', sans-serif;
}

p {
    margin: 4px 0;
}

button {
    padding: 4px;
    color: #fff;
    border: 1px solid #314f70;
    border-radius: 2px;
    background-image: -webkit-linear-gradient(top, #456da0, #38658e);
    background-repeat: repaeat-x;
}

li {
    padding: 4px;
    margin-bottom: 4px;
    overflow: hidden;
    line-height: 26px;
    font-size: 12px;
    border: 1px solid #e2e2e2;
    border-radius: 2px;
    
}

li button {
    float: right;
}

li span {
    display: block;
    float: left;
    width: 70%;
    padding-left: 1px;
}

li input {
    display: block;
    float: left;
    width: 70%;
    height: 22px;
    font-size: 12px;
    border: 1px solid #e2e2e2;
    border-radius: 2px;
}

JavaScript

(function (window) {
    "use strict";
    function ListController ($scope) {
        $scope.list = [];

    }
            
    window.ListController = ListController;
}(window));