User:Soronos/global.css

/*Imports*/ @import "/load.php?mode=articles&articles=u:dev:MediaWiki:AdRailRemove/code.css&only=styles"; @import "/load.php?mode=articles&articles=u:dev:MediaWiki:GlobalNavigationIcons.css&only=styles";

/* - - - - - - - - - - - Suppression de la navigation globale - - - - - - - - - - - - - */ /* Choses retirées */j .wds-global-navigation__content-bar-left, .wds-global-navigation__start-a-wiki, .wds-global-navigation__user-menu .wds-dropdown__toggle-chevron, .wds-global-navigation__notifications-dropdown .wds-dropdown__toggle-chevron, .wds-community-header__counter, .wds-community-header__wiki-buttons, .wds-global-navigation__search-container.search-scope-is-loaded .wds-global-navigation__search-scope, .wds-global-navigation__search-container.wds-search-is-focused.search-scope-is-loaded .wds-global-navigation__search-scope, .is-hidden-svg { display: none; }
 * 1) wds-company-logo-fandom-white,

/* Position générale */ .wds-global-navigation-wrapper { position: absolute; width: 100%; padding: 0; pointer-events: none; visibility: hidden; } .wds-global-navigation { position: relative; visibility: visible; margin: 0 auto; width: 768px; background-color: transparent; } body.action-view #globalNavigation, body.action-view .wds-global-navigation { padding: 0 24px; } @media only screen and (min-width: 1024px) { #globalNavigation, .wds-global-navigation { width: 1004px; padding: 0 10px; } } @media only screen and (min-width: 1084px) { #globalNavigation, .wds-global-navigation { width: 1064px; }	body.action-view #globalNavigation, body.action-view .wds-global-navigation { padding: 0 20px; } } @media only screen and (min-width: 1596px) { #globalNavigation, .wds-global-navigation { width: 1238px; padding: 0 30px; } } .wds-global-navigation .wds-global-navigation__dropdown-controls { display: flex; margin-top: 24px; } .wds-global-navigation__dropdown-controls > * { pointer-events: all; visibility: visible; } .skin-oasis .WikiaSiteWrapper { margin-top: 0; } .skin-oasis .WikiaSiteWrapper .WikiaPage { padding-top: 0; }
 * 1) globalNavigation,

