JSFiddle - React, Tailwind, and code Playground

HTML

<div class="overlay">

    <div class="frame">
    </div>

</div>

CSS

.overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #000;
}

.frame {
    width: 100px;
    height: 250px;
    position: relative;
    top: 150px;
    background: #fff;
    left: 50%;
    margin-left: -50px;
}

JavaScript

$(document).ready(function () {
	$('.overlay').click( function(e) {
        
        if ($(e.target).hasClass('overlay')) {
        
			$(this).fadeOut();            
        
        }
    	
    });
});