dev

Note: After publishing, you may have to bypass your browser's cache to see the changes.

/***
 * @title           FadedDropdowns
 * @author          Lavgup
 * @description     Fades dropdowns in the global and local navigation, and the page header buttons dropdown.
 * @docs            [[FadedDropdowns]]
 * @installation    @import url("/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:FadedDropdowns.css");
 ***/

.global-navigation .wds-dropdown__content {
 -webkit-animation: dropdown-global 0.35s;
 -moz-animation: dropdown-global 0.35s;
 animation: dropdown-global 0.35s;
}
.page-header  #p-cactions,
#PageHeader #EditMessageWallGreeting .wds-button-group .wds-dropdown .wds-dropdown__content,
.fandom-community-header__local-navigation .wds-dropdown .wds-dropdown__content {
 -webkit-animation: contribution-dropdown 0.3s linear;
 -moz-animation: contribution-dropdown 0.3s linear;
 animation: contribution-dropdown 0.3s linear;
}
@keyframes dropdown-global {
 from {opacity: 0; top: 45px;}
 to {opacity: 1;}
}
@keyframes dropdown-topnav {
 from {opacity: 0; top: 30px;}
 to {opacity: 1; top: 40px;}
}
@keyframes dropdown-animation {
 from {opacity: 0; transform: translateX(-10px);}
 to {opacity: 1; transform: translateX(0);}
}
@keyframes contribution-dropdown {
 from {opacity: 0; top: 25px;}
 to {opacity: 1; top: 35px;}
}
@keyframes searchsuggestions-dropdown {
 from {top: 80%; opacity: 0;}
 to {top: calc(1px+100%); opacity: 1;}
}
.wds-dropdown-level-nested:hover svg#wds-icons-menu-control-tiny {
 transform: rotate(-90deg) translateY(3px);
}
.wds-dropdown-level-nested svg#wds-icons-menu-control-tiny {
 -webkit-transition: transform 0.2s;
 -moz-transition: transform 0.2s;
 -o-transition: transform 0.2s;
 transition: transform 0.2s;
}
svg#wds-icons-dropdown-tiny {
 transition: transform 0.2s;
}