JSFiddle - React, Tailwind, and code Playground

HTML

<div class="menu"></div>
<button id="interruptor" type="button">abrir</button>

CSS

.menu {
    padding: 50px;
    margin-top: -100px;
    transition: margin-top 1s;
    background-color: #ccf;
    margin-bottom: 10px;
}

.abrir {
    margin-top: 0px;
}

JavaScript

var menu = document.querySelector('div.menu');
var botao = document.querySelector('button#interruptor');
botao.addEventListener('click', function() {
    var aberto = menu.classList.contains('abrir');
    menu.classList.toggle('abrir');
    this.innerHTML = aberto ? 'abrir' : 'fechar';
});