From da7fb6c52fcb520d3a1a270433e70b607a3fb800 Mon Sep 17 00:00:00 2001 From: Tor Andersson Date: Fri, 2 Sep 2022 18:29:50 +0200 Subject: Use svg lines to show supply lines. --- play.html | 39 ++++++++++++++++++--------------------- 1 file changed, 18 insertions(+), 21 deletions(-) (limited to 'play.html') diff --git a/play.html b/play.html index f439c31..a7775e8 100644 --- a/play.html +++ b/play.html @@ -45,7 +45,7 @@ header.your_turn { background-color: orange; } display: flex; flex-wrap: wrap; justify-content: center; - min-height: 350px; + min-height: 170px; max-width: 2672px; gap: 20px; } @@ -373,34 +373,31 @@ svg .hex.allied_supply { fill-opacity: 0.4; } -svg .side.axis_supply { - stroke: darkslategray !important; - stroke-width: 122px; - stroke-width: 121.5px; - stroke-width: 72px; - stroke-linecap: butt; - stroke-dasharray: 8 100; - stroke-dashoffset: -31; - stroke-opacity: 0.6; +svg .hex.axis_supply.allied_supply { + fill: darkgoldenrod; + fill-opacity: 0.4; +} + +svg #lines line { + pointer-events: none; + stroke: none; + stroke-width: 6px; + stroke-linecap: round; } -svg .side.allied_supply { - stroke: darkred !important; - stroke-width: 122px; - stroke-width: 121.5px; - stroke-width: 72px; - stroke-linecap: butt; - stroke-dasharray: 8 100; - stroke-dashoffset: -31; +svg #lines line.axis_supply { + stroke: darkslategray; stroke-opacity: 0.6; } -svg .hex.axis_supply.allied_supply { - fill: orange; +svg #lines line.allied_supply { + stroke: darkred; + stroke-opacity: 0.6; } -svg .side.allied_supply.axis_supply { +svg #lines line.axis_supply.allied_supply { stroke: darkorange; + stroke-opacity: 0.6; } /* UNITS */ -- cgit v1.2.3