From 52c4d3435cb5b7f1378b849375f8dbe6834fb1ba Mon Sep 17 00:00:00 2001 From: Tor Andersson Date: Tue, 27 Jun 2023 00:29:22 +0200 Subject: Battle -> Combat. Card tooltips. --- play.css | 61 +++++++------- play.html | 2 + play.js | 171 +++++++++++++++++++++++++------------ rules.js | 284 +++++++++++++++++++++++++++++++------------------------------- 4 files changed, 293 insertions(+), 225 deletions(-) diff --git a/play.css b/play.css index 4811f80..ce727b5 100644 --- a/play.css +++ b/play.css @@ -23,16 +23,17 @@ body.Blue .your_turn { background-color: hsl(207,67%,83%) } body.Yellow .your_turn { background-color: hsl(47,100%,78%) } body.Green .your_turn { background-color: hsl(99,36%,65%) } -#log .h1.p_red { background-color: hsl(354,85%,77%) } -#log .h1.p_blue { background-color: hsl(207,67%,83%) } -#log .h1.p_yellow { background-color: hsl(47,100%,78%) } -#log .h1.p_green { background-color: hsl(99,36%,70%) } +#log .h1.R { background-color: hsl(354,85%,77%) } +#log .h1.B { background-color: hsl(207,67%,83%) } +#log .h1.Y { background-color: hsl(47,100%,78%) } +#log .h1.G { background-color: hsl(99,36%,70%) } -#log img { height: 14px; vertical-align: -6px; } +#log span.M { color: hsl(358, 78%, 41%) } +#log span.S { color: hsl(206, 100%, 30%) } +#log span.P { color: hsl(44, 100%, 32%) } -#log span.M { color: #e31f26 } -#log span.S { color: #0066b3 } -#log span.P { color: hsl(44, 100%, 35%) } +#log .tip { cursor: default } +#log .tip:hover { text-decoration: underline; } #log { background-color: whitesmoke; } #log .h1 { background-color: silver; font-weight: bold; padding-top:2px; padding-bottom:2px; margin: 8px 0; text-align: center; } @@ -54,11 +55,6 @@ body.Green .your_turn { background-color: hsl(99,36%,65%) } background-repeat: no-repeat; } -#log img { - pointer-events: none; - vertical-align: -3px; -} - #log .white { background-image: url(images/die_black_pips.svg); background-color: #fff; @@ -444,22 +440,22 @@ body.p2 #npg_galatia { display: block } .sassanids.inactive { background-image: url(images/sassanids_inactive.png) } .neutral.governor { background-image: url(images/neutral_governor.png) } -#ardashir { background-image: url(images/ardashir.png) } -#cniva { background-image: url(images/cniva.png) } -#shapur { background-image: url(images/shapur.png) } -#ardashir.inactive { background-image: url(images/ardashir_back.png) } -#cniva.inactive { background-image: url(images/cniva_back.png) } -#shapur.inactive { background-image: url(images/shapur_back.png) } -#postumus { background-image: url(images/rival_postumus.png) } -#priest_king { background-image: url(images/rival_priest_king.png) } -#zenobia { background-image: url(images/rival_zenobia.png) } - -body.shift #ardashir { background-image: url(images/ardashir_back.png) } -body.shift #cniva { background-image: url(images/cniva_back.png) } -body.shift #shapur { background-image: url(images/shapur_back.png) } -body.shift #postumus { background-image: url(images/rival_back.png) } -body.shift #priest_king { background-image: url(images/rival_back.png) } -body.shift #zenobia { background-image: url(images/rival_back.png) } +.ardashir { background-image: url(images/ardashir.png) } +.cniva { background-image: url(images/cniva.png) } +.shapur { background-image: url(images/shapur.png) } +.ardashir.inactive { background-image: url(images/ardashir_back.png) } +.cniva.inactive { background-image: url(images/cniva_back.png) } +.shapur.inactive { background-image: url(images/shapur_back.png) } +.postumus { background-image: url(images/rival_postumus.png) } +.priest_king { background-image: url(images/rival_priest_king.png) } +.zenobia { background-image: url(images/rival_zenobia.png) } + +body.shift .ardashir { background-image: url(images/ardashir_back.png) } +body.shift .cniva { background-image: url(images/cniva_back.png) } +body.shift .shapur { background-image: url(images/shapur_back.png) } +body.shift .postumus { background-image: url(images/rival_back.png) } +body.shift .priest_king { background-image: url(images/rival_back.png) } +body.shift .zenobia { background-image: url(images/rival_back.png) } .blue.governor { background-image: url(images/blue_governor.png) } .green.governor { background-image: url(images/green_governor.png) } @@ -500,6 +496,13 @@ body.shift #zenobia { background-image: url(images/rival_back.png) } /* CARDS */ +#card_tip { + position: fixed; + z-index: 200; + right: 240px; + top: 60px; +} + .card { width: 250px; height: 350px; diff --git a/play.html b/play.html index 9cd8e32..9182eac 100644 --- a/play.html +++ b/play.html @@ -14,6 +14,8 @@ +
+