MediaWiki:Common.css
Jump to navigation
Jump to search
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.
/***** CSS placed here is applied to all skins on the entire site. *****/
/* Web design by Enenra for the Space Engineers community */
@import url('https://fonts.googleapis.com/css?family=Saira:400,500,700');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,500,700');
:root {
/* Colors */
--text: hsl(0, 0%, 7%);
--text-highlight: hsl(0, 0%, 0%);
--content-background: hsla(0, 0%, 100%, .5);
--button-stroke: hsl(60, 1%, 75%);
--button-fill: hsla(60, 1%, 75%, .75);
--box-background: hsla(40, 4%, 86%, .85);
--table-row-background: rgba(207, 209, 211, .85);
--highlight: rgb(0, 192, 253);
--highlight-hover: rgba(0, 192, 253, .85);
--highlight-active: rgba(0, 192, 253, .65);
--info: hsl(54, 50%, 50%);
--positive: hsl(144, 50%, 50%);
--negative: hsl(0, 50%, 50%);
--warning: hsl(22, 100%, 50%);
--mathtable-text: rgb(33, 33, 33);
--mathtable-background: rgb(204, 204, 204);
--kbd-background: rgb(204, 204, 204);
/* Whitespace */
--margin-standard: 30px;
--sidebar-width: 200px;
--header-buttons-separation: 10px;
/* Background */
--background-image: url(/images/9/93/Wikibackground_lightmode.png);
--background-blur: 20px;
/* Icons */
--icon-arrow-right: url(https://spaceengineers.wiki.gg/images/4/42/Arrow-right-white.svg);
--icon-link-external: url(https://spaceengineers.wiki.gg/images/9/96/Link-external-small-ltr-progressive.svg);
--icon-edit: url(https://spaceengineers.wiki.gg/images/3/30/Edit.svg);
--icon-magnify: url(/images/f/fd/Magnify.svg);
/* Buttons */
--graphic-nav-default: url(/images/7/77/Nav_default_lightmode.svg);
--graphic-button-bcitem-default: url(/images/2/21/Graphic_button-bcitem-default-lightmode.svg);
--graphic-nav-hover: url(/images/d/d7/Nav_hover.svg);
--graphic-nav-active: url(/images/3/38/Nav_active.svg);
--icon-notebox-note: url(/images/1/1c/Icon_notebox_note.svg);
--icon-notebox-info: url(/images/2/2b/Icon_notebox_info_lightmode.svg);
--icon-notebox-warning: url(/images/b/b4/Icon_notebox_warning.svg);
--icon-notebox-error: url(/images/4/47/Icon_notebox_error_lightmode.svg);
--icon-learnings-included: url(/images/b/b1/Icon_learnings_included_lightmode.svg);
--icon-learnings-excluded: url(/images/2/27/Icon_learnings_excluded_lightmode.svg);
--icon-prerequisites: url(/images/3/33/Icon_prerequisites.svg);
--icon-page-generic: url(/images/6/6e/Icon_page_generic.svg);
--icon-sidebar-menu: url(/images/2/22/Sidebar_menu_icon-lightmode.svg);
--graphic-button-bcstart-default: url(/images/a/a6/Graphic_button-bcstart-default-lightmode.svg);
--graphic-button-bcstart-hover: url(/images/5/50/Graphic_button-bcstart-hover.svg);
--graphic-button-bcstart-active: url(/images/b/b2/Graphic_button-bcstart-active.svg);
--graphic-button-bcitem-default: url(/images/2/21/Graphic_button-bcitem-default-lightmode.svg);
--graphic-button-header-corners-default: url(/images/1/11/Graphic_button_header_corners_default_lightmode.svg);
--graphic-button-header-corners-hover: url(/images/e/ed/Graphic_button_header_corners_hover.svg);
--graphic-button-header-corners-active: url(/images/e/ed/Graphic_button_header_corners_hover.svg);
--graphic-nav-hover: url(/images/d/d7/Nav_hover.svg);
--graphic-button-bcitem-hover: url(/images/d/d6/Graphic_button-bcitem-hover.svg);
--graphic-button-bcitem-active: url(/images/e/e9/Graphic_button-bcitem-active.svg);
--graphic-box-corner-left: url(/images/5/5f/Graphic_box_corner.svg);
--graphic-box-corner-right: url(/images/c/c7/Graphic_box_corner_right.svg);
--graphic-bulletpoint: url(/images/0/08/Bulletpoint.svg);
/* Text */
--text-p-size: 1.125rem;
--text-table-size: 1rem;
--text-h1-size: 2rem;
--text-h2-size: 1.625rem;
--text-h3-size: 1.375rem;
--text-h4-size: 1.125rem;
--text-h5-size: 1.125rem;
--text-h6-size: 1.125rem;
--text-sidebar-labels-size: 1rem;
--text-h1-weight: 700;
--text-h2-weight: 500;
--text-h3-weight: 400;
--text-h4-weight: 400;
--text-h5-weight: 400;
--text-h6-weight: 400;
--text-sidebar-labels-weight: 400;
/* Code Display */
--code-editor-background: hsl(0, 0%, 86%);
--text-code-comment: hsl(0, 0%, 35%);
--text-code-root: hsl(206, 62%, 36%);
--text-code-variables: hsl(208, 100%, 35%);
--text-code-defs: hsl(0, 0%, 15%);
--text-code-int: hsl(134, 84%, 20%);
--text-code-float: hsl(134, 84%, 20%);
--text-code-unit: hsl(134, 84%, 20%);
--text-code-link: hsl(29, 100%, 39%);
--text-code-url: hsl(0, 0%, 20%);
--text-code-var: hsl(0, 0%, 15%);
--text-code-string: hsl(21, 86%, 36%);
--text-code-property: hsl(0, 0%, 20%);
--text-code-classes: hsl(29, 100%, 39%);
--text-code-id: hsl(198, 42%, 35%);
--text-code-expr: hsl(134, 84%, 20%);
}
/* Signal to browsers when dark mode is being used */
html.view-dark {
color-scheme: dark;
}
/*--- Left Navigation: logo ---*/
#p-logo, #p-logo a {
object-fit: contain;
max-width: 170px;
background-position: center top;
background-size: 100%;
margin-top: -50px;
margin-bottom: -75px;
}
body {
background-image: var(--background-image);
background-color: var(--content-background);
background-attachment: fixed;
background-size: cover;
background-repeat: repeat;
background-position: left top;
}
.thumbimage {
background:inherit;
}
/* General */
.content-wrapper {
max-width: 1920px;
display: block;
margin-left: auto;
margin-right: auto;
margin-top: 55px;
}
.mw-body {
padding: var(--margin-standard);
margin-left: var(--sidebar-width);
border: hidden;
backdrop-filter: blur(var(--background-blur));
background-color: var(--content-background);
}
#mw-page-base, #mw-content-text, .vector-body, p {
background: none;
}
/* ------------------------- Header Start ------------------------- */
#mw-head {
max-width: 1920px;
left: 0;
margin: 0 auto;
margin-top: 50px;
}
#mw-head a {
background: none;
font-family: 'Saira', sans-serif;
font-size: var(--text-sidebar-labels-size);
text-transform: uppercase;
color: var(--text-highlight);
padding: 0;
height: 30px;
width: 140px;
line-height: 1.85em;
text-align: center;
}
#mw-head a:hover {
text-decoration: none;
}
#mw-head .vector-menu-content ul li {
position: relative;
background: var(--button-fill);
backdrop-filter: blur(var(--background-blur));
border: 1px solid var(--button-stroke);
margin-right: var(--header-buttons-separation);
height: 28px;
width: 138px;
}
#mw-head .vector-menu-content ul li::before {
content: "";
position: absolute;
top: -2px;
left: -2px;
background-image: var(--graphic-button-header-corners-default);
height: 32px;
width: 142px;
}
#mw-head .vector-menu-content ul li:hover {
background: var(--highlight-hover);
border-color: var(--highlight);
}
#mw-head .vector-menu-content ul li:hover::before {
background-image: var(--graphic-button-header-corners-hover);
}
#mw-head .vector-menu-content .selected {
background: var(--highlight-active);
border-color: var(--highlight);
}
#mw-head .vector-menu-content .selected::before {
background-image: var(--graphic-button-header-corners-active);
}
#mw-head .vector-menu-dropdown .vector-menu-content {
background: none;
border: none;
}
#mw-head #left-navigation {
margin-left: var(--sidebar-width);
}
#mw-head #left-navigation #p-namespaces {
background: none;
}
#mw-head #right-navigation {
margin-right: var(--margin-standard);
}
#mw-head #right-navigation #p-views, #mw-head #right-navigation #p-cactions-label {
background: none;
}
#mw-head #right-navigation #ca-watch, #ca-unwatch {
background-image: none;
backdrop-filter: unset;
height: unset;
width: unset;
border: unset;
}
#mw-head #right-navigation #ca-watch::before, #ca-unwatch::before {
background-image: none;
}
#mw-head #right-navigation #ca-watch.icon, #ca-unwatch.icon {
background: none;
}
#mw-head #right-navigation #ca-watch.icon, #ca-unwatch.icon a {
font-size: 0;
height: unset;
width: unset;
background-color: var(--text-highlight);
--mask: url(/skins/Vector/resources/skins.vector.styles/images/watch-icon.svg?6ab6f) no-repeat;
mask: var(--mask);
mask-position: center center;
padding: 15px;
}
#mw-head #right-navigation #ca-watch.icon, #ca-unwatch.icon a:hover {
font-size: 0;
height: unset;
width: unset;
background-color: var(--highlight);
--mask: url(/skins/Vector/resources/skins.vector.styles/images/watch-icon.svg?6ab6f) no-repeat;
mask: var(--mask);
mask-position: center center;
padding: 15px;
}
#mw-head #right-navigation #ca-watch.icon, #ca-unwatch.icon a::before {
display: none;
}
#mw-head #right-navigation #ca-unwatch.icon a {
background-color: var(--highlight);
}
#mw-head #right-navigation #ca-unwatch.icon a:hover {
background-color: var(--text-highlight);
}
#mw-head #right-navigation #p-cactions .vector-menu-heading {
padding: 0;
}
#mw-head #right-navigation #p-cactions .vector-menu-heading::after {
opacity: 1;
background-image: none;
background-color: var(--text);
--mask: url(/skins/Vector/resources/skins.vector.styles/images/arrow-down.svg?9426f) no-repeat;
mask: var(--mask);
mask-position: center center;
padding-top: 12px;
padding-left: 5px;
}
#mw-head #right-navigation #p-cactions .vector-menu-heading-label {
font-family: 'Saira', sans-serif;
font-weight: 400;
line-height: 1.85em;
font-size: var(--text-sidebar-labels-size);
text-shadow: 2px 2px 5px var(--content-background);
}
#mw-head #right-navigation #p-cactions a {
font-family: 'Open Sans', sans-serif;
font-size: unset;
text-transform: unset;
color: var(--highlight);
padding: 10px;
line-height: unset;
text-align: unset;
}
#mw-head #right-navigation #p-cactions a:hover {
border: none;
color: var(--text-highlight);
text-decoration: underline;
}
#mw-head #right-navigation #p-cactions ul {
margin-top: 10px;
background: var(--box-background);
padding: 5px 5px 10px 5px;
}
#mw-head #right-navigation #p-cactions ul li {
background: none;
border: none;
backdrop-filter: unset;
}
#mw-head #right-navigation #p-cactions ul li::before {
background: none;
border: none;
backdrop-filter: unset;
position: relative;
top: unset;
left: unset;
height: unset;
width: unset;
margin: unset;
padding: unset;
}
#mw-head #right-navigation #p-search {
margin-right: 0;
}
#mw-head #right-navigation .vector-search-box form {
margin-top: 0;
}
#mw-head #right-navigation .vector-search-box form .vector-search-box-input {
background-color: var(--box-background);
border-color: var(--button-stroke);
border-radius: 0;
padding: 5px 30px 5px 5px;
box-shadow: none;
color: var(--text);
font-family: 'Open Sans', sans-serif;
font-size: 0.875rem;
}
#mw-head #right-navigation .vector-search-box form .searchButton[name=go] {
background: none;
--mask: url(/skins/Vector/resources/skins.vector.styles.legacy/images/search.svg?bbf78) no-repeat;
mask: var(--mask);
mask-size: 75% 75%;
mask-position: center center;
background-color: var(--text);
}
/* ------------------------- Header End ------------------------- */
/*---- Search Results start----*/
.mw-search-profile-tabs {
background-color: var(--box-background);
border: 1px dashed var(--button-stroke);
}
.search-types .current a {
color: var(--text);
}
/*---- Search Results end----*/
/* --- Version History Page Adjustments--- */
#pagehistory li.selected {
background-color: var(--box-background);
color: var(--text);
outline: 1px dashed var(--button-stroke);
}
/*---- Recent Changes page start ----*/
.mw-plusminus-pos {
color: var(--positive);
}
.mw-plusminus-neg {
color: var(--warning);
}
.mw-changeslist-legend, .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
float: right;
margin-left: 15px;
margin-bottom: 0.5em;
clear: right;
font-size: 1rem;
line-height: 1.2em;
padding: 10px;
border: 1px solid var(--button-stroke);
background-color: var(--content-background);
}
.mw-icon-arrow-collapsed, .mw-collapsible-arrow.mw-collapsible-toggle-collapsed {
background-image: none;
background-color: var(--highlight);
--mask: url(/resources/src/mediawiki.icon/images/arrow-collapsed-ltr.svg?40e9a) no-repeat;
mask: var(--mask);
mask-position: center center;
}
.mw-icon-arrow-expanded, .mw-collapsible-arrow.mw-collapsible-toggle-expanded {
background-image: none;
background-color: var(--text);
--mask: url(/resources/src/mediawiki.icon/images/arrow-collapsed-ltr.svg?40e9a) no-repeat;
mask: var(--mask);
mask-position: center center;
transform: rotate(90deg);
}
/*---- Recent Changes page end ----*/
/* Footnote highlight */
ol.references li:target{
color: var(--text);
background-color: var(--content-background);
}
::selection {
color: var(--text-highlight);
background-color: var(--highlight);
}
/* ---- start Link styles ---- */
.mw-parser-output a.external {
background-image: var(--icon-link-external);
}
a, a.mw-selflink, .mw-parser-output a.extiw, .mw-parser-output a.external {
color: var(--highlight);
text-decoration: none;
text-shadow: none;
}
a:visited , a.mw-selflink:visited, .mw-parser-output a.extiw:visited, .mw-parser-output a.external:visited {
color: var(--highlight);
}
a:hover, a.mw-selflink:hover, .mw-parser-output a.extiw:hover, .mw-parser-output a.external:hover {
color: var(--text-highlight);
text-decoration:underline var(--text-highlight);
text-shadow: none;
}
a:active, a.mw-selflink:active, .mw-parser-output a.extiw:active, .mw-parser-output a.external:active {
color: var(--text-highlight);
}
a.new {
color: var(--warning);
}
a.new:hover {
color: var(--text-highlight)
}
a.new:visited {
color: var(--warning);
}
a.new:visited:hover {
color: var(--text-highlight);
}
.mw-editsection .mw-editsection-bracket {
display: none;
}
.mw-editsection a {
position: relative;
top: -0.5em;
margin-left: -6px;
color: transparent;
display: inline-block;
width: 1.45em;
height: 1.45em;
--mask: var(--icon-edit) no-repeat;
mask: var(--mask);
mask-size: 100% 100%;
mask-position: center center;
background-color: var(--highlight);
}
.mw-editsection a:hover {
text-decoration: none;
background-color: var(--text-highlight);
}
.mw-editsection-divider {
color: transparent;
}
#mw-indicator-mw-helplink a {
background: none;
font-size: 0;
}
#mw-indicator-mw-helplink a:before {
content: '';
display: block;
background-color: var(--highlight);
background-position: left center;
background-repeat: no-repeat;
--mask: url(/resources/src/mediawiki.helplink/images/helpNotice.svg?46d34) no-repeat;
mask: var(--mask);
mask-position: center center;
width: 20px;
height: 20px;
position: absolute;
left: 0px;
}
#mw-indicator-mw-helplink a:hover:before {
background-color: var(--text-highlight);
}
/*---- link styles end----*/
/* --- Left Sidebar Navigation "tabs"/buttons start --- */
.vector-menu-heading-label{
font-family: 'Open Sans';
text-transform: uppercase;
font-weight:500;
font-size: 1.25rem;
color: var(--text-highlight);
text-shadow: 2px 2px 5px var(--content-background);
}
.vector-menu-portal, .vector-menu-portal .vector-menu-content {
margin: 0;
}
.vector-menu-portal .vector-menu-content li a:visited, .vector-menu-portal .vector-menu-content li a {
color: var(--text-highlight);
}
.vector-menu-portal .vector-menu-heading {
position: relative;
left: 0;
background-image: none;
border-bottom: 2px solid var(--highlight);
margin-left: 5px;
margin-bottom: 5px;
}
#mw-panel {
position: relative;
width: 170px;
padding-left: 0;
margin-right: 30px;
}
#mw-panel ul li a, .content-box li a {
text-shadow:none;
text-decoration:none;
color: var(--text-highlight);
display: block; /* whole box clickable*/
}
#mw-panel ul li, .content-box li {
position: relative;
left: 0;
background-image: var(--graphic-nav-default);
backdrop-filter: blur(var(--background-blur));
background-color: unset;
border: unset;
padding: 9px 5px 5px 5px;
margin-bottom: 5px;
width: 157px;
height: 20px;
color: var(--text-highlight);
font-family: 'Saira', sans-serif;
text-transform: uppercase;
font-weight: 400;
font-size: var(--text-sidebar-labels-size);
text-align: left middle;
overflow:clip;
}
#mw-panel ul li:hover, .content-box li:hover {
background-image: var(--graphic-nav-hover);
color: var(--highlight);
}
#mw-panel ul li:active, .content-box li:active {
background-image: var(--graphic-nav-active);
}
#t-print.mw-list-item, #t-info.mw-list-item {
font-size: 0.938rem;
}
/* --- left sidebar menu/tabs end ---*/
/* --- start kbd style ---*
/* kbd style is used in Template:Default
to render a keyboard key. Taken from
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/kbd */
kbd {
color: var(--text);
background-color: var(--kbd-background);
border-radius: 3px;
border: 1px solid #b4b4b4;
box-shadow:
0 1px 1px rgba(0, 0, 0, 0.2),
0 2px 0 0 rgba(255, 255, 255, 0.7) inset;
display: inline-block;
line-height: 1;
padding: 2px 4px;
white-space: nowrap;
}
kbd a, kbd a.selflink, kbd a:visited {
font-family: 'Open Sans', sans-serif;
color: var(--text);
font-size: 1rem;
font-weight:500;
padding: 3px;
}
kbd a:hover, kbd a.selflink:hover {
font-family: 'Open Sans', sans-serif;
color: var(--text-highlight);
text-decoration: none;
font-size: 1rem;
font-weight:500;
}
table {
white-space: normal;
display:table;
}
table caption {
background: transparent;
color:var(--text);
}
/*--- wikigg Infobox table style start ----*/
.wikigg-infobox, .portable-infobox {
float:right;
background: transparent;
border: 1px solid var(--button-stroke);
padding: 5px;
margin-left: var(--margin-standard);
margin-bottom: var(--margin-standard);
color:var(--text);
min-width: 300px;
max-width: 350px;
}
.wikigg-infobox table {
border-collapse: separate;
border-radius: 5px;
}
.wikigg-infobox tbody tr {
border-bottom: none;
}
.portable-infobox .pi-secondary-background {
color: var(--text-highlight);
background: var(--box-background);
}
.wikigg-infobox tr {
border: none;
color: var(--text-highlight);
background: transparent;
}
.wikigg-infobox-header {
font-weight:500;
text-transform: uppercase;
background: transparent;
}
.wikigg-infobox-image {
text-align: center;
}
.infobox td,
.infobox th {
vertical-align: top;
border: none;
}
.wikigg-infobox caption {
font-size: larger;
margin-left: inherit;
}
/*---- wikigg Infobox table style end ----*/
/*--- footer start ---*/
.mw-footer {
max-width: 1920px;
display: block;
margin-left: auto;
margin-right: auto;
}
#footer-info, #footer-places {
margin-left: var(--sidebar-width);
}
.mw-footer ul {
list-style: none;
margin: 0;
padding: 0;
list-style-image: none;
}
.mw-footer li {
font-family: 'Open Sans', sans-serif;
font-size: 1rem;
text-transform: none;
text-shadow: 2px 2px 5px var(--content-background);
margin: 0;
padding: 1em;
color: var(--text);
list-style-image: none;
}
.mw-footer a {
text-shadow: 2px 2px 5px var(--content-background);
}
footer#wikigg-footer {
position: sticky;
top: 100%;
}
.mw-footer img {
float: right;
}
#footer-info-copyright img{
position: relative;
right: 0;
/* mediawiki logo is 31px height, and this image has a 1px black border,
a small tweak to make them visually matched on size and position */
bottom: -1px;
height: 33px;
width: auto;
}
/*--- footer end ---*/
/*---- plain table style start ---*/
.wikitable {
overflow-x:auto;
border: 1px solid var(--button-stroke);
background: var(--box-background);
}
.wikitable tbody, .wikitable tr, .wikitable td {
color: var(--text);
background: transparent;
}
.wikitable table {
border-collapse: separate;
color:var(--text);
background:var(--box-background);
border-radius: 5px;
margin:50px auto;
box-shadow: 0 0 5px rgba(0,0,0,0.3);
width:100%;
font-size: 0.875rem;
word-break: break-all;
table-layout: fixed;
white-space: normal;
}
.wikitable thead {
border-radius:5px;
border-bottom:1px solid var(--button-stroke);;
}
.wikitable thead th {
font-family: "Saira", sans-serif;
font-size: 1rem;
font-weight:800;
text-align:left;
padding:2px;
border-top:1px solid var(--button-stroke);;
}
.wikitable tbody tr {
font-family: inherit;
font-size: var(--text-table-size);
font-weight:400;
color:var(--text);
padding: 2px;
}
tbody td {
font-family: 'Open Sans', sans-serif;
background: transparent;
color: var(--text)
}
.wikitable tbody tr:nth-child(2n) {
background: transparent;
background-color: var(--table-row-background);
}
.wikitable tbody tr:last-child td {
border-bottom:none;
}
.wikitable.center-all td {
text-align: center;
}
.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td {
font-family: 'Open Sans', sans-serif;
font-size: 1rem;
color: var(--text);
background: none;
background-color: transparent;
border: none;
padding: 0.5em;
}
/*---- table style end ----*/
/*---- wiki.gg header start ---*/
.headerBox{
border: none;
text-align:center;
font-size: var(--text-p-size);
width:100%;
background-color: transparent;
margin-bottom: 10px;
}
.headerText {
font-family: inherit;
padding: 0;
font-size: 1.5rem;
text-transform: uppercase;
color: var(--text-highlight);
font-weight: var(--text-h2-weight);
}
.headerText a:link,
.headerText a:visited,
.headerText a:hover,
.headerText a:active {
color: var(--text-highlight);
}
/* wiki.gg header end */
/* Removes the header from the main page */
.page-Space_Engineers_Wiki h1.firstHeading, .page-Space_Engineers_Wiki h1.page-header__title { display:none; }
/* Hide unpatrolled flags */
body.ns--1 .unpatrolled { display: none }
/* Mark redirects in Special:Allpages and Special:Watchlist */
.allpagesredirect {
font-style: italic;
}
.allpagesredirect:after {
color: var(--warning); content: " (redirect)"
}
.watchlistredir {
font-style: italic;
}
/* ------------------------- Text, Headings Start ------------------------- */
/* ----- Shared ----- */
.mw-body, .vector-body, body {
font-family: 'Open Sans', sans-serif;
font-size: var(--text-p-size);
color: var(--text);
}
h1, h2, h3, h4, h5, h6 {
font-family: unset;
text-transform: uppercase;
color: var(--text-highlight);
}
/* ----- Headings ----- */
h1, .vector-body h1, .mw-body h1, .mw-body-content h1 {
font-size: var(--text-h1-size);
font-weight: var(--text-h1-weight);
margin-bottom: 0.6em;
border-bottom: 3px solid var(--highlight);
}
h2, .vector-body h2 {
font-size: var(--text-h2-size);
font-weight: var(--text-h2-weight);
margin-top: 1em;
margin-bottom: 0.6em;
border-bottom: 2px solid var(--highlight);
}
h3, .vector-body h3 {
font-size: var(--text-h3-size);
font-weight: var(--text-h3-weight);
margin-top: 0.3em;
line-height: 1.6;
}
h4, .vector-body h4 {
font-size: var(--text-h4-size);
font-weight: var(--text-h4-weight);
margin-top: 0.3em;
line-height: 1.6;
}
h5, .vector-body h5 {
font-size: var(--text-h5-size);
font-weight: var(--text-h5-weight);
margin-top: 0.3em;
line-height: 1.6;
}
h6, .vector-body h6 {
font-size: var(--text-h6-size);
font-weight: var(--text-h6-weight);
margin-top: 0.3em;
line-height: 1.6;
}
/* ----- Links ----- */
a {
color: var(--highlight);
}
a:visited {
color: var(--highlight);
}
a:active {
color: var(--highlight);
}
a:hover,
a:focus {
color: var(--text-highlight);
text-decoration: underline;
}
a.new {
color: var(--warning);
}
a.new:visited:hover {
color: var(--text-highlight);
}
/* ----- Patches ----- */
.mw-body h1,
.mw-body-content h1,
.mw-body-content h2 {
margin-bottom: unset;
padding: unset;
font-family: unset;
line-height: unset;
}
.mw-headline {
border: none !important;
}
.vector-body .toc h2 {
font-family: unset;
}
/* ------------------------- Text, Headings End ------------------------- */
/* -- start TOC style--*/
.toc h2 {
margin-top: 20px;
border-bottom: none;
}
.toc, .toc * {
box-sizing: border-box;
}
.toc {
margin-top: 20px;
font-size: 1rem;
background: transparent;
border: 1px solid var(--button-stroke);
padding: 15px;
min-width: 12em;
}
.toc .toctogglecheckbox:checked ~ ul {
overflow: hidden;
display: block;
height: 0;
border: 0;
padding-top: 0;
padding-bottom: 0;
margin: 0;
}
.toc .toctitle {
font-size: 1.25rem;
text-align: left;
}
.toc li {
padding-left: 0em;
}
.toc li a:hover {
text-decoration: none;
}
.toc .toctogglespan::before,
.toc .toctogglespan::after,
.toc .toctogglelabel::after {
display: none;
}
.toctitle {
margin-bottom: -2em;
}
.toctitle .toctogglespan {
position: relative;
top: -2em;
}
.toctitle .toctogglelabel {
position: relative;
width: 100%;
height: 100%;
display: inline-block;
padding: 5px;
}
.toc .toctogglelabel::before {
position: relative;
content: "";
float: right;
--mask: var(--icon-arrow-right) no-repeat;
mask: var(--mask);
mask-size: 100% 100%;
mask-position: center center;
background-color: var(--text-highlight);
width: 16px;
height: 16px;
transform: rotate(90deg);
margin-top: 0.35em;
}
.toc .toctogglecheckbox:checked + .toctitle .toctogglelabel::before {
float: right;
width: 16px;
height: 16px;
flex: 0 0 auto;
transform: rotate(-90deg);
}
.toc .toctogglelabel:hover::before {
background-color: var(--highlight);
}
.tocnumber {
color: var(--text-highlight);
}
/*---- End toc style----*/
/* ------ Bullet Points ------ */
.content-body ul li {
list-style-image: var(--graphic-bulletpoint);
padding-left: 5px;
}
.content-body .toc ul li,
.search-types ul li,
.searchresults ul li,
.mw-category-group ul li {
list-style-image: none;
}
.CategoryTreeToggle {
color: var(--highlight);
}
.catlinks {
border: none;
background: none;
border-top: 1px solid var(--highlight);
margin-top: var(--margin-standard);
}
.mw-collapsible-content p span, .navbox p span{
font-size: 0.875rem;
}
/* Image frame fix */
div.tright, div.tleft {
border: 1px solid silver;
}
div.thumbinner {
background: inherit;
border: none;
color: inherit;
}
#article div.thumb {
color:inherit;
}
/* Start column layout for homepage
menu buttons [[Template:Content Box]] */
.content-box {
display: table;
table-layout: fixed; /* width of first cell*/
font-family: 'Saira', sans-serif;
text-align: center;
}
.content-box div {
display: table-cell;
}
/* Start column layout for contact box */
.contact-box {
display: table;
width: 100%;
table-layout: fixed;
font-family: 'Saira', sans-serif;
}
.contact-box div {
display: table-cell;
text-align: center;
}
.contact-box li {
list-style-type: none;
}
/* end column layout for contact box */
.home-social-media{
margin:2px;
}
/* disambiguation box */
.disambig {
border: 1px solid var(--button-stroke);
background: transparent;
padding: 15px;
white-space: normal;
margin-bottom: var(--margin-standard);
}
/* --- homepage layout start --- */
.home-content-menu { grid-area: buttons; }
.home-social-media { grid-area: social; }
.home-contact { grid-area: contact; }
.home-main { grid-area: main; }
.home-contributions { grid-area: contributions; }
.home-modding { grid-area: modding; }
.home-recent-changes { grid-area: changes; }
.home-grid-container {
display: grid;
grid-template-areas:
'main main main modding'
'contributions contributions changes changes'
'social social contact contact';
gap: 35px;
}
.home-grid-container > div {
padding: 25px;
}
/* the desktop page does not use the "content"
grid area, it already has the sidebar,
only mobile needs it. */
.content-box { display:none; }
/* --- homepage layout end --- */
/*---- image thumbnails start */
div.tright, div.tleft {
border: none;
}
.thumbimage {
border: 1px solid var(--button-stroke);
}
.thumbimage:hover {
border: 1px solid var(--highlight);
}
.thumbcaption {
padding-top: 5px;
}
.mw-content-ltr .magnify a {
background-image: none;
background-color: var(--highlight);
--mask: var(--icon-magnify) no-repeat;
mask: var(--mask);
mask-size: 100%;
height: 16px;
}
.mw-content-ltr .magnify a:hover {
background-color: var(--text-highlight);
}
li.gallerybox div.thumb {
background-color:transparent;
border-color: var(--button-stroke);
}
li.gallerybox div.thumb:hover {
border-color: var(--highlight);
}
.embedvideo {
border: 1px solid var(--button-stroke);
}
.embedvideo:hover {
border: 1px solid var(--highlight);
}
.image {
display: inline-block;
max-width: 100%;
overflow: auto;
border: 1px solid transparent;
}
.image:hover {
border: 1px solid var(--highlight);
}
/*--- image thumbnails end ----*/
/*---- preformatted and code style start ----*/
code {
background-color: var(--code-editor-background);
border: var(--button-stroke);
color: var(--text-code-comment);
}
pre {
background: var(--code-editor-background);
border: 1px solid var(--button-stroke);
box-shadow: var(--button-stroke);
color: var(--text);
}
.mw-content-ltr.mw-highlight-lines pre, .mw-content-ltr.content .mw-highlight-lines pre {
box-shadow: inset 2.75em 0 0 var(--button-stroke);
}
.mw-highlight .linenos {
color: var(--text);
}
.mw-highlight .c {
color: var(--text-code-comment);
font-style: inherit;
}
.mw-highlight .nd {
color: var(--text-code-root);
}
.mw-highlight .nv {
color: var(--text-code-variables);
}
.mw-highlight .nb {
color: var(--text-code-defs);
}
.mw-highlight .mi {
color: var(--text-code-int);
}
.mw-highlight .mf {
color: var(--text-code-float);
}
.mw-highlight .kt {
color: var(--text-code-unit);
}
.mw-highlight .sx {
color: var(--text-code-link);
}
.mw-highlight .k {
color: var(--text-code-property);
font-weight: inherit;
}
.mw-highlight .s1 {
color: var(--text-code-string);
}
.mw-highlight .nt {
color: var(--text-code-url);
font-weight: inherit;
}
.mw-highlight .nn {
color: var(--text-code-id);
font-weight: inherit;
}
.mw-highlight .kc {
color: var(--text-code-expr);
font-weight: inherit;
}
.mw-highlight .nc {
color: var(--text-code-classes);
font-weight: inherit;
}
.mw-highlight .nf {
color: var(--text-code-var);
}
.mw-highlight .hll {
background-color: var(--highlight);
}
/*---- code style end ----*/
/* --- mathtable start: fuer {{Template:Math_table}} e.g. on Physics page --- */
.wikigg-mathtable table {
border:2px ridge var(--highlight); /*where is this color visible?*/
border-radius: 20px;
padding: 10px
}
.wikigg-mathtable tbody td {
background-color: var(--mathtable-background);
color: var(--mathtable-text);
}
/* --- mathtable end ---*/
/* --- NavBoxes --- */
.wikigg-NavBox {
border: 1px solid var(--button-stroke);
p span {
font-size: inherit;
}
}
/*
====================================================================================================
Specific Custom Elements
====================================================================================================
*/
/* ------------------------- Homepage Start ------------------------- */
.frontpage-grid-container {
display: grid;
grid-template-areas:
'main main main update'
'game game game game'
'learn learn modding modding'
'contrib contrib changes changes'
'social social contact contact';
grid-auto-columns: minmax(0, 1fr);
grid-auto-flow: column;
gap: var(--margin-standard);
}
.frontpage-grid-container img {
max-width: 100%;
}
.frontpage-grid-container .flexiconlinks {
display: flex;
justify-content: space-around;
flex-direction: row;
flex-wrap: wrap;
align-items: flex-start;
}
.frontpage-grid-container .flexiconlinks .iconlink {
display: block;
text-align: center;
}
.frontpage-grid-container .frontpage-main {
grid-area: main;
}
.frontpage-grid-container .frontpage-update {
grid-area: update;
border: 1px solid var(--button-stroke);
padding: calc(var(--margin-standard) / 2);
}
.frontpage-grid-container .frontpage-game {
grid-area: game;
border: 1px solid var(--button-stroke);
padding: calc(var(--margin-standard) / 2);
}
.frontpage-grid-container .frontpage-game img {
transition: transform .3s;
}
.frontpage-grid-container .frontpage-game img:hover {
transform: scale(1.1);
}
.frontpage-grid-container .frontpage-learn {
grid-area: learn;
border: 1px solid var(--button-stroke);
padding: calc(var(--margin-standard) / 2);
}
.frontpage-grid-container .frontpage-learn img {
transition: transform .3s;
}
.frontpage-grid-container .frontpage-learn img:hover {
transform: scale(1.1);
}
.frontpage-grid-container .frontpage-modding {
grid-area: modding;
border: 1px solid var(--button-stroke);
padding: calc(var(--margin-standard) / 2);
min-width: 0;
}
.frontpage-grid-container .frontpage-modding img {
transition: transform .3s;
}
.frontpage-grid-container .frontpage-modding img:hover {
transform: scale(1.1);
}
.frontpage-grid-container .frontpage-contributions {
grid-area: contrib;
}
.frontpage-grid-container .frontpage-changes {
grid-area: changes;
}
.frontpage-grid-container .frontpage-social {
grid-area: social;
}
.frontpage-grid-container .frontpage-contact {
grid-area: contact;
}
/* ------------------------- Homepage End ------------------------- */
/*
====================================================================================================
Templates
====================================================================================================
*/
/* ------------------------- Breadcrumbs Start ------------------------- */
#contentSub > .subpages {
/*hide the default breadcrumbs*/
display: none;
}
/* ----- Shared ----- */
.BreadCrumbBar {
font-family: 'Saira', sans-serif;
text-transform: uppercase;
font-weight: 400;
font-size: var(--text-sidebar-labels-size);
line-height: 30px;
}
.BreadCrumbBar a {
display: block;
position: absolute;
margin-top: 5px;
margin-left: 20px;
margin-right: 15px;
color: var(--text-highlight);
height: 35px;
width: 165px;
text-align: center;
overflow: clip;
}
.BreadCrumbBar a.new {
color: var(--text-highlight);
}
.BreadCrumbBar a:visited {
color: var(--text-highlight);
}
.BreadCrumbBar a:hover {
color: var(--text-highlight);
text-decoration: none;
}
.BreadCrumbBar a.mw-selflink {
font-weight: unset;
}
/* ----- First ----- */
.BreadCrumbBar .BCOverview {
position: relative;
display: inline-block;
height: 40px;
width: 200px;
a {
margin-left: 5px;
}
}
.BreadCrumbBar .BCOverview::before {
content: "";
position: absolute;
top: 0px;
left: 0px;
background-image: var(--graphic-button-bcstart-default);
height: 40px;
width: 200px;
z-index: -1;
}
.BreadCrumbBar .BCOverview:hover::before {
background-image: var(--graphic-button-bcstart-hover);
}
/* ----- Middle ----- */
.BreadCrumbBar .BCOther {
position: relative;
display: inline-block;
height: 40px;
width: 200px;
}
.BreadCrumbBar .BCOther::before {
content: "";
position: absolute;
top: 0px;
left: 0px;
background-image: var(--graphic-button-bcitem-default);
height: 40px;
width: 200px;
z-index: -1;
}
.BreadCrumbBar .BCOther:hover::before {
background-image: var(--graphic-button-bcitem-hover);
}
/* ----- Last ----- */
.BreadCrumbBar .BCCurrent {
position: relative;
display: inline-block;
height: 40px;
width: 200px;
}
.BreadCrumbBar .BCCurrent::before {
content: "";
position: absolute;
top: 0px;
left: 0px;
background-image: var(--graphic-button-bcitem-active);
height: 40px;
width: 200px;
z-index: -1;
}
.BreadCrumbBar .BCCurrent:hover::before {
background-image: var(--graphic-button-bcitem-hover);
}
/* ------------------------- Breadcrumbs End ------------------------- */
/* ------------------------- Labels Start ------------------------- */
.wikigg-label-blue {
background: var(--box-background);
padding: 0px 5px 0px 5px;
border: 1px solid var(--highlight);
color: var(--highlight);
font-weight: 500;
text-transform: uppercase;
margin-right: 0.2em;
}
.wikigg-label-green {
background: var(--box-background);
padding: 0px 5px 0px 5px;
border: 1px solid var(--positive);
color: var(--positive);
font-weight: 500;
text-transform: uppercase;
margin-right: 0.2em;
}
.wikigg-label-yellow {
background: var(--box-background);
padding: 0px 5px 0px 5px;
border: 1px solid var(--info);
color: var(--info);
font-weight: 500;
text-transform: uppercase;
margin-right: 0.2em;
}
.wikigg-label-orange {
background: var(--box-background);
padding: 0px 5px 0px 5px;
border: 1px solid var(--warning);
color: var(--warning);
font-weight: 500;
text-transform: uppercase;
margin-right: 0.2em;
}
.wikigg-label-red {
background: var(--box-background);
padding: 0px 5px 0px 5px;
border: 1px solid var(--negative);
color: var(--negative);
font-weight: 500;
text-transform: uppercase;
margin-right: 0.2em;
}
/* ------------------------- Labels End ------------------------- */
/* ------------------------- Notebox Start ------------------------- */
.wikigg-NoteBox {
background: none;
margin: calc(var(--margin-standard) / 2) 0px;
}
/* ----- Shared ----- */
.wikigg-NoteBox .wikigg-NoteBoxBackground {
background: var(--box-background);
overflow: hidden;
}
.wikigg-NoteBox .wikigg-NoteBoxLabel {
float: left;
background-position: center center;
background-repeat: no-repeat;
padding: 30px;
margin: 15px 30px 15px 30px;
}
.wikigg-NoteBox .wikigg-NoteBoxText {
display: block;
padding: 30px;
margin-left: 90px;
}
.wikigg-NoteBox .wikigg-NoteBoxCornerLeft {
position: relative;
float:left;
}
.wikigg-NoteBox .wikigg-NoteBoxCornerRight {
position: relative;
float: right;
}
/* ----- Note ----- */
.wikigg-NoteBox .wikigg-NoteBoxNote .wikigg-NoteBoxBackground {
border: 1px solid var(--button-stroke);
}
.wikigg-NoteBox .wikigg-NoteBoxNote .wikigg-NoteBoxLabel {
background-image: var(--icon-notebox-note);
}
.wikigg-NoteBox .wikigg-NoteBoxNote .wikigg-NoteBoxCornerLeft::before {
content: "";
position: absolute;
background-color: var(--button-stroke);
mask: var(--graphic-box-corner-left) no-repeat;
padding: 16px;
top: -4px;
left: -4px;
}
.wikigg-NoteBox .wikigg-NoteBoxNote .wikigg-NoteBoxCornerRight::after {
content: "";
position: absolute;
background-color: var(--button-stroke);
mask: var(--graphic-box-corner-right) no-repeat;
padding: 16px;
bottom: -4px;
right: -4px;
}
/* ----- Info ----- */
.wikigg-NoteBox .wikigg-NoteBoxInfo .wikigg-NoteBoxBackground {
border: 1px solid var(--info);
}
.wikigg-NoteBox .wikigg-NoteBoxInfo .wikigg-NoteBoxLabel {
background-image: var(--icon-notebox-info);
}
.wikigg-NoteBox .wikigg-NoteBoxInfo .wikigg-NoteBoxCornerLeft::before {
content: "";
position: absolute;
background-color: var(--info);
mask: var(--graphic-box-corner-left) no-repeat;
padding: 16px;
top: -4px;
left: -4px;
}
.wikigg-NoteBox .wikigg-NoteBoxInfo .wikigg-NoteBoxCornerRight::after {
content: "";
position: absolute;
background-color: var(--info);
mask: var(--graphic-box-corner-right) no-repeat;
padding: 16px;
bottom: -4px;
right: -4px;
}
/* ----- Warning ----- */
.wikigg-NoteBox .wikigg-NoteBoxWarning .wikigg-NoteBoxBackground {
border: 1px solid var(--warning);
}
.wikigg-NoteBox .wikigg-NoteBoxWarning .wikigg-NoteBoxLabel {
background-image: var(--icon-notebox-warning);
}
.wikigg-NoteBox .wikigg-NoteBoxWarning .wikigg-NoteBoxCornerLeft::before {
content: "";
position: absolute;
background-color: var(--warning);
mask: var(--graphic-box-corner-left) no-repeat;
padding: 16px;
top: -4px;
left: -4px;
}
.wikigg-NoteBox .wikigg-NoteBoxWarning .wikigg-NoteBoxCornerRight::after {
content: "";
position: absolute;
background-color: var(--warning);
mask: var(--graphic-box-corner-right) no-repeat;
padding: 16px;
bottom: -4px;
right: -4px;
}
/* ----- Error ----- */
.wikigg-NoteBox .wikigg-NoteBoxError .wikigg-NoteBoxBackground {
border: 1px solid var(--negative);
}
.wikigg-NoteBox .wikigg-NoteBoxError .wikigg-NoteBoxLabel {
background-image: var(--icon-notebox-error);
}
.wikigg-NoteBox .wikigg-NoteBoxError .wikigg-NoteBoxCornerLeft::before {
content: "";
position: absolute;
background-color: var(--negative);
mask: var(--graphic-box-corner-left) no-repeat;
padding: 16px;
top: -4px;
left: -4px;
}
.wikigg-NoteBox .wikigg-NoteBoxError .wikigg-NoteBoxCornerRight::after {
content: "";
position: absolute;
background-color: var(--negative);
mask: var(--graphic-box-corner-right) no-repeat;
padding: 16px;
bottom: -4px;
right: -4px;
}
/* ------------------------- Notebox End ------------------------- */
/* ------------------------- Collapsible Box Start ------------------------- */
.wikigg-CollapsibleBox {
border: 1px solid var(--button-stroke);
margin-top: 15px;
padding: 5px 5px 5px 0px;
overflow: hidden;
}
.wikigg-CollapsibleBox .wikigg-Collapsible-Title {
position: relative;
display: flex;
left: 25px;
font-weight: 500;
}
.wikigg-CollapsibleBox .mw-collapsible .mw-collapsible-content {
margin-top: 5px;
padding-left: 25px;
}
.wikigg-CollapsibleBox .mw-collapsible:not(.mw-collapsed) {
margin-top: 10px;
padding-left: 15px;
}
.wikigg-CollapsibleBox .mw-collapsible-toggle::before, .mw-collapsible-toggle::after {
display: none;
}
.wikigg-CollapsibleBox .wikigg-Collapsible-Title::before {
mask: var(--icon-arrow-right) no-repeat;
mask-size: 100% 100%;
mask-position: center center;
background-color: var(--text-highlight);
color: var(--text-highlight);
width: 16px;
height: 16px;
margin-top: 0.35em;
transform: rotate(90deg);
content:'';
display:block;
margin-right:0.5em;
}
.wikigg-CollapsibleBox:has(.mw-collapsed) .wikigg-Collapsible-Title::before {
transform:unset;
}
.wikigg-CollapsibleBox .mw-collapsible-toggle {
z-index: 1;
}
.wikigg-CollapsibleBox .mw-collapsible-toggle:hover .mw-collapsible-text {
background-color: var(--highlight);
color: var(--highlight);
}
/* ------------------------- Collapsible Box End ------------------------- */
/* ------------------------- Tutorial Sidebar Start ------------------------- */
.wikigg-TutorialSideBar {
float: right;
min-width: 450px;
max-width: 450px;
margin-left: calc(var(--margin-standard) * 2);
margin-bottom: var(--margin-standard);
}
.wikigg-TutorialSideBar ul {
margin-left: 0;
}
.wikigg-TutorialSideBar .wikigg-TutorialDifficulty {
text-align: right;
}
.wikigg-TutorialSideBar .wikigg-TutorialLearningsHeader {
font-size: var(--text-h2-size);
font-weight: var(--text-h2-weight);
text-transform: uppercase;
color: var(--text-highlight);
}
.wikigg-TutorialSideBar .wikigg-TutorialIncluded p {
display: block;
border: 1px solid var(--positive);
background: var(--box-background);
padding: 10px;
}
.wikigg-TutorialSideBar .wikigg-TutorialIncluded p::before {
float: left;
content: "";
background-image: var(--icon-learnings-included);
height: 30px;
width: 30px;
margin-right: 10px;
}
.wikigg-TutorialSideBar .wikigg-TutorialExcluded p {
display: block;
border: 1px solid var(--negative);
background: var(--box-background);
padding: 10px;
}
.wikigg-TutorialSideBar .wikigg-TutorialExcluded p::before {
float: left;
content: "";
background-image: var(--icon-learnings-excluded);
height: 30px;
width: 30px;
margin-right: 10px;
}
.wikigg-TutorialSideBar .wikigg-TutorialPrerequisitesHeader {
margin-top: var(--margin-standard);
font-size: var(--text-h2-size);
font-weight: var(--text-h2-weight);
text-transform: uppercase;
color: var(--text-highlight);
}
.wikigg-TutorialSideBar .wikigg-TutorialPrerequisites p {
display: block;
border: 1px solid var(--button-stroke);
background: var(--box-background);
padding: 10px;
}
.wikigg-TutorialSideBar .wikigg-TutorialPrerequisites p::before {
float: left;
content: "";
background-image: var(--icon-prerequisites);
height: 27px;
width: 30px;
margin-right: 10px;
}
.wikigg-TutorialSideBar .wikigg-TutorialTocHeader {
margin-top: var(--margin-standard);
font-size: var(--text-h2-size);
font-weight: var(--text-h2-weight);
text-transform: uppercase;
color: var(--text-highlight);
}
.wikigg-TutorialSideBar .wikigg-TutorialToc .toctitle {
display: none;
}
.wikigg-TutorialSideBar .toc .toctogglecheckbox:checked ~ ul {
display:block;
height:unset;
}
.wikigg-TutorialSideBar .wikigg-TutorialToc .toc {
border: none;
margin-top: 0;
padding: 0px 0px 0px 5px;
}
.wikigg-TutorialSideBar .wikigg-TutorialRelatedHeader {
margin-top: var(--margin-standard);
font-size: var(--text-h2-size);
font-weight: var(--text-h2-weight);
text-transform: uppercase;
color: var(--text-highlight);
}
.wikigg-TutorialSideBar .wikigg-TutorialRelated {
display: inline-block;
padding: 10px;
padding-top: 0px;
}
.wikigg-TutorialSideBar .wikigg-TutorialRelated p::before {
display: inline-block;
vertical-align: middle;
content: "";
background-image: var(--icon-page-generic);
height: 25px;
width: 18px;
margin-right: 8px;
margin-bottom: 2px;
}
/* ------------------------- Tutorial Sidebar End ------------------------- */
/*
====================================================================================================
Page Adjustments
====================================================================================================
*/
/* ------------------------- Mobile Sidebar Toggle Start ------------------------- */
.client-js #mw-panel .mobile-nav-toggle {
display: none;
}
.client-js #mw-panel .vector-menu-portal {
display: block;
}
/* ------------------------- Mobile Sidebar Toggle End ------------------------- */
/* ------------------------- Patches Start ------------------------- */
/* Fixes visual editor positioning */
.oo-ui-toolbar {
clear: none;
position: sticky;
top: 35px;
height: unset !important;
z-index: 10;
}
.ve-init-mw-desktopArticleTarget-toolbar-open > .oo-ui-toolbar-bar > div:nth-child(4) {
display: none;
}
.ve-ui-toolbar-floating > .oo-ui-toolbar-bar {
position: unset;
}
/* ------------------------- Patches End ------------------------- */
/* ------------------------- Page Width Flex Start ------------------------- */
@media screen
and (min-width : 1920px)
{
#mw-head #right-navigation {
margin-right: 0px;
}
}
@media screen
and (max-width : 1640px)
{
/* ----- Frontpage ----- */
.frontpage-grid-container {
display: grid;
grid-template-areas:
'main main main main'
'update update update update'
'game game game game'
'learn learn modding modding'
'contrib contrib contrib contrib'
'changes changes changes changes'
'social social contact contact';
gap: var(--margin-standard);
}
}
@media screen
and (max-width : 940px)
{
/* ----- Frontpage ----- */
.frontpage-grid-container {
display: grid;
grid-template-areas:
'main main'
'update update'
'game game'
'learn learn'
'modding modding'
'contrib contrib'
'changes changes'
'social social'
'contact contact';
gap: var(--margin-standard);
}
/* ----- Tutorial Sidebar ----- */
.wikigg-TutorialSideBar {
float: unset;
display: block;
max-width: 100%;
min-width: unset;
margin-left: 0px;
}
}
@media screen
and (max-width : 840px)
{
/* ----- Header ----- */
#mw-head a {
height: unset;
width: unset;
text-shadow: 2px 2px 5px var(--content-background);
}
#mw-head a:hover {
color: var(--highlight);
}
#mw-head .vector-menu-content ul li {
background: none;
border: none;
backdrop-filter: none;
height: unset;
width: unset;
}
#mw-head .vector-menu-content ul li:hover {
background: none;
border: none;
}
#mw-head .vector-menu-content ul li::before {
display: none;
}
#mw-head .vector-menu-content .selected {
background: none;
border: none;
}
#mw-head .vector-menu-content .selected a {
color: var(--highlight);
}
#mw-head .vector-menu-content .selected a:hover {
color: var(--text-highlight);
}
#mw-head #left-navigation {
margin-left: var(--sidebar-width);
}
#mw-head #right-navigation {
margin-right: var(--margin-standard);
}
#mw-head #right-navigation #p-cactions {
a {
text-shadow: none;
}
}
}
/* ------------------------- Page Width Flex End ------------------------- */
/* ------------------------- Mobile Theme Start ------------------------- */
@media screen
and (max-width : 720px)
and (orientation : portrait)
{
:root {
--margin-standard: 15px;
--text-p-size: 16px;
}
img {
max-width: 300px;
height: auto;
}
/* ----- Header ----- */
#mw-head #left-navigation {
margin-top: 0px;
margin-left: var(--margin-standard);
}
#mw-head #right-navigation {
margin-top: 0px;
}
.vector-menu-content-list.menu,
#mw-head #right-navigation #p-cactions-label,
#mw-head #right-navigation #p-search {
margin-top: -2px;
}
/* ----- Sidebar ----- */
.client-js #mw-panel {
z-index: 3;
position: absolute;
width: unset;
margin: unset;
top: 125px;
}
.client-js #p-logo, .client-js #p-logo a {
display: none;
}
.client-js #mw-panel .mobile-nav-toggle {
display: block;
}
.client-js #mw-panel .vector-menu-portal {
display: none;
}
.client-js #mw-panel .mobile-nav-toggle {
position: relative;
z-index: 5;
mask: var(--icon-sidebar-menu);
background-color: var(--text-highlight);
mask-position: center center;
border: none;
height: 20px;
width: 20px;
top: -65px;
left: var(--margin-standard);
}
.client-js #mw-panel .mobile-nav-toggle:hover {
background-color: var(--highlight);
}
.client-js #mw-panel .vector-menu-content ul li {
backdrop-filter: none;
}
.client-js #mw-panel .mobile-nav-toggle.nav--expanded ~ .vector-menu-portal {
display: block;
background: var(--content-background);
backdrop-filter: blur(var(--background-blur));
padding-right: 15px;
}
/* ----- Frontpage ----- */
.frontpage-grid-container .frontpage-game img,
.frontpage-grid-container .frontpage-learn img,
.frontpage-grid-container .frontpage-modding img{
width: 64px;
}
.home-recent-changes{
max-width:300px;
overflow-x:auto;
}
/* ----- Footer ----- */
.mw-footer {
padding-left: var(--margin-standard);
}
#footer-info, #footer-places {
margin-left: 0;
}
/* ----- Tables ----- */
table {
display: block;
overflow-x: auto;
max-width: 600px;
}
/* ----- Notebox ----- */
.wikigg-NoteBox {
.wikigg-NoteBoxLabel {
float: unset;
display: block;
}
.wikigg-NoteBoxText {
margin-left: 0;
padding-top: 0;
}
}
/* --- mobile homepage layout start --- */
.content-box div {
display:flex;
flex: 0 0 50%
}
/*big content menu buttons only for mobile*/
.content-box {
grid-area: buttons;
display:block;
}
.home-grid-container {
display: grid;
grid-template-areas:
'main'
'buttons'
'changes'
'modding'
'contact'
'contributions'
'social' ;
gap: 10px;
padding: 10px;
}
.home-grid-container > div {
padding: 20px 0;
}
}
/* ------------------------- Mobile Theme End ------------------------- */