/* Icônes du menu déroulant */ .wds-global-navigation .wds-avatar svg.wds-avatar__image, .wds-global-navigation .wds-avatar img.wds-avatar__image { fill: #fff; border-color: white; } .wds-global-navigation__user-menu, .wds-global-navigation__notifications-dropdown, .wds-global-navigation__user-menu .wds-dropdown__toggle, .wds-global-navigation__notifications-dropdown .wds-dropdown__toggle { color: white; width: 40px; margin: 0; height: 45px; justify-content: center; }

/* Menu utilisateur */ .wds-global-navigation__dropdown-controls > .wds-global-navigation__user-menu:after { border-bottom-color: #dedede; } .wds-global-navigation__dropdown-controls > .wds-global-navigation__user-logged-in > .wds-dropdown__content { left: -21px; min-width: unset; background-color: #ccc; border: none; padding: 0; border-radius: 6px; overflow: hidden; box-shadow: 0 0 10px 0 #0003; } .wds-global-navigation__user-menu .wds-dropdown__content:not(.wds-is-not-scrollable) ul.wds-list { background-image: unset; } .wds-global-navigation__user-menu .wds-dropdown__content:not(.wds-is-not-scrollable) ul.wds-list:before, .wds-global-navigation__user-menu .wds-dropdown__content:not(.wds-is-not-scrollable) ul.wds-list:after { display: none; }

/* Menu déroulant utilisateur – liste */ .wds-global-navigation__dropdown-controls .wds-global-navigation__user-menu .wds-dropdown__content .wds-list.wds-is-linked > li { padding: 0; margin: 0; background-repeat: no-repeat; } .wds-global-navigation__dropdown-controls .wds-global-navigation__user-menu .wds-dropdown__content .wds-list.wds-is-linked > li { background-color: #fff0; transition: background-color .6s; } .wds-global-navigation__dropdown-controls .wds-global-navigation__user-menu .wds-dropdown__content .wds-list.wds-is-linked > li:hover { background-color: #fff; transition: 0s; } .wds-global-navigation__dropdown-controls .wds-global-navigation__user-menu .wds-dropdown__content .wds-list.wds-is-linked > li > a, .wds-global-navigation__dropdown-controls .wds-list.wds-is-linked > li .wds-sign-out__button { color: #808995; background-color: #eee8; transition: color .6s, background-color, .6s; } .wds-global-navigation__dropdown-controls .wds-global-navigation__user-menu .wds-dropdown__content .wds-list.wds-is-linked > li:hover > a, .wds-global-navigation__dropdown-controls .wds-list.wds-is-linked > li:hover .wds-sign-out__button { color: #39424d; background-color: #fff0; transition: 0s; } .wds-global-navigation__dropdown-controls .wds-global-navigation__user-menu .wds-dropdown__content .wds-list.wds-is-linked > li > a { padding: 9px 14px 9px 42px; } .wds-global-navigation__user-menu .wds-dropdown__content .wds-list > li button.wds-sign-out__button { padding: 9px 14px 12px 42px; border-radius: 0; } .wds-global-navigation__user-menu .wds-dropdown__content .wds-list.wds-is-linked > li:first-of-type > a { padding-top: 14px; }

/* Global Notifications */ /* Arrow dropdown */ .wds-global-navigation .wds-global-navigation__content-bar-right > .wds-global-navigation__dropdown-controls > .wds-global-navigation__notifications-dropdown.wds-dropdown.wds-has-dark-shadow:after { top: 29px; border-bottom-color: #eee; } /* List */ .wds-global-navigation__dropdown-controls > .wds-global-navigation__notifications-dropdown > #onSiteNotificationsDropdown.wds-global-navigation__dropdown-toggle + .wds-dropdown__content.wds-notifications__dropdown-content { width: 290px; right: -4px; top: 45px; min-width: unset; padding: 0; overflow: hidden; box-shadow: 0 5px 10px -3px #0003; } /* "Mark as read" button */ display: block; justify-content: unset; margin-top: 0; color: #f3f3f3; background-color: #888; transition: background-color .6s; }	background-color: #777; transition: background-color .2s; }	width: unset; display: block; height: 11px; padding: 7px 5px 7px 36px; border: none; color: #f3f3f3; transition: color .6s; }	color: #fff; transition: color .2s; } /* Notifications */ .wds-notifications__dropdown-content > ul#notificationContainer.wds-notifications__notification-list { background-image: unset; } .wds-dropdown__content ul#notificationContainer.wds-notifications__notification-list:before, .wds-dropdown__content ul#notificationContainer.wds-notifications__notification-list:after { display: none; } ul.wds-notifications__notification-list > li.wds-notification-card { margin: 0; padding: 0; background-color: #eee; transition: background-color .6s; } ul.wds-notifications__notification-list > li.wds-notification-card:hover { background-color: white; transition: 0s; } ul.wds-notifications__notification-list > li.wds-notification-card:first-child { margin-top: 0; } ul.wds-notifications__notification-list > li.wds-notification-card > a.wds-notification-card__outer-body { padding: 10px 0; } li.wds-notification-card > a.wds-notification-card__outer-body > .wds-notification-card__body { padding: 0 7px; } a.wds-notification-card__outer-body > .wds-notification-card__body > p.wds-notification-card__last-actor { margin: 4px 0; } a.wds-notification-card__outer-body > .wds-notification-card__body > p.wds-notification-card__context-list { padding: 0; }
 * 1) onSiteNotificationsDropdown + .wds-notifications__dropdown-content > #markAllAsReadButton.wds-notifications__mark-all-as-read-button {
 * 1) onSiteNotificationsDropdown + .wds-notifications__dropdown-content > #markAllAsReadButton.wds-notifications__mark-all-as-read-button:hover {
 * 1) onSiteNotificationsDropdown + .wds-notifications__dropdown-content > #markAllAsReadButton > a.wds-notifications__mark-all-as-read {
 * 1) onSiteNotificationsDropdown + .wds-notifications__dropdown-content > #markAllAsReadButton:hover > a.wds-notifications__mark-all-as-read {

