JSFiddle - React, Tailwind, and code Playground

by Love Trivedi

HTML

<div class="nav">
    <ul>
        <li>test</li>
        <li>test
            <ul class="sub-menu">
                <li>test</li>
            </ul>
        </li>
    </ul>
</div>

CSS

.nav ul li > ul {
   opacity:0;
    overflow:hidden;
     transition: all 0.5s ease;
}
.nav ul li:hover > ul 
{
    transition: all 0.5s ease 0s;
    height:auto;
    opacity:1;  
}