making bootstrap drop down menus opened with a sliding animation
.open > .dropdown-menu {
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
}
.open > .dropdown-menu li a {
color: #000;
}
.dropdown-menu li a{
color: #fff;
}
.dropdown-menu {
-webkit-transform-origin: top;
transform-origin: top;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-transform: scale(1, 0);
display: block;
transition: all 0.2s ease-out;
-webkit-transition: all 0.2s ease-out;
}
.dropup .dropdown-menu {
-webkit-transform-origin: bottom;
transform-origin: bottom;
}
.navbar .nav > li > .dropdown-menu:after {
}
.dropup > .dropdown-menu:after {
border-bottom: 0;
border-top: 6px solid rgba(39, 45, 51, 0.9);
top: auto;
display: inline-block;
bottom: -6px;
content: '';
position: absolute;
left: 50%;
border-right: 6px solid transparent;
border-left: 6px solid transparent;
}