MediaWiki:Common.css: Difference between revisions

From Parallel Wiki
Jump to navigation Jump to search
No edit summary
(Add support for custom hex code colors)
 
(3 intermediate revisions by the same user not shown)
Line 189: Line 189:


/* Try to use nearest neighbour scaling for pixelated images */
/* Try to use nearest neighbour scaling for pixelated images */
.mcwiki-header-grass,
.ns-special .gallerybox img,
.ns-14 .gallerybox img,
.filehistory a img,
.filehistory a img,
.pixel-image,
.pixel-image,
Line 272: Line 275:
text-shadow: 0.125em 0.125em 0 #000;
text-shadow: 0.125em 0.125em 0 #000;
}
}
.format-1 {
.format-1 {
color: #00A;
color: #0000A8;
text-shadow: 0.125em 0.125em 0 #00002A;
text-shadow: 0.125em 0.125em 0 #00002A;
}
}
.format-2 {
.format-2 {
color: #0A0;
color: #00A800;
text-shadow: 0.125em 0.125em 0 #002A00;
text-shadow: 0.125em 0.125em 0 #002A00;
}
}
.format-3 {
.format-3 {
color: #0AA;
color: #00A8A8;
text-shadow: 0.125em 0.125em 0 #002A2A;
text-shadow: 0.125em 0.125em 0 #002A2A;
}
}
.format-4 {
.format-4 {
color: #A00;
color: #A80000;
text-shadow: 0.125em 0.125em 0 #2A0000;
text-shadow: 0.125em 0.125em 0 #2A0000;
}
}
.format-5 {
.format-5 {
color: #A0A;
color: #A800A8;
text-shadow: 0.125em 0.125em 0 #2A002A;
text-shadow: 0.125em 0.125em 0 #2A002A;
}
}
.format-6 {
.format-6 {
color: #FA0;
color: #FBA800;
text-shadow: 0.125em 0.125em 0 #2A2A00;
text-shadow: 0.125em 0.125em 0 #3E2A00;
}
}
.format-7 {
.format-7 {
color: #AAA;
color: #A8A8A8;
text-shadow: 0.125em 0.125em 0 #2A2A2A;
text-shadow: 0.125em 0.125em 0 #2A2A2A;
}
}
.format-8 {
.format-8 {
color: #555;
color: #545454;
text-shadow: 0.125em 0.125em 0 #151515;
text-shadow: 0.125em 0.125em 0 #151515;
}
}
.format-9 {
.format-9 {
color: #55F;
color: #5454FB;
text-shadow: 0.125em 0.125em 0 #15153F;
text-shadow: 0.125em 0.125em 0 #15153E;
}
}
.format-a {
.format-a {
color: #5F5;
color: #54FB54;
text-shadow: 0.125em 0.125em 0 #153F15;
text-shadow: 0.125em 0.125em 0 #153E15;
}
}
.format-b {
.format-b {
color: #5FF;
color: #54FBFB;
text-shadow: 0.125em 0.125em 0 #153F3F;
text-shadow: 0.125em 0.125em 0 #153E3E;
}
}
.format-c {
.format-c {
color: #F55;
color: #FB5454;
text-shadow: 0.125em 0.125em 0 #3F1515;
text-shadow: 0.125em 0.125em 0 #3E1515;
}
}
.format-d {
.format-d {
color: #F5F;
color: #FB54FB;
text-shadow: 0.125em 0.125em 0 #3F153F;
text-shadow: 0.125em 0.125em 0 #3E153E;
}
}
.format-e {
.format-e {
color: #FF5;
color: #FBFB54;
text-shadow: 0.125em 0.125em 0 #3F3F15;
text-shadow: 0.125em 0.125em 0 #3E3E15;
}
}
.format-f,
.format-f,
#minetip-tooltip {
#minetip-tooltip {
color: #FFF;
color: #FBFBFB;
text-shadow: 0.125em 0.125em 0 #3F3F3F;
text-shadow: 0.125em 0.125em 0 #3E3E3E;
}
.format-g {
color: #DDD605;
text-shadow: 0.125em 0.125em 0 #373501;
}
.format-h {
color: #E3D4D1;
text-shadow: 0.125em 0.125em 0 #383534;
}
.format-i {
color: #CECACA;
text-shadow: 0.125em 0.125em 0 #333232;
}
.format-j {
color: #443A3B;
text-shadow: 0.125em 0.125em 0 #110E0E;
}
}
.format-l {
.format-l {
font-weight: bold;
font-weight: bold;
letter-spacing: 0.125em;
letter-spacing: 0.125em;
}
}
.format-m {
.format-m {
text-decoration: line-through;
text-decoration: line-through;
}
}
.format-n {
.format-n {
text-decoration: underline;
text-decoration: underline;
}
}
.format-o {
.format-o {
font-style: italic;
font-style: italic;
}
.format-p {
color: #DEB12D;
text-shadow: 0.125em 0.125em 0 #372C0B;
}
.format-q {
color: #47A036;
text-shadow: 0.125em 0.125em 0 #04280D;
}
.format-s {
color: #2CBAA8;
text-shadow: 0.125em 0.125em 0 #0B2E2A;
}
.format-t {
color: #21497B;
text-shadow: 0.125em 0.125em 0 #08121E;
}
.format-u {
color: #9A5CC6;
text-shadow: 0.125em 0.125em 0 #261731;
}
.format-v {
color: #EB7114;
text-shadow: 0.125em 0.125em 0 #3B1D05;
}
/* Custom color codes because §m and §n are used twice. */
.format-y {
color: #971607;
text-shadow: 0.125em 0.125em 0 #250501;
}
.format-z {
color: #B4684D;
text-shadow: 0.125em 0.125em 0 #2D1A13;
}
/* Class for &#123456 and &$123 adding custom hex colors. */
.format-custom {
text-shadow: 0.125em 0.125em 0 color-mix(in srgb, currentColor 25%, #000 75%);
}
}



Latest revision as of 01:48, 5 November 2024

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

/*
 * This is the CSS for all desktop skins on en.Wikipedia.
 * Styling inside .mw-parser-output should generally use TemplateStyles.
 */

body {
	font-family: "Liberation Sans", Arial, Helvetica, FreeSans, sans-serif;
}

/** Main page stylings **/
@supports (flex-wrap: wrap) { 
	.edition-group {
		display: flex;
		flex-wrap: wrap;
	}
	.edition-group .edition-box {
		flex: 17.4em;
	}
}



/* Hatnotes and disambiguation notices */
.hatnote {
	font-style: italic;
}

.hatnote i {
	font-style: normal;
}

div.hatnote {
	padding-left: 1.6em;
	margin-bottom: 0.5em;
}

div.hatnote + div.hatnote {
	margin-top: -0.5em;
}

/* [[Template:Layered blueprint]] */
@-webkit-keyframes layered-blueprint-fade-in {
	0% {
		opacity: 0;
		visibility: hidden;
	}
	100% {
		opacity: 1;
		visibility: visible;
	}
}

@keyframes layered-blueprint-fade-in {
	0% {
		opacity: 0;
		visibility: hidden;
	}
	100% {
		opacity: 1;
		visibility: visible;
	}
}

.layered-blueprint-layer {
	-webkit-animation: layered-blueprint-fade-in 200ms;
	animation: layered-blueprint-fade-in 200ms;
}

@-webkit-keyframes layered-blueprint-fade-out {
	0% {
		opacity: 1;
		visibility: visible;
	}
	100% {
		opacity: 0;
		visibility: hidden;
	}
}

@keyframes layered-blueprint-fade-out {
	0% {
		opacity: 1;
		visibility: visible;
	}
	100% {
		opacity: 0;
		visibility: hidden;
	}
}

.layered-blueprint-radio:checked + .layered-blueprint-tab + .layered-blueprint-layer ~ .layered-blueprint-layer {
	-webkit-animation: layered-blueprint-fade-out 200ms;
	animation: layered-blueprint-fade-out 200ms;
}

/* [[Template:YouTube]] */
.youtube-video {
	display: block;
}

/* Prevent page jump from the toolbar loading */
.client-js #editform {
	/* To disable margin collapsing */
	overflow: hidden;
}

