From 41064aa4d7b938e1887cdc571bb47fa82090a6b4 Mon Sep 17 00:00:00 2001 From: Tor Andersson Date: Tue, 28 Feb 2023 00:39:19 +0100 Subject: Rally, March. --- play.css | 30 ++++++++++++++++++++---------- 1 file changed, 20 insertions(+), 10 deletions(-) (limited to 'play.css') diff --git a/play.css b/play.css index 5958485..2cf2615 100644 --- a/play.css +++ b/play.css @@ -57,31 +57,36 @@ main { background-color: #777; } #cities { position: absolute; } #boxes { position: absolute; } -path { fill: transparent; } -path.action { fill: white; fill-opacity: 0.3; stroke: white; stroke-width: 4; } +path { fill: transparent; stroke-width: 4; } +path.action { fill: white; fill-opacity: 0.3; stroke: white; } path.action.foreign { fill: gold; stroke: lemonchiffon; } path.action.forest { fill: limegreen; stroke: limegreen; } path.action.grassland { fill: greenyellow; stroke: greenyellow; } path.action.mountain { fill: chocolate; stroke: chocolate; } +path.selected { stroke: yellow; } -.box{position:absolute;box-sizing:border-box;} -.box.action{z-index:100; border:4px solid lemonchiffon;} +.box{position:absolute;box-sizing:border-box;border:4px solid transparent} .box.city{border-radius:50%} -.box.city.action{background-color:#6495ed55;border:4px solid cornflowerblue;} .box.loc{border-radius:50%} -.box.loc.action{background-color:#fff5;border:4px solid white;} +.box.action{border-color:lemonchiffon;} +.box.city.action{background-color:#6495ed55;border-color:deepskyblue;} +.box.loc.action{background-color:#fff5;border-color:white;} +.box.selected{border-color:yellow;} + -.piece { position: absolute; } -.piece { background-position: center; background-repeat: no-repeat; background-size: contain; } .piece { + position: absolute; + pointer-events: none; + background-position: center; + background-repeat: no-repeat; + background-size: contain; transition-property: top, left; transition-duration: 700ms; transition-timing-function: ease; -} -.piece { filter: drop-shadow(0 1px 2px #000a); } .piece.action { + pointer-events: auto; filter: drop-shadow(0 -2px 0 white) drop-shadow(0 2px 0 white) @@ -91,6 +96,7 @@ path.action.mountain { fill: chocolate; stroke: chocolate; } } .token { + pointer-events: none; position: absolute; transition-property: top, left; transition-duration: 700ms; @@ -103,6 +109,10 @@ path.action.mountain { fill: chocolate; stroke: chocolate; } height: 45px; } +.token.action { + pointer-events: auto; +} + .token.terror, .token.sabotage, .token.active_opposition, -- cgit v1.2.3