JSFiddle - React, Tailwind, and code Playground

by mlms13

HTML

<div class="box green"></div>
<h1>This is Point 1</h1>
<div class="box blue"></div>
<h1>This is Point 2</h1>

CSS

body {
    background: #666;
}
.box {
    background-image: -webkit-linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.3));
    border-radius: 9px;
    border-right: 1px solid #444;
    border-bottom: 1px solid #444;
    clear: left;
    float: left;
    height: 18px;
    margin: 4px 0 18px;
    width: 18px;
}
.green {
    background-color: #ae5;
}
.blue {
    background-color: #6cf;
}

h1 {
    color: #fff;
    font-family: sans-serif;
    font-size: 26px;
    font-weight: bold;
    line-height: 26px;
    height: 32px;
    margin: 0 0 12px 26px;
    text-shadow: -1px -1px 1px rgba(0,0,0,0.4)
}