MediaWiki:Gadget-Formatting.css

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

/* Colors */
:root {
	--color-red: #F4001C;
	--color-orange: #F4A521;
	--color-yellow: #FBFF29;
	--color-green: #34C217;
	--color-cyan: #67FDFE;
	--color-blue: #3627FC;
	--color-purple: #CE1BD6;
	/* R-Action */
	--color-lightgreen: #80FF80;
	/* S-Action */
	--color-violet: #FF80FF;
	/* N-Action */
	--color-lightyellow: #FFFF80;
	--color-text-shadow: none;
	/* Images */
	--bg-on-dark: var(--background-color-disabled);
	--outline-on-dark:
		drop-shadow(1px 0 white)
		drop-shadow(-1px 0 white)
		drop-shadow(0 1px white)
		drop-shadow(0 -1px white);
	--bg-on-light: none;
	--outline-on-light: none;
}

html.skin-theme-clientpref-day {
	--color-orange: #FF9300;
	--color-cyan: #008EAB;
	--color-lightgreen: #5FE163;
	--color-violet: #E97ACD;
	--color-text-shadow: 1px  1px 1px #000,
						-1px -1px 1px #000,
						 1px  0   1px #000,
						-1px  0   1px #000,
						 0    1px 1px #000,
						 0   -1px 1px #4d4508;
	--bg-on-dark: none;
	--outline-on-dark: none;
	--bg-on-light: var(--background-color-disabled);
	--outline-on-light:
		drop-shadow(1px 1px black)
		drop-shadow(-1px -1px black)
		drop-shadow(-1px 1px black)
		drop-shadow(1px -1px black);
}

@media screen and (prefers-color-scheme: light) {
	html.skin-theme-clientpref-os {
		--color-orange: #FF9300;
		--color-cyan: #008EAB;
		--color-lightgreen: #5FE163;
		--color-violet: #E97ACD;
		--color-text-shadow: 1px  1px 1px #000,
							-1px -1px 1px #000,
							 1px  0   1px #000,
							-1px  0   1px #000,
							 0    1px 1px #000,
							 0   -1px 1px #4d4508;
		--bg-on-dark: none;
		--outline-on-dark: none;
		--bg-on-light: var(--background-color-disabled);
		--outline-on-light:
			drop-shadow(1px 1px black)
			drop-shadow(-1px -1px black)
			drop-shadow(-1px 1px black)
			drop-shadow(1px -1px black);
	}
}

.red {
	color: var(--color-red);
}
.orange {
	color: var(--color-orange);
}
.yellow {
	color: var(--color-yellow);
	text-shadow: var(--color-text-shadow);
}
.green {
	color: var(--color-green);
}
.cyan {
	color: var(--color-cyan);
}
.blue {
	color: var(--color-blue);
}
.purple {
	color: var(--color-purple);
}
.lightgreen {
	color: var(--color-lightgreen);
}
.violet {
	color: var(--color-violet);
}
.lightyellow {
	color: var(--color-lightyellow);
	text-shadow: var(--color-text-shadow);
}

/* Fonts */
.sans {
	font-family: "Comic Sans MS", "Comic Sans", "Chalkboard SE", sans-serif;
}
.papyrus {
	font-family: "Papyrus", sans-serif;
}
.dt {
	font-family: "Determination Mono", monospace;
}

/* Images */
.flip-image img {
	transform: scaleX(-1);
}

.extimage img {
	max-width: 100%;
}

.pi-theme-bg-on-dark .pi-image, .bg-on-dark img {
	background-color: var(--bg-on-dark);
}

.pi-theme-bg-on-light .pi-image, .bg-on-light img {
	background-color: var(--bg-on-light);
}

.pi-theme-outline-on-dark .pi-image img, .outline-on-dark img {
	filter: var(--outline-on-dark);
}

.pi-theme-outline-on-light .pi-image img, .outline-on-light img {
	filter: var(--outline-on-light);
}

/** <poem> styling **/
.poem {
	font-style: italic;
}