JSFiddle - React, Tailwind, and code Playground

by Ajsa Ferguson

HTML

<div id="menu-wrapper">
    <div id="menu-tab" class="closed">Disclaimer</div>
    <div id="menu-nav">disclaimertextdisclaimertextdisclaimertext
        <br>disclaimertextdisclaimertextdisclaimertext</div>
</div>
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src="js/index.js"></script>

CSS

body {
    background-color: #333333;
    text-align: center;
}
#menu-wrapper {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}
#menu-tab {
    background-color: #FC4349;
    cursor: pointer;
    margin: 0% 45% 0% 45%;
    padding: 5px 10px;
}
#menu-nav {
    display: none;
    background-color: #FC4349;
    margin: 0% 30% 0% 30%;
}

JavaScript

$(document).on('click', '#menu-tab', function () {
    $('#menu-nav').slideToggle('slow');
});