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

#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, -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);
   ...