Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/*** Navigation bar ***/
.global-navigation {
--fandom-global-nav-background-color: #111;
--fandom-global-nav-link-color: #FFC500;
--fandom-global-nav-link-color--hover: white;
--fandom-global-nav-icon-color: white;
--fandom-global-nav-icon-background-color: #222;
--fandom-global-nav-icon-background-color--hover: rgba(255, 255, 255, 0.3);
--fandom-global-nav-icon-background-color--active: var(--fandom-global-nav-icon-background-color--hover);
--fandom-global-nav-icon-border-color: rgba(255, 255, 255, 0.75);
--fandom-global-nav-icon-border-color--hover: rgba(255, 255, 255, 0.3);
--fandom-global-nav-icon-border-color--active: var(--fandom-global-nav-icon-border-color--hover);
--fandom-global-nav-bottom-icon-color: var(--fandom-global-nav-icon-color);
--fandom-global-nav-counter-background-color: #222;
--fandom-global-nav-counter-label-color: white;
}
/* Dropdowns */
.global-navigation .wds-dropdown:not(.notifications .wds-dropdown) {
--fandom-dropdown-background-color: #252525;
--fandom-border-color: #2A2A2A;
--fandom-text-color: white;
--fandom-link-color: white;
--fandom-link-color--fadeout: rgba(255, 255, 255, 0.1);
--fandom-box-shadow-color: hsl(0deg 0% 30% / 50%);
}
.global-navigation .wds-dropdown .wds-dropdown__content {
box-shadow: 6px 3px 12px -9px var(--fandom-box-shadow-color);
}
/*** Notifications ***/
.global-navigation .notifications {
--fandom-border-color: #222;
--fandom-text-color: white;
--fandom-text-color--rgb: 255, 255, 255;
--fandom-link-color: #FFC500;
--fandom-link-color--hover: #997600;
--fandom-accent-color: #FFC500;
--fandom-accent-color--hover: #997600;
--fandom-accent-label-color: #222;
--fandom-notifications-background-color: #222;
--fandom-dropdown-background-color: var(--fandom-notifications-background-color);
--fandom-notifications-read-card-background-color: var(--fandom-notifications-background-color);
--fandom-notifications-unread-card-background-color: #393939;
--fandom-notifications-footer-text-color: #CCC;
--fandom-notifications-border-color: #555;
}
.global-navigation .notifications [class*="NotificationCard-module_card__"] {
--fandom-border-color: var(--fandom-notifications-border-color);
}
.global-navigation .notifications .fandom-spinner > svg circle {
stroke: var(--fandom-link-color);
}
/*** Footers ***/
#mixed-content-footer, .global-footer {
--fandom-background-color: #1D1D1D;
--fandom-background-color--secondary: #555;
--fandom-text-color: white;
--fandom-link-color: #EEE;
--fandom-link-color--hover: #FFC500;
--fandom-border-color: rgba(255, 255, 255, 0.25);
--fandom-mcf-height: 500px;
}
/* Fan Feed */
.mcf-content {
height: var(--fandom-mcf-height); /* Fixed height, use "unset" to revert */
overflow-y: auto;
padding-right: 3px; /* Scrollbar padding */
}
a.mcf-card.mcf-card-article {
transition: .5s;
}
a.mcf-card.mcf-card-article:hover {
filter: brightness(130%) !important;
}
.mcf-card, .mcf-card-discussions__header, .mcf-card-related-wikis__header {
border: none;
}
.mcf-card-wiki-articles__header, .mcf-card-wiki-articles__item-link, .mcf-card-wiki-articles__circle,
.mcf-card-discussions__header, .mcf-card-discussions__user-subtitle, .mcf-card-discussions__content, .mcf-card-discussions__in, .mcf-card-discussions__counters, .mcf-card-discussions__counters svg,
.mcf-card-related-wikis__header, .mcf-card-related-wikis__title {
color: var(--fandom-text-color) !important;
background-color: inherit;
}
.mcf-card-wiki-articles,
.mcf-card-discussions__header, .mcf-card-discussions, .mcf-card-discussions__list::after, .mcf-card-discussions__list::before,
.mcf-card-related-wikis__header, .mcf-card-related-wikis {
background-color: var(--fandom-background-color);
}
.mcf-card-wiki-articles__item,
.mcf-card-discussions__header, .mcf-card-discussions__item,
.mcf-card-related-wikis__header, .mcf-card-related-wikis__item {
border-color: var(--fandom-border-color) !important;
}
.mcf-card-wiki-articles__circle {
background-color: var(--fandom-background-color--secondary);
}
.mcf-card-discussions__user-info .wds-avatar {
--wds-avatar-border-color: var(--fandom-border-color);
--wds-avatar-border-color--hover: var(--fandom-border-color);
--wds-avatar-background-color: transparent;
}
.mcf-card-discussions__link {
color: var(--fandom-link-color);
}
.mcf-card-discussions__link:hover, .mcf-card-discussions__item > a:hover {
color: var(--fandom-link-color--hover);
}
.mcf-card-discussions__item a {
color: inherit;
}
/* Global Footer */
.global-footer {
background-color: var(--fandom-background-color);
color: var(--fandom-text-color);
}
.global-footer__link, .global-footer__link:active, .global-footer__link:focus, .global-footer__link:visited,
.global-footer__bottom a, .global-footer__bottom a:visited {
color: var(--fandom-link-color);
}
.global-footer__link:hover, .global-footer__bottom a:hover, .global-footer__section-social-links .global-footer__link-icon:hover {
color: var(--fandom-link-color--hover);
}
.global-footer__section-header, .global-footer__section-social-links .global-footer__link-icon {
color: inherit;
}
.global-footer__bottom {
background-color: inherit;
}
.global-footer__section-fandom-stores:after, .global-footer__bottom > div ~ div {
border-color: var(--fandom-border-color);
}
/*** Logo recolor ***/
#wds-brand-fandom-logo-light > path[fill="#F9EDD8"] {
fill: white;
}
/*** Banner notifications ***/
.wds-banner-notification {
--wds-banner-notification-background-color: #222;
--wds-banner-notification-text-color: white;
--wds-banner-notification-link-color: #FFC500;
--wds-banner-notification-link-color--hover: #997600;
--wds-banner-notification-border-color: #2A2A2A;
--wds-banner-notification-close-icon: #EEE;
--wds-banner-notification-alert: #bf0017;
--wds-banner-notification-warning: #cf721c;
--wds-banner-notification-success: #0c742f;
--wds-banner-notification-message: #753369;
}
.wds-alert .wds-banner-notification__icon { background-color: var(--wds-banner-notification-alert) }
.wds-warning .wds-banner-notification__icon { background-color: var(--wds-banner-notification-warning) }
.wds-success .wds-banner-notification__icon { background-color: var(--wds-banner-notification-success) }
.wds-message .wds-banner-notification__icon { background-color: var(--wds-banner-notification-message) }
/*** Blackouts ***/
.lightboxContainer .blackout, .search-modal:before {
background-color: #000;
opacity: 0.6 !important;
}
/*** Search ***/
.search-modal, .highlight__sticky-container {
--fandom-text-color: white;
--fandom-text-color--hover: var(--fandom-link-color);
--fandom-dropdown-background-color: #222;
--fandom-border-color: #222;
--fandom-accent-color: #FFC500;
--fandom-accent-color--hover: #997600;
--fandom-accent-label-color: #222;
--fandom-link-color: #FFC500;
--fandom-link-color--fadeout: rgba(255, 255, 255, 0.1); /* rgba(255, 197, 0, 0.1) */
}
.search-modal .highlight__wiki-btn {
border-color: var(--fandom-link-color--fadeout) !important;
}
.search-modal form > input::placeholder {
color: var(--fandom-text-color);
opacity: 0.6;
}
.search-modal .top-results__link:active {
color: var(--fandom-accent-color--hover);
}
/*** Search tooltip ***/
.highlight__sticky-container {
background-color: var(--fandom-dropdown-background-color) !important;
}
.highlight__sticky-container path {
fill: var(--fandom-text-color);
opacity: 0.4;
}
.highlight__sticky-container::before {
border-top-color: var(--fandom-dropdown-background-color) !important;
}
.highlight__action :is(a, button) {
color: var(--fandom-text-color) !important;
}
.highlight__action :is(a, button):is(:active, :focus, :hover) {
color: var(--fandom-text-color--hover) !important;
}