.client-js .mw-editform > #wpTextbox1 {
    margin-top: 73px;
}

.wikiEditor-ui-toolbar .tabs span.tab a:before {
	filter: invert(1);
}

/* Alternating cell background */
.alternatecells:nth-child(odd) {
	background-color: #F9F9F9;
}
body.wgl-theme-dark .alternatecells:nth-child(odd) {
	background-color: #222;
}

/* Alternating table rows, primarily used with [[Template:Infobox row]] */
.alternaterows tr:nth-child(even),
.infobox-rows tr:nth-child(even) {
	background-color: #F9F9F9;
}
body.wgl-theme-dark .alternaterows tr:nth-child(even),
body.wgl-theme-dark .infobox-rows tr:nth-child(even) {
	background-color: #222;
}

/* Scale file page image to the width of the page */
#file img {
	max-width: 100%;
	height: auto;
}

/* Highlight clicked reference in blue to help navigation */
ol.references li:target,
sup.reference:target,
span.citation:target { 
	background-color: #C1DAF2;
}

/* Style the sitenotice */
#siteNotice #localNotice,
#siteNotice .globalNotice,
.page-MediaWiki_Sitenotice .mw-content-ltr .mw-parser-output {
	margin-bottom: 24px;
}

/* Allow parts of toc to be hidden */
/* Section levels */
.toc-hidelevel2 .toclevel-1 ul,
.toc-hidelevel3 .toclevel-2 ul,
.toc-hidelevel4 .toclevel-3 ul,
/* Numbers */
.toc-nonumbers .tocnumber {
	display: none;
}

