From fa93dc1cbb185bab17da9c09d6c2c08fefb2e99c Mon Sep 17 00:00:00 2001
From: Tor Andersson <tor@ccxvii.net>
Date: Sun, 8 Oct 2023 12:45:42 +0200
Subject: Add tinted militia and reduced legions as option (on by default).

Make it easier to see what is what in a mixed stack than just the
tiny combat strength number.
---
 play.css | 23 +++++++++++++++++++++--
 1 file changed, 21 insertions(+), 2 deletions(-)

(limited to 'play.css')

diff --git a/play.css b/play.css
index bdca4c8..22f2853 100644
--- a/play.css
+++ b/play.css
@@ -9,6 +9,9 @@ header.your_turn { background-color: orange; }
 #turn_info { background-color: gainsboro; }
 .role_vp { float: right; }
 
+.checked::before { content: "\2714  " }
+.unchecked::before { content: "\2714  "; color:transparent; }
+
 body.Observer #hand_panel, body.Observer #draw_panel, body.Observer #discard_panel {
 	display: none;
 }
@@ -311,8 +314,8 @@ body.p2 #npg_galatia { display: block }
 .blue.action { box-shadow: 0 0 0 1px #113854, 0 0 0 4px white; }
 .yellow.action { box-shadow: 0 0 0 1px #553a00, 0 0 0 4px white; }
 .green.action { box-shadow: 0 0 0 1px #033600, 0 0 0 4px white; }
-.legion.action { box-shadow: 0 0 0 1px #434343, 0 0 0 4px white; }
-.militia.action { box-shadow: 0 0 0 1px #434343, 0 0 0 4px white; }
+.legion.action { box-shadow: 0 0 0 1px #434343, 0 0 0 4px white !important; }
+.militia.action { box-shadow: 0 0 0 1px #434343, 0 0 0 4px white !important; }
 
 .alamanni.action { box-shadow: 0 0 0 1px #393204, 0 0 0 4px white; }
 .franks.action { box-shadow: 0 0 0 1px #1d323a, 0 0 0 4px white; }
@@ -520,6 +523,22 @@ body.shift .shapur.inactive { background-image: url(images/shapur.png) }
 .red.breakaway { background-image: url(images/red_breakaway.svg) }
 .yellow.breakaway { background-image: url(images/yellow_breakaway.svg) }
 
+/* TINTED UNITS */
+
+body.tint .militia {
+	background-color: #f3ddbd;
+	background-image: url(images/militia_tint.png);
+	border-color: #fffcdb #b8a385 #b8a385 #fffcdb;
+	box-shadow: 0 0 0 1px #4c3b1f, 1px 2px 4px #0008;
+}
+
+body.tint .legion.reduced {
+	background-color: #f4cccd;
+	background-image: url(images/legion_reduced_tint.png);
+	border-color: #fff4f5 #ba9596 #ba9596 #fff4f5;
+	box-shadow: 0 0 0 1px #503133, 1px 2px 4px #0008;
+}
+
 /* CARDS */
 
 #card_tip {
-- 
cgit v1.2.3