JSFiddle - React, Tailwind, and code Playground

HTML

<div class="some-el"></div>
  <a id="open" href="#">Toggle</a>

CSS

.some-el {
  width: 60%;
  height: 50%;
  position: fixed;
  left: 20%;
  right: 20%;
  top: 50%;
  background-color: black;

  /* All vendor-prefixes */
  -webkit-transition: all linear 1s;
  transition: all linear 1s;
  -webkit-transform: translate3d(0,-100%,0);
  transform: translate3d(0,-100%,0);

}

.some-el.open {
  /* All vendor-prefixes */
  -webkit-transform: translate3d(0,-0%,0);
   transform: translate3d(0,-100%,0);
}

JavaScript

document.getElementById('open').onclick = function() {
      document.querySelector('.some-el').classList.toggle('open');
    };