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

diff --git a/sc.css b/sc.css
index 50581bb..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,12 @@ 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;
 }
@@ -151,3 +158,76 @@ tbody .unit-shield {
 	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;
+	}
+}
+