JSFiddle - React, Tailwind, and code Playground

by Andrew Dunai

HTML

<div class="block">asdasd</div>
asd

CSS

.block {
    transition: opacity 0.5s linear, transform 0.5s linear, max-height 0.5s linear, padding 0.5s linear;
    opacity: 1;
    max-height: 30px;
    
    background: red;
    padding: 10px;
    cursor: ponter;
}
.block.hidden {
    opacity: 0;
    max-height: 0;
    padding: 0;
    transform: scaleY(0);
}

JavaScript

$('.block').click(function() {
    $(this).addClass('hidden');
});