JSFiddle - React, Tailwind, and code Playground

by jakie8

HTML

<div>
    <header>jakiestfu</header>
    <p>Software Engineer at <a href="#" class="ms">Maker Studios</a></p>
    <nav>
        <ul>
            <li><a href="#" class="gh">GitHub</a></li>
            <li><a href="#" class="tw">Twitter</a></li>
            <li><a href="#" class="fo">Forrst</a></li>
            <li><a href="#" class="dr">Dribbble</a></li>
            <li><a href="#" class="md">Medium</a></li>
            <li><a href="#" class="em">Email</a></li>
        </ul>
    </nav>
</div>

CSS

@import url(http://fonts.googleapis.com/css?family=Lato:400);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:800);

* {
    -webkit-font-smoothing: antialiased;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html, body{
    overflow: hidden;
    margin: 0;
    padding: 0;
}

body{
    font-family: "Lato", sans-serif;
    font-size: 22px;
    color: #555;
    background: #fff;
}
header{
    text-transform: uppercase;
    font: 800 64px /64px 'Open Sans';
    color: #333;
    letter-spacing: 1px;
}
nav ul{
    display: block;
    margin: 0;
    padding: 0;
    list-style-type: none;
}
nav ul li{
    display: inline-block;
}
nav ul li:after {
    content: " · ";
    opacity: 0.2;
}
nav ul li:last-child:after{
    content: "";
}
a{
    color: #333;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    display: inline-block;
    transition: color 0.2s ease, border 0.3s ease;
}

div{
    width: 500px;
    height: 170px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -300px;
    margin-top: -95px;
}

.ms:hover{
    color: #999;
    border-color: #999;
}
.gh:hover{
    color: #97AECC;
    border-color: #97AECC;
}
.em:hover{
    color: #333;
    border-color: #333;
}
.tw:hover{
    color: #00aced;
    border-color: #00aced;
}
.fo:hover{
    color: #778E72;
    border-color: #778E72;
}
.dr:hover{
    color: #EA4C89;
    border-color: #EA4C89;
}
.md:hover{
    color: #57AD68;
    border-color: #57AD68;
}