JSFiddle - React, Tailwind, and code Playground

HTML

<div id="sh-zone-buttons">
    
    <a href="#" id="sh-zone-button-login-menu" class="inner"><span class="button-icon-link-login"></span>Account Manager</a>
    
    <div id="sh-zone-login-menu" class="sh-zone-button-link-menu-container">
        
        <form action="#" method="post" enctype="multipart/form-data">
            <p>
                <label for="email">Username or Email</label>
                <input type="text" name="email" maxlength="255" value="" />
            </p>
            <p>
                <label for="email">Password</label>
                <input type="password" name="password" maxlength="20" value="" />
            </p>
            <p class="remember">
                <input type="submit" value="Sign in" />
                <input type="checkbox" name="remember" value="1" />
                <label for="remember">Remember me</label>
            </p>
            <p>
                <a href="#">Forgot your password?</a>
            </p>
        </form>
        
    </div>
</div>

CSS

#sh-zone-buttons .sh-zone-button-link-menu-container{z-index: 200; position:absolute;}
#sh-zone-login-menu{display:none;}
#sh-zone-login-menu .showsubmenu{display: block;}
#sh-zone-login-menu form {position:absolute; -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-top-left-radius: 5px; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;
    background: #eee; padding: 12px; margin: 0px; top: 10px; left: 0px; width: 230px; height: 200px; z-index: 100;}
#sh-zone-login-menu form label{font-size: 11px;}
#sh-zone-login-menu form input[type=text], #sh-zone-login-menu form input[type=password]{background: #ffffff; border: none; width: 215px; 
    line-height: 12px; font-size: 12px; color: #555; padding: 5px; margin: 0px 0px 5px 0px; border: 1px solid #ccc; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
#sh-zone-login-menu form input[type=text]:focus, #sh-zone-login-menu form input[type=password]:focus{-webkit-box-shadow: 0px 0px 7px #92AE41; -moz-box-shadow: 0px 0px 7px #92AE41; box-shadow: 0 0 7px #92AE41;}
#sh-zone-login-menu form p{margin:0px; font-size: 11px;}
#sh-zone-login-menu form p.remember{padding:10px 0px;}

JavaScript

var $_ = jQuery;

$_(document).ready(function() {


    $_("#sh-zone-buttons").delegate("#sh-zone-button-login-menu", "click", function(event) {

        $_("#sh-zone-buttons #sh-zone-login-menu").toggle();
        $_(this).toggleClass("current");
        return false;
    });

});