X-Git-Url: http://git.shiar.net/sheet.git/blobdiff_plain/c09dbeb9c62930fc46ec793d4f18eda815cd8c34..0e311de08dd204822e8b513ab71bbc6d50a171d7:/sc.css

diff --git a/sc.css b/sc.css
index b8e3981..19b40b0 100644
--- a/sc.css
+++ b/sc.css
@@ -9,6 +9,7 @@
 	padding: 0 0.2em;
 	background: transparent;
 	text-align: left;
+	vertical-align: top;
 }
 tr.alt td {
 	font-size: 70%;
@@ -37,6 +38,15 @@ table h2 {
 .units td.unit + td.unit {
 	padding-left: 0;
 }
+.unit-gas {
+	color: #040;
+}
+.unit-min, .unit-min a:not(:hover) {
+	color: #004;
+}
+.unit-supply {
+	color: #080;
+}
 .unit-o {color: #C08} /* organic */
 .unit-u {color: #44C} /* mechanic */
 .unit-p {color: #0A8} /* psionic */
@@ -44,31 +54,49 @@ table h2 {
 	color: #C88;
 	font-size: 70%;
 }
-.unit.unit-s {color: #770}
-.unit.unit-m {color: #C70}
-.unit.unit-l {color: #D22}
-.hurt.unit-s::before {
-	content: '~';
-	color: #773;
+.unit-air {
+	color: #08C;
 }
-.hurt.unit-l::before {
-	content: '*';
-	color: #C66;
-}
-.unit-massive,
+.unit-x {color: #888}
+.unit-s {color: #890}
+.unit-m {color: #C70}
+.unit-l {color: #D22}
+.unit-h {color: #804}
+td .unit-jump,
 .hurt .unit-splash {
 	position: absolute;
 }
+td .unit-massive {
+	float: right;
+	width: 0;
+}
 .hurtrel, .units .hurtrel {
+	color: #778;
+}
+td.hurtrel {
 	padding-left: 1em;
+}
+td.unit-shield,
+td.hurtrel {
 	font-size: 70%;
-	color: #778;
+}
+tbody .unit-shield {
+	color: #64A;
+}
+.unit-pdd {
+	color: #A8C;
 }
 .unit-splash {
 	color: #4A0;
 }
+.hurt-a {
+	color: #036;
+}
+.hurt-g {
+	color: #063;
+}
 .unit-massive {
-	color: #A76;
+	color: #D88;
 }
 .unit-detect::before {
 	content: '!';
@@ -76,11 +104,28 @@ table h2 {
 	font-size: 70%;
 	vertical-align: super;
 }
+.unit-jump {
+	margin-left: -.2em;
+	color: #8A4;
+}
 .unit-magic {
 	padding-left: 0.5em;
 }
+.magic-opt::before {
+	color: #000;
+	content: '(';
+	position: absolute;
+	margin-left: -0.33em;
+}
+.magic-opt::after {
+	color: #000;
+	content: ')';
+}
 .magic-perma {
 	text-decoration: underline;
+	        text-decoration-color: #8C0;
+	   -moz-text-decoration-color: #8C0;
+	-webkit-text-decoration-color: #8C0;
 }
 
 .units .val {
@@ -113,3 +158,76 @@ table h2 {
 	margin-right: 2em;
 }
 
+@media (max-width: 52em) {
+	.units {
+		width: auto;
+	}
+	.units th {
+	}
+	.units td {
+		height: 2em;
+	}
+
+	.units tbody .cat {
+		position: absolute;
+		visibility: hidden;
+	}
+	.units td:nth-child(2) {
+		max-width: 6.5em;
+		white-space: normal;
+		overflow: hidden;
+	}
+
+	.units thead th:first-child,
+	.units .cat,
+	.units .unit-speed,
+	.units .hurtrel,
+	.units .unit-pop, .units .unit-type,
+	.units .unit-shield,
+	.units .unit-gas {
+		padding: 0;
+		position: absolute;
+		margin-top: 3.2ex;
+		margin-top: 1rem;
+		min-width: 4em;
+		text-align: right;
+		margin-left: -4.3em;
+		font-size: 70%;
+	}
+	.units th.unit-attr {
+		position: absolute;
+	}
+	.units .unit-type {
+		text-align: left;
+		margin-left: 0;
+	}
+	.units .unit-speed {
+		margin-left: -6em;
+	}
+	.units .alt thead th:first-child,
+	.units .alt .cat,
+	.units .alt .unit-speed,
+	.units .alt .hurtrel,
+	.units .alt .unit-pop, .units .alt .unit-type,
+	.units .alt .unit-shield,
+	.units .alt .gas {
+		margin-top: 2ex;
+	}
+	.units .cat {
+		margin-top: -2ex;
+		margin-left: 0;
+		text-align: left;
+	}
+
+	.units thead th:first-child {
+		margin-left: 0.5em;
+	}
+	.units thead th:first-child,
+	.units th.unit-speed,
+	.units th.hurtrel,
+	.units th.unit-shield,
+	.units th.gas {
+		margin-top: 2.2ex;
+	}
+}
+