MediaWiki:Gadget-Colortable.css - Revision history

Ihaveahax: adjust dark colors to increase contrast with text

2025-08-07T17:58:41Z

adjust dark colors to increase contrast with text

← Older revision		Revision as of 17:58, 7 August 2025
Line 5:		Line 5:
	--yellow-l: #fff9ac;		--yellow-l: #fff9ac;

	--green-d: #~~30623c~~;		--green-d: #03350f;
	--red-d: #~~5c312e~~;		--red-d: #3e0b07;
	--blue-d: #~~383477~~;		--blue-d: #120e59;
	--yellow-d: #~~5e5324~~;		--yellow-d: #3c3207;

	--green: var(--green-l);		--green: var(--green-l);

Ihaveahax: i don't think this padding rule is necessary anymore?

2024-05-02T02:47:02Z

i don't think this padding rule is necessary anymore?

← Older revision		Revision as of 02:47, 2 May 2024
Line 33:		Line 33:
	--blue: var(--blue-d);		--blue: var(--blue-d);
	--yellow: var(--yellow-d);		--yellow: var(--yellow-d);
	}

	~~body.skin-citizen .colortable td {~~
	~~padding: 10px; /* default padding is 10px 20px 10px 0 but it looks weird with bg colors */~~
	}		}

Ihaveahax: fix for citizen changes (hopefully)

2024-05-02T02:45:39Z

fix for citizen changes (hopefully)

← Older revision		Revision as of 02:45, 2 May 2024
Line 18:		Line 18:
	@media screen and (prefers-color-scheme: dark) {		@media screen and (prefers-color-scheme: dark) {
	/* only timeless has a dark theme skin right now */		/* only timeless has a dark theme skin right now */
	~~/* citizen is not here because it manages dark theme itself; adding it here will conflict with its light theme */~~		body.skin-timeless .colortable,
	body.skin-~~timeless~~ .colortable {		html.skin-theme-clientpref-os body.skin-citizen .colortable {
	--green: var(--green-d);		--green: var(--green-d);
	--red: var(--red-d);		--red: var(--red-d);
Line 27:		Line 27:
	}		}

	html.skin-citizen-dark .colortable {		html.skin-citizen-dark .colortable,
			html.skin-theme-clientpref-night body.skin-citizen .colortable {
	--green: var(--green-d);		--green: var(--green-d);
	--red: var(--red-d);		--red: var(--red-d);

Ihaveahax: move text-align to colored table elements

2023-08-22T12:13:52Z

move text-align to colored table elements

← Older revision		Revision as of 12:13, 22 August 2023
Line 1:		Line 1:
	.colortable {		.colortable {
	~~text-align: center;~~

	--green-l: #a7f6b0;		--green-l: #a7f6b0;
	--red-l: #fabfb9;		--red-l: #fabfb9;
Line 40:		Line 38:
	}		}

	.ct-green { background-color: var(--green) }		.ct-green { text-align: center; background-color: var(--green) }
	.ct-red { background-color: var(--red) }		.ct-red { text-align: center; background-color: var(--red) }
	.ct-blue { background-color: var(--blue) }		.ct-blue { text-align: center; background-color: var(--blue) }
	.ct-yellow { background-color: var(--yellow) }		.ct-yellow { text-align: center; background-color: var(--yellow) }

Ihaveahax: fix default yellow using blue

2023-02-27T08:06:53Z

fix default yellow using blue

← Older revision		Revision as of 08:06, 27 February 2023
Line 15:		Line 15:
	--red: var(--red-l);		--red: var(--red-l);
	--blue: var(--blue-l);		--blue: var(--blue-l);
	--yellow: var(--~~blue~~-l);		--yellow: var(--yellow-l);
	}		}

Ihaveahax: adjust colors, especially dark theme

2023-02-14T10:04:29Z

adjust colors, especially dark theme

← Older revision		Revision as of 10:04, 14 February 2023
Line 2:		Line 2:
	text-align: center;		text-align: center;

	--green-l: #~~c8ffc8~~;		--green-l: #a7f6b0;
	--red-l: #~~ffc8c8~~;		--red-l: #fabfb9;
	--blue-l: #~~c8c8ff~~;		--blue-l: #bfd4ff;
	--yellow-l: #~~eee8aa~~;		--yellow-l: #fff9ac;

	--green-d: #~~4b804b~~;		--green-d: #30623c;
	--red-d: #~~804b4b~~;		--red-d: #5c312e;
	--blue-d: #~~4b4b80~~;		--blue-d: #383477;
	--yellow-d: #~~746f3d~~;		--yellow-d: #5e5324;

	--green: var(--green-l);		--green: var(--green-l);
	--red: var(--red-l);		--red: var(--red-l);
	--blue: var(--blue-l);		--blue: var(--blue-l);

Ihaveahax: add yellow

2022-12-15T22:43:09Z

add yellow

← Older revision		Revision as of 22:43, 15 December 2022
Line 5:		Line 5:
	--red-l: #ffc8c8;		--red-l: #ffc8c8;
	--blue-l: #c8c8ff;		--blue-l: #c8c8ff;
			--yellow-l: #eee8aa;

	--green-d: #4b804b;		--green-d: #4b804b;
	--red-d: #804b4b;		--red-d: #804b4b;
	--blue-d: #4b4b80;		--blue-d: #4b4b80;
			--yellow-d: #746f3d;

	--green: var(--green-l);		--green: var(--green-l);
	--red: var(--red-l);		--red: var(--red-l);
	--blue: var(--blue-l);		--blue: var(--blue-l);
			--yellow: var(--blue-l);
	}		}

Line 22:		Line 25:
	--red: var(--red-d);		--red: var(--red-d);
	--blue: var(--blue-d);		--blue: var(--blue-d);
			--yellow: var(--yellow-d);
	}		}
	}		}
Line 29:		Line 33:
	--red: var(--red-d);		--red: var(--red-d);
	--blue: var(--blue-d);		--blue: var(--blue-d);
			--yellow: var(--yellow-d);
	}		}

Line 38:		Line 43:
	.ct-red { background-color: var(--red) }		.ct-red { background-color: var(--red) }
	.ct-blue { background-color: var(--blue) }		.ct-blue { background-color: var(--blue) }
			.ct-yellow { background-color: var(--yellow) }

Ihaveahax: generic version of Template:B9s LED table/styles.css

2022-11-01T00:46:06Z

generic version of Template:B9s LED table/styles.css

New page

.colortable {
text-align: center;

--green-l: #c8ffc8;
--red-l: #ffc8c8;
--blue-l: #c8c8ff;

--green-d: #4b804b;
--red-d: #804b4b;
--blue-d: #4b4b80;

--green: var(--green-l);
--red: var(--red-l);
--blue: var(--blue-l);
}

@media screen and (prefers-color-scheme: dark) {
/* only timeless has a dark theme skin right now */
/* citizen is not here because it manages dark theme itself; adding it here will conflict with its light theme */
body.skin-timeless .colortable {
--green: var(--green-d);
--red: var(--red-d);
--blue: var(--blue-d);
}
}

html.skin-citizen-dark .colortable {
--green: var(--green-d);
--red: var(--red-d);
--blue: var(--blue-d);
}

body.skin-citizen .colortable td {
padding: 10px; /* default padding is 10px 20px 10px 0 but it looks weird with bg colors */
}

.ct-green { background-color: var(--green) }
.ct-red { background-color: var(--red) }
.ct-blue { background-color: var(--blue) }