JSFiddle - React, Tailwind, and code Playground

HTML

<div class="menu">
    <div id="smoke"> <span class="s0"></span>  <span class="s1"></span>  <span class="s2"></span>  <span class="s3"></span>  <span class="s4"></span>  <span class="s5"></span>  <span class="s6"></span>  <span class="s7"></span>  <span class="s8"></span>  <span class="s9"></span> 
    </div>
</div>

CSS

.menu{
    overflow: hidden;
}

#smoke {
    position: absolute;
    width: 1px;
    height: 160px;
    transform: rotate(264deg);
    left: 38%;
    top: -23px;
}
#smoke span {
    display: block;
    position: absolute;
    bottom: -35px;
    left: 50%;
    margin-left: -20px;
    height: 0px;
    width: 0px;
    border: 35px solid rgba(204, 204, 204, 0.7);
    border-radius: 35px;
    left: -14px;
    opacity: 0;
    -webkit-transform: scale(0.2);
    -moz-transform: scale(0.2);
    -ms-transform: scale(0.2);
    -o-transform: scale(0.2);
    transform: scale(0.2);
}
@-webkit-keyframes smokeL {
    0% {
        -webkit-transform: scale(0.2) translate(0, 0);
        -moz-transform: scale(0.2) translate(0, 0);
        -ms-transform: scale(0.2) translate(0, 0);
        -o-transform: scale(0.2) translate(0, 0);
        transform: scale(0.2) translate(0, 0);
    }
    10% {
        opacity: 1;
        -webkit-transform: scale(0.2) translate(0, -5px);
        -moz-transform: scale(0.2) translate(0, -5px);
        -ms-transform: scale(0.2) translate(0, -5px);
        -o-transform: scale(0.2) translate(0, -5px);
        transform: scale(0.2) translate(0, -5px);
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(1) translate(-20px, -130px);
        -moz-transform: scale(1) translate(-20px, -130px);
        -ms-transform: scale(1) translate(-20px, -130px);
        -o-transform: scale(1) translate(-20px, -130px);
        transform: scale(1) translate(-20px, -130px);
    }
}
@-moz-keyframes smokeL {
    0% {
        -webkit-transform: scale(0.2) translate(0, 0);
        -moz-transform: scale(0.2) translate(0, 0);
        -ms-transform: scale(0.2) translate(0, 0);
        -o-transform: scale(0.2) translate(0, 0);
        transform: scale(0.2) translate(0, 0);
    }
    10% {
        opacity: 1;
        -webkit-transform: scale(0.2) translate(0, -5px);
        -moz-transform: scale(0.2) translate(0, -5px);
        -ms-transform: scale(0.2) translate(0,...