JSFiddle - React, Tailwind, and code Playground
by djp3d
HTML
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<haed>
<style>
.noselect {-webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */ -khtml-user-select: none; /* Konqueror HTML */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */ }
body { background-color: #058586; text-align: center; color: white; font-family: Arial, Helvetica, sans-serif; padding:0px; margin:0px; padding-top:10px; }
.card { background-color: #7BC473; border-radius: 12px; padding:10px; margin:30px; margin-bottom:60px; -webkit-box-shadow: 0px 2px 12px 0px rgba(0,0,0,0.3); -moz-box-shadow: 0px 2px 12px 0px rgba(0,0,0,0.3); box-shadow: 0px 2px 12px 0px rgba(0,0,0,0.3); }
.panel-heading {
border : 3px solid white;
}
.panel-title a {
color: white;
}
.panel-default>.panel-heading {
background-color: #7BC473; border-radius: 12px;
border
}
.panel-body {
background-color: #7BC473; border-radius: 12px;
margin-top: 10px;
margin-bottom: 10px;
}
.panel-default>.panel-heading+.panel-collapse>.panel-body {
border: none !important;
}
.panel-group .panel {
background-color:transparent;
}
.panel-default {
border: none;
}
h1 { font-size: 1.4em; }
p { font-size: 0.9em; line-height:1.4em; }
</style>
</haed>
<!------ Include the above in your HEAD tag ---------->
<div...