MediaWiki:Navbar.css

/********************/ /***** Navigation Bar Animation - Credits to BTS Wiki *****/ /********************/

@keyframes FadeIn { from { opacity: 0 }	to { opacity: 1 } } @keyframes SlideLeft { 0% {		transform: translate3d(-10px, 0, 0) }	100% {		transform: translate3d(0, 0, 0) } } @keyframes SlideTopNavigation { 0% {		transform: translate3d(0, -10px, 0) }	100% {		transform: translate3d(0, 0, 0) } } @keyframes SlideTop { 0% {		transform: translate3d(0, -10px, 0) }	100% {		transform: translate3d(0, 0, 0) } } @keyframes RainbowName2{ from { -webkit-filter: text-shadow hue-rotate(360deg); filter: text-shadow hue-rotate(360deg); } to { -webkit-filter: text-shadow hue-rotate(15deg); filter: text-shadow hue-rotate(15deg); } }

/* Themed Community Header Dropdown (credit to BTS Wiki) */ .wds-dropdown__content:hover .wds-list.wds-is-linked>li>a:not(.wds-button):hover { border-radius: 3px; color: var(--theme-link-color); background-color: rgba(var(--theme-link-color--rgb),0.1); cursor: pointer; font-weight: 400; padding-left: 9px; padding-right: 9px; text-decoration: none; transition-duration: .3s; transition-property: background-color,color; }

/*Top navigation container fade-in*/ .wds-community-header__top-container .wds-button-group .wds-button:first-of-type { border-radius: 0.33em 0 0 0.33em } .wds-community-header__top-container .wds-button-group .wds-dropdown .wds-button { border-radius: 0 0.33em 0.33em 0 } .wds-community-header__top-container .wds-button-group .wds-button:only-of-type { border-radius: 0.33em !important } .wds-community-header__top-container .wds-button-group .wds-button .wds-icon, .wds-community-header__top-container .wds-button-group .wds-button span { transition: transform 0.2s }

/* Dropdown */ transition: transform cubic-bezier(0.66, 0.52, 0.25, 1.25) 0.25s } .wds-icon-tiny { transition: transform 0.2s; }	transform: rotate(180deg) } .wds-dropdown__content .wds-list.wds-is-linked li:hover > a svg.wds-dropdown-chevron { transform: rotate(90deg); } .wds-icon.wds-icon-tiny.wds-dropdown__toggle-chevron { transition: transform cubic-bezier(0.66, 0.52, 0.25, 1.25) 0.25s } .wds-tabs .wds-tabs__tab-label { transition: 0.25s; } .wds-community-header__local-navigation .wds-tabs .wds-tabs__tab-label:hover { text-shadow: 0 0 7px #dddddd; } .wds-community-header .wds-dropdown__content .wds-list li>a svg { transition: transform cubic-bezier(0.66, 0.52, 0.26, 1.43) 0.25s } .wds-community-header .wds-dropdown__content .wds-list li:hover>a svg{ transform: rotate(90deg) !important } .wds-global-navigation-wrapper .wds-dropdown__toggle-chevron{ fill: var(--secondary-color) !important; }
 * 1) wds-icons-dropdown-tiny {
 * 1) wds-icons-dropdown-tiny:hover {

.wds-global-navigation__link, .wds-global-navigation__search-toggle-text, .wds-global-navigation__start-a-wiki { font-family: var(--font); letter-spacing: var(--font-spacing); }

.wds-community-bar__discussions>svg, .wds-community-header__local-navigation .wds-dropdown__toggle-chevron, .wds-is-disabled { opacity: 1 !important; }

.wds-dropdown__content, .wds-dropdown.wds-has-dark-shadow .wds-dropdown__content, .wds-dropdown:before, .wds-dropdown-level-2__content { border: 0 !important; }

.wds-community-header .wds-dropdown__content .wds-list.wds-is-linked li:hover>a, .wds-dropdown__content .wds-list.wds-is-linked>li.wds-is-selected>a:not(.wds-button), .wds-dropdown__content .wds-list.wds-is-linked>li:hover>a:not(.wds-button) { border-radius: 2px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, .1) !important; transition: background-color 0.167s linear, color 0.167s linear, box-shadow 0.167s linear }

.wds-dropdown__content .wds-list.wds-is-linked .wds-dropdown-level-2:hover>a { border-radius: 2px 0 0 2px !important }

.wds-community-header .wds-dropdown__content .wds-list .wds-dropdown-level-2 .wds-dropdown-level-2__content { animation-duration: 0.367s; animation-fill-mode: both; animation-name: FadeIn, SlideLeft; animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); box-shadow: rgba(0, 0, 0, 0.133) 0 6.4px 14.4px 0, rgba(0, 0, 0, 0.11) 0 1.2px 3.6px 0 }

.wds-dropdown__content{ animation-duration: 0.367s; animation-fill-mode: both; animation-name: FadeIn, SlideTopNavigation; animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); box-shadow: rgba(0, 0, 0, 0.133) 0 6.4px 14.4px 0, rgba(0, 0, 0, 0.11) 0 1.2px 3.6px 0 }

.wds-tabs__tab .wds-dropdown__content, .wds-dropdown__content.wds-is-right-aligned, .wds-dropdown__content.wds-is-left-aligned, .wds-global-navigation__search-suggestions.wds-dropdown__content { animation-duration: 0.367s; animation-fill-mode: both; animation-name: FadeIn, SlideTop; animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); box-shadow: rgba(0, 0, 0, 0.133) 0 6.4px 14.4px 0, rgba(0, 0, 0, 0.11) 0 1.2px 3.6px 0 } .wds-dropdown:after { fill: #787878; animation-duration: 0.367s; animation-fill-mode: both; animation-name: FadeIn, SlideTop; animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); } .wds-community-header__local-navigation .wds-dropdown:after { margin-bottom:3px; } .wds-community-header__local-navigation .wds-dropdown__content { margin-top:-3px; }	display:none !important; }	border-bottom-color:#787878; }
 * 1) userProfileApp .wds-dropdown:after{
 * 1) userProfileApp .user-identity-social__icon-tooltip:after,
 * 2) userProfileApp .user-identity-social__icon-tooltip:before{

.page-header__contribution-buttons .wds-dropdown:after { z-index:200; } /***** NAVIGATION BAR ANIMATION ENDS *****/