MediaWiki:Attributes.css: Difference between revisions

.attribute-pill {
	--attribute-Beauty: #88cec6;
	--attribute-Change: #a0a9f4;
	--attribute-Competition: linear-gradient(90deg, rgba(213, 67, 68, 1) 0%, rgba(86, 112, 176, 1) 100%);
	--attribute-Dark: #734e9d;
	--attribute-Hate: #a893dd;
	--attribute-Insatiability: #c5db7d;
	--attribute-Joy: #f68481;
	--attribute-Light: #f8b430;
	--attribute-Love: #eda1b6;
	--attribute-Memory: #8ec0e8;
	--attribute-Oblivion: #aab4da;
	--attribute-Peace: #deceb0;
	--attribute-Pride: #b27ad3;
	--attribute-Prosperity: #fa8d43;
	--attribute-Reality: #959595;
	--attribute-Regret: #775378;
	--attribute-Right: #5bb8e7;
	--attribute-Satiation: #f5a77d;
	--attribute-Strength: #87b5f3;
	--attribute-Ugliness: #7c93aa;
	--attribute-War: #964545;
	--attribute-Weakness: #b6d0e7;
	
	--attribute-Blaster: #9c749d;
	--attribute-Cherubim: #fff;
	--attribute-Cherubim--text: #bba479;
	--attribute-Explorer: #9fc47b;
	--attribute-Gladiator: #bba479;
	--attribute-Hothead: #e36566;
	--attribute-Mascot: #f6b560;
	--attribute-Mastermind: #71b7af;
	--attribute-Protector: #d2a3ba;
	--attribute-Striker: #fa9269;
	
	--attribute-disposition-1: #798fe1;
	--attribute-disposition-2: #bd93e1;
	--attribute-disposition-3: #798fe1;/* replace with lvl3 color when known */

	display: inline-flex;
	align-items: center;
	border-radius: 16px;
	padding: 0 8px;
	height: 25px;
	margin: 2px;
	background-color: var(--theme-color-5);
	line-height: 1;
	position: relative;
}

.attribute-pill a,
.attribute-pill .mw-selflink {
	color: white;
	font-weight: 600;
}

.theme-fandomdesktop-light .attribute-pill-Cherubim,
.theme-fandommobile-light .attribute-pill-Cherubim {
	box-shadow: 0px 0px 3px var(--attribute-Cherubim--text);
}

/* Aspect Colors */
.attribute-pill-Beauty { background-color: var(--attribute-Beauty); }
.attribute-pill-Change { background-color: var(--attribute-Change); }
.attribute-pill-Competition { background: var(--attribute-Competition); }
.attribute-pill-Dark { background-color: var(--attribute-Dark); }
.attribute-pill-Hate { background-color: var(--attribute-Hate); }
.attribute-pill-Insatiability { background-color: var(--attribute-Insatiability); }
.attribute-pill-Insatiability a { color: black; }
.attribute-pill-Joy { background-color: var(--attribute-Joy); }
.attribute-pill-Light { background-color: var(--attribute-Light); }
.attribute-pill-Love { background-color: var(--attribute-Love); }
.attribute-pill-Memory { background-color: var(--attribute-Memory); }
.attribute-pill-Oblivion { background-color: var(--attribute-Oblivion); }
.attribute-pill-Peace { background-color: var(--attribute-Peace); }
.attribute-pill-Peace a { color: black; }
.attribute-pill-Pride { background-color: var(--attribute-Pride); }
.attribute-pill-Prosperity { background-color: var(--attribute-Prosperity); }
.attribute-pill-Regret { background-color: var(--attribute-Regret); }
.attribute-pill-Reality { background-color: var(--attribute-Reality); }
.attribute-pill-Right { background-color: var(--attribute-Right); }
.attribute-pill-Satiation { background-color: var(--attribute-Satiation); }
.attribute-pill-Strength { background-color: var(--attribute-Strength); }
.attribute-pill-Ugliness { background-color: var(--attribute-Ugliness); }
.attribute-pill-War { background-color: var(--attribute-War); }
.attribute-pill-Weakness { background-color: var(--attribute-Weakness); }
.attribute-pill-Weakness a { color: black; }

/* Trait Colors */
.attribute-pill-Blaster { background-color: var(--attribute-Blaster); }
.attribute-pill-Cherubim { background-color: var(--attribute-Cherubim); }
.attribute-pill-Cherubim a { color: var(--attribute-Cherubim--text) !important; }
.attribute-pill-Explorer { background-color: var(--attribute-Explorer); }
.attribute-pill-Gladiator { background-color: var(--attribute-Gladiator); }
.attribute-pill-Hothead { background-color: var(--attribute-Hothead); }
.attribute-pill-Mascot { background-color: var(--attribute-Mascot); }
.attribute-pill-Mastermind { background-color: var(--attribute-Mastermind); }
.attribute-pill-Protector { background-color: var(--attribute-Protector); }
.attribute-pill-Striker { background-color: var(--attribute-Striker); }

/* Disposition Colors */
.attribute-pill-disposition-1 { background-color: var(--attribute-disposition-1); }
.attribute-pill-disposition-2 { background-color: var(--attribute-disposition-2); }
.attribute-pill-disposition-3 { background-color: var(--attribute-disposition-3); }

/* Invert unreadable icons */
.attribute-pill-Insatiability img,
.attribute-pill-Peace img,
.attribute-pill-Weakness img {
	filter: invert();
}

.theme-fandomdesktop-light .attributeicon img {
	filter: invert();
}

.attribute-area-icon {
	width: 32px;
	height: 32px;
	background-color: white;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-right: 5px;
	position: relative;
	border: 2px solid #989daf;
}