Only grayscale background image of hidden/disabled lord mats.

5 files changed, 23 insertions, 4 deletions

diff --git a/images/lord_mat_150_gray.jpg b/images/lord_mat_150_gray.jpg
new file mode 100644
index 0000000..2da80e5
--- /dev/null
+++ b/images/lord_mat_150_gray.jpg
diff --git a/images/lord_mat_150_gray.png b/images/lord_mat_150_gray.png
new file mode 100644
index 0000000..57a3f4f
--- /dev/null
+++ b/images/lord_mat_150_gray.png
diff --git a/images/lord_mat_75_gray.jpg b/images/lord_mat_75_gray.jpg
new file mode 100644
index 0000000..9035a95
--- /dev/null
+++ b/images/lord_mat_75_gray.jpg
diff --git a/images/lord_mat_75_gray.png b/images/lord_mat_75_gray.png
new file mode 100644
index 0000000..f1187f5
--- /dev/null
+++ b/images/lord_mat_75_gray.png
diff --git a/play.css b/play.css
index 9e4a3f2..a8f2974 100644
--- a/play.css
+++ b/play.css
@@ -486,12 +486,31 @@ body.Lancaster #plan_actions .york { display: none }
 .mat.engaged .board { box-shadow: 0 0 0 1px #333, 0 0 0 4px indianred; }
 
 #court1 .mat.hidden .board,
-#court2 .mat.hidden .board {
-	filter: grayscale(100%)
+#court2 .mat.hidden .board,
+.mat.ravine .board
+{
+	background-image: url(images/lord_mat_75_gray.jpg);
+	background-color: #999;
+	border-color: #aaa #666 #666 #aaa;
+}
+
+.defender .att #court1 .mat.hidden .board,
+.defender .att #court2 .mat.hidden .board,
+.defender .att .mat.ravine .board,
+.attacker .def #court1 .mat.hidden .board,
+.attacker .def #court2 .mat.hidden .board,
+.attacker .def .mat.ravine .board
+{
+	border-color: #666 #aaa #aaa #666;
 }
 
-.mat.ravine .board {
-	filter: grayscale(100%)
+@media (min-resolution: 97dpi) {
+	#court1 .mat.hidden .board,
+	#court2 .mat.hidden .board,
+	.mat.ravine .board
+	{
+		background-image: url(images/lord_mat_150_gray.jpg);
+	}
 }
 
 .mat .capabilities {