JSFiddle - React, Tailwind, and code Playground
HTML
<div id="main">
<div>TITLE</div>
<div>BODY</div>
<div>COMMENT</div>
<div><textarea></textarea></div>
<div id="overlay">@@@@@@</div>
</div>
<button>overlay</button>
CSS
#main {
width: 200px;
height: 200px;
background-color: yellow;
position:relative
}
#overlay{
background:rgba(0, 84, 214, 0.5);
height:100%; width:100%;
line-height:200px;
position:absolute;
top:0; left:0;
display:none;
text-align: center;
}
JavaScript
$('button').click(function(){
$('#overlay').toggle();
});