From d58f1834daf6112bd8e2bcbd32db062dedb75752 Mon Sep 17 00:00:00 2001 From: Tor Andersson Date: Sun, 19 Dec 2021 17:03:16 +0100 Subject: Prettier logs with formatting and colors. --- play.html | 40 ++++++++++++++++++++++------------------ ui.js | 4 ++++ 2 files changed, 26 insertions(+), 18 deletions(-) diff --git a/play.html b/play.html index aa30c7a..23d5242 100644 --- a/play.html +++ b/play.html @@ -14,7 +14,6 @@ .grid_center { background-color: slategray; } .grid_role { background-color: gainsboro; } -.grid_log { background-color: gainsboro; } .grid_top { background-color: silver; } .Persia .grid_top.your_turn { background-color: skyblue; } .Greece .grid_top.your_turn { background-color: salmon; } @@ -23,6 +22,24 @@ .one .role_name { background-color: salmon; } .two .role_name { background-color: skyblue; } +#log { + background-color: gainsboro; +} + +#log .tip { + cursor: help; + text-decoration: underline; + color: blue; +} + +#log .st { + font-weight: bold; + background-color: gray; + color: white; + text-align: center; + padding: 3px; +} + .hand.greek { background-color: rosybrown; border-radius: 10px; @@ -39,9 +56,6 @@ #deck_info { text-align: center; } -.grid_role { - width: 240px; -} /* CARDS */ @@ -72,24 +86,16 @@ .card_info .card { margin: 15px auto; - width: 200px; - height: 280px; + width: 125px; + height: 175px; border-radius: 10px; } -.log span.tip { - cursor: help; - text-decoration: underline; - color: blue; -} - #tooltip.card { position: fixed; z-index: 200; - right: 270px; + right: 230px; top: 60px; - width: 375px; - height: 525px; } /* PHONE SIZE: squeeze side bar on small screens */ @@ -321,9 +327,7 @@
-
-
-
+
diff --git a/ui.js b/ui.js index 8c2526b..1736404 100644 --- a/ui.js +++ b/ui.js @@ -66,6 +66,10 @@ create_log_entry = function (text) { text = text.replace(/>/g, ">"); text = text.replace(/card (\d+)/g, 'card $1'); + if (text.match(/^Start Campaign /)) { + p.className = 'st'; + text = text.substring(6); + } p.innerHTML = text; return p; } -- cgit v1.2.3