Battle box.

1 files changed, 17 insertions, 12 deletions

diff --git a/play.css b/play.css
index 12b1b9d..bc2a2ac 100644
--- a/play.css
+++ b/play.css
@@ -125,10 +125,6 @@ header.your_turn { background-color: orange; }
 	position: absolute;
 }
 
-#map svg image {
-	pointer-events: none;
-}
-
 #map svg path.area {
 	fill-opacity: 0;
 	fill: white;
@@ -155,7 +151,6 @@ header.your_turn { background-color: orange; }
 /* TURN MARKER */
 
 div.turn {
-	pointer-events: none;
 	position: absolute;
 	width: 66px;
 	height: 66px;
@@ -197,11 +192,11 @@ body.shift .block.known:hover {
 .oldblocks div.block { border-radius: 8px; }
 .newblocks div.block { border-radius: 4px; }
 
-#map div.block {
+#blocks > div.block {
 	position: absolute;
 }
 
-#battle div.block {
+#battle > div.block {
 	position: relative;
 }
 
@@ -239,11 +234,23 @@ div.block.r3 { transform: rotate(-270deg); }
 div.block:hover { z-index: 1; }
 
 div.block {
-	transition-property: top, left, transform;
-	transition-duration: 700ms, 700ms, 200ms;
-	transition-timing-function: ease;
+	transition-property: top, left, transform, opacity;
+	transition-duration: 700ms, 700ms, 250ms, 250ms;
+	transition-timing-function: ease, ease, ease, linear;
 }
 
+/* BATTLE BOX HIDING */
+
+#map svg path.area.battle {
+	fill-opacity: 0.5;
+	fill: black;
+}
+
+/*
+div.block.battle { filter: grayscale(60%) brightness(60%) !important }
+*/
+div.block.battle { opacity: 0; pointer-events: none }
+
 /* HERALD DIALOG */
 
 #herald {
@@ -262,8 +269,6 @@ body.Scotland #herald li.action:hover { background-color: hsl(0, 59%, 35%); }
 
 /* BATTLE BOARD */
 
-#battle { top: 160px; left: 185px; }
-
 #battle { background-color: silver; }
 #battle_message { background-color: lightsteelblue; }
 #battle_header { background-color: steelblue; color: white; }