From 4251b1dedc84f8622355542be7d64a020f398a26 Mon Sep 17 00:00:00 2001
From: Tor Andersson <tor@ccxvii.net>
Date: Fri, 23 Jun 2023 18:07:18 +0200
Subject: Start log formatting.

---
 play.css | 59 ++++++++++++++++++++++++++++++++++++++++++++++-------------
 1 file changed, 46 insertions(+), 13 deletions(-)

(limited to 'play.css')

diff --git a/play.css b/play.css
index f21cb33..09ab547 100644
--- a/play.css
+++ b/play.css
@@ -9,10 +9,45 @@ header.your_turn { background-color: orange; }
 #turn_info { background-color: gainsboro; }
 .role_vp { float: right; }
 
-header.your_turn.player_red { background-color: salmon; }
-header.your_turn.player_blue { background-color: skyblue; }
-header.your_turn.player_yellow { background-color: khaki; }
-header.your_turn.player_green { background-color: darkseagreen; }
+body.Red header.your_turn { background-color: salmon; }
+body.Blue header.your_turn { background-color: skyblue; }
+body.Yellow header.your_turn { background-color: khaki; }
+body.Green header.your_turn { background-color: darkseagreen; }
+
+#log { background-color: whitesmoke; }
+#log .h1 { background-color: silver; font-weight: bold; padding-top:2px; padding-bottom:2px; margin: 8px 0; text-align: center; }
+#log .h1.p_red { background-color: salmon; }
+#log .h1.p_blue { background-color: skyblue; }
+#log .h1.p_yellow { background-color: khaki; }
+#log .h1.p_green { background-color: darkseagreen; }
+#log .h2 { background-color: gainsboro; padding-top:2px; padding-bottom:2px; text-align: center; }
+#log .h3 { text-decoration: underline; }
+#log div { padding-left: 20px; text-indent: -12px; }
+#log div.indent { padding-left: 32px; text-indent: -12px; }
+
+#log .white, #log .black {
+	display: inline-block;
+	vertical-align: -2px;
+	width: 12px;
+	height: 12px;
+	border-radius: 0px;
+	box-shadow: none;
+	border: none;
+	background-size: 600% 100%;
+	background-repeat: no-repeat;
+}
+
+#log .white {
+	background-image: url(images/die_black_pips.svg);
+	background-color: #fff;
+	border: 1px solid #444;
+}
+
+#log .black {
+	background-image: url(images/die_white_pips.svg);
+	background-color: #666;
+	border: 1px solid #222;
+}
 
 .action {
 	cursor: pointer;
@@ -62,8 +97,6 @@ body.p3 #crisis_table {
 	left: 50px;
 }
 
-body.Solo #.role { display: none }
-
 svg {
 	position: absolute;
 }
@@ -155,13 +188,13 @@ body svg .sea.action {
 	background-repeat: no-repeat;
 }
 
-.dice.d0 { background-position: -100% 0 }
-.dice.d1 { background-position: 0% 0; }
-.dice.d2 { background-position: 20% 0; }
-.dice.d3 { background-position: 40% 0; }
-.dice.d4 { background-position: 60% 0; }
-.dice.d5 { background-position: 80% 0; }
-.dice.d6 { background-position: 100% 0; }
+.d0 { background-position: -100% 0 }
+.d1 { background-position: 0% 0; }
+.d2 { background-position: 20% 0; }
+.d3 { background-position: 40% 0; }
+.d4 { background-position: 60% 0; }
+.d5 { background-position: 80% 0; }
+.d6 { background-position: 100% 0; }
 
 .dice.black {
 	background-image: url(images/die_white_pips.svg);
-- 
cgit v1.2.3