/* Adjust styles for small screens */
@media (max-width: 500px) {
	#content div.thumb {
		float: none;
	}
}

/* Simulate link styling for JS only links */
.jslink {
	color: #0645AD;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.jslink:hover {
	text-decoration: underline;
	cursor: pointer;
}

.jslink:active {
	color: #FAA700;
}

/* Try to use nearest neighbour scaling for pixelated images */
.mcwiki-header-grass,
.ns-special .gallerybox img,
.ns-14 .gallerybox img,
.filehistory a img,
.pixel-image,
.invslot-item-image,
.sprite {
	image-rendering: optimizeSpeed;
	image-rendering: -webkit-optimize-contrast;
	image-rendering: optimize-contrast;
	image-rendering: -moz-crisp-edges;
	image-rendering: -o-crisp-edges;
	image-rendering: crisp-edges;
	image-rendering: pixelated;
	-ms-interpolation-mode: nearest-neighbor;
}

/* Add [[File:Mojang logo.svg]] to known Mojang employee userlinks */
.mw-userlink[href="/w/User:Dinnerbone-gpuser"], .mw-userlink[href="/w/User:Dinnerbone-gpuser?action=edit&redlink=1"],
.mw-userlink[href="/w/User:Jeb_mojang"], .mw-userlink[href="/w/User:Jeb_mojang?action=edit&redlink=1"],
.mw-userlink[href="/w/User:MidnightEnforcer"], .mw-userlink[href="/w/User:MidnightEnforcer?action=edit&redlink=1"],
.mw-userlink[href="/w/User:Minecraft_Staff"], .mw-userlink[href="/w/User:Minecraft_Staff?action=edit&redlink=1"],
.mw-userlink[href="/w/User:Mojang_tommo"], .mw-userlink[href="/w/User:Mojang_tommo?action=edit&redlink=1"],
.mw-userlink[href="/w/User:Slicedlime"], .mw-userlink[href="/w/User:Slicedlime?action=edit&redlink=1"],
.mw-userlink[href="/w/User:Jocopa3"], .mw-userlink[href="/w/User:Jocopa3?action=edit&redlink=1"],
.mw-userlink[href="/w/User:IP_Justice"], .mw-userlink[href="/w/User:IP_Justice?action=edit&redlink=1"],
.mw-userlink[href="/w/User:Cornerhard"], .mw-userlink[href="/w/User:Cornerhard?action=edit&redlink=1"],
.mw-userlink[href="/w/User:CornerHard"], .mw-userlink[href="/w/User:CornerHard?action=edit&redlink=1"],

/* legacy/deleted */
.mw-userlink[href="/w/User:MidnightEnforcer43458@legacy41488102"], .mw-userlink[href="/w/User:MidnightEnforcer43458@legacy41488102?action=edit&redlink=1"],
/* previously User:Jonkagstrom47437 */
.mw-userlink[href="/w/User:@DeletedUser40286849"], .mw-userlink[href="/w/User:@DeletedUser40286849?action=edit&redlink=1"],
/* previously User:shoghicp */
.mw-userlink[href="/w/User:@DeletedUser40317681"], .mw-userlink[href="/w/User:@DeletedUser40317681?action=edit&redlink=1"] {
	padding-left: 17px;
	background: url('filepath://Mojang_logo.svg') no-repeat left center;
	background-size: 14px 14px;
}

