JSFiddle - React, Tailwind, and code Playground
HTML
<div class="card">
<div>1</div>
</div>
<div class="card">
<div>2</div>
</div>
<div class="card">
<input type='text' onclick='event.stopPropagation();event.preventDefault();' value='pick a number'></input>
</div>
CSS
body {
background-color:#000000;
}
.card {
background-color: #8f97a3;
width:200px;
height:200px;
margin:10px;
}
.card div, .card input {
margin:6px;
padding:6px;
}
.card:active {
background-color:#b9bec5;
margin:10px 6px 10px 14px;
}
JavaScript
$(document).ready(function () {
});