MediaWiki:Common.css

/* CSS placed here will be applied to all skins */

/* FandomDesktop dark */ .theme-fandomdesktop-dark .page__main { background-color: #2c3238; } .Craft { background: url(https://static.wikia.nocookie.net/crafttheworld_gamepedia/images/5/5e/Header.jpg/revision/latest); border: 1px solid #000; box-shadow: rgba(104, 116, 120, 1) 0 0.1em 0.75em; }

/* Main Page headings */ display: block; float: left; border-collapse: separate; } .headLeft { width: 45px; height: 40px; background-image: url(https://static.wikia.nocookie.net/crafttheworld_gamepedia/images/2/2c/HeadLeft.png/revision/latest); background-repeat: no-repeat; } .headLeftIcon { width: 35px; height: 34px; background-image: url(https://static.wikia.nocookie.net/crafttheworld_gamepedia/images/2/26/HeadLeftIcon.png/revision/latest); background-repeat: no-repeat; padding: 6px 0 0 10px; } .headMid { height: 40px; width: calc(100% - 90px); background-image: url(https://static.wikia.nocookie.net/crafttheworld_gamepedia/images/c/ca/HeadMid.png/revision/latest); background-repeat: repeat-x; padding-top: 5px; text-align: center; color: #cb7; font-size: 130%; } .headLeftIcon + .headMid > b { margin-left: 12px; margin-right: -12px; position: relative; } .headRight { width: 45px; height: 40px; background-image: url(https://static.wikia.nocookie.net/crafttheworld_gamepedia/images/3/3b/HeadRight.png/revision/latest); background-repeat: no-repeat; }
 * 1) head {

/* Tables - wikitable */ .wikitable { border: 0; } .wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td { padding: .5em 1em; } .theme-fandomdesktop-light .wikitable { background-color: #0002; } .theme-fandomdesktop-dark .wikitable { background-color: #0004; }

/* Tables - infoboxes on FandomDesktop */ .article-table-wrapper { display: contents; } .skin-fandomdesktop .wikitable > tr > th[colspan], .skin-fandomdesktop .wikitable > * > tr > th[colspan] { text-align: center; }

/*Tables - listing items with icons*/ .iconTable > tbody > tr > td:first-child { text-align: left; padding: 0 8px 0 0; }

/* Infobox template style */ .infobox { border: 1px solid #aaaaaa; background-color: #f9f9f9; color: black; margin-bottom: 0.5em; margin-left: 1em; padding: 0.2em; float: right; } .infobox td, .infobox th { vertical-align: top; } .infobox img { max-width: 200px; height: auto; } .infobox caption { font-size: larger; margin-left: inherit; } .infobox.bordered { border-collapse: collapse; } .infobox.bordered td, .infobox.bordered th { border: 1px solid #aaaaaa; } .infobox.bordered .borderless td, .infobox.bordered .borderless th { border: 0; } table.ctw { margin: 1em 1em 1em 0; background: #f9f9f9; border: 1px #AFCFE2 solid; padding: 0.2em; border-radius: .7em; -moz-border-radius: .7em; -webkit-border-radius: .7em; } .ctw th, .ctw td { padding: 0.2em; } .ctw th { background: #E4F0F7; color: #063B5E; text-align: center; } .ctw caption { font-weight: bold; }

/*Adds a option for the ToC to have no auto-numbers*/ .noautonum .tocnumber { display: none; }

/* "Template:Crafting_recipe" and "Template:Disassembling_an_item" */ .craft-grid { margin: auto; table-layout: fixed; border-spacing: 4px; } .craft-grid td { width: 40px; height: 40px; text-align: center; border-radius: 4px; background-color: #ec8; }

/* Flexible columns in items lists. E.g.: Water#Use. */	display: flex; flex-wrap: wrap; align-content: flex-start; }	flex-basis: 200px; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 * 1) flexList {
 * 1) flexList > p {

/* This governs the sections on the Community portal */ .cpbox { display: flex; flex-direction: row-reverse; flex-wrap: wrap; } .cpbox #admins { box-sizing: border-box; width: calc(33% - 10px); margin: 5px; flex-grow: 1; min-width: 300px; } .cpbox #help { box-sizing: border-box; width: calc(67% - 10px); margin: 5px; flex-grow: 1; }

/* Template documentation styles */ /* If modifying these styles, be sure to update the mobile skin! */ .doc { margin: 0em auto 1em; background-color: rgba(0, 0, 0, 0.1); border: 2px solid #BDCAC3; border-radius: 1em; padding: 1em; } .doc-header { padding-bottom: 3px; border-bottom: 1px solid #BDCAC3; margin-bottom: 1ex; } .doc-footer { margin: 0; background-color: rgba(0, 0, 0, 0.1); border: 2px solid #BDCAC3; border-radius: 1em; padding: 1em; }

/* Front page structure */ .fpbox { margin: 5px; padding: 5px; overflow: auto; width: calc(100% - 2px); } .fpbox.plain { background: transparent; border: none; box-shadow: none; } .fpbox .heading, .fpbox .mainheading, .fpbox .welcome { margin: 0 0 10px; padding: 0 0 5px; overflow: auto; } .fpbox .mainheading, .fpbox .welcome { font-size: 150%; font-weight: bold; } .fpbox .heading { text-align: center; font-size: 132%; } .linkslabel { margin: 15px 5px 5px; padding: 0 0 5px; }

/* Template:FP links styles */ .fplinks { display: flex; flex-wrap: wrap; justify-content: space-evenly; align-items: stretch; text-align: center; } .fplink-outer { padding: 5px; flex-basis: calc(25% - 10px); width: calc(25% - 15px); min-width: 115px; display: inline-block; vertical-align: middle; } .fplink-wide { flex-basis: calc(33% - 10px); width: calc(33% - 15px); } .fplink-fullwidth { flex-basis: 100%; width: calc(100% - 15px); font-weight: bold; } .fplink { padding: 0.5em; box-sizing: border-box; width: 100%; height: 100%; display: table; } .fplink-plain { background: transparent; border-radius: 0; border: 0; box-shadow: none; } .fplink-inner { display: table-row; } .fplink a { display: table-cell; vertical-align: middle; } .fplink img { max-width: 150px; width: 100%; height: auto; }

/* Auto-resize front page video to fit smaller columns */ .fpbox .embedvideowrap { width: 100%!important; max-width: 480px; margin: 0 auto; } .fpbox .embedvideowrap iframe { width: 100%!important; }

/* Multi-column box support */ .fp-container main .columns .leftcol, .fp-container .columns .rightcol { width: 100%; margin: 0; padding: 0; } @media (min-width: 990px) { .fp-container .columns .leftcol { float: left; width: 50%; }	.fp-container .columns .rightcol { float: right; width: 50%; } } .fp-section { display: flex; flex-wrap: wrap; }

/* this CSS governs the responsive 2 column main page layout */ display: grid; grid-template-areas: "a" "b" "c"; grid-template-columns: 100%; } @media screen and (min-width: 990px) { #fp-2column.fp-container { grid-template-areas: "a b" "c c"; grid-template-columns: 50% 50%; } } @media screen and (min-width: 1350px) { #fp-2column.fp-container { grid-template-areas: "a b" "c b"; grid-template-columns: auto 520px; } }	grid-area: a; } grid-area: b; } grid-area: c; }
 * 1) fp-2column.fp-container {
 * 1) fp-top {
 * 1) fp-flex {
 * 1) fp-bottom {

/* Special:NewFiles - see images boundaries on hover */ .page-Special_NewFiles .gallerybox .thumb { margin: 0; border: 0; background-color: #ccc; padding: 1px; } .page-Special_NewFiles .gallerybox .thumb:hover img { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAAAAAA6mKC9AAAAGElEQVQYV2N4DwX/oYBhgARgDJjEAAkAAEC99wFuu0VFAAAAAElFTkSuQmCC); background-repeat: repeat; }

/* UserProfile - Comments */ .ns-202 .commentdisplay { margin-bottom: 0; } .ns-202 .commentdisplay > .commentblock { border-radius: 4px; padding: 6px 8px; } .ns-202 .commentdisplay > .commentblock:hover { background: #0002; } .ns-202 .comments .public > p { display: none; } .ns-202 .commentdisplay > .commentblock:not(:hover) .right > .icon { opacity: 0; } .ns-202 .replyset .avatar { margin-right: 42px; } .ns-202 .replyset .commentbody { margin-left: 42px; } .ns-202 .mw-parser-output > p:first-of-type { margin-top: 0; } .ns-202 .mw-parser-output > p:last-of-type { margin-bottom: 0; }