From 9c245b088c82c4c15b0699a82169d36c01797f3f Mon Sep 17 00:00:00 2001 From: Tor Andersson Date: Wed, 29 May 2024 00:53:48 +0200 Subject: tweak look & feel of highlights --- play.css | 37 +++++++++++++++++++++---------------- play.js | 7 ++++--- 2 files changed, 25 insertions(+), 19 deletions(-) diff --git a/play.css b/play.css index 49bb6ad..9913d57 100644 --- a/play.css +++ b/play.css @@ -272,6 +272,7 @@ span.suit.reserve { color: var(--color-reserve); font-weight: bold; font-family: border-radius: 50%; } +.space.tip { z-index: 3000 } .space.country_austria.tip { border-color: gray; } .space.country_sweden.tip { border-color: forestgreen; } .space.country_poland.tip { border-color: indianred; } @@ -292,6 +293,7 @@ span.suit.reserve { color: var(--color-reserve); font-weight: bold; font-family: .space.action { border-color: white; + box-shadow: 0 0 2px black, inset 0 0 2px black; z-index: 2000; } @@ -333,7 +335,9 @@ span.suit.reserve { color: var(--color-reserve); font-weight: bold; font-family: drop-shadow(2px 0px 0px white) drop-shadow(0px 2px 0px white) drop-shadow(0px -2px 0px white) - drop-shadow(-2px 0px 0px white); + drop-shadow(-2px 0px 0px white) + drop-shadow(0 0 1px black) + ; } .piece.selected { @@ -341,15 +345,9 @@ span.suit.reserve { color: var(--color-reserve); font-weight: bold; font-family: drop-shadow(2px 0px 0px yellow) drop-shadow(0px 2px 0px yellow) drop-shadow(0px -2px 0px yellow) - drop-shadow(-2px 0px 0px yellow); -} - -.piece.austria.selected, .piece.imperial.selected { - filter: - drop-shadow(2px 0px 0px hotpink) - drop-shadow(0px 2px 0px hotpink) - drop-shadow(0px -2px 0px hotpink) - drop-shadow(-2px 0px 0px hotpink); + drop-shadow(-2px 0px 0px yellow) + drop-shadow(0 0 1px black) + ; } .piece.tip { @@ -357,7 +355,9 @@ span.suit.reserve { color: var(--color-reserve); font-weight: bold; font-family: drop-shadow(2px 0px 0px lime) drop-shadow(0px 2px 0px lime) drop-shadow(0px -2px 0px lime) - drop-shadow(-2px 0px 0px lime); + drop-shadow(-2px 0px 0px lime) + drop-shadow(0 0 1px black) + ; } .piece.cube.austria { background-image: url(images/cube_austria.svg) } @@ -445,18 +445,23 @@ span.suit.reserve { color: var(--color-reserve); font-weight: bold; font-family: } .card.action { - box-shadow: 0 0 0 4px white; + box-shadow: 0 0 0 3px white; + border-color: white; } +/* +.card.diamonds.action { box-shadow: 0 0 0 2px var(--color-diamonds); border-color: var(--color-diamonds); } +.card.hearts.action { box-shadow: 0 0 0 2px var(--color-hearts); border-color: var(--color-hearts); } +.card.clubs.action { box-shadow: 0 0 0 2px var(--color-clubs); border-color: var(--color-clubs); } +.card.spades.action { box-shadow: 0 0 0 2px var(--color-spades); border-color: var(--color-spades); } +.card.reserve.action { box-shadow: 0 0 0 2px var(--color-reserve); border-color: var(--color-reserve); } +*/ + .card.action:hover { margin-top: -10px; margin-bottom: 10px; } -/* -.card.tc.reverse + .card.tc.reverse { margin-left: -200px; } -*/ - .draw-break { margin-left: 145px; } .card.tc { margin-right: -145px; } .panel_body { padding-right: calc(18px + 145px); } diff --git a/play.js b/play.js index 6f368c5..e2de08e 100644 --- a/play.js +++ b/play.js @@ -90,7 +90,8 @@ const all_power_trains = [ ] const RESERVE = 4 -let suit_class = [ "S", "C", "H", "D", "R" ] +let suit_class = [ "spades", "clubs", "hearts", "diamonds", "reserve" ] +let suit_letter = [ "S", "C", "H", "D", "R" ] function to_deck(c) { return c >> 7 @@ -465,12 +466,12 @@ function make_tc_deck(n) { for (let suit = 0; suit <= 3; ++suit) { for (let value = 2; value <= 13; ++value) { let c = (n << 7) | (suit << 4) | value - ui.tc[c] = create_element("card", c, "card tc deck_" + (n+1) + " " + suit_class[suit] + value) + ui.tc[c] = create_element("card", c, "card tc deck_" + (n+1) + " " + suit_class[suit] + " " + suit_letter[suit] + value) } } for (let value = 2; value <= 3; ++value) { let c = (n << 7) | (4 << 4) | value - ui.tc[c] = create_element("card", c, "card tc deck_" + (n+1) + " R") + ui.tc[c] = create_element("card", c, "card tc deck_" + (n+1) + " reserve R") } } -- cgit v1.2.3