MediaWiki:Common.css
Appearance
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)
- Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* Factory Town 2: Paradise Wiki — site stylesheet */
/* CSS placed here will be applied to all skins */
/******************************************************************************************
********************************* Start user-edit variables *******************************
******************************************************************************************/
/*****************************************
****** START BASIC DESIGN VARIABLES ******
----------------------------------------*/
:root {
/* font settings */
--wiki-body-font-family: sans-serif;
--wiki-content-heading-font-family: 'Linux Libertine', 'Georgia', 'Times', serif;
--wiki-sidebar-heading-font-family: sans-serif;
/* border settings for content and sidebar portals */
--wiki-border-width: 1px;
--wiki-border-radius: 0px;
/* layout settings */
--wiki-is-top-logo: 0; /* 1 = center logo at the top of the page; 0 = logo at the top left of the page */
--wiki-logo-file-width: 160; /* Width of the image file in px. Put a number without the letters `px`. */
--wiki-logo-file-height: 160; /* Height of the image file in px. Put a number without the letters `px`. */
--wiki-is-navigation-inside-content: 0; /* 0 = default navigation tabs layout; 1 = navigation tabs inside content box */
}
/*----------------------------------------
******* END BASIC DESIGN VARIABLES *******
*****************************************/
/*****************************************
****** START BASIC COLOR VARIABLES *******
----------------------------------------*/
:root,
.view-light {
--wiki-body-background-color: #F6F6F6;
--wiki-body-background-image: url(filepath://Site-background.jpg);
--wiki-border-color: #a7d7f9;
--wiki-content-background-color: #ffffff;
--wiki-content-background-opacity: 100%;
--wiki-content-link-color: #0645ad;
--wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%);
--wiki-accent-color: #3366cc;
--wiki-accent-label-color: #ffffff;
--wiki-accent-link-color: #D5FB51;
}
.view-dark {
--wiki-body-background-color: #171717;
--wiki-body-background-image: url(filepath://Site-background-dark.jpg);
--wiki-border-color: #991A51;
--wiki-content-background-color: #202020;
--wiki-content-background-opacity: 90%;
--wiki-content-link-color: #6d8afb;
--wiki-icon-to-link-filter: invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%);
--wiki-accent-color: #ff4d9d;
--wiki-accent-label-color: #000;
--wiki-accent-link-color: #1e1e43;
}
/*----------------------------------------
******* END BASIC COLOR VARIABLES ********
*****************************************/
/*****************************************
**** START ADVANCED COLOR VARIABLES ******
----------------------------------------*/
:root,
.view-light {
--wiki-logo-invert: 0;
--wiki-body-background-position: top center;
--wiki-body-background-size: cover;
--wiki-body-background-repeat: no-repeat;
--wiki-body-background-attachment: fixed;
--wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));
--wiki-content-text-color: #111111;
--wiki-content-link-color--visited: var(--wiki-content-link-color);
--wiki-content-link-color--hover: var(--wiki-content-link-color);
--wiki-content-redlink-color: #ba0000;
--wiki-content-heading-color: var(--wiki-content-text-color);
--wiki-content-heading-border-color: var(--wiki-content-body-border-color);
--wiki-content-body-border-color: var(--wiki-content-border-color);
--wiki-navigation-background-color: var(--wiki-content-background-color--secondary);
--wiki-navigation-border-color: var(--wiki-navigation-selected-border-color);
--wiki-navigation-text-color: var(--wiki-content-link-color);
--wiki-navigation-selected-background-color: var(--wiki-content-background-color);
--wiki-navigation-selected-border-color: var(--wiki-content-border-color);
--wiki-navigation-selected-text-color: var(--wiki-content-text-color);
--wiki-table-background-color: var(--wiki-content-background-color);
--wiki-table-header-background-color: var(--wiki-content-background-color--secondary);
--wiki-table-text-color: var(--wiki-content-text-color);
--wiki-table-link-color: var(--wiki-content-link-color);
--wiki-table-redlink-color: var(--wiki-content-redlink-color);
--wiki-table-header-text-color: var(--wiki-table-text-color);
--wiki-table-header-link-color: var(--wiki-content-link-color);
--wiki-table-border-color: var(--wiki-content-border-color);
--wiki-neutral-color: var(--wiki-content-text-mix-color);
--wiki-alert-color: #bf0017;
--wiki-warning-color: #b05f30;
--wiki-success-color: #0c742f;
--wiki-body-dynamic-color: #000000;
--wiki-body-dynamic-color--inverted: #ffffff;
--wiki-body-dynamic-color--secondary: #333333;
--wiki-body-dynamic-color--secondary--inverted: #cccccc;
--wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);
--wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);
--wiki-content-link-label-color: #ffffff;
--wiki-content-dynamic-color: #000000;
--wiki-content-dynamic-color--inverted: #ffffff;
--wiki-content-dynamic-color--secondary: #333333;
--wiki-content-dynamic-color--secondary--inverted: #cccccc;
--wiki-alert-label-color: #ffffff;
--wiki-warning-label-color: #ffffff;
--wiki-success-label-color: #ffffff;
--wiki-icon-general-filter: ;
}
.view-dark {
--wiki-logo-invert: 0;
--wiki-body-background-position: top center;
--wiki-body-background-size: cover;
--wiki-body-background-repeat: no-repeat;
--wiki-body-background-attachment: fixed;
--wiki-content-background-color--secondary: color-mix(in srgb, var(--wiki-content-background-color) 96%, var(--wiki-content-dynamic-color));
--wiki-content-text-color: #ededed;
--wiki-content-link-color--visited: var(--wiki-content-link-color);
--wiki-content-link-color--hover: var(--wiki-content-link-color);
--wiki-content-redlink-color: #FC5B4F;
--wiki-content-heading-color: var(--wiki-content-text-color);
--wiki-content-heading-border-color: var(--wiki-content-body-border-color);
--wiki-content-body-border-color: var(--wiki-content-border-color);
--wiki-navigation-background-color: var(--wiki-content-background-color--secondary);
--wiki-navigation-border-color: var(--wiki-navigation-selected-border-color);
--wiki-navigation-text-color: var(--wiki-content-link-color);
--wiki-navigation-selected-background-color: var(--wiki-content-background-color);
--wiki-navigation-selected-border-color: var(--wiki-content-border-color);
--wiki-navigation-selected-text-color: var(--wiki-content-text-color);
--wiki-table-background-color: var(--wiki-content-background-color);
--wiki-table-header-background-color: var(--wiki-content-background-color--secondary);
--wiki-table-text-color: var(--wiki-content-text-color);
--wiki-table-link-color: var(--wiki-content-link-color);
--wiki-table-redlink-color: var(--wiki-content-redlink-color);
--wiki-table-header-text-color: var(--wiki-table-text-color);
--wiki-table-header-link-color: var(--wiki-content-link-color);
--wiki-table-border-color: var(--wiki-content-border-color);
--wiki-neutral-color: var(--wiki-content-text-mix-color);
--wiki-alert-color: #ff576a;
--wiki-warning-color: #cf721c;
--wiki-success-color: #13aa45;
--wiki-body-dynamic-color: #ffffff;
--wiki-body-dynamic-color--inverted: #000000;
--wiki-body-dynamic-color--secondary: #cccccc;
--wiki-body-dynamic-color--secondary--inverted: #333333;
--wiki-content-border-color--secondary: color-mix(in srgb, var(--wiki-content-border-color) 50%, transparent);
--wiki-content-border-color--accent: color-mix(in srgb, var(--wiki-accent-color) 50%, transparent);
--wiki-content-link-label-color: #000;
--wiki-content-dynamic-color: #ffffff;
--wiki-content-dynamic-color--inverted: #000000;
--wiki-content-dynamic-color--secondary: #cccccc;
--wiki-content-dynamic-color--secondary--inverted: #333333;
--wiki-alert-label-color: #000000;
--wiki-warning-label-color: #000000;
--wiki-success-label-color: #000000;
--wiki-icon-general-filter: invert(100%);
}
/*----------------------------------------
***** END ADVANCED COLOR VARIABLES *******
*****************************************/
/*****************************************
**** START ADVANCED DESIGN VARIABLES *****
----------------------------------------*/
:root {
--wiki-logo-height: calc(var(--wiki-logo-file-height)*1px);
--wiki-logo-margin: 15px;
--wiki-content-firstheading-font-family: var(--wiki-content-heading-font-family);
--wiki-page-content-max-width: 9999px;
--wiki-gap-between-sidebar-and-content: 1em;
--wiki-sidebar-offset: 0px;
--wiki-sidebar-width: 10em;
--wiki-sidebar-portal-spacing: 0px;
--wiki-spacing-before-footer: 0px;
--wiki-top-spacing: calc(var(--wiki-is-top-logo)*var(--wiki-logo-margin) + (1 - var(--wiki-is-top-logo))*1em);
--wiki-left-spacing: 1em;
--wiki-right-spacing: 1em;
--wiki-bottom-spacing: 2em;
--wiki-content-top-spacing:1.25em;
--wiki-content-left-spacing:1.5em;
--wiki-content-right-spacing:1.5em;
--wiki-content-bottom-spacing:1.5em;
}
/*----------------------------------------
***** END ADVANCED DESIGN VARIABLES ******
*****************************************/
/*******************************
**** START SHARED VARIABLES ****
**** tl;dr: don't edit this ****
********************************/
:root {
--wiki-accent-color--hover: color-mix(in srgb, var(--wiki-accent-color) 90%, var(--wiki-accent-label-color));
--wiki-logo-offset-x: 0px;
--wiki-logo-offset-y: 0px;
--wiki-logo-filter: invert(var(--wiki-logo-invert, 0)) hue-rotate(calc(var(--wiki-logo-invert, 0)*180deg));
--wiki-border-style: solid;
--wiki-border-image: none;
--wiki-backdrop-filter: none;
--wiki-content-border-width: var(--wiki-border-width);
--wiki-content-border-color: var(--wiki-border-color);
--wiki-content-border-style: var(--wiki-border-style);
--wiki-content-border-radius: var(--wiki-border-radius);
--wiki-content-border-image: var(--wiki-border-image);
--wiki-content-backdrop-filter: var(--wiki-backdrop-filter);
--wiki-content-border-top-radius: var(--wiki-content-border-radius);
--wiki-content-border-bottom-width: calc(min(var(--wiki-content-border-width), 1px));
--wiki-content-border-bottom-style: var(--wiki-content-border-style);
--wiki-content-border-bottom-color: var(--wiki-content-border-color);
--wiki-content-text-mix-color: color-mix(in srgb, var(--wiki-content-background-color), var(--wiki-content-text-color) 62%);
--wiki-content-text-mix-color-95: color-mix(in srgb, var(--wiki-content-background-color) 95%, var(--wiki-content-text-color));
--wiki-content-text-color--hover: var(--wiki-content-text-color);
--wiki-sidebar-border-width: var(--wiki-border-width);
--wiki-sidebar-border-color: var(--wiki-border-color);
--wiki-sidebar-border-style: var(--wiki-border-style);
--wiki-sidebar-border-radius: var(--wiki-border-radius);
--wiki-sidebar-border-image: var(--wiki-border-image);
--wiki-sidebar-background-color: var(--wiki-content-background-color);
--wiki-sidebar-background-opacity: var(--wiki-content-background-opacity);
--wiki-sidebar-background-image: none;
--wiki-sidebar-background-position: center;
--wiki-sidebar-background-repeat: repeat;
--wiki-sidebar-background-size: auto;
--wiki-sidebar-backdrop-filter: var(--wiki-backdrop-filter);
--wiki-sidebar-box-shadow: none;
--wiki-sidebar-filter: none;
--wiki-sidebar-font-size: 0.75em;
--wiki-sidebar-line-height: 1.125;
--wiki-sidebar-heading-font-size: 0.75em;
--wiki-sidebar-margin: 0em;
--wiki-sidebar-padding: 0px;
--wiki-sidebar-link-color: var(--wiki-content-link-color);
--wiki-sidebar-icon-to-link-filter: var(--wiki-icon-to-link-filter);
--wiki-sidebar-link-color--hover: var(--wiki-content-link-color--hover);
--wiki-sidebar-heading-color: var(--wiki-content-heading-color);
--wiki-sidebar-heading-font-weight: normal;
--wiki-sidebar-heading-font-style: normal;
--wiki-sidebar-heading-text-transform: none;
--wiki-sidebar-heading-line-height: normal;
--wiki-sidebar-heading-padding: 0.5rem 0.25rem 0.5rem 0.5rem;
--wiki-sidebar-heading-margin: 0px 0px -0.5rem 0px;
--wiki-sidebar-heading-background: none;
--wiki-sidebar-heading-border-image: none;
--wiki-sidebar-heading-text-shadow: none;
--wiki-sidebar-list-margin: 0px;
--wiki-sidebar-list-padding: 0.25rem;
--wiki-sidebar-list-border-image: none;
--wiki-sidebar-list-background: none;
--wiki-sidebar-list-item-padding: 0.25em 0.25rem;
--wiki-sidebar-list-item-spacing: 0px;
--wiki-sidebar-list-item-border-image: none;
--wiki-sidebar-list-item-border-image--hover: none;
--wiki-sidebar-list-item-background: none;
--wiki-sidebar-list-item-background--hover: none;
--wiki-sidebar-box-padding: 0px;
--wiki-sidebar-box-border: 0px;
--wiki-sidebar-box-border-radius: var(--wiki-sidebar-border-radius);
--wiki-sidebar-box-border-image: none;
--wiki-sidebar-box-background: none;
--wiki-footer-border-width: var(--wiki-content-border-width);
--wiki-footer-border-color: var(--wiki-content-border-color);
--wiki-footer-border-style: var(--wiki-content-border-style);
--wiki-footer-border-radius: var(--wiki-content-border-radius);
--wiki-footer-border-image: none;
--wiki-footer-background-color: var(--wiki-content-background-color);
--wiki-footer-background-opacity: var(--wiki-content-background-opacity);
--wiki-footer-backdrop-filter: var(--wiki-content-backdrop-filter);
--wiki-footer-text-color: var(--wiki-content-text-color);
--wiki-footer-link-color: var(--wiki-content-link-color);
--wiki-footer-link-color--hover: var(--wiki-content-link-color--hover);
--wiki-navigation-height: 2.75rem;
--wiki-navigation-left-spacing: calc( (1 - var(--wiki-is-navigation-inside-content))*var(--wiki-content-border-radius) + var(--wiki-is-navigation-inside-content) * 0.5rem );
--wiki-navigation-right-spacing: calc( var(--wiki-is-navigation-inside-content) * 0.5rem );
--wiki-navigation-selected-backdrop-filter: var(--wiki-content-backdrop-filter);
--wiki-navigation-backdrop-filter: var(--wiki-navigation-selected-backdrop-filter);
--wiki-navigation-box-border-image: none;
--wiki-navigation-box-background-color: var(--wiki-content-background-color);
--wiki-navigation-box-background-opacity: calc(var(--wiki-content-background-opacity)*0.8*var(--wiki-is-navigation-inside-content));
--wiki-navigation-box-background: color-mix(in srgb, var(--wiki-navigation-box-background-color) var(--wiki-navigation-box-background-opacity), transparent);
--wiki-navigation-box-backdrop-filter: none;
--wiki-navigation-font-size: 0.8125em;
--wiki-navigation-font-weight: normal;
--wiki-navigation-selected-font-weight: var(--wiki-navigation-font-weight);
--wiki-navigation-tab-spacing: 0.25em;
--wiki-navigation-tab-padding-top: 0.5em;
--wiki-navigation-tab-padding-bottom: 0.5em;
--wiki-navigation-tab-padding-x: 0.75em;
--wiki-navigation-icon-size: 1em;
--wiki-navigation-tab-padding-x--icon: var(--wiki-navigation-tab-padding-x);
--wiki-navigation-border-width: var(--wiki-navigation-selected-border-width);
--wiki-navigation-border-style: solid;
--wiki-navigation-border-radius: calc(var(--wiki-content-border-radius) - var(--wiki-is-navigation-inside-content)*2px);
--wiki-navigation-border-image: none;
--wiki-navigation-selected-border-width: calc( (1 - var(--wiki-is-navigation-inside-content))*var(--wiki-content-border-width) + var(--wiki-is-navigation-inside-content) * 1px );
--wiki-navigation-selected-border-style: solid;
--wiki-navigation-selected-border-bottom-background: none;
--wiki-navigation-selected-border-image: var(--wiki-navigation-border-image);
--wiki-navigation-border-color--hover: var(--wiki-navigation-border-color);
--wiki-navigation-border-image--hover: var(--wiki-navigation-border-image);
--wiki-navigation-border-bottom-color: var(--wiki-navigation-selected-border-color);
--wiki-navigation-border-bottom-color--hover: var(--wiki-navigation-border-color--hover);
--wiki-navigation-border-bottom-width: calc(var(--wiki-is-navigation-inside-content, 0) * var(--wiki-navigation-selected-border-width, 1px) + (1 - var(--wiki-is-navigation-inside-content, 0)) * var(--wiki-content-border-width, 1px));
--wiki-navigation-border-bottom-style: var(--wiki-navigation-selected-border-style);
--wiki-navigation-background-opacity: var(--wiki-navigation-selected-background-opacity);
--wiki-navigation-background-image: none;
--wiki-navigation-background-repeat: no-repeat, no-repeat, repeat-x;
--wiki-navigation-background-position: left bottom, right bottom, left bottom;
--wiki-navigation-background-size: 1px 100%, 1px 100%, 100%;
--wiki-navigation-selected-background-opacity: var(--wiki-content-background-opacity);
--wiki-navigation-selected-background-image: none;
--wiki-navigation-selected-background-repeat: no-repeat, no-repeat;
--wiki-navigation-selected-background-position: left bottom, right bottom;
--wiki-navigation-selected-background-size: 1px 100%, 1px 100%;
--wiki-navigation-background-color--hover: var(--wiki-navigation-background-color);
--wiki-navigation-background-opacity--hover: var(--wiki-navigation-background-opacity);
--wiki-navigation-background-image--hover: var(--wiki-navigation-background-image);
--wiki-navigation-background-position--hover: var(--wiki-navigation-background-position);
--wiki-navigation-background-repeat--hover: var(--wiki-navigation-background-repeat);
--wiki-navigation-background-size--hover: var(--wiki-navigation-background-size);
--wiki-navigation-text-transform: none;
--wiki-navigation-text-color--hover: var(--wiki-content-link-color--hover);
--wiki-navigation-text-shadow: none;
--wiki-navigation-selected-text-shadow: var(--wiki-navigation-text-shadow);
--wiki-navigation-text-shadow--hover: var(--wiki-navigation-text-shadow);
--wiki-navigation-filter: none;
--wiki-navigation-selected-filter: var(--wiki-navigation-filter);
--wiki-navigation-transform--hover: none;
--wiki-navigation-bottom-spacing: 0px;
--wiki-navigation-dropdown-offset: 0px;
--wiki-navigation-dropdown-text-color: var(--wiki-navigation-text-color);
--wiki-navigation-dropdown-text-color--hover: var(--wiki-navigation-dropdown-text-color);
--wiki-navigation-dropdown-font-size: var(--wiki-navigation-font-size);
--wiki-navigation-dropdown-border-color: var(--wiki-navigation-border-color);
--wiki-navigation-dropdown-border-width: 1px;
--wiki-navigation-dropdown-border-radius: var(--wiki-navigation-border-radius);
--wiki-navigation-dropdown-border-image: none;
--wiki-navigation-dropdown-padding: 0.25em;
--wiki-navigation-dropdown-item-padding: 0.625em;
--wiki-navigation-dropdown-item-background--hover: none;
--wiki-navigation-dropdown-background-color: var(--wiki-content-background-color);
--wiki-navigation-dropdown-background-opacity: var(--wiki-content-background-opacity);
--wiki-navigation-dropdown-backdrop-filter: none;
--wiki-navigation-dropdown-box-shadow: none;
--wiki-navigation-search-height: 2em;
--wiki-navigation-search-bottom-spacing: 3px;
--wiki-navigation-search-background-color: var(--wiki-content-background-color--secondary);
--wiki-navigation-search-background-image: none;
--wiki-navigation-search-background-position: 0;
--wiki-navigation-search-background-size: auto;
--wiki-navigation-search-background-repeat: repeat;
--wiki-navigation-search-backdrop-filter: none;
--wiki-navigation-search-border-color: var(--wiki-navigation-border-color);
--wiki-navigation-search-border-color--hover: var(--wiki-accent-color);
--wiki-navigation-search-border-width: 1px;
--wiki-navigation-search-border-style: solid;
--wiki-navigation-search-border-radius: 2px;
--wiki-navigation-search-border-image: none;
--wiki-navigation-search-border-image--hover: var(--wiki-navigation-search-border-image);
--wiki-navigation-search-box-shadow: none;
--wiki-navigation-search-box-shadow--hover: var(--wiki-navigation-search-box-shadow);
--wiki-navigation-search-text-color: var(--wiki-content-text-color);
--wiki-navigation-search-font-size: var(--wiki-navigation-font-size);
--wiki-navigation-search-button-color: currentColor;
--wiki-navigation-search-button-color--hover: var(--wiki-navigation-search-button-color);
--wiki-navigation-search-button-color-opacity: 80%;
--wiki-navigation-search-button-color-opacity--hover: 95%;
--wiki-navigation-search-highlight-background-color: color-mix(in srgb, var(--wiki-accent-color) 5%, transparent);
--wiki-navigation-gap-between-left-and-right: calc(max(0px, var(--wiki-navigation-tab-spacing)));
--wiki-content-heading-border-bottom-width: 1px;
--wiki-content-heading-border-style: solid;
--wiki-content-heading-font-weight: normal;
--wiki-content-heading-font-style: normal;
--wiki-content-heading-line-height: normal;
--wiki-content-heading-text-transform: none;
--wiki-content-heading-text-shadow: none;
--wiki-content-firstheading-font-size: 1.8em;
--wiki-content-heading-h2-font-size: 1.5em;
--wiki-content-heading-h3-font-size: 1.2em;
--wiki-content-heading-h4-font-size: 114%;
--wiki-content-heading-h5-font-size: 108%;
--wiki-content-heading-h6-font-size: 100%;
--wiki-content-firstheading-border-bottom-width: var(--wiki-content-heading-border-bottom-width);
--wiki-content-firstheading-border-color: var(--wiki-content-heading-border-color);
--wiki-content-firstheading-border-style: var(--wiki-content-heading-border-style);
--wiki-content-firstheading-color: var(--wiki-content-heading-color);
--wiki-content-firstheading-font-weight: var(--wiki-content-heading-font-weight);
--wiki-content-firstheading-font-style: var(--wiki-content-heading-font-style);
--wiki-content-firstheading-line-height: var(--wiki-content-heading-line-height);
--wiki-content-firstheading-text-transform: var(--wiki-content-heading-text-transform);
--wiki-content-firstheading-text-shadow: none;
--wiki-content-subheading-border-bottom-width: 0px;
--wiki-content-subheading-border-color: var(--wiki-content-heading-border-color);
--wiki-content-subheading-border-style: var(--wiki-content-heading-border-style);
--wiki-content-subheading-color: var(--wiki-content-heading-color);
--wiki-content-subheading-font-family: var(--wiki-body-font-family);
--wiki-content-subheading-font-weight: bold;
--wiki-content-subheading-font-style: normal;
--wiki-content-subheading-line-height: var(--wiki-content-heading-line-height);
--wiki-content-subheading-text-transform: none;
--wiki-content-subheading-text-shadow: none;
--wiki-content-toc-border-width: 1px;
--wiki-content-toc-border-color: var(--wiki-content-body-border-color);
--wiki-content-toc-border-style: solid;
--wiki-content-toc-border-radius: 0px;
--wiki-content-toc-border-image: none;
--wiki-content-toc-background: var(--wiki-content-background-color--secondary);
--wiki-content-toc-box-shadow: none;
--wiki-content-toc-heading-font-family: var(--wiki-body-font-family);
--wiki-content-catlinks-border-width: 1px;
--wiki-content-catlinks-border-color: var(--wiki-content-body-border-color);
--wiki-content-catlinks-border-style: solid;
--wiki-content-catlinks-border-radius: 0px;
--wiki-content-catlinks-border-image: none;
--wiki-content-catlinks-background: var(--wiki-content-background-color--secondary);
--wiki-content-catlinks-box-shadow: none;
--wiki-content-filetoc-border-width: 1px;
--wiki-content-filetoc-border-color: var(--wiki-content-body-border-color);
--wiki-content-filetoc-border-style: solid;
--wiki-content-filetoc-border-radius: 0px;
--wiki-content-filetoc-border-image: none;
--wiki-content-filetoc-background: var(--wiki-content-background-color--secondary);
--wiki-content-filetoc-box-shadow: none;
}
@media screen and (max-width: 720px) {
:root:root,
:root.view-light {
--wiki-page-content-max-width: 9999px;
--wiki-logo-offset-x: 0px;
--wiki-logo-offset-y: 0px;
}
:root.view-dark{
/* for dark themes */
}
body.has-vector-mobile-menu{
--wiki-sidebar-offset: 0px;
--wiki-sidebar-margin: 0px;
--wiki-sidebar-heading-background: none;
--wiki-sidebar-heading-border-image: none;
--wiki-sidebar-heading-margin: 0px 0px -0.5em 0px;
--wiki-sidebar-list-margin: 0px;
--wiki-sidebar-list-background: none;
--wiki-sidebar-list-border-image: none;
--wiki-sidebar-list-item-background: none;
--wiki-sidebar-list-item-border-image: none;
--wiki-sidebar-list-item-background--hover: none;
--wiki-sidebar-list-item-border-image--hover: none;
--wiki-sidebar-list-item-spacing: 0px;
--wiki-sidebar-line-height: 1.125;
--wiki-sidebar-background-opacity: 100%;
--wiki-navigation-search-border-width: 1px;
}
}
/*****************************
**** END SHARED VARIABLES ****
******************************/
/******************************
* Fallback for older browsers *
* DONT EDIT THIS *
*******************************/
@supports not (color:color-mix(in srgb, #000, transparent)) {
.view-dark,
.view-light,
:root {
--wiki-content-text-mix-color: var(--wiki-content-text-color);
--wiki-content-text-mix-color-95: var(--wiki-content-background-color);
--wiki-content-background-color--secondary: var(--wiki-content-dynamic-color--secondary--inverted);
--wiki-content-border-color--secondary: var(--wiki-content-border-color);
--wiki-content-border-color--accent: var(--wiki-accent-color);
--wiki-accent-color--hover: var(--wiki-accent-color);
--wiki-navigation-search-highlight-background-color: transparent;
}
}
/*****************************
* PortableInfoboxes *
******************************/
:root {
--pi-background: var(--wiki-content-background-color);
--pi-secondary-background: var(--wiki-accent-color);
--pi-secondary-background-label: var(--wiki-accent-label-color);
--pi-border-color: color-mix(in srgb, var(--pi-secondary-background) 50%, transparent);
}
.portable-infobox .pi-title,
.portable-infobox .pi-header {
text-align: center;
font-size: 1.5em;
background: color-mix(in srgb, var(--pi-secondary-background) 75%, transparent);
color: var(--pi-secondary-background-label);
}
.portable-infobox .pi-data,
.portable-infobox .pi-group {
background: var(--wiki-content-background-color--secondary);
}
.portable-infobox .pi-image {
padding: 8px;
}
.pi-image-thumbnail {
max-width: 100%;
}
.pi-caption {
color: var(--wiki-content-text-mix-color);
}
.pi-section-navigation .pi-section-tab.pi-section-active,
.pi-section-navigation .pi-section-tab.current,
.pi-media-collection .pi-tab-link.current {
background: var(--pi-secondary-background);
color: var(--pi-secondary-background-label);
}
.pi-collapse > .pi-item:first-child {
cursor: pointer;
}
.mw-body .portable-infobox h2,
.mw-body .portable-infobox h3 {
border-bottom: 0;
font-family: inherit;
font-weight: 700;
margin: 0;
}
/***********************
* MP link *
************************/
.mp-links {
--gap: 10px;
--mp-link-nested-indent: 1.5em;
}
.mp-links ul {
display: flex;
flex-flow: row wrap;
justify-content: space-evenly;
margin: 2px;
gap: var(--gap);
}
.mp-links ul > li {
display: flex;
flex-flow: column nowrap;
align-items: stretch;
text-align: center;
box-sizing: border-box;
flex: max(calc(50% - var(--gap)), 5em) 1 1;
outline: 1px solid var(--wiki-content-link-color);
transition: 0.1s ease-in;
}
.mp-links.columns-1 ul > li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}
.mp-links.columns-2 ul > li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}
.mp-links.columns-3 ul > li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}
.mp-links.columns-4 ul > li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}
.mp-links.columns-5 ul > li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}
.mp-links.columns-6 ul > li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}
.mp-links.columns-7 ul > li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}
.mp-links.columns-8 ul > li {flex: max(calc((100% / 8) - var(--gap)), 5em) 1 1;}
.mp-links.columns-max ul > li {flex: max(calc(0% - var(--gap)), 5em) 1 1;}
.mp-links ul > li > a {
display: flex;
align-items: center;
justify-content: center;
flex: 1 1 auto;
box-sizing: border-box;
padding: 5px;
}
.mp-links ul > li:has(> a:hover) > a {
background-color: color-mix(in srgb, var(--wiki-content-link-color) 20%, transparent);
text-decoration: underline;
}
.mp-links ul > li > ul {
margin:var(--gap);
flex:0 0 100%;
max-width:calc(100% - (var(--gap) * 2));
padding: calc(var(--gap) * 2) 0;
padding-left:var(--mp-link-nested-indent);
box-sizing:border-box;
}
.mp-links ul > li > ul > li {
margin-right:calc(var(--gap) * 2);
}
.mp-links:not(.plain) ul > li > ul {
background-color:var(--background-color-interactive);
}
.mp-links.stretch,
.mp-links.stretch ul {
height: 100%;
}
.mp-links.plain ul > li {
outline-width: 0px;
}
.mp-links.side-image li {
flex-flow: row wrap;
}
.mp-links.side-image.left li a {
justify-content: flex-start;
}
.mp-links.side-image.left li a:first-child:not(:only-child) {
flex:0 0 auto;
}
.mp-links.side-image.right li {
flex-direction:row-reverse
}
.mp-links.side-image.right li a {
justify-content: flex-end;
}
.mp-links.side-image.right li a:first-child:not(:only-child) {
flex:0 0 auto;
}
.mp-links.side-image.center li a {
flex-basis:50%;
}
.mp-links.side-image.center li a:first-child {
justify-content:flex-end;
}
.mp-links.side-image.center li a:first-child img {
margin:initial;
}
.mp-links.side-image.center li a:last-child {
justify-content: flex-start;
}
.mp-links.side-image.center li a:only-child {
justify-content:center;
}
/*********************************************************************************************************************
* Semantically-correct horizontal lists (for Module:Navbox)
**********************************************************************************************************************/
.hlist dl,
.hlist ol,
.hlist ul {
margin: 0;
padding: 0;
}
.hlist dd,
.hlist dt,
.hlist li {
margin: 0;
display: inline;
}
.hlist.inline,
.hlist.inline dl,
.hlist.inline ol,
.hlist.inline ul,
.hlist dl dl,
.hlist dl ol,
.hlist dl ul,
.hlist ol dl,
.hlist ol ol,
.hlist ol ul,
.hlist ul dl,
.hlist ul ol,
.hlist ul ul {
display: inline;
}
.hlist .mw-empty-li {
display: none;
}
.hlist dt:not(:last-child)::after {
content: ":\20";
}
.hlist dd:not(:last-child)::after,
.hlist li:not(:last-child)::after {
content: "\20\A0\2022\A0\20";
font-weight: inherit;
}
.hlist dd ol::before,
.hlist dd ul::before,
.hlist dd dl::before,
.hlist dt ol::before,
.hlist dt ul::before,
.hlist dt dl::before,
.hlist li ol::before,
.hlist li ul::before,
.hlist li dl::before {
content: "\20(";
font-weight: inherit;
}
.hlist dd ol::after,
.hlist dd ul::after,
.hlist dd dl::after,
.hlist dt ol::after,
.hlist dt ul::after,
.hlist dt dl::after,
.hlist li ol::after,
.hlist li ul::after,
.hlist li dl::after {
content: ")";
font-weight: inherit;
}
.hlist ol {
counter-reset: listitem;
}
.hlist ol > li {
counter-increment: listitem;
}
.hlist ol > li::before {
content: " " counter(listitem) ".\20";
}
.hlist :is(li,dt,dd):not(:has(:is(li,dt,dd))) {
display: inline-block;
}
/*** Miscellaneous ***/
.responsive-image {
max-width: 100%;
height: auto;
box-sizing: border-box;
}
.view-dark .invert-on-dark,
.view-light .invert-on-light {
filter: invert(100%);
}
.pixelated {
image-rendering: pixelated;
}
@media screen and (min-width: 720px) {
.mobileonly {
display: none;
}
}
@media screen and (max-width: 720px) {
.nomobile {
display: none;
}
}
/*** Utility classes for standard MW galleries ***/
.gallery.gallery.gallery.spaced {
display: flex;
flex-flow: row wrap;
justify-content: space-evenly;
margin-left: unset;
}
.gallery.centered {
text-align: center;
}
* Ambox */
.ambox {
--ambox-color: var(--wiki-accent-color);
border: 1px solid var(--wiki-content-border-color);
border-left: 10px solid var(--ambox-color);
border-radius: 2px;
display: flex;
align-items: center;
gap: .6em;
margin: 1em 0;
padding: 3px .6em;
background-color: var(--wiki-content-background-color--secondary);
box-shadow: 2px 2px 5px 0px #0002;
}
@media (min-width: 720px) {
.ambox {
margin-inline: 10%;
}
}
.ambox.tiny {
padding: .04rem .5em;
margin-inline: 0;
width: fit-content;
}
.ambox + .ambox {
margin-top: -.6em;
}
.ambox-content {
flex: 1;
}
.ambox-content p {
margin: .15em 0;
}
.ambox-title {
font-weight: bold;
}
* Hatnote */
.hatnote {
padding: 1px 0 1px 1.6em;
margin-bottom: 0.5em;
font-style: italic;
border-top: 1px solid var(--wiki-content-border-color--secondary);
border-bottom: 1px solid var(--wiki-content-border-color--secondary);
}
.hatnote.icon {
padding-left: 0;
}
* Spoiler */
.spoiler-content {
background-color: color-mix(in srgb, var(--wiki-content-dynamic-color) 50%, transparent);
transition: all 0.3s;
cursor: pointer;
overflow: auto;
}
@supports not (color:color-mix(in srgb, #000, transparent)) {
.spoiler-content {
background-color: var(--wiki-content-dynamic-color--secondary);
}
}
.spoiler-content > * {
pointer-events: none;
opacity: 0;
transition: all 0.3s;
}
.spoiler-content.show {
background-color: transparent;
}
.spoiler-content.show > * {
pointer-events: unset;
opacity: 1;
}
* Link icon */
.link-icon {
--link-icon-line-height: 1.5em;
--link-icon-size: 1.5em;
display: inline-flex;
align-items: center;
height: var(--link-icon-line-height);
vertical-align: bottom;
}
.link-icon .regular {
align-self: center;
}
.link-icon .regular a {
display: flex;
}
.link-icon .regular img {
height: var(--link-icon-size);
max-width: var(--link-icon-size);
}
.link-icon .fallback {
outline: 1px solid var(--wiki-content-text-color);
border-radius: 50%;
text-align: center;
width: var(--link-icon-size);
line-height: var(--link-icon-size);
}
.link-icon.notext,
.link-icon.notext .fallback {
display: inline-block;
}
* Quote */
.quote {
background: var(--wiki-content-background-color--secondary);
border-radius: 5px;
border: 2px solid var(--wiki-content-border-color);
margin: .5em 0;
padding: .5em;
overflow-y: hidden;
}
.quote .block {
display: block;
}
.quote .title {
font-size: large;
font-weight: bold;
}
.quote .author {
font-weight: bold;
text-align: end;
}
.quote .marks-wrapper {
display: flex;
gap: 5px;
}
.quote .marks-wrapper::before,
.quote .marks-wrapper::after {
font-size: 100px;
line-height: 0px;
}
.quote .marks-wrapper::before {
content: "\201C";
margin-top: 40px;
}
.quote .marks-wrapper::after {
content: "\201D";
align-self: end;
margin-bottom: -10px;
}
.client-js .mw-charinsert-item {
display: none;
}
/*****************************
* Color *
******************************/
.color__splotch {
display: inline-block;
height: 1em;
width: 1em;
box-sizing: border-box;
vertical-align: text-top;
border-radius: 50%;
border: 1px solid var(--wiki-content-text-color);
}
/*********************************
* TOC limit *
**********************************/
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul {
display: none;
}
/*********************************
* TOC right *
**********************************/
@media all and (min-width: 720px) {
.tocright {
float: right;
clear: right;
margin: 0 0 0.5em 1em;
}
}
/*********************************
* key *
**********************************/
kbd.key{
filter: drop-shadow(0 0 1px #808080);
}
/*********************************
* Nowrap *
**********************************/
.nowrap{
white-space: nowrap;
}
/* --- Factory Town 2: Paradise Wiki site theming --- */
:root {
--ft2-accent: #2e7d32;
--ft2-accent-dark: #1b5e20;
--ft2-card-bg: #ffffff;
--ft2-card-border: #dcdcdc;
--ft2-card-shadow: rgba(0, 0, 0, 0.08);
--ft2-text: #202122;
}
/* "Game Navigation" icon grid on the Main Page (MediaWiki <gallery> tag) */
.gallery {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 16px;
margin: 20px 0;
border: none !important;
}
.gallery .gallerybox {
width: 130px !important;
text-align: center;
background: var(--ft2-card-bg);
border: 1px solid var(--ft2-card-border);
border-radius: 10px;
padding: 12px 8px;
box-shadow: 0 1px 3px var(--ft2-card-shadow);
transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.gallery .gallerybox:hover {
transform: translateY(-3px);
box-shadow: 0 6px 14px var(--ft2-card-shadow);
border-color: var(--ft2-accent);
}
.gallery .gallerybox .thumb {
background: transparent !important;
border: none !important;
display: flex;
justify-content: center;
align-items: center;
min-height: 64px;
}
.gallery .gallerybox img {
max-width: 56px;
max-height: 56px;
object-fit: contain;
}
.gallery .gallerytext {
font-weight: 600;
font-size: 0.95em;
margin-top: 8px;
color: var(--ft2-text);
}
.gallery .gallerytext a {
color: var(--ft2-text);
text-decoration: none;
}
.gallery .gallerybox:hover .gallerytext a {
color: var(--ft2-accent-dark);
}
/* Sidebar section headings */
.vector-menu-heading,
.mw-portlet-head {
color: var(--ft2-accent-dark) !important;
font-weight: 700 !important;
text-transform: uppercase;
font-size: 0.8em;
letter-spacing: 0.03em;
}
/* General link color */
a {
color: var(--ft2-accent-dark);
}
a:visited {
color: var(--ft2-accent);
}
/* Main page welcome box */
.ft2-welcome {
background: #f6f8f6;
border: 1px solid var(--ft2-card-border);
border-radius: 10px;
padding: 16px 20px;
margin-bottom: 20px;
}
/* --- Page background + top banner spacing --- */
body {
background-image: url("https://factorytown2.com/images/d/de/Site_background.jpg");
background-size: cover;
background-position: top center;
background-repeat: no-repeat;
background-attachment: fixed;
}
/* Pushes the visible page content down, revealing the background/logo
area above it. Adjust the height (140px here) to taste -- this is
the "recessed" gap you saw on the source site. */
#content,
.mw-page-container {
margin-top: 800px;
}
/* Optional: place your logo centered in that new top gap.
Requires uploading a logo image the same way as the background,
then swapping the URL below. Remove this block if you'd rather
just use MediaWiki's standard sidebar logo ($wgLogos in
LocalSettings.php) and only want the background banner above. */
body::before {
content: "";
display: block;
position: absolute;
top: 20px;
left: 50%;
transform: translateX(-50%);
width: 160px;
height: 100px;
background-image: url("https://factorytown2.com/images/d/de/Site_background.jpg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
pointer-events: none;
}