/* Add [[File:Grass Block JE7 BE6.png]] to known Minecraft/Mojang-related contractor employee userlinks */
.mw-userlink[href="/w/User:C418bla"], .mw-userlink[href="/w/User:C418bla?action=edit&redlink=1"] {
	padding-left: 17px;
	background: url('filepath://Grass_Block_JE7_BE6.png') no-repeat left center;
	background-size: 14px 14px;
}

/* Add [[File:Gray Mojang Thing.png]] to known ex-Mojang employee userlinks */
.mw-userlink[href="/w/User:EvilSeph"], .mw-userlink[href="/w/User:EvilSeph?action=edit&redlink=1"],
.mw-userlink[href="/w/User:ExcitedZe"], .mw-userlink[href="/w/User:ExcitedZe?action=edit&redlink=1"],
.mw-userlink[href="/w/User:Neon_Master"], .mw-userlink[href="/w/User:Neon_Master?action=edit&redlink=1"],
.mw-userlink[href="/w/User:RazzleberryFox"], .mw-userlink[href="/w/User:RazzleberryFox?action=edit&redlink=1"],
.mw-userlink[href="/w/User:Tahg"], .mw-userlink[href="/w/User:Tahg?action=edit&redlink=1"],
.mw-userlink[href="/w/User:Tamerjeison"], .mw-userlink[href="/w/User:Tamerjeison?action=edit&redlink=1"],
.mw-userlink[href="/w/User:HelenAngel"], .mw-userlink[href="/w/User:HelenAngel?action=edit&redlink=1"],
/* previously User:ProfMobius */
.mw-userlink[href="/w/User:@DeletedUser40549330"], .mw-userlink[href="/w/User:@DeletedUser40549330?action=edit&redlink=1"] {
	padding-left: 17px;
	background: url('filepath://Gray_Mojang_Thing.png') no-repeat left center;
}

/* Make external links the same colour as internal links, the icon is enough to differentiate them */
.mw-body a.external {
	color: #0645ad;
}

.mw-body a.external:visited {
	color: #0b0080;
}

.mw-body a.external:active {
	color: #faa700;
}

/* Make tabs the correct size */
body {
	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;
}

/* Classes corresponding to Minecraft formatting codes */
.format-0 {
	color: #000;
	text-shadow: 0.125em 0.125em 0 #000;
}
.format-1 {
	color: #0000A8;
	text-shadow: 0.125em 0.125em 0 #00002A;
}
.format-2 {
	color: #00A800;
	text-shadow: 0.125em 0.125em 0 #002A00;
}
.format-3 {
	color: #00A8A8;
	text-shadow: 0.125em 0.125em 0 #002A2A;
}
.format-4 {
	color: #A80000;
	text-shadow: 0.125em 0.125em 0 #2A0000;
}
.format-5 {
	color: #A800A8;
	text-shadow: 0.125em 0.125em 0 #2A002A;
}
.format-6 {
	color: #FBA800;
	text-shadow: 0.125em 0.125em 0 #3E2A00;
}
.format-7 {
	color: #A8A8A8;
	text-shadow: 0.125em 0.125em 0 #2A2A2A;
}
.format-8 {
	color: #545454;
	text-shadow: 0.125em 0.125em 0 #151515;
}
.format-9 {
	color: #5454FB;
	text-shadow: 0.125em 0.125em 0 #15153E;
}
.format-a {
	color: #54FB54;
	text-shadow: 0.125em 0.125em 0 #153E15;
}
.format-b {
	color: #54FBFB;
	text-shadow: 0.125em 0.125em 0 #153E3E;
}
.format-c {
	color: #FB5454;
	text-shadow: 0.125em 0.125em 0 #3E1515;
}
.format-d {
	color: #FB54FB;
	text-shadow: 0.125em 0.125em 0 #3E153E;
}
.format-e {
	color: #FBFB54;
	text-shadow: 0.125em 0.125em 0 #3E3E15;
}
.format-f,
#minetip-tooltip {
	color: #FBFBFB;
	text-shadow: 0.125em 0.125em 0 #3E3E3E;
}
.format-g {
	color: #DDD605;
	text-shadow: 0.125em 0.125em 0 #373501;
}
.format-h {
	color: #E3D4D1;
	text-shadow: 0.125em 0.125em 0 #383534;
}
.format-i {
	color: #CECACA;
	text-shadow: 0.125em 0.125em 0 #333232;
}
.format-j {
	color: #443A3B;
	text-shadow: 0.125em 0.125em 0 #110E0E;
}
.format-l {
	font-weight: bold;
	letter-spacing: 0.125em;
}
.format-m {
	text-decoration: line-through;
}
.format-n {
	text-decoration: underline;
}
.format-o {
	font-style: italic;
}
.format-p {
	color: #DEB12D;
	text-shadow: 0.125em 0.125em 0 #372C0B;
}
.format-q {
	color: #47A036;
	text-shadow: 0.125em 0.125em 0 #04280D;
}
.format-s {
	color: #2CBAA8;
	text-shadow: 0.125em 0.125em 0 #0B2E2A;
}
.format-t {
	color: #21497B;
	text-shadow: 0.125em 0.125em 0 #08121E;
}
.format-u {
	color: #9A5CC6;
	text-shadow: 0.125em 0.125em 0 #261731;
}
.format-v {
	color: #EB7114;
	text-shadow: 0.125em 0.125em 0 #3B1D05;
}
/* Custom color codes because §m and §n are used twice. */
.format-y {
	color: #971607;
	text-shadow: 0.125em 0.125em 0 #250501;
}
.format-z {
	color: #B4684D;
	text-shadow: 0.125em 0.125em 0 #2D1A13;
}
/* Class for &#123456 and &$123 adding custom hex colors. */
.format-custom {
	text-shadow: 0.125em 0.125em 0 color-mix(in srgb, currentColor 25%, #000 75%);
}

/* Styling for minecraft style tooltip */
#minetip-tooltip {
	position: fixed;
	top: 0;
	left: 0;
	background-color: #100010;
	background-color: rgba(16, 0, 16, 0.94);
	padding: 0.375em;
	font-family: Minecraft, sans-serif;
	font-size: 16px;
	word-spacing: 4px;
	white-space: nowrap;
	line-height: 1.25em;
	margin: 0.125em 0.25em;
	pointer-events: none;
	z-index: 9999;
}

