MediaWiki:Common.css

From Cobalt Core Wiki
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 will be applied to all skins */

/* ===========================
 * FONTS
 * ===========================
 */
@font-face {
    font-family: 'ChevyRayPinch';
    src: url('https://cobaltcore.wiki.gg/images/0/0c/ChevyRayPinchWebfont.woff2') format('woff2'),
         url('https://cobaltcore.wiki.gg/images/5/5b/ChevyRayPinchWebfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.font-pinch {
    font-family: 'ChevyRayPinch';
    font-size: 14px;
    line-height: 1.3333333333;
}

.font-size-7,
.font-pinch.font-size-1x {
    font-size: 7px;
}

.font-size-14,
.font-pinch.font-size-2x {
    font-size: 14px;
}

.font-size-21,
.font-pinch.font-size-3x {
    font-size: 21px;
}

.font-size-28,
.font-pinch.font-size-4x {
    font-size: 28px;
}
/* END Fonts */

/* ===========================
 * COLORS 
 * ===========================
 * #060326; dark blue (wiki theme)
 * #2c54a0; blue (wiki theme)
 * #84b6ff; light blue (wiki theme)
 * #dddddd; page text color (wiki theme)
 * #9D96D3; link text color (wiki theme)
 *
 * #ffc131; warning yellow
 * #bf9125; warning yellow shadow
 */
:root {
    --color-books: #fff3c5;
    --color-cat: #d3e8f2;
    --color-dizzy: #40a4fc;
    --color-dracula: #e81b16;
    --color-drake: #f3506b;
    --color-enemy: #ff5165;
    --color-isaac: #59f790;
    --color-max: #9195ff;
    --color-peri: #c54ff5;
    --color-riggs: #ff9c5f;
    --color-sasha: #FABF26;
    --color-soggins: #6a9c59;
    --color-tooth: #828297;
    --color-trash: #a6afba;
	
	--color-action: #ffb051;
	--color-amount: #ff68ff;
    --color-artifact: #66ffff;
    --color-cardtrait: #dff75b;
    --color-damage: #ff687d;
    --color-downside: #ff687d;
    --color-drone: #59f790;
    --color-energy: #66ffff;
    --color-faint: #3a67cc;
    --color-heal: #3dffa4;
    --color-health: #3dffa4;
    --color-hull: #3dffa4;
    --color-keyword: #ff68ff;
    --color-midrow: #59f790;
    --color-part: #ffffff;
    --color-parttrait: #ffffff;
    --color-status: #a8f8ff;
}
.bg-shadow { opacity:0.74; }
 
.border-color-warning { border-color:#ffc131 !important; }
.border-color-warning-shadow { border-color:#bf9125 !important; }

.bg-color-books { background-color: var(--color-books) !important; }
.border-color-books { border-color: var(--color-books) !important; }
.text-color-books { color: var(--color-books) !important; }

.bg-color-cat { background-color: var(--color-cat) !important; }
.border-color-cat { border-color: var(--color-cat) !important; }
.text-color-cat { color: var(--color-cat) !important; }

.bg-color-dizzy { background-color: var(--color-dizzy) !important; }
.border-color-dizzy { border-color: var(--color-dizzy) !important; }
.text-color-dizzy { color: var(--color-dizzy) !important; }

.bg-color-dracula { background-color: var(--color-dracula) !important; }
.border-color-dracula { border-color: var(--color-dracula) !important; }
.text-color-dracula { color: var(--color-dracula) !important; }

.bg-color-drake { background-color: var(--color-drake) !important; }
.border-color-drake { border-color: var(--color-drake) !important; }
.text-color-drake { color: var(--color-drake) !important; }

.bg-color-isaac { background-color: var(--color-isaac) !important; }
.border-color-isaac { border-color: var(--color-isaac) !important; }
.text-color-isaac { color: var(--color-isaac) !important; }

.bg-color-max { background-color: var(--color-max) !important; }
.border-color-max { border-color: var(--color-max) !important; }
.text-color-max { color: var(--color-max) !important; }

.bg-color-peri { background-color: var(--color-peri) !important; }
.border-color-peri { border-color: var(--color-peri) !important; }
.text-color-peri { color: var(--color-peri) !important; }

.bg-color-riggs { background-color: var(--color-riggs) !important; }
.border-color-riggs { border-color: var(--color-riggs) !important; }
.text-color-riggs { color: var(--color-riggs) !important; }

.bg-color-sasha { background-color: var(--color-sasha) !important; }
.border-color-sasha { border-color: var(--color-sasha) !important; }
.text-color-sasha { color: var(--color-sasha) !important; }

.bg-color-soggins { background-color: var(--color-soggins) !important; }
.border-color-soggins { border-color: var(--color-soggins) !important; }
.text-color-soggins { color: var(--color-soggins) !important; }

.bg-color-tooth { background-color: var(--color-tooth) !important; }
.border-color-tooth { border-color: var(--color-tooth) !important; }
.text-color-tooth { color: var(--color-tooth) !important; }

.bg-color-trash { background-color: var(--color-trash) !important; }
.border-color-trash { border-color: var(--color-trash) !important; }
.text-color-trash { color: var(--color-trash) !important; }

.bg-color-action { background-color: var(--color-action) !important; }
.border-color-action { border-color: var(--color-action) !important; }
.text-color-action { color: var(--color-action) !important; }

.bg-color-amount { background-color: var(--color-amount) !important; }
.border-color-amount { border-color: var(--color-amount) !important; }
.text-color-amount { color: var(--color-amount) !important; }

.bg-color-artifact { background-color: var(--color-artifact) !important; }
.border-color-artifact { border-color: var(--color-artifact) !important; }
.text-color-artifact { color: var(--color-artifact) !important; }

.bg-color-cardtrait { background-color: var(--color-cardtrait) !important; }
.border-color-cardtrait { border-color: var(--color-cardtrait) !important; }
.text-color-cardtrait { color: var(--color-cardtrait) !important; }

.bg-color-damage { background-color: var(--color-damage) !important; }
.border-color-damage { border-color: var(--color-damage) !important; }
.text-color-damage { color: var(--color-damage) !important; }

.bg-color-downside { background-color: var(--color-downside) !important; }
.border-color-downside { border-color: var(--color-downside) !important; }
.text-color-downside { color: var(--color-downside) !important; }

.bg-color-drone { background-color: var(--color-drone) !important; }
.border-color-drone { border-color: var(--color-drone) !important; }
.text-color-drone { color: var(--color-drone) !important; }

.bg-color-enemy { background-color: var(--color-enemy) !important; }
.border-color-enemy { border-color: var(--color-enemy) !important; }
.text-color-enemy { color: var(--color-enemy) !important; }

.bg-color-energy { background-color: var(--color-energy) !important; }
.border-color-energy { border-color: var(--color-energy) !important; }
.text-color-energy { color: var(--color-energy) !important; }

.bg-color-faint { background-color: var(--color-faint) !important; }
.border-color-faint { border-color: var(--color-faint) !important; }
.text-color-faint { color: var(--color-faint) !important; }

.bg-color-heal { background-color: var(--color-heal) !important; }
.border-color-heal { border-color: var(--color-heal) !important; }
.text-color-heal { color: var(--color-heal) !important; }

.bg-color-health { background-color: var(--color-health) !important; }
.border-color-health { border-color: var(--color-health) !important; }
.text-color-health { color: var(--color-health) !important; }

.bg-color-hull { background-color: var(--color-hull) !important; }
.border-color-hull { border-color: var(--color-hull) !important; }
.text-color-hull { color: var(--color-hull) !important; }

.bg-color-keyword { background-color: var(--color-keyword) !important; }
.border-color-keyword { border-color: var(--color-keyword) !important; }
.text-color-keyword { color: var(--color-keyword) !important; }

.bg-color-midrow { background-color: var(--color-midrow) !important; }
.border-color-midrow { border-color: var(--color-midrow) !important; }
.text-color-midrow { color: var(--color-midrow) !important; }

.bg-color-part { background-color: var(--color-part) !important; }
.border-color-part { border-color: var(--color-part) !important; }
.text-color-part { color: var(--color-part) !important; }

.bg-color-parttrait { background-color: var(--color-parttrait) !important; }
.border-color-parttrait { border-color: var(--color-parttrait) !important; }
.text-color-parttrait { color: var(--color-parttrait) !important; }

.bg-color-status { background-color: var(--color-status) !important; }
.border-color-status { border-color: var(--color-status) !important; }
.text-color-status { color: var(--color-status) !important; }
/* END Colors */

/* ===========================
 * Redlinks
 * ===========================
 */
span.redlink > a:link,
a[href*="redlink=1"] {
	color: var(--color-enemy) !important;
}

span.redlink > a:visited,
a[href*="redlink=1"]:visited  {
	color: var(--color-enemy) !important;
}
/* END Redlinks */

/* ===========================
 * MediaWiki overrides
 * ===========================
 */
.wikitable {
	background-color: transparent;
	border-width: 0;
    color: #ddd;
}

.wikitable >caption {
	background-color: #060326;
	border: 1px solid #a2a9b1;
    border-bottom: 0;
	padding: 0.2em 0.4em;
}

.wikitable td,
.mw-datatable td {
	background-color: #060326;
    white-space: normal;
}

.mw-datatable tr:hover td {
	background-color: #130c61;
}

.wikitable > tr > th,
.wikitable > * > tr > th,
.mw-datatable th {
	background-color: #2c54a0;
}

.mw-templatedata-doc-muted {
	color: #888;
}

.toc,
.toccolours {
	background-color: #060326;
}

.toctogglelabel,
a.mw-collapsible-text {
	color: #9D96D3;
}

.tocnumber {
	color: #ddd;
}

.catlinks {
	background-color: #060326;
}

*:not(.mw-highlight) > pre,
*:not(.mw-highlight) > code,
*:not(.mw-highlight) > .mw-code {
    background-color: #060326;
    color: #ddd;
    border-width: 0;
}

.mw-templatedata-doc-param-alias {
	color: #333;
}

.vector-search-box-input {
    background-color: #060326;
    color: #ddd;
}

.searchButton[name='go'] {
	background-color: #fff;
}

.mw-search-profile-tabs {
	background-color: #060326;
	border-color: #2c54a0;
}

.mw-search-profile-tabs >.search-types >ul >li >a {
	color: #84b6ff !important;
}

.mw-search-profile-tabs >.search-types >ul >li.current {
	background-color: #2c54a0;
	font-weight: bold;
}

ul {
	list-style: disc;
}
/* END MediaWiki color overrides */

body {
    background-image: url("https://cobaltcore.wiki.gg/images/2/26/Background.png");
    /*background-color: #0B0A2F;*/
    background-attachment: fixed;
    background-size: cover;
    overflow-x: visible;
    overflow-y: visible;
    position: relative;
    top: 0;
}

/* (removing this older version of the logo now that it has been replaced with a wiki specific logo)
#p-logo {
    background-image: url("https://cobaltcore.wiki.gg/images/8/8e/Logo_Transparent.png");
    background-size: 160px;
}
*/

#mw-page-base {
    background-image: none;
    background-color: #FFFFFF00;
}

#content {
    background-color: #1F2656CC;
    color: #B2B2B2;
    border-color: #060326;
    border-style: solid;
    border-width: 2px;
    margin-right: 20px;
}

h1, h2, h3, h4, h5, h6, p, label, .mw-headline, .mw-footer, .mw-footer li, #content {
    color: #DDDDDD;
}