/* - - - - - - - - - - SEARCH BAR - - - - - - - - - - */ form.wds-global-navigation__search-container { margin-right: 6px; max-width: 268px; height: 32px; height: min-content; padding-right: 0; } form.wds-global-navigation__search-container > .wds-global-navigation__search { color: #fff; } @media only screen and (max-width: 1499px) { .wds-search-is-active .wds-global-navigation__search-container { margin-left: 0; } }

/* Magnifying glass */ .wds-global-navigation__search > .wds-global-navigation__search-toggle { opacity: .4; transition: opacity .6s; } .wds-global-navigation__search:hover > .wds-global-navigation__search-toggle { opacity: .7; transition: opacity .3s; } .wds-global-navigation.wds-search-is-active .wds-global-navigation__search-toggle { opacity: 1; pointer-events: none; transition: opacity .3s; } .wds-global-navigation__search-toggle > .wds-global-navigation__search-toggle-icon { margin-right: 8px; }

/* Avoid conflict between wiki title & search bar */ .wds-community-header__sitename > a { display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } @media only screen and (max-width: 1023px) { .wds-global-navigation__search-toggle { display: none; }	.wds-community-header__sitename > a { max-width: 160px; } } @media only screen and (min-width: 1024px) and (max-width: 1083px) { .wds-community-header__sitename > a { max-width: 390px; } } @media only screen and (min-width: 1084px) and (max-width: 1595px) { .wds-community-header__sitename > a { max-width: 360px; } } @media only screen and (min-width: 1596px) { .wds-community-header__sitename > a { max-width: 500px; } }

/* Text "search" */ .wds-global-navigation__search-toggle > span.wds-global-navigation__search-toggle-text { display: none; }

/* Search wrapper */ .wds-global-navigation .wds-global-navigation__search-input-wrapper { float: right; padding-bottom: 0; border-bottom: 2px solid #fff4; transition: border-bottom .6s; } .wds-global-navigation:not(.wds-search-is-active):hover .wds-global-navigation__search-input-wrapper { width: 268px; border-bottom: 2px solid #fff9; transition: border-bottom .3s; } .wds-global-navigation.wds-search-is-active .wds-global-navigation__search-input-wrapper { width: 268px; border-bottom: 2px solid #fff; transition: border-bottom .2s; }

/* Input text area wrapper */ .wds-global-navigation .wds-global-navigation__suggestions-anchor { flex: 1 1 auto; transition: width .6s; } .wds-global-navigation.wds-search-is-active .wds-global-navigation__suggestions-anchor { width: 370px; }

/* Input text area */ .wds-global-navigation form.wds-global-navigation__search-container > .wds-global-navigation__search > .wds-global-navigation__search-input-wrapper > .wds-dropdown > input.wds-global-navigation__search-input[type="search"] { width: 268px; display: block; flex: none; border-radius: 5px 5px 0 0; padding: 0 68px 0 12px; height: 34px; color: #eee; font-weight: bold; font-family: Rubik, Helvetica Neue, Helvetica, Arial, sans-serif; } .wds-global-navigation.wds-search-is-active form.wds-global-navigation__search-container.wds-search-is-focused input.wds-global-navigation__search-input { background-color: #0006; transition: background-color 2s; } .wds-global-navigation.wds-search-is-active form.wds-global-navigation__search-container.wds-search-is-focused input.wds-global-navigation__search-input:focus { background-color: #141414; transition: background-color 1.2s; } .wds-global-navigation input.wds-global-navigation__search-input[type="search"]::placeholder { color: #555 !important; }

/* Close button */ .wds-global-navigation form.wds-global-navigation__search-container button.wds-global-navigation__search-close { display: block; margin-left: -68px; border-radius: unset; height: 30px; padding: 4px 9px 0; line-height: 14px; } .wds-global-navigation:not(.wds-search-is-active) form.wds-global-navigation__search-container:not(.wds-search-is-focused) button.wds-global-navigation__search-close { opacity: 0; pointer-events: none; background-color: #0001; transition: opacity .3s, background-color .3s, padding .6s; } .wds-global-navigation:not(.wds-search-is-active) form.wds-global-navigation__search-container.wds-search-is-focused button.wds-global-navigation__search-close { opacity: 0; background-color: #000a; transition: opacity .3s, background-color .3s, width .6s, padding .6s; } .wds-global-navigation.wds-search-is-active form.wds-global-navigation__search-container.wds-search-is-focused input:focus + input + button.wds-global-navigation__search-close { opacity: 1; background-color: #141414; transition: padding-left .6s, opacity .6s, background-color 1.2s; } .wds-global-navigation.wds-search-is-active form.wds-global-navigation__search-container.wds-search-is-focused button.wds-global-navigation__search-close { background-color: #0006; transition: background-color 2s; } .wds-global-navigation button.wds-global-navigation__search-close:not(:hover) > svg { opacity: .6; } .wds-global-navigation button.wds-global-navigation__search-close:hover { color: #fff; }

/* Submit button */ .wds-global-navigation form.wds-global-navigation__search-container button.wds-button.wds-global-navigation__search-submit { display: flex; border: none; height: 26px; opacity: 0; border-radius: 0 5px 0 0; } .wds-global-navigation:not(.wds-search-is-active) form.wds-global-navigation__search-container:not(.wds-search-is-focused) button.wds-button.wds-global-navigation__search-submit { opacity: 0; background-color: #0001; transition: opacity .3s, background-color .3s, width .6s, padding .6s; } .wds-global-navigation:not(.wds-search-is-active) form.wds-global-navigation__search-container.wds-search-is-focused button.wds-global-navigation__search-submit { opacity: 0; background-color: #000a; transition: opacity .3s, background-color .3s, width .6s, padding .6s; } .wds-global-navigation.wds-search-is-active form.wds-global-navigation__search-container.wds-search-is-focused button.wds-global-navigation__search-submit { opacity: 1; background-color: #141414; transition: .6s; } .wds-global-navigation.wds-search-is-active form.wds-global-navigation__search-container.wds-search-is-focused input:focus + input + button + button.wds-global-navigation__search-submit { opacity: 1; background-color: #141414; transition: .6s; } .wds-global-navigation.wds-search-is-active form.wds-global-navigation__search-container.wds-search-is-focused button.wds-global-navigation__search-submit { background-color: #0006; transition: background-color 2s; } .wds-global-navigation button.wds-global-navigation__search-submit:not(:hover) > svg { opacity: .6; } .wds-global-navigation button.wds-global-navigation__search-submit:disabled > svg { opacity: .3; }

/* Search suggestions */ .wds-dropdown__content.wds-global-navigation__search-suggestions.wds-is-not-scrollable { top: calc(100% - 2px); display: block; background-color: #ddd; box-shadow: 0 5px 10px -5px #0003; border-radius: 0 0 6px 6px; overflow: hidden; } .wds-global-navigation:not(.wds-search-is-active) .wds-global-navigation__suggestions-anchor > .wds-global-navigation__search-suggestions { opacity: 0; max-height: 0; transition: opacity .4s, max-height .4s; } .wds-global-navigation.wds-search-is-active .wds-global-navigation__suggestions-anchor:not(.wds-is-active) > .wds-global-navigation__search-suggestions { opacity: 0; max-height: 0; transition: opacity .4s, max-height .4s; } .wds-global-navigation.wds-search-is-active .wds-global-navigation__suggestions-anchor.wds-is-active > .wds-global-navigation__search-suggestions { opacity: 1; } .wds-global-navigation__search-suggestions > ul.wds-list.wds-is-linked { padding: 0; background-color: transparent; display: block !important; } .wds-global-navigation__search-suggestions > ul.wds-list.wds-is-linked > li { margin: 0; cursor: pointer; } .wds-global-navigation__search-suggestions > ul.wds-list.wds-is-linked > li > a.wds-global-navigation__dropdown-link { padding: 9px 8px 9px 16px; color: #666; background-color: #ddd; transition: background-color .6s; } .wds-global-navigation__search-suggestions.wds-dropdown__content ul.wds-list.wds-is-linked > li:hover:not(.wds-is-selected) > a { color: #333; background-color: #ccc; } .wds-global-navigation__search-suggestions > ul.wds-list.wds-is-linked > li:first-of-type > a.wds-global-navigation__dropdown-link { padding: 12px 8px 9px 16px; } .wds-global-navigation__search-suggestions > ul.wds-list.wds-is-linked > li:not(:first-of-type):last-of-type > a.wds-global-navigation__dropdown-link { padding: 9px 8px 12px 16px; } .wds-global-navigation__search-suggestions > ul.wds-list.wds-is-linked > li.wds-is-selected > a.wds-global-navigation__dropdown-link { color: #333; background-color: white; transition: 0s; }

/* - - - - - - - - - - Special cases - - - - - - - - - - */ /* 2017 Visual Editor (including source mode) */ html.ve-activated.ve-active .wds-global-navigation-wrapper, html.ve-activated.ve-active #globalNavigation { display: contents; } html.ve-activated.ve-active .wds-global-navigation__content-bar-right { height: 0; } html.ve-activated.ve-active .wds-global-navigation__dropdown-controls { padding: 0 20px; width: 1064px; margin: 164px auto 0; box-sizing: border-box; z-index: 201; } html.ve-activated.ve-active .WikiaPage, html.ve-activated.ve-active .WikiaPageContentWrapper { z-index: unset; } html.ve-activated.ve-active .ve-oasis-header .ve-ui-modeSwitchPopupButtonWidget { top: 64px; z-index: 200; } html.ve-activated.ve-active .ve-ui-modeSwitchPopupButtonWidget .oo-ui-popupWidget, html.ve-activated.ve-active .ve-ui-modeSwitchPopupButtonWidget-popup { display: contents !important; } html.ve-activated.ve-active .ve-ui-modeSwitchPopupButtonWidget-popup .oo-ui-popupWidget-body { position: absolute; margin-left: -20px; border-radius: 0 0 6px 6px; padding: 6px 0; background-color: var(--themed-page-background--secondary); box-shadow: 0 4px 6px 0 #0004; } html.ve-activated.ve-active #content .ve-ui-oasisToolbar > .oo-ui-toolbar-bar { position: fixed; top: 0; left: 166.5px; right: 166.5px; border-top: 0; border-top-left-radius: 0; border-top-right-radius: 0; } html.ve-activated.ve-active .ve-oasis-header .ve-oasis-header__label, html.ve-activated.ve-active .ve-oasis-header__title .oo-ui-popupWidget-anchor, html.ve-activated.ve-active .oo-ui-popupWidget-body:not([style^="max-width:"]) { display: none; }

/* 2010 Editor */ .action-edit .wds-global-navigation-wrapper, .action-submit .wds-global-navigation-wrapper { top: 12px; height: 0; } .action-edit .wds-global-navigation__content-bar-right, .action-submit .wds-global-navigation__content-bar-right { height: 36px; } .action-edit .wds-global-navigation__dropdown-controls, .action-submit .wds-global-navigation__dropdown-controls { margin-top: 0; }

/* Big top banners - shall be closed to regain access to user menu */ .skin-oasis > .WikiaSiteWrapper > .banner-notifications-placeholder { top: 0; z-index: 500; }