MediaWiki:Common.css/src/template/hp.scss

From Terraria Wiki
Jump to navigation Jump to search
/********* [[Template:Hp]] *********/

.hp {
	display: inline-block;
	vertical-align: middle;

	$heart-width: 22px;
	$heart-height: 22px;
	$gap: 2px;

	> div {
		margin: -$gap;
		max-width: ($heart-width + 2 * $gap) * 10; /* maximum number of hearts in one row: 10 */

		> img, > a {
			width: $heart-width;
			height: $heart-height;
			padding: $gap;
		}

		.text-red {
			color: #fe9b9b;
			@theme Underground {
				/* high contrast */
				color: #fe7c7c;
			}
			@theme Snow {
				/* high contrast */
				color: #d61616;
			}
			@theme Jungle {
				/* high contrast */
				color: #fe8f8f;
			}
			@theme Hallowed {
				/* contrast as high as possible (contrast ratio is only 3:1, but at higher ratios this is basically just white) */
				color: #ffb0b0;
			}
			@theme Crimson {
				/* high contrast */
				color: #fe9595;
			}
			// Corruption: same as default
			@theme Legacy {
				/* high contrast */
				color: #e71818;
			}
		}

		.text-golden {
			color: #e1ad60;
			@theme Underground {
				/* high contrast */
				color: #db9d40;
			}
			@theme Snow {
				/* high contrast */
				color: #946114;
			}
			@theme Jungle {
				/* high contrast */
				color: #dea44e;
			}
			@theme Hallowed {
				/* contrast as high as possible (contrast ratio is only 3:1, but at higher ratios this is basically just white) */
				color: #e4c15c;
			}
			@theme Crimson {
				/* high contrast */
				color: #dfa958;
			}
			// Corruption: same as default
			@theme Legacy {
				/* high contrast */
				color: #9f6919;
			}
		}
	}
}