/* editing UI */
.diffchange {
	color: #4a4a4a;
}

.editOptions label {
	color: inherit;
}

/* end editing UI */

.vector-menu-portal {
    background-color: #0C0C31CC;
}

.vector-menu-portal .vector-menu-content li a:is(:visited, :link) {
	color: #9D96D3;
}

#content a:link, #content a:visited, a:link, a:visited {
    color: #9D96D3;
}

/* Vector Tabs background removal */
.vector-menu-tabs-legacy .selected,
.vector-menu-tabs-legacy li,
.vector-menu-tabs, .vector-menu-tabs a,
#mw-head .vector-menu-dropdown .vector-menu-heading {
    background: none;
    
}

.vector-menu-tabs-legacy .selected, .vector-menu-tabs-legacy li{
    background-color: #1F2656CC;
    border-color: #060326;
    border-style: none solid none solid;
    border-width: 1px;
}

.vector-menu-tabs a:visited, .vector-menu-tabs a:link, .vector-menu-tabs a:hover, .vector-menu-tabs a:active {
    color: #9D96D3;
}

.galleries .gallerybox .thumb {
    background-color: #090623;
}

.galleries .gallerybox .thumb img {
    image-rendering: pixelated;
}

.m-0 {
    margin: 0;
}

.mt-0 {
    margin-top: 0;
}

