JSFiddle - React, Tailwind, and code Playground
HTML
</head>
<body>
<h1>Protean</h1>
<p>Your status bar, your way.</p>
<hr>
<a class="Button" href="#">
<i class="fa fa-spin fa-refresh"></i> Coming Soon</a>
<hr style="height:8pt; visibility:hidden;" />
</body>
</html>
CSS
h1 {
color: #ffffff !important;
font-size: 350%;
}
p {
color: #ffffff !important;
font-size: 19px;
}
body {
background:#4fb088 !important;
text-align:center !important;
}
.Button {
background-color:#5fc79c;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:HelveticaNeue-Medium;
font-size:16.5px;
padding:15px 35px;
text-decoration:none;
}
.Button:hover {
background-color:#6cd2a8;
}
.Button:active {
position:relative;
top:1px;
}
a:hover
{
text-decoration:none;
color:white;
}
brbutton {
display: block;
margin: 10px 0;
}
hr {
height:1px;
visibility:hidden;
margin-bottom:-1px;
}