#minetip-tooltip::before {
	content: "";
	position: absolute;
	top: 0.125em;
	right: -0.125em;
	bottom: 0.125em;
	left: -0.125em;
	border: 0.15em solid #100010;
	border-style: none solid;
	border-color: rgba(16, 0, 16, 0.94);
}

#minetip-tooltip::after {
	content: "";
	position: absolute;
	top: 0.125em;
	right: 0;
	bottom: 0.125em;
	left: 0;
	border: 0.125em solid #2D0A63;
	border-image: -webkit-linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;
	border-image: linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;
}

#minetip-tooltip > .description,
#minetip-tooltip > .minetip-description {
	display: block;
	margin-top: 0.25em;
}

/* prevent sitenotice show/hide toggle from moving page contents down after pageload */
.globalNotice .globalNoticeDismiss {
	float: right;
}

/* Prevent "Other Review Tools" from showing up at the top of Special:RecentChanges */
.mw-rcfilters-ui-rcTopSectionWidget-topLinks-table {
	display: none;
}

/* Style code, pre and similar elements/classes with one common styling */
@media screen {
	pre, code, .mw-code {
		background-color: #F8F9FA;
		color: #000;
		border: 1px solid #BBC2C6;
	}
}

kbd, .kbd-color {
	text-shadow: 0 1px 0 #FFF;
	background-color: #F8F9FA;
	color: #222;
	box-shadow: 0 1px rgba(0,0,0,0.2), 0 0 0 2px #FFF inset;
	border-color: #BBC2C6;
	font-size: smaller;
}

/* Fixes for small screens */
@media screen and (max-width: 720px) {
	#mw-head {
		top: 13px;
	}
	
	div#mw-navigation div#mw-panel {
		position: static !important; /* position: relative may be added to inline styles by built-in JS after page load; it needs an !important to override */
	}
}

@media screen and (max-width: 500px) {
	/* TOC fix */
	#mw-content-text > .mw-parser-output > div[style*="float"] {
		float: none !important;
		margin: 0 !important;
	}
}

/* presumable Discord link on comportal */
.CPDiscord {
	float: right;
	margin-left: 1em;
	clear: right;
}

/* Styling for tooltip */
.explain {
	border-bottom: 0;
	text-decoration: underline dotted;
	cursor: help;
}

/* Show help cursor when an abbr element has a title attribute */
abbr[title] {
	cursor: help;
}

/* Machine-readable extra template information */
.history-json, .chest-json, .chestcontents-json, .sound-json, .spawntable-json, .advancements-json, .achievements-json {
	display: none;
}

.mw-references-columns {
	overflow-wrap: break-word;
}