.mb-0 {
    margin-bottom: 0;
}

.d-flex {
    display: flex; 
}

.justify-content-center {
    justify-content: center;
}

.justify-content-space-around {
    justify-content: space-around;
}

.flex-column {
    flex-direction: column;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-grow-0,
.flex-children-grow-0 > * {
    flex-grow: 0;
}

.flex-grow-1,
.flex-children-grow-1 > * {
    flex-grow: 1;
}

.flex-shrink-0,
.flex-children-shrink-0 > * {
    flex-shrink: 0;    
}

.flex-shrink-1,
.flex-children-shrink-1 > * {
    flex-shrink: 1;    
}

.text-align-center {
    text-align: center;
}

hr {
	margin: 1em 0;
}

.vector-menu-tabs-legacy .selected a, .vector-menu-tabs-legacy .selected a:visited {
    color: #fcfbfd;
}

/* ===========================
 * Portable Infoboxes
 * ===========================
 */
:root {
	--pi-background: #060326;
    --pi-secondary-background: #2c54a0;
    --pi-border-color: #2c54a0;
}

.portable-infobox {
    background-color: #060326;
    color: #84b6ff;
    border: #2c54a0;
}

.portable-infobox.pi-type-enemy {
	--pi-width: 290px;
}

.portable-infobox.pi-type-enemy .pi-item[data-source="pilot"] {
	padding: 10px;
	overflow: visible;
}

.portable-infobox.pi-type-enemy .pi-item[data-source="pilot"] .pi-data-value {
	padding: 0;
}

.portable-infobox .pi-secondary-background {
    background-color: #0f085e;
}
/* END Portable Infoboxes */



/* ===========================
 * Template:Dialogue_Box
 * ===========================
 */
.dialogue-box .dialogue-box-outer-border {
	border: 4px solid #000;
}

.dialogue-box .dialogue-box-inner {
	flex-grow: 1;
	background: #000;
	border: 4px solid #5199ff;
	padding: 24px;
}

.dialogue-box .dialogue-box-inner .dialogue-box-icon {
	flex-shrink: 0;
	margin-right: 24px;
}

.dialogue-box .dialogue-box-inner .dialogue-box-text {
	flex-grow: 1;
    white-space: normal;
}

.dialogue-box .dialogue-box-bottom-border {
	flex-shrink: 0;
	border-bottom: 8px solid #3a67cc;
}

.dialogue-box.size-2x .dialogue-box-outer-border {
	border-width:2px;
}

.dialogue-box.size-2x .dialogue-box-inner {
	border-width:2px;
	padding:12px;
}

.dialogue-box.size-2x .dialogue-box-inner .dialogue-box-icon {
	margin-right: 12px;
}

.dialogue-box.size-2x .dialogue-box-bottom-border {
	border-width:4px;
}

.dialogue-box.size-1x .dialogue-box-outer-border {
	border-width:1px;
}

.dialogue-box.size-1x .dialogue-box-inner {
	border-width:1px;
	padding:6px;
}

.dialogue-box.size-1x .dialogue-box-inner .dialogue-box-icon {
	margin-right: 6px;
}

.dialogue-box.size-1x .dialogue-box-bottom-border {
	border-width:2px;
}
/* END Template:Dialogue_Box */

/* ===========================
 * Template:Character_Panel
 * ===========================
 */
.character-panel {
    --character-panel-width-1x: 64;
    --character-panel-height-1x: 61;
    --character-panel-border-width-1x: 1;
    --character-panel-3d-side-width-1x: 3;
    
	position: relative;
	width: calc(var(--character-panel-width-1x) * 4px);
	z-index: 5;
}

.character-panel:before {
	content: '';
	display: block;
	padding-bottom: calc( 100% * var(--character-panel-height-1x) / var(--character-panel-width-1x) );
}

.character-panel .character-panel-outer {
	position: absolute;
	top: 0;
	left: 0;
	max-width: 100%;
	width: auto;
	height: auto;
}

.character-panel .character-panel-inner {
	position: absolute;
	top: calc( 100% * 1 / var(--character-panel-height-1x) );
	transform-origin: 0 0;
}

.character-panel:not(.flip) .character-panel-inner {
	left: calc( 100% * 4 / var(--character-panel-width-1x) );
}

.character-panel .character-panel-label {
	position: absolute;
    top: calc( 100% * 4 / var(--character-panel-height-1x) );
    left: calc( 100% * 7 / var(--character-panel-width-1x) );
    opacity: 0.65;
}

.character-panel.flip .character-panel-outer,
.character-panel.flip .character-panel-inner {
    rotate: y 180deg;
    /* transform-origin: center center; */
}

.character-panel.flip .character-panel-inner {
	/* right: calc( 100% * 4 / var(--character-panel-width-1x) ); */
    left: calc(100% - var(--character-panel-border-width-1x) * 4px - var(--character-panel-3d-side-width-1x) * 4px);
}

.character-panel.flip .character-panel-label {
    left: calc( 100% * 4 / var(--character-panel-width-1x) );
}

.character-panel.size-2x {
	width: calc(var(--character-panel-width-1x) * 2px);
}

.character-panel.size-2x .character-panel-inner {
	scale: 0.5;
}

.character-panel.flip.size-2x .character-panel-inner {
    left: calc(100% - var(--character-panel-border-width-1x) * 2px - var(--character-panel-3d-side-width-1x) * 2px);
}

.character-panel.size-1x {
	width: calc(var(--character-panel-width-1x) * 1px);
}

.character-panel.size-1x .character-panel-inner {
	scale: 0.25;
}

.character-panel.flip.size-1x .character-panel-inner {
    left: calc(100% - var(--character-panel-border-width-1x) * 1px - var(--character-panel-3d-side-width-1x) * 1px);
}
/* END Template:Character_Panel */

/* ===========================
 * Template:Character_Panel_Mini
 * ===========================
 */
.character-panel-mini,
.character-panel-mini *,
.character-panel-mini *:before {
    position: relative;
    box-sizing: border-box;
}

.character-panel-mini {
    --character-panel-mini-width-4x: 140px;
    --character-panel-mini-height-4x: 132px;
    --character-panel-mini-border-width-4x: 4px;
    display: flex;
    background: #060326;
    width: var(--character-panel-mini-width-4x);
    height: var(--character-panel-mini-height-4x);
    border: var(--character-panel-mini-border-width-4x) solid #000;
}

/* .character-panel-mini .character-panel-mini-outer-border {
    border: 4px solid #000;
} */

.character-panel-mini .character-panel-mini-left-border {
    /* border-left: 8px solid #bcbcbc; */
    flex-shrink: 0;
    width: calc(8% / 132 * 100);
    height: 100%;
    background: #fff;
}

.character-panel-mini .character-panel-mini-inner {
    flex-grow: 1;
    /* width: 124px;
    height: 124px; */
    border: 4px solid #fff;
    overflow: visible;
}

/* .character-panel-mini .character-panel-mini-inner:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #060326;
    border: 4px solid #fff;
} */

.character-panel-mini .character-panel-mini-inner .character-panel-mini-corner-triangle {
    display: flex;
    align-items: flex-end;
    position: absolute;
    bottom: calc(4% / 116 * 100);
    left: calc(4% / 116 * 100);
    width: calc(28% / 116 * 100);
    height: calc(28% / 116 * 100);
    opacity: 0.35;
}

.character-panel-mini .character-panel-mini-inner .character-panel-mini-corner-triangle .character-panel-mini-corner-triangle-step {
    width: calc(1% / 7 * 100);
    background: #fff;
}

.character-panel-mini .character-panel-mini-inner .character-panel-mini-corner-triangle .character-panel-mini-corner-triangle-step:nth-child(1) {
    height: 100%;
}

.character-panel-mini .character-panel-mini-inner .character-panel-mini-corner-triangle .character-panel-mini-corner-triangle-step:nth-child(2) {
    height: calc(6% / 7 * 100);
}

.character-panel-mini .character-panel-mini-inner .character-panel-mini-corner-triangle .character-panel-mini-corner-triangle-step:nth-child(3) {
    height: calc(5% / 7 * 100);
}

.character-panel-mini .character-panel-mini-inner .character-panel-mini-corner-triangle .character-panel-mini-corner-triangle-step:nth-child(4) {
    height: calc(4% / 7 * 100);
}

.character-panel-mini .character-panel-mini-inner .character-panel-mini-corner-triangle .character-panel-mini-corner-triangle-step:nth-child(5) {
    height: calc(3% / 7 * 100);
}

.character-panel-mini .character-panel-mini-inner .character-panel-mini-corner-triangle .character-panel-mini-corner-triangle-step:nth-child(6) {
    height: calc(2% / 7 * 100);
}

.character-panel-mini .character-panel-mini-inner .character-panel-mini-corner-triangle .character-panel-mini-corner-triangle-step:nth-child(7) {
    height: calc(1% / 7 * 100);
}

.character-panel-mini .character-panel-mini-inner >img {
    position: absolute;
    top: calc(-4% / 124 * 100);
    left: 0;
	transform-origin: 0 0;
}

.character-panel-mini.size-2x {
    width: calc(var(--character-panel-mini-width-4x) / 2);
    height: calc(var(--character-panel-mini-height-4x) / 2);
}

.character-panel-mini.size-2x,
.character-panel-mini.size-2x .character-panel-mini-inner {
    border-width: calc(var(--character-panel-mini-border-width-4x) / 2);
}

.character-panel-mini.size-2x .character-panel-mini-inner >img {
    scale: 0.5;
}

.character-panel-mini.size-1x {
    width: calc(var(--character-panel-mini-width-4x) / 4);
    height: calc(var(--character-panel-mini-height-4x) / 4);
}

.character-panel-mini.size-1x,
.character-panel-mini.size-1x .character-panel-mini-inner {
    border-width: calc(var(--character-panel-mini-border-width-4x) / 4);
}

.character-panel-mini.size-1x .character-panel-mini-inner >img {
    scale: 0.25;
}
/* END Template:Character_Panel_Mini */

/* ===========================
 * Template:Character_Quote
 * ===========================
 */
.character-quote {
	align-items: start;
    justify-content: start;
    max-width: 700px;
}

.character-quote >.character-panel {
	flex-shrink: 0;
	margin-right: 8px;
}

.character-quote + .character-quote {
    margin-top: 10px;
}

@media only screen and (min-width:768px) {	
    .character-quote.flip {
        justify-content: flex-end;
    }

	.character-quote.flip >.character-panel {
		order: 2;
        margin-right: 0;
        margin-left: 8px;
	}
	.character-quote.flip >.dialogue-box {
		order: 1;
	}
}

@media only screen and (max-width:767px) {
	.character-quote {
		flex-direction: column;
	}

    .character-quote.flip {
        align-items: flex-end;
    }
	
	.character-quote >.character-panel {
		margin-right: 0;
		margin-bottom: 8px;
	}
}
/* END Template:Character_Quote */

/* ===========================
 * Template:Character_Pose_Mini
 * ===========================
 */
.character-pose,
.character-pose * {
    position: relative;
    box-sizing: border-box;
}

.character-pose.mini {
    --character-pose-mini-width-1x: 26;
    --character-pose-mini-height-1x: 27;
    --character-pose-mini-offset-top-1x: 3;
    --character-pose-mini-offset-left-1x: 2;
    width: calc(var(--character-pose-mini-width-1x) * 4px);
    height: calc(var(--character-pose-mini-height-1x) * 4px);
    overflow: hidden;
}

.character-pose.mini > img {
    position: absolute;
    top: calc(-1 * var(--character-pose-mini-offset-top-1x) * 4px);
    left: calc(-1 * var(--character-pose-mini-offset-left-1x) * 4px);
    transform-origin: 0 0;
}

.character-pose.mini.size-2x {
    width: calc(var(--character-pose-mini-width-1x) * 2px);
    height: calc(var(--character-pose-mini-height-1x) * 2px);
}

.character-pose.mini.size-2x > img {
    top: calc(-1 * var(--character-pose-mini-offset-top-1x) * 2px);
    left: calc(-1 * var(--character-pose-mini-offset-left-1x) * 2px);
    scale: 0.5;
}

.character-pose.mini.size-1x {
    width: calc(var(--character-pose-mini-width-1x) * 1px);
    height: calc(var(--character-pose-mini-height-1x) * 1px);
}

.character-pose.mini.size-1x > img {
    top: calc(-1 * var(--character-pose-mini-offset-top-1x) * 1px);
    left: calc(-1 * var(--character-pose-mini-offset-left-1x) * 1px);
    scale: 0.25;
}
/* END Template:Character_Pose_Mini */

/* ===========================
 * Template:IconLink
 * ===========================
 */
.icon-link {
    display: inline-flex;
    align-items: center;
}

.icon-link >.icon {
    display: inline-flex;
    align-items: center;
}

.icon-link >.icon >a {
    display: inline-flex;
    align-items: center;
    padding-right: 3px;
}

.icon-link:hover >.label >a,
.icon-link:focus >.label >a {
    text-decoration: underline;
}

.icon-link.parttrait,
.icon-link.status {
    vertical-align: -4px;
}

.icon-link.artifact,
.icon-link.difficulty {
    vertical-align: -2px;
}
/* END Template:IconLink */
Retrieved from "https://cobaltcore.wiki.gg/index.php?title=MediaWiki:Common.css&oldid=6418"