|
|
| (8 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| /* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ | | /* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ |
| /**
| |
| * Used files: [[File:Old Fandom Logo White.svg]], [[File:WDS Dropdown Icon Orange.svg]]
| |
| */
| |
| :root {
| |
| --oasis-revived-font: Helvetica Neue, helvetica, arial, sans-serif;
| |
|
| |
| --theme-page-background-color--opacity: 1;
| |
| --theme-header-background-color: var(--theme-sticky-nav-background-color);
| |
| --theme-header-text-color: var(--theme-sticky-nav-text-color);
| |
| --theme-header-text-color--hover: var(--theme-sticky-nav-text-color--hover);
| |
| --background-img-position: center center;
| |
| --background-img-size: cover;
| |
| --background-img-repeat: no-repeat;
| |
| --background-img-attachment: fixed;
| |
|
| |
| --fandom-accent-color: #00d6d6;
| |
| --fandom-accent-color--rgb:0, 214, 214;
| |
| --fandom-accent-color--hover:#fff;
| |
| --fandom-accent-color--hover--rgb:255,255,255;
| |
| --fandom-link-color--fadeout: rgba(0,214,214,.2);
| |
| --fandom-link-color: #00d6d6;
| |
| --fandom-link-color--rgb: 0, 214, 214;
| |
| --fandom-link-color--hover: #007070;
| |
| --fandom-border-color: #dee7e5;
| |
| --fandom-text-color: #39424d;
| |
| --fandom-text-color--rgb: 57, 66, 77;
| |
| --fandom-global-nav-background-color: #002a32;
| |
| --fandom-global-nav-link-color: #00d6d6;
| |
| --fandom-global-nav-link-color--hover: #fff;
| |
| --fandom-global-nav-icon-color: #00d6d6;
| |
| --fandom-global-nav-icon-background-color: none;
| |
| --fandom-global-nav-icon-background-color--hover: rgba(255, 255, 255, 0.25);
| |
| --fandom-global-nav-icon-background-color--active: rgba(255, 255, 255, 0.4);
| |
| --fandom-global-nav-icon-border-color: #00d6d6;
| |
| --fandom-global-nav-icon-border-color--hover: #fff;
| |
| --fandom-global-nav-icon-border-color--active: #fff;
| |
| --fandom-global-nav-bottom-icon-color: #00d6d6;
| |
| --fandom-global-nav-start-wiki-color: #00d6d6;
| |
| --fandom-global-nav-start-wiki-color--hover: #82a7a3;
| |
| --fandom-global-nav-counter-background-color: #fff;
| |
| --fandom-global-nav-counter-label-color: #000;
| |
|
| |
| --fandom-dropdown-background-color: #002a32;
| |
| --fandom-notifications-background-color: #fff;
| |
| --fandom-notifications-read-card-background-color: #fff;
| |
| --fandom-notifications-unread-card-background-color: #f6f6f6;
| |
| --fandom-notifications-footer-text-color: #656e78;
| |
| --fandom-banner-notification-background-color: #fff;
| |
| --fandom-banner-notifications-close-icon: var(--fandom-text-color);
| |
| }
| |
| a:active, a:focus, a:hover {
| |
| text-decoration: none
| |
| }
| |
|
| |
|
| /* Page background opacity */
| | .infobox { |
| .main-container .resizable-container {
| | background: #eee; |
| background-color: rgba(var(--theme-page-background-color--rgb), var(--theme-page-background-color--opacity))
| | border: 1px solid #aaa; |
| | float: right; |
| | margin: 0 0 1em 1em; |
| | padding: 1em; |
| | width: 400px; |
| } | | } |
| | | .infobox-title { |
| .notifications-placeholder { | | font-size: 2em; |
| bottom: 18px;
| | text-align: center; |
| left: 18px;
| |
| } | | } |
| | | .infobox-image { |
| .page__main, .page__right-rail { | | text-align: center; |
| background: inherit;
| |
| } | | } |
| | | .infobox th { |
| /* Global Navigation */
| | text-align: right; |
| /** Removing sticky header **/
| | vertical-align: top; |
| .fandom-sticky-header {
| | width: 120px; |
| display: none;
| |
| } | | } |
| | | .infobox td { |
| /** Rotate bar background and style text **/
| | vertical-align: top; |
| .global-navigation { | |
| flex-direction: row;
| |
| width: 100%;
| |
| height: 55px;
| |
| bottom: auto;
| |
| box-shadow: none;
| |
| font-family: Rubik,Helvetica Neue,Helvetica,Arial,sans-serif;
| |
| padding: 0 12px;
| |
| align-items: center;
| |
| z-index: 10001;
| |
| }
| |
| | |
| /** Global navigation (main) items direction **/
| |
| .global-navigation__top, .global-navigation__nav {
| |
| display: flex;
| |
| } | | } |
| .global-navigation__nav .global-navigation__icon:not(.global-navigation__search) { | | div.thumbinner { |
| display: none;
| | border: 1px solid #c8ccd1; |
| | background-color: #f8f9fa; |
| | font-size: 94%; |
| } | | } |
|
| |
|
| /** Fandom logo size **/
| |
| .global-navigation__logo {
| |
| height: 27px;
| |
| width: 126px;
| |
| }
| |
| .global-navigation__logo > * {
| |
| display: none;
| |
| }
| |
| .global-navigation__logo:after {
| |
| content: ' ';
| |
| height: 27px;
| |
| width: 126px;
| |
| background-image: url(https://static.wikia.nocookie.net/dev/images/a/a3/Old_Fandom_Logo_White.svg/revision/latest);
| |
| display: block;
| |
| }
| |
|
| |
|
| /** Hide tooltip on global nav **/ | | /* CSS Modal for Mediawiki |
| .wds-tooltip.is-right { | | * |
| z-index: 10000;
| | * @author: Keenan Payne |
| }
| | * current version crafted together by [[User:Christharp]]. |
| | * Added scroll bar for inside div and changed some elements for better viewing inside a Mediawiki. |
| | */ |
|
| |
|
| /** Removing option icons **/
| | .modalDialog { |
| .global-navigation__nav .global-navigation__search { | |
| display: flex;
| |
| justify-content: center;
| |
| align-items: center;
| |
| margin-top: 0;
| |
| position: fixed; | | position: fixed; |
| height: 34px; | | font-family: Arial, Helvetica, sans-serif; |
| width: 34px;
| | top: 0; |
| }
| | right: 0; |
| .global-navigation .global-navigation__links {
| | bottom: 0; |
| flex-direction: row;
| | left: 0; |
| display: inline-flex;
| | background: rgba(0,0,0,0.8); |
| align-items: center;
| | z-index: 99999; |
| height: 100%;
| | opacity:0; |
| }
| | transition: opacity 400ms ease-in; |
| .global-navigation .notifications .global-navigation__icon {
| |
| width: 30px;
| |
| height: 30px; | |
| }
| |
| | |
| /** Correcting alignment for other elements **/
| |
| .global-navigation__link, .global-navigation__links > .wds-dropdown {
| |
| margin-top: 0;
| |
| padding: 0; | |
| margin-left: 30px; | |
| }
| |
| @media only screen and (max-width: 1023px) {
| |
| .global-navigation__link { | |
| margin-left: 18px;
| |
| }
| |
| }
| |
| .global-navigation__link:not([data-tracking-label="start-a-wiki"]) {
| |
| display: flex;
| |
| justify-content: center;
| |
| height: 100%;
| |
| }
| |
| | |
| /** Flexbox fixes **/
| |
| .global-navigation__nav {
| |
| align-items: center;
| |
| }
| |
| | |
| /** Style of options text **/
| |
| .global-navigation__label {
| |
| font-size: 18px;
| |
| font-weight: 700;
| |
| margin-top: 0;
| |
| overflow: visible; | |
| align-items: center;
| |
| transition: color .3s,font-size .2s,margin-left .2s;
| |
| max-width: unset;
| |
| }
| |
| @media only screen and (max-width: 1279px) {
| |
| .global-navigation__label {
| |
| font-size: 16px;
| |
| }
| |
| }
| |
| .global-navigation__label:focus,
| |
| .global-navigation__label:hover {
| |
| color: #fff;
| |
| }
| |
| | |
| .global-navigation__bottom .global-navigation__icon,.global-navigation__bottom .global-navigation__icon svg {
| |
| transition:.3s
| |
| }
| |
| .global-navigation .global-navigation__icon:hover,.global-navigation .global-navigation__link:hover .global-navigation__icon, .wds-dropdown:hover .global-navigation__icon {
| |
| background-color: transparent;
| |
| border-color: transparent;
| |
| }
| |
| .global-navigation .global-navigation__icon:hover svg,.global-navigation .global-navigation__link:hover .global-navigation__icon svg, .wds-dropdown:hover .global-navigation__icon svg {
| |
| color:#fff;
| |
| fill:#fff;
| |
| }
| |
| | |
| /** Dropdown colors **/
| |
| .global-navigation .wds-dropdown {
| |
| --wds-dropdown-background-color: #fff;
| |
| --wds-dropdown-border-color: #bed1cf;
| |
| --wds-dropdown-text-color: #3a3a3a;
| |
| --wds-dropdown-linked-item-color: #088488;
| |
| --wds-dropdown-linked-item-background-color: rgba(8,132,136,0.1);
| |
| --wds-dropdown-scrollable-shadow-color: rgba(58,58,58,0.1);
| |
| }
| |
| | |
| /** Dropdown position **/
| |
| .global-navigation .wds-dropdown.wds-open-to-right .wds-dropdown__content {
| |
| bottom: unset; | |
| top: 100%;
| |
| left: 50%;
| |
| transform: translateX(-50%);
| |
| border-radius: 3px;
| |
| }
| |
| .global-navigation .wds-dropdown.wds-open-to-right:not(.wds-is-not-hoverable):hover:before {
| |
| display: block !important; | |
| bottom: -1px; | |
| content: "";
| |
| left: 50%;
| |
| pointer-events: none; | | pointer-events: none; |
| position: absolute;
| |
| z-index: 2;
| |
| border: 8px solid transparent;
| |
| border-bottom: 8px solid var(--wds-dropdown-background-color);
| |
| margin-left: -8px;
| |
| top: unset;
| |
| transform: unset;
| |
| }
| |
| .global-navigation__bottom .wds-dropdown.is-attached-to-bottom .wds-dropdown__content {
| |
| position: absolute;
| |
| } | | } |
|
| |
|
| /** Start a wiki **/
| | .modalDialog:target { |
| .global-navigation__link[data-tracking-label="start-a-wiki"] .global-navigation__label { | | opacity:1; |
| display: none;
| | pointer-events: auto; |
| align-items: center;
| |
| border: 1px solid currentColor;
| |
| border-radius: 3px;
| |
| box-sizing: content-box;
| |
| font-size: 12px;
| |
| font-weight: 600;
| |
| justify-content: center;
| |
| letter-spacing: .15px;
| |
| line-height: 16px;
| |
| margin-left: 0;
| |
| min-height: 18px;
| |
| padding: 7px 18px;
| |
| transition-duration: .3s;
| |
| transition-property: color;
| |
| white-space: nowrap;
| |
| max-width: fit-content;
| |
| color: var(--fandom-global-nav-start-wiki-color);
| |
| }
| |
| @media only screen and (min-width: 1024px) {
| |
| .global-navigation__link[data-tracking-label="start-a-wiki"] .global-navigation__label { | |
| display: flex;
| |
| } | |
| }
| |
| .global-navigation__link[data-tracking-label="start-a-wiki"] .global-navigation__label:hover {
| |
| color: var(--fandom-global-nav-start-wiki-color--hover);
| |
| } | | } |
|
| |
|
| /** Joined classes necessary. Removing overflow cover **/
| | .modalDialog > div { |
| .global-navigation__label.text-overflow:after {
| |
| display: none;
| |
| }
| |
| | |
| /** Order of elements **/
| |
| .global-navigation__link[data-tracking-label="start-a-wiki"] .global-navigation__label {
| |
| position: absolute;
| |
| width: 118px;
| |
| right: 12px;
| |
| top: 10px;
| |
| }
| |
| .global-navigation__bottom {
| |
| position: absolute;
| |
| right: 147px;
| |
| display: flex;
| |
| flex-direction: row-reverse;
| |
| bottom: unset;
| |
| }
| |
| @media only screen and (max-width: 1023px) {
| |
| .global-navigation__bottom {
| |
| right: 13px;
| |
| }
| |
| .global-navigation__search {
| |
| right: 130px;
| |
| }
| |
| }
| |
| | |
| /** User and notification icon **/
| |
| .global-navigation__bottom .wds-dropdown {
| |
| margin-left: 7px;
| |
| }
| |
| .global-navigation__bottom .wds-dropdown__toggle,
| |
| .global-navigation__bottom .global-navigation__icon {
| |
| justify-content: center;
| |
| align-items: center;
| |
| width: inherit;
| |
| }
| |
| .global-navigation .global-navigation__link.wds-dropdown .wds-dropdown__toggle,
| |
| .global-navigation__bottom .wds-dropdown__toggle {
| |
| display: flex;
| |
| flex-direction: row;
| |
| }
| |
| .global-navigation .wds-dropdown__toggle:after {
| |
| content: ' ';
| |
| background-image: url(https://static.wikia.nocookie.net/dev/images/2/2e/WDS_Dropdown_Icon_Orange.svg/revision/latest);
| |
| height: 12px;
| |
| min-width: 12px;
| |
| width: 12px;
| |
| margin-left: 6px;
| |
| }
| |
| .global-navigation .wds-dropdown:hover .wds-dropdown__toggle:after {
| |
| transform: rotate(180deg);
| |
| }
| |
| .global-navigation__bottom .global-navigation__icon {
| |
| height: inherit;
| |
| border: none;
| |
| }
| |
| .global-navigation__bottom > * {
| |
| display: flex;
| |
| align-items: center;
| |
| }
| |
| | |
| /*** Small icon with no. of unread notifications ***/
| |
| .global-navigation__bottom .global-navigation__icon .notifications__counter {
| |
| left: -2px;
| |
| top: -3px;
| |
| }
| |
| | |
| /** Remove dropdown arrow for user profile **/
| |
| .wds-dropdown.wds-open-to-right:before, .wds-dropdown.wds-open-to-right:after {
| |
| display: none !important;
| |
| }
| |
| | |
| /** Reversing list of options in user dropdown **/
| |
| .global-navigation__bottom .wds-dropdown.is-attached-to-bottom .wds-dropdown__content ul.wds-list {
| |
| transform: rotate(180deg);
| |
| }
| |
| .global-navigation__bottom .wds-dropdown.is-attached-to-bottom .wds-dropdown__content ul.wds-list li {
| |
| transform: rotate(-180deg);
| |
| }
| |
| | |
| /** Revert box shadow **/
| |
| .global-navigation__bottom.is-overflowing {
| |
| box-shadow:none!important;
| |
| }
| |
| | |
| /** Global navigation dropdown menu button's colors when hovered**/
| |
| .global-navigation .wds-dropdown__content .wds-list.wds-is-linked > li.wds-is-selected > a:not(.wds-button),
| |
| .global-navigation .wds-dropdown__content .wds-list.wds-is-linked > li:hover > a:not(.wds-button),
| |
| .global-navigation__signout-button:hover {
| |
| background-color: var(--wds-dropdown-linked-item-background-color);
| |
| color: var(--wds-dropdown-linked-item-color);
| |
| }
| |
| | |
| /** Notifications icon alignment **/
| |
| .global-navigation__bottom .notifications {
| |
| margin-bottom: 0;
| |
| }
| |
| | |
| /** Makes all dropdown menus have white background and shadow **/
| |
| .global-navigation .wds-dropdown .wds-dropdown__content,.global-navigation .wds-dropdown__content {
| |
| border-radius:4px;
| |
| background-color: #fff;
| |
| box-shadow: 0 0 20px 0 rgba(26,26,26,.3);
| |
| border:0
| |
| }
| |
| .global-navigation .wds-dropdown__content:not(.wds-is-not-scrollable) .wds-list::after, .global-navigation .wds-dropdown__content:not(.wds-is-not-scrollable) .wds-list::before {
| |
| background:#fff;
| |
| }
| |
| | |
| /* idk what this does but i got it from webarchive */
| |
| .global-navigation .wds-dropdown__content:not(.wds-is-not-scrollable) .wds-list {
| |
| background-image: radial-gradient(farthest-side at 50% 0,rgba(26,26,26,.12),transparent),radial-gradient(farthest-side at 50% 100%,rgba(26,26,26,.12),transparent);
| |
| background-position: 0 0,0 100%;
| |
| background-repeat: no-repeat;
| |
| background-size: 100% 9px;
| |
| max-height: 270px;
| |
| overflow-y: auto;
| |
| position: relative; | | position: relative; |
| z-index: 1; | | width: 50%; |
| | height:auto; |
| | margin: 10% auto; |
| | padding: 5px 20px 13px 20px; |
| | border-radius: 10px; |
| | background: #fff; |
| | background: linear-gradient(#fff, #999); |
| } | | } |
|
| |
|
| /** Notifications dropdown div **/
| | .modalDialog img { |
| .global-navigation .notifications .wds-dropdown.wds-is-not-hoverable.is-attached-to-bottom div.wds-dropdown__content {
| | width:100%; |
| top: 55px;
| | height:auto; |
| right: 0;
| |
| min-height: 80px;
| |
| max-height: 435px;
| |
| width: 356px;
| |
| left: auto;
| |
| transform: none;
| |
| background-color: #fff;
| |
| color: #39424d;
| |
| border: 0;
| |
| box-shadow: 0 0 20px 0 rgba(26, 26, 26, .3);
| |
| }
| |
| .NotificationCard-module_card__6Nucq {
| |
| --notification-card-background-color: #fff !important;
| |
| }
| |
| | |
| /** Notifications scrollable and font size **/
| |
| .global-navigation .global-navigation__bottom .notifications div.wds-dropdown__content div.wds-tab__content.wds-is-current {
| |
| overflow-y: auto;
| |
| font-size: 14px;
| |
| } | | } |
|
| |
|
| .global-navigation .notifications .wds-dropdown__content { | | .close { |
| background-color:var(--fandom-notifications-background-color);
| | background: #606061; |
| color:var(--fandom-text-color);
| |
| }
| |
| .global-navigation .notifications .wds-dropdown.wds-open-to-right::after {
| |
| border-right-color:var(--fandom-notifications-background-color);
| |
| }
| |
| .NotificationCard-module_card__6Nucq.NotificationCard-module_isUnread__18vlB {
| |
| --notification-card-background-color: var(--fandom-notifications-unread-card-background-color) !important;
| |
| }
| |
| | |
| /*** Small icon next to tab with unread notif ***/
| |
| .NotificationsDropdown-module_tabber__1qKxW .wds-tabs__tab-label .NotificationsDropdown-module_tabTotal__p7gqN {
| |
| background: #089196; | |
| }
| |
| .theme-fandomdesktop-dark .NotificationsDropdown-module_tabber__1qKxW .wds-tabs__tab-label .NotificationsDropdown-module_tabTotal__p7gqN {
| |
| background: #00d6d6;
| |
| }
| |
| | |
| /*** Mark all as read ***/
| |
| .global-navigation__bottom .NotificationsDropdown-module_markAllAsRead__2yUse {
| |
| color: #089196;
| |
| }
| |
| .global-navigation__bottom .NotificationsDropdown-module_markAllAsRead__2yUse:hover,
| |
| .theme-fandomdesktop-dark .global-navigation__bottom .NotificationsDropdown-module_markAllAsRead__2yUse {
| |
| color: #00d6d6;
| |
| }
| |
| .theme-fandomdesktop-dark .global-navigation__bottom .NotificationsDropdown-module_markAllAsRead__2yUse:hover {
| |
| color: #fff; | | color: #fff; |
| }
| | line-height: 25px; |
| .theme-fandomdesktop-dark .global-navigation__bottom .wds-dropdown__content .NotificationCard-module_card__2YXOh {
| | position: absolute; |
| --notification-card-background-color: #002a32; | | right: -12px; |
| border-bottom: 1px solid #656e78; | | text-align: center; |
| | top: -10px; |
| | width: 24px; |
| | text-decoration: none; |
| | font-weight: bold; |
| | border-radius: 12px; |
| | box-shadow: 1px 1px 3px #000; |
| } | | } |
|
| |
|
| /*** Unread notifications ***/
| | .close:hover { |
| .theme-fandomdesktop-dark .global-navigation__bottom .wds-dropdown__content .NotificationCard-module_card__2YXOh.NotificationCard-module_isUnread__25iz- {
| | background: #00d9ff; |
| --notification-card-background-color: #004b52;
| |
| }
| |
| .global-navigation__bottom .NotificationCard-module_card__2YXOh.NotificationCard-module_isUnread__25iz- .NotificationCard-module_unreadStatusDot__q1FDX,
| |
| .global-navigation__bottom .NotificationCard-module_card__2YXOh.NotificationCard-module_isUnread__25iz- .NotificationCard-module_unreadStatusDot__q1FDX:hover {
| |
| background-color: #089196;
| |
| border: #089196;
| |
| }
| |
| .theme-fandomdesktop-dark .NotificationCard-module_card__2YXOh.NotificationCard-module_isUnread__25iz- .NotificationCard-module_unreadStatusDot__q1FDX,
| |
| .theme-fandomdesktop-dark .NotificationCard-module_card__2YXOh.NotificationCard-module_isUnread__25iz- .NotificationCard-module_unreadStatusDot__q1FDX:hover {
| |
| background-color: #00d6d6;
| |
| border: #00d6d6;
| |
| } | | } |
|
| |
|
| /** Making space for the global nav, using the space on the left for page body **/
| | .portable-infobox.pi-theme-item_box { |
| .main-container { | | line-height: 1.15; |
| margin-left: 0;
| |
| width: 100%;
| |
| margin-top: 55px;
| |
| } | | } |
| .resizable-container { | | .portable-infobox.pi-theme-item_box .pi-item-spacing { |
| margin-top: 10px;
| | position: relative; |
| } | | } |
| | | .portable-infobox.pi-theme-item_box .pi-item-spacing:after { |
| /** Styling for the custom search added by the OasisRevived script **/
| | content: ''; |
| .global-navigation__search-container { | | display: block; |
| position: fixed;
| |
| height: 55px;
| |
| top: 0;
| |
| }
| |
| @media only screen and (max-width: 1023px) {
| |
| .global-navigation__search-container,
| |
| .global-navigation__search.global-navigation__icon {
| |
| right: 128px;
| |
| }
| |
| }
| |
| @media only screen and (min-width: 1024px) {
| |
| .global-navigation__search-container, | |
| .global-navigation__search.global-navigation__icon {
| |
| right: 267px;
| |
| }
| |
| }
| |
| @media only screen and (min-width: 1500px) {
| |
| .global-navigation__search-container {
| |
| flex: unset;
| |
| width: 450px;
| |
| margin-left: 34px;
| |
| margin-right: 6px;
| |
| }
| |
| }
| |
| .global-navigation__search {
| |
| align-items: center;
| |
| display: flex;
| |
| justify-content: flex-end;
| |
| margin-top: 0;
| |
| width: inherit;
| |
| }
| |
| .global-navigation__search-toggle {
| |
| align-items: center;
| |
| cursor: pointer;
| |
| display: flex;
| |
| transition: color .3s;
| |
| }
| |
| @media only screen and (min-width: 1500px) {
| |
| .global-navigation__search-toggle {
| |
| pointer-events: none;
| |
| }
| |
| }
| |
| .global-navigation__search-toggle-icon.wds-icon-small {
| |
| margin-right: 8px;
| |
| }
| |
| @media only screen and (max-width: 1023px) {
| |
| .global-navigation__search-toggle-icon.wds-icon-small {
| |
| display: none;
| |
| }
| |
| }
| |
| @media only screen and (min-width: 1024px) {
| |
| .wds-global-navigation__search-toggle-icon:not(.wds-icon-small) {
| |
| display: none;
| |
| }
| |
| }
| |
| @media only screen and (max-width: 1023px) {
| |
| .global-navigation__search-toggle-text {
| |
| display: none;
| |
| }
| |
| }
| |
| @media only screen and (min-width: 1500px) {
| |
| .global-navigation__search-toggle-text {
| |
| display: none;
| |
| }
| |
| }
| |
| .global-navigation__search-input-wrapper {
| |
| align-items: center;
| |
| display: none;
| |
| flex: 0 1 auto;
| |
| padding-bottom: 3px;
| |
| transition: flex .2s;
| |
| }
| |
| @media only screen and (min-width: 1500px) {
| |
| .global-navigation__search-input-wrapper {
| |
| border-bottom: 2px solid #00d6d6;
| |
| width: 100%;
| |
| display: flex;
| |
| }
| |
| }
| |
| .wds-global-navigation__suggestions-anchor {
| |
| display: flex; | |
| flex: 1 1 auto;
| |
| }
| |
| input.global-navigation__search-input {
| |
| background: transparent;
| |
| border: 0;
| |
| box-sizing: border-box;
| |
| flex: 1 1 auto;
| |
| font-family: sans-serif;
| |
| font-size: 14px;
| |
| height: 28px;
| |
| padding: 0; | | padding: 0; |
| width: 430px; | | border: none; |
| outline: none;
| | height: 1px; |
| color: #fff;
| | background: linear-gradient(to right, rgba(254,204,177,0) 0%,rgba(248,165,121,0.31) 22%,rgba(241,116,50,0.41) 50%,rgba(234,85,7,0.41) 51%,rgba(241,110,41,0.31) 70%,rgba(251,149,94,0) 100%); |
| caret-color: #fff;
| | color: #333; |
| }
| |
| input.global-navigation__search-input::placeholder {
| |
| color: #fff;
| |
| }
| |
| | |
| /* Community header */
| |
| .community-header-wrapper {
| |
| height: 105px; | |
| }
| |
| .fandom-community-header {
| |
| background-color: var(--theme-header-background-color); | |
| color: var(--theme-header-text-color);
| |
| height: 105px;
| |
| }
| |
| .fandom-community-header a {
| |
| color: var(--theme-header-text-color);
| |
| }
| |
| .fandom-community-header a:hover {
| |
| color: var(--theme-header-text-color--hover);
| |
| }
| |
| .wiki-tools .wds-button.wds-is-secondary {
| |
| --wds-secondary-button-label-color: var(--theme-header-text-color);
| |
| --wds-secondary-button-label-color--hover: var(--theme-header-text-color--hover);
| |
| }
| |
| @media only screen and (max-width: 1083px) {
| |
| .fandom-community-header {
| |
| height: 115px;
| |
| }
| |
| }
| |
| | |
| /** Removing gap between header and page **/
| |
| .page {
| |
| margin-top: 0;
| |
| }
| |
| html:not(.ve-activated) .page.has-right-rail .page__main, .page__main, .page__right-rail {
| |
| border-radius: 0;
| |
| }
| |
| | |
| /** Wiki wordmark **/
| |
| .fandom-community-header__image { | |
| margin-right: 0;
| |
| }
| |
| .fandom-community-header__image img {
| |
| height: 65px;
| |
| margin: 20px 0 20px 20px;
| |
| }
| |
| @media only screen and (max-width: 1083px) {
| |
| .fandom-community-header__image img {
| |
| height: 49px;
| |
| max-width: 175px;
| |
| margin-bottom: 0;
| |
| max-height: none;
| |
| }
| |
| }
| |
| | |
| /** Area of wiki title and those small icons **/
| |
| .fandom-community-header__top-container { | |
| align-items: normal;
| |
| height: 59px;
| |
| }
| |
| @media only screen and (max-width: 1083px) {
| |
| .fandom-community-header__top-container {
| |
| height: 69px;
| |
| }
| |
| }
| |
| | |
| /** Article counter **/
| |
| .page-counter {
| |
| margin: 17px 0 20px 20px;
| |
| }
| |
| .page-counter__value {
| |
| font-size: 20px;
| |
| line-height: 1;
| |
| font-weight: 600;
| |
| }
| |
| .page-counter__label {
| |
| font-size: 12px;
| |
| line-height: 1;
| |
| margin-top: 3px;
| |
| font-weight: 600;
| |
| }
| |
| | |
| /** Wiki title wrapper **/
| |
| .fandom-community-header__community-name-wrapper {
| |
| flex: 1;
| |
| font-size: 28px;
| |
| font-weight: 600;
| |
| line-height: 1;
| |
| margin: 25px 0 0 18px;
| |
| overflow: hidden;
| |
| }
| |
| @media only screen and (max-width: 1083px) {
| |
| .fandom-community-header__community-name-wrapper {
| |
| word-wrap: break-word;
| |
| font-size: 24px;
| |
| margin-top: 20px;
| |
| max-height: 72px;
| |
| white-space: normal;
| |
| }
| |
| }
| |
| | |
| /** Wiki title text **/
| |
| .fandom-community-header__community-name-wrapper a.fandom-community-header__community-name {
| |
| font-size: 28px;
| |
| font-weight: 600;
| |
| line-height: 1;
| |
| }
| |
| | |
| /** Wiki title text hover **/
| |
| .fandom-community-header__community-name-wrapper a.fandom-community-header__community-name:hover {
| |
| text-decoration: none;
| |
| }
| |
| | |
| /** Those small icons. Preventing stretched borders **/
| |
| .main-container .resizable-container header .wiki-tools.wds-button-group {
| |
| align-items: center;
| |
| margin: 20px 20px auto 15px
| |
| }
| |
| | |
| /** Community header tabs padding and order **/
| |
| .fandom-community-header__local-navigation ul {
| |
| order: 1;
| |
| padding-left: 6px;
| |
| }
| |
| .fandom-community-header__local-navigation ul div:first-child {
| |
| order: 2;
| |
| }
| |
| .fandom-community-header__local-navigation .wds-dropdown__toggle.first-level-item {
| |
| margin: 0 11px;
| |
| }
| |
| .fandom-community-header .fandom-community-header__local-navigation .large-navigation {
| |
| display: none;
| |
| }
| |
| @media only screen and (min-width: 1084px) and (max-width: 1279px) {
| |
| .fandom-community-header__local-navigation {
| |
| grid-column: inherit;
| |
| }
| |
| }
| |
| @media only screen and (min-width: 1084px) {
| |
| .fandom-community-header .fandom-community-header__local-navigation .extra-large-navigation {
| |
| display: flex;
| |
| }
| |
| .fandom-community-header__image {
| |
| grid-row: 1/3;
| |
| }
| |
| }
| |
| @media only screen and (max-width: 1083px) {
| |
| .fandom-community-header .fandom-community-header__local-navigation .medium-navigation {
| |
| display: flex;
| |
| }
| |
| }
| |
| | |
| /* Move background image to front */
| |
| .main-container {
| |
| background-image: var(--theme-body-background-image);
| |
| background-position: var(--background-img-position);
| |
| background-size: var(--background-img-size);
| |
| background-repeat: var(--background-img-repeat);
| |
| background-attachment: var(--background-img-attachment);
| |
| }
| |
| | |
| /* Make left icon buttons on articles smaller */
| |
| .page-side-tools button, .page-side-tools a {
| |
| height: 32px;
| |
| width: 32px;
| |
| }
| |
| .page-side-tools svg {
| |
| height: 16px;
| |
| width: 16px;
| |
| min-width: 16px;
| |
| }
| |
| @media only screen and (max-width: 1279px) {
| |
| .page-side-tools__wrapper {
| |
| transform: translateX(-60%);
| |
| }
| |
| }
| |
| | |
| /* Dropdown menus in Oasis had white wiki background */
| |
| .wds-dropdown__content,.wds-dropdown__content .wds-list.wds-is-linked .wds-dropdown-level-nested .wds-dropdown-level-nested__content {
| |
| background:var(--theme-page-background-color);
| |
| border-radius:4px;
| |
| }
| |
| .wds-dropdown::before {
| |
| border-bottom: 9px solid var(--theme-border-color);
| |
| }
| |
| .wds-dropdown::after {
| |
| border-bottom: 8px solid var(--theme-page-background-color); | |
| }
| |
| .wds-dropdown__content:not(.wds-is-not-scrollable) .wds-list::after, .wds-dropdown__content:not(.wds-is-not-scrollable) .wds-list::before {
| |
| background:var(--theme-page-background-color);
| |
| }
| |
| | |
| /* Wikia Bar */
| |
| /** Main styling **/
| |
| @media only screen and (min-width: 1024px) {
| |
| #WikiaBar .WikiaBarWrapper .wikia-bar {
| |
| width: 1026px;
| |
| }
| |
| }
| |
| @media only screen and (min-width: 1596px) {
| |
| #WikiaBar .WikiaBarWrapper .wikia-bar {
| |
| width: 1300px;
| |
| }
| |
| }
| |
| .WikiaBarWrapper {
| |
| align-items: center;
| |
| text-align: center; | | text-align: center; |
| box-shadow: 0 0 10px #333; | | margin: 1px auto 0px; |
| position: fixed; | | overflow: visible; |
| border-radius: 0;
| |
| bottom: 0; | | bottom: 0; |
| | position: absolute; |
| width: 100%; | | width: 100%; |
| z-index: 200;
| |
| right: auto;
| |
| }
| |
|
| |
| /** Bar collapsing animation **/
| |
| .WikiaBarWrapper .hidden {
| |
| bottom: -25px;
| |
| transition: all .2s ease-in;
| |
| z-index: -1;
| |
| }
| |
|
| |
| /** Most of the bar **/
| |
| .WikiaBarWrapper .wikia-bar {
| |
| display: inherit!important;
| |
| height: 25px;
| |
| margin: auto;
| |
| text-align: center;
| |
| }
| |
|
| |
| /** Toolbar **/
| |
| .WikiaBarWrapper .wikia-bar .toolbar {
| |
| align-self: auto;
| |
| height: 20px;
| |
| padding: 5px 0 0;
| |
| }
| |
|
| |
| /** Padding of the tools area **/
| |
| .WikiaBarWrapper .tools {
| |
| padding: 0 10px;
| |
| }
| |
|
| |
| /** Prevent underlined text when hover **/
| |
| .WikiaBarWrapper ul.tools li a:hover {
| |
| text-decoration: none;
| |
| }
| |
|
| |
| /** Line between tools **/
| |
| .WikiaBarWrapper ul.tools > li {
| |
| border-right: 1px solid var(--theme-accent-label-color);
| |
| margin: 0;
| |
| padding: 2px 10px;
| |
| height: 16px;
| |
| }
| |
|
| |
| /** Items position (currently doesn't work) **/
| |
| @media only screen and (max-width: 1083px) {
| |
| .WikiaBarWrapper div.wikia-bar > div.toolbar > ul.tools {
| |
| width: 818px;
| |
| }
| |
| }
| |
| @media only screen and (min-width: 1024px) {
| |
| .WikiaBarWrapper > div.wikia-bar > div.toolbar > ul.tools {
| |
| width: 1026px;
| |
| }
| |
| }
| |
| @media only screen and (min-width: 1084px) and (max-width: 1595px) {
| |
| .WikiaBarWrapper > div.wikia-bar > div.toolbar > ul.tools {
| |
| width: 1106px;
| |
| }
| |
| }
| |
|
| |
| /** Hide wikia bar - toggle position **/
| |
| .WikiaBarWrapper .arrow {
| |
| position: fixed;
| |
| bottom: 2.5px;
| |
| float: left;
| |
| right: 0;
| |
| }
| |
|
| |
| /** Show wikia bar (wrench) - toggle position **/
| |
| .WikiaBarCollapseWrapper {
| |
| bottom: 0;
| |
| right: 0;
| |
| }
| |
|
| |
| /** Show wikia bar (wrench) - toggle style **/
| |
| .WikiaBarCollapseWrapper .wikia-bar-collapse {
| |
| border-radius: 0;
| |
| height: 27px;
| |
| padding: 5px;
| |
| width: 28px;
| |
| box-shadow: 0 0 10px #333;
| |
| }
| |
|
| |
| /** Fix My Tools arrow animation and position **/
| |
| .WikiaBarWrapper .mytools.menu:not(:hover) svg {
| |
| transform: rotate(180deg);
| |
| transition: .25s all ease;
| |
| }
| |
| .WikiaBarWrapper .mytools.menu:hover svg {
| |
| transition: .25s all ease;
| |
| }
| |
|
| |
| /** My Tools dropdown **/
| |
| .WikiaBarWrapper .tools-menu {
| |
| text-align: left;
| |
| background: var(--theme-page-background-color--secondary);
| |
| }
| |
|
| |
| /** My Tools dropdown links **/
| |
| .WikiaBarWrapper .tools-menu > li >a {
| |
| color: var(--theme-page-text-color);
| |
| }
| |
|
| |
| /** Compatibility with OldWikiaBar **/
| |
| body div#WikiaBarWrapper.WikiaBarWrapper div.toolbar ul.tools > li:not(:first-child)::before {
| |
| display: none;
| |
| }
| |
|
| |
| /* TOC */
| |
| /** General style **/
| |
| .page-content #toc {
| |
| border-radius: 0;
| |
| padding: 5px;
| |
| margin: 1em 0;
| |
| }
| |
|
| |
| /** TOC title **/
| |
| .toc .toctitle {
| |
| border-bottom: 0;
| |
| justify-content: normal;
| |
| font-size: 12px;
| |
| padding: 3px 2px;
| |
| }
| |
| .toc .toctitle h2 {
| |
| font-size: 14px;
| |
| margin-top: 3px;
| |
| padding: 0 5px 3px 0;
| |
| }
| |
| .toc .toctogglespan:before,
| |
| .toc .toctogglespan:after {
| |
| font-size: 12px;
| |
| }
| |
|
| |
| /** Removing small icon near title **/
| |
| .toc .toctitle h2 .wds-icon {
| |
| display: none;
| |
| }
| |
|
| |
| /** Padding for content **/
| |
| .toc ul {
| |
| padding: 0;
| |
| }
| |
| .toc ul li {
| |
| margin: 0
| |
| }
| |
| .toc ul li .toclevel-2 {
| |
| margin-left: 2em;
| |
| }
| |
| .toc ul li .toclevel-3 {
| |
| margin-left: 2em;
| |
| }
| |
| .toc ul li .toclevel-4 {
| |
| margin-left: 2em;
| |
| }
| |
| .toc ul li .toclevel-5 {
| |
| margin-left: 2em;
| |
| }
| |
|
| |
| /** Links **/
| |
| .toc ul li a {
| |
| color: var(--theme-link-color);
| |
| display: initial;
| |
| font-weight: normal!important;
| |
| padding: 0;
| |
| }
| |
|
| |
| /** No background and color change when hovering links **/
| |
| .toc ul li a:hover {
| |
| background: none;
| |
| }
| |
| .toc ul li a:hover .tocnumber {
| |
| color: var(--theme-page-text-color);
| |
| }
| |
|
| |
| /** Number color **/
| |
| .toc ul li a .tocnumber {
| |
| color: var(--theme-page-text-color);
| |
| }
| |
|
| |
| /** No dot after number **/
| |
| .toc ul li a .tocnumber:after {
| |
| display: none;
| |
| }
| |
|
| |
| /* User Masthead */
| |
| body.skin-fandomdesktop #userProfileApp {
| |
| background-color: rgba(var(--theme-page-background-color--rgb),var(--theme-page-background-color--opacity));
| |
| padding: 18px 0 0 0;
| |
| }
| |
|
| |
| /* Achievements on User Profile Page */
| |
| /** Most of the text **/
| |
| body.skin-fandomdesktop .UserProfileAchievementsModule,
| |
| body.skin-fandomdesktop .UserProfileAchievementsModule a {
| |
| font-family: inherit;
| |
| }
| |
|
| |
| /** Right rail **/
| |
| html:not(.ve-activated) .page.has-right-rail .page__right-rail {
| |
| width: 300px;
| |
| margin-left: 20px;
| |
| }
| |
| html:not(.ve-activated) .page.has-right-rail .page__right-rail.is-rail-hidden {
| |
| margin-left: 0;
| |
| width: 0;
| |
| }
| |
| .right-rail-wrapper {
| |
| padding: 0;
| |
| }
| |
| .rail-module {
| |
| background-color: transparent;
| |
| border-bottom: 0;
| |
| margin: 30px 10px 10px;
| |
| padding: 0;
| |
| }
| |
| .rail-module h2 {
| |
| border-bottom: 1px solid var(--theme-border-color);
| |
| font-size: 16px;
| |
| font-weight: 700;
| |
| margin: 0;
| |
| margin-bottom: 16px;
| |
| min-height: 30px;
| |
| padding: 0;
| |
| padding-left: 2px;
| |
| padding-bottom: 1px;
| |
| width: 100%;
| |
| background-image: none;
| |
| line-height: 1;
| |
| }
| |
| .rail-module h2.has-icon svg {
| |
| margin-right: 7px;
| |
| }
| |
|
| |
| /** Title of earned badges **/
| |
| .rail-module .badges-profile-title {
| |
| background-image: none;
| |
| border-bottom: 1px solid var(--theme-border-color);
| |
| min-height: 30px;
| |
| width: 100%;
| |
| }
| |
|
| |
| /** Link to Leaderboard **/
| |
| .UserProfileAchievementsModule .data .data-details.ranking > p > a {
| |
| font-family: inherit;
| |
| }
| |
|
| |
| /** More Badges You Can Earn! - Title text **/
| |
| .UserProfileAchievementsModule .title-challeneges {
| |
| border-bottom: 1px solid var(--theme-border-color);
| |
| font-size: 16px;
| |
| font-weight: 700;
| |
| margin-bottom: 16px;
| |
| min-height: 30px;
| |
| }
| |
|
| |
| /* Removing fixed header for tables */
| |
| .article-table .fixed-header, .wikitable .fixed-header {
| |
| box-shadow: none;
| |
| outline: none;
| |
| transform: none;
| |
| transition: none;
| |
| }
| |
|
| |
| /* Tabs in Wiki, Social and Image Activity */
| |
| .activity-tabs.with-bottom-border .wds-tabs__tab-label {
| |
| font-family: Helvetica Neue, helvetica, arial, sans-serif; /* Fallback */
| |
| font-family: var(--oasis-revived-font);
| |
| align-items: center;
| |
| display: inline-flex;
| |
| font-size: 12px;
| |
| font-weight: 700;
| |
| height: 40px;
| |
| text-align: center;
| |
| text-transform: uppercase;
| |
| white-space: nowrap;
| |
| margin: 0 11px;
| |
| text-decoration: none;
| |
| transition: color 0.1s ease 0s;
| |
| }
| |
|
| |
| /** No underlined text **/
| |
| .activity-tabs.with-bottom-border .wds-tabs__tab-label:active,
| |
| .activity-tabs.with-bottom-border .wds-tabs__tab-label:focus {
| |
| text-decoration: none;
| |
| }
| |
|
| |
| /**No bottom and top margin for tabs **/
| |
| .page-content li.wds-tabs__tab {
| |
| margin: 0;
| |
| }
| |
|
| |
| /* Search pop-up */
| |
| .search-modal, .search-modal:before {
| |
| left: 0; | | left: 0; |
| } | | } |
| | | .portable-infobox.pi-theme-item_box .pi-data-label { |
| .search-modal .search-modal__content {
| | min-width: 95px; |
| border-color:#404a57;
| | overflow-wrap: normal; |
| }
| | line-height: 1.2em; |
| .search-modal::before {
| | width: 95px; |
| background-color: rgba(0, 0, 0, .5)
| |
| }
| |
| .SearchInput-module_form__fAwdT .wds-button[type="button"]:hover {
| |
| color:rgba(255,255,255,.7)
| |
| }
| |
| .search-modal .search-seeding, .highlight__wiki-btn, .search-modal input[class^="SearchInput-module_input"], .search-modal .SearchInput-module_form__fAwdT .wds-button[type="button"] {
| |
| color: #fff;
| |
| }
| |
| .SearchResults-module_results__k8itn.wds-list.wds-is-linked > li > a {
| |
| color: var(--fandom-link-color)!important;
| |
| transition: 0.1s;
| |
| }
| |
| .SearchResults-module_results__k8itn.wds-list.wds-is-linked > li > a.SearchResults-module_isSelected__7oTZQ, .SearchResults-module_results__k8itn.wds-list.wds-is-linked > li > a:hover {
| |
| background-color: var(--fandom-link-color--fadeout);
| |
| color:#fff
| |
| }
| |
| .search-modal .wds-button:hover,.search-modal .wds-button:focus,.search-modal .wds-button:active {
| |
| color: #fff;
| |
| background-color: var(--fandom-link-color--hover);
| |
| border-color: var(--fandom-link-color--hover);
| |
| }
| |
| | |
| /* Default body font */
| |
| body.skin-fandomdesktop {
| |
| font-family: Helvetica Neue, helvetica, arial, sans-serif; /* Fallback */
| |
| font-family: var(--oasis-revived-font);
| |
| font-size: 14px;
| |
| }
| |
| | |
| /* Main article */
| |
| .resizable-container { | |
| background-color: var(--theme-page-background-color);
| |
| }
| |
| .page .page__main { | |
| font-size: 16px;
| |
| line-height: 1.5;
| |
| }
| |
| | |
| /** Headers **/
| |
| .page-content h2 {
| |
| line-height: 1;
| |
| margin: 0.5em 0 0.2em;
| |
| padding: 0 0 3px;
| |
| font-size: 28px;
| |
| }
| |
| | |
| .page-content h1, .page-content h2, .page-content h3, .page-content h4, .page-content h5, .page-content h6 {
| |
| font-family: var(--oasis-revived-font);
| |
| }
| |
| | |
| /** Article text styling and padding **/
| |
| .page-content p {
| |
| margin: 0.4em 0 0.5em;
| |
| line-height: 1.5;
| |
| }
| |
| | |
| .page-content p+p {
| |
| margin: 1em 0;
| |
| }
| |
| | |
| /** List styling and padding **/
| |
| .page-content ul {
| |
| list-style: square;
| |
| }
| |
| .page-content li {
| |
| margin: 3px 0;
| |
| }
| |
| .mw-content-ltr ol, .mw-content-ltr ul {
| |
| margin: 0.4em 0 0.5em 2.5em;
| |
| }
| |
| | |
| /** Article content wrapper padding **/
| |
| .page .page__main {
| |
| padding: 0 0 0 24px;
| |
| }
| |
| .page {
| |
| padding-right: 24px;
| |
| }
| |
| @media only screen and (min-width: 1024px) {
| |
| .page .page__main {
| |
| padding: 0 0 0 10px;
| |
| }
| |
| .page {
| |
| padding-right: 10px;
| |
| }
| |
| }
| |
| @media only screen and (min-width: 1084px) {
| |
| .page .page__main {
| |
| padding: 0 0 0 20px;
| |
| }
| |
| .page {
| |
| padding-right: 20px;
| |
| }
| |
| }
| |
| @media only screen and (min-width: 1596px) {
| |
| .page .page__main {
| |
| padding: 0 0 0 30px;
| |
| }
| |
| .page {
| |
| padding-right: 30px;
| |
| }
| |
| }
| |
| | |
| /* Article header */
| |
| .page-header {
| |
| padding: 16px 0 8px;
| |
| border-bottom: 1px solid var(--theme-border-color);
| |
| margin-bottom: 18px;
| |
| }
| |
| .page-header__title {
| |
| font-weight: 700;
| |
| line-height: 1;
| |
| }
| |
| .page-header__categories {
| |
| font-size: 12px;
| |
| line-height: 1;
| |
| }
| |
| .page-header__categories-in {
| |
| font-weight: 600;
| |
| }
| |
| .page-header__categories *:not(.page-header__categories-in) {
| |
| font-style: italic;
| |
| line-height: 16px;
| |
| }
| |
| | |
| /*** Page header buttons ***/
| |
| .page-header__actions {
| |
| align-items: flex-end;
| |
| display: inline-flex;
| |
| justify-content: flex-start;
| |
| padding-top: 0;
| |
| padding-bottom: 6px;
| |
| }
| |
| .page-header__bottom .page-header__actions .page-header__action-button {
| |
| align-items: center;
| |
| background-color: var(--theme-accent-color);
| |
| border: 1px solid var(--theme-accent-color);
| |
| border-radius: 3px;
| |
| color: var(--theme-accent-label-color);
| |
| cursor: pointer;
| |
| font-family: inherit;
| |
| display: inline-flex;
| |
| font-size: 12px;
| |
| font-weight: 600;
| |
| line-height: 16px;
| |
| letter-spacing: .15px;
| |
| margin: 0;
| |
| margin-right: 1px;
| |
| outline: none;
| |
| padding: 7px 12px;
| |
| text-decoration: none;
| |
| text-transform: uppercase;
| |
| transition-duration: .3s;
| |
| transition-property: background-color,border-color,color;
| |
| vertical-align: top;
| |
| height: unset;
| |
| }
| |
| .page-header__bottom .page-header__actions .page-header__action-button:hover {
| |
| background-color: var(--theme-accent-color--hover);
| |
| border: 1px solid var(--theme-accent-color--hover);
| |
| }
| |
| .page-header__bottom .page-header__actions .wds-button:first-child {
| |
| border-radius: 3px 0 0 3px;
| |
| }
| |
| .page-header__bottom .page-header__actions .wds-dropdown:last-child .wds-button {
| |
| border-radius: 0 3px 3px 0;
| |
| cursor: default;
| |
| }
| |
| .page-header__bottom .page-header__actions .page-header__action-button:before {
| |
| display: none;
| |
| }
| |
| | |
| /* Article footer */
| |
| .page-footer__categories header,
| |
| .page-footer__languages header {
| |
| display: none;
| |
| }
| |
| .page-footer .wds-collapsible-panel.wds-is-collapsed .wds-collapsible-panel__content {
| |
| display: block;
| |
| }
| |
| | |
| /** Categories **/
| |
| .page-footer__categories {
| |
| background-color: var(--theme-page-background-color);
| |
| background-image: none;
| |
| border: 1px solid var(--theme-border-color);
| |
| clear: both;
| |
| font-size: 12px;
| |
| line-height: normal;
| |
| margin: 10px 0;
| |
| padding: 0;
| |
| position: relative;
| |
| }
| |
| .page-footer__categories .wds-collapsible-panel__content {
| |
| padding: 10px 20px 10px;
| |
| }
| |
| .CategorySelect.articlePage .add {
| |
| padding: 0 10px;
| |
| }
| |
| .CategorySelect.articlePage .category, .CategorySelect.articlePage .last, .CategorySelect.articlePage .placeholder, .CategorySelect.articlePage .special-categories-label,.CategorySelect.articlePage .category.new {
| |
| margin-bottom:0
| |
| }
| |
| .CategorySelect.articlePage.editMode > .toolbar {
| |
| margin-top: 5px;
| |
| padding-bottom: 0;
| |
| padding-top: 10px;
| |
| }
| |
| .CategorySelect.articlePage .container {
| |
| padding: 0;
| |
| }
| |
| .CategorySelect.articlePage.editMode .container {
| |
| padding: 5px 20px 5px 0;
| |
| }
| |
| | |
| /** Languages **/
| |
| .page-footer__languages {
| |
| border: none;
| |
| display: flex;
| |
| flex-direction: row;
| |
| padding: 10px 0 0;
| |
| }
| |
| .page-footer__languages .wds-collapsible-panel__content {
| |
| align-items: baseline;
| |
| clear: both;
| |
| display: flex;
| |
| margin: 10px;
| |
| }
| |
| .page-footer__languages:before {
| |
| content: 'Languages: ';
| |
| font-size: 18px;
| |
| line-height: 1.25;
| |
| font-weight: 500;
| |
| margin: 0.5em 0 0.2em;
| |
| }
| |
| .page-footer__languages .wds-collapsible-panel__content a {
| |
| font-size: 14px;
| |
| margin: 0;
| |
| padding: 0;
| |
| line-height: 24px;
| |
| padding-left: 5px;
| |
| padding-right: 9px;
| |
| margin-bottom: 6px;
| |
| border: 0;
| |
| border-left: 1px solid #7f9998;
| |
| }
| |
| .page-footer__languages .wds-collapsible-panel__content a:first-child {
| |
| padding-left: 0;
| |
| border: 0;
| |
| }
| |
| | |
| /** License description **/
| |
| .page-footer .license-description {
| |
| clear: both;
| |
| font-size: 12px;
| |
| margin: 18px 12px;
| |
| padding: 0;
| |
| }
| |
| | |
| /* Special:ThemeDesigner */
| |
| .theme-designer {
| |
| margin-left: 0;
| |
| }
| |
| | |
| /* Special:AdminDashboard */
| |
| /** General and Advanced tabs **/
| |
| #AdminDashboardTabs.wds-tabs {
| |
| flex-direction: row-reverse;
| |
| }
| |
| | |
| #AdminDashboardTabs .tab.wds-tabs__tab {
| |
| color: var(--theme-page-text-color);
| |
| margin: 0;
| |
| border: solid var(--theme-border-color);
| |
| border-top-left-radius: 5px;
| |
| border-top-right-radius: 5px;
| |
| border-width: 1px 1px 0;
| |
| margin-left: 4px;
| |
| }
| |
| | |
| #AdminDashboardTabs .tab.wds-tabs__tab.wds-is-current {
| |
| box-shadow: none;
| |
| color: var(--theme-page-text-color);
| |
| background: var(--theme-page-background-color--secondary);
| |
| }
| |
| | |
| #AdminDashboardTabs .tab.wds-tabs__tab > .wds-tabs__tab-label {
| |
| font-weight: normal;
| |
| height: 19px;
| |
| text-transform: none;
| |
| letter-spacing: normal;
| |
| margin: 0;
| |
| padding: 2px 25px 0;
| |
| }
| |
| | |
| #AdminDashboardTabs .tab.wds-tabs__tab > .wds-tabs__tab-label > .link:hover,
| |
| #AdminDashboardTabs .tab.wds-tabs__tab > .wds-tabs__tab-label > .link:focus {
| |
| color: var(--theme-page-text-color);
| |
| }
| |
| | |
| /** Hide global nav outside preview **/
| |
| .ns-special.page-Special_ThemeDesigner .global-navigation {
| |
| display: none;
| |
| }
| |
| | |
| /* Diff page */
| |
| .diff td.diff-deletedline, .diff td.diff-addedline {
| |
| background-color: var(--theme-page-background-color--secondary);
| |
| }
| |
| .diff-editfont-monospace .diff-addedline, .diff-editfont-monospace .diff-deletedline, .diff-editfont-monospace .diff-context {
| |
| font-family: var(--oasis-revived-font);
| |
| font-size: 88%;
| |
| line-height: 1.6;
| |
| }
| |
| | |
| /* SVG after external links */
| |
| a.external.text:after {
| |
| background-color: currentColor;
| |
| content: "";
| |
| display: inline-block;
| |
| height: 13px;
| |
| width: 13px;
| |
| -webkit-mask: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13'%3E%3Cpath fill='%2336b' d='M5.002 1.01h7v7l-2-2-3 2v-1l3-2.25 1 1V2.01h-3.75l1 1-2.25 3h-1l2-3z'/%3E%3Cpath fill='%2336b' d='M7.002 3.01h-5v8h8v-5h-1v4h-6v-6h4z'/%3E%3Cpath fill='%2315a5ea' d='M4.082 5.51c0-.621.621-.621.621-.621 1.864.621 3.107 1.864 3.728 3.728 0 0 0 .621-.62.621-1.245-1.864-1.866-2.485-3.73-3.728z'/%3E%3C/svg%3E") no-repeat center;
| |
| mask: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13'%3E%3Cpath fill='%2336b' d='M5.002 1.01h7v7l-2-2-3 2v-1l3-2.25 1 1V2.01h-3.75l1 1-2.25 3h-1l2-3z'/%3E%3Cpath fill='%2336b' d='M7.002 3.01h-5v8h8v-5h-1v4h-6v-6h4z'/%3E%3Cpath fill='%2315a5ea' d='M4.082 5.51c0-.621.621-.621.621-.621 1.864.621 3.107 1.864 3.728 3.728 0 0 0 .621-.62.621-1.245-1.864-1.866-2.485-3.73-3.728z'/%3E%3C/svg%3E") no-repeat center;
| |
| }
| |
| | |
| /* Fix issue with text before a list */
| |
| .page-content p+ol, .page-content p+ul, .page-content section+ol, .page-content section+ul {
| |
| margin-top: 0;
| |
| }
| |
| | |
| /*Media lightbox*/
| |
| .skin-fandomdesktop .LightboxModal {
| |
| margin-left: 0;
| |
| width: 90%;
| |
| margin-top: 55px; /*so that it doesn't display behind global nav*/
| |
| }
| |
| | |
| /* Discussions-specific CSS */
| |
| body[data-app-name="feeds-and-posts"] .app-wrapper {
| |
| margin-left: 0;
| |
| max-width: 100%;
| |
| width: 100%;
| |
| margin-top: 55px;
| |
| }
| |
| @media only screen and (min-width: 768px) {
| |
| body[data-app-name="feeds-and-posts"] .post-form-wrapper {
| |
| top: 55px;
| |
| }
| |
| body[data-app-name="feeds-and-posts"] .is-sticky-rail {
| |
| top: 75px;
| |
| }
| |
| } | | } |
|
| |
|
| /* Global footer */
| | #p-Forum-label { |
| .global-footer {
| | line-height: 25px; |
| background: var(--fandom-global-nav-background-color);
| |
| font-family: Rubik,Helvetica,Arial,sans-serif;
| |
| font-size: 14px;
| |
| line-height: 1.25;
| |
| word-wrap: break-word;
| |
| }
| |
| .global-footer .global-footer__bottom {
| |
| background: rgba(38,38,38,.5)
| |
| }
| |
| | |
| .global-footer .global-footer__content a {
| |
| color: var(--fandom-global-nav-link-color);
| |
| }
| |
| | |
| .global-footer h2 a {
| |
| display: none;
| |
| }
| |
| | |
| .global-footer h2::after {
| |
| content: ' ';
| |
| height: 49px;
| |
| width: 164px;
| |
| background-image: url(https://static.wikia.nocookie.net/dev/images/a/a3/Old_Fandom_Logo_White.svg/revision/latest);
| |
| display: block;
| |
| margin: auto;
| |
| background-repeat: no-repeat;
| |
| background-position: center
| |
| }
| |
| .global-footer__header {
| |
| width:164px
| |
| }
| |
| @media only screen and (min-width: 1024px) {
| |
| .global-footer__header {
| |
| margin-bottom:12px;
| |
| }
| |
| }
| |
| .global-footer__section-header {
| |
| color: #fff;
| |
| font-size: 12px;
| |
| font-weight: 700;
| |
| line-height: 1;
| |
| margin-bottom: 7px;
| |
| margin-top: 0;
| |
| padding: 0;
| |
| text-transform: uppercase;
| |
| }
| |
| .global-footer__bottom a, .global-footer__bottom a:visited {
| |
| color: var(--fandom-link-color);
| |
| text-decoration: none;
| |
| }
| |
| .global-footer__section-social-links .wds-icon {
| |
| color: #fff;
| |
| opacity: .3;
| |
| transition: opacity .3s;
| |
| }
| |
| .global-footer__section-social-links .wds-icon:hover {
| |
| color: #fff;
| |
| opacity:1;
| |
| }
| |
| .global-footer .global-footer__content .global-footer__link:hover {
| |
| color: #fff;
| |
| text-decoration: none;
| |
| } | | } |
