JSFiddle - React, Tailwind, and code Playground

by Julien Roy

HTML

<div id="container"></div>

CSS

.line {
    color:green;
    font-style: bold;
}
.direction {
    color:blue;
}
.time {
    font-style:italic;
}
.separator {
    margin:5px;
}

JavaScript

var data = {
    "atcocode": "43000804705",
        "smscode": "nwmdjgdj",
        "request_time": "2015-10-06T18:58:35Z",
        "departures": {
        "142": [{
            "mode": "bus",
                "line": "142",
                "direction": "Stourbridge, Stourbridge Bus Station",
                "operator": "cen-AMN",
                "aimed_departure_time": "20:10",
                "expected_departure_time": null,
                "best_departure_estimate": "20:10",
                "source": "NextBuses"
        }, {
            "mode": "bus",
                "line": "142",
                "direction": "Stourbridge, Stourbridge Bus Station",
                "operator": "cen-AMN",
                "aimed_departure_time": "21:10",
                "expected_departure_time": null,
                "best_departure_estimate": "21:10",
                "source": "NextBuses"
        }, {
            "mode": "bus",
                "line": "142",
                "direction": "Stourbridge, Stourbridge Bus Station",
                "operator": "cen-AMN",
                "aimed_departure_time": "22:10",
                "expected_departure_time": null,
                "best_departure_estimate": "22:10",
                "source": "NextBuses"
        }],
            "004": [{
            "mode": "bus",
                "line": "004",
                "direction": "Harborne, Serpentine Road",
                "operator": "cen-HAN",
                "aimed_departure_time": "07:05",
                "expected_departure_time": null,
                "best_departure_estimate": "07:05",
                "source": "NextBuses"
        }, {
            "mode": "bus",
                "line": "004",
                "direction": "Harborne, Serpentine Road",
                "operator": "cen-HAN",
                "aimed_departure_time": "07:33",
                "expected_departure_time": null,
                "best_departure_estimate": "07:33",
                "source": "NextBuses"
        },...