diff options
Diffstat (limited to 'play.html')
| -rw-r--r-- | play.html | 139 |
1 files changed, 68 insertions, 71 deletions
@@ -261,61 +261,29 @@ td img { vertical-align: middle } background-color: tan; } -svg .side { - stroke-linecap: round; - stroke-width: 8px; -} - -svg .side.axis_control { - stroke: green; - stroke-width: 4px; - stroke-opacity: 0.8; - stroke-dasharray: 54 100; - stroke-dashoffset: -8; -} - -svg .side.allied_control { - stroke: brown; - stroke-width: 4px; - stroke-opacity: 0.8; - stroke-dasharray: 54 100; - stroke-dashoffset: -8; -} - -svg .side.axis_supply { - stroke-width: 64px; - stroke-linecap: butt; - stroke-dasharray: 8 100; - stroke-dashoffset: -31; - stroke-opacity: 0.6; - stroke: green; -} +/* MAP */ -svg .side.allied_supply { - stroke-width: 64px; - stroke-linecap: butt; - stroke-dasharray: 8 100; - stroke-dashoffset: -31; - stroke-opacity: 0.6; - stroke: crimson; +svg .fortress.axis { + fill: #264; } -svg .side.allied_supply.axis_supply { - stroke: yellow; +svg .side { + stroke-linecap: round; + stroke-width: 4; } -svg .fortress.axis { - fill: #264; +svg .hex { + stroke-width: 2; } svg .hex.action { - stroke: whitesmoke; - stroke-width: 2; + stroke: ivory; + stroke-dasharray: 2 2; + stroke-dashoffset: 1; } svg .hex.action.forced_march { - stroke: salmon; - stroke-width: 2; + stroke: crimson; } svg .hex.exit { @@ -327,22 +295,8 @@ svg .hex.refit.action { stroke: lightskyblue; } -svg .hex.battle:not(.action) { - stroke: black; - stroke-width: 4; - stroke-opacity: 0.25; -} - -svg .hex.assault:not(.action) { - stroke: black; - stroke-width: 4; - stroke-opacity: 0.5; -} - -svg .hex.current:not(.action) { +svg .hex.selected { stroke: yellow; - stroke-width: 4; - stroke-opacity: 0.5; } svg .hex.from { @@ -355,36 +309,79 @@ svg .hex.to { fill-opacity: 0.2; } +svg .hex.tip { + stroke: white; + stroke-dasharray: 4 4; +} + +/* HEX CONTROL */ + svg .hex.axis_control { - fill: green; + fill: seagreen; fill-opacity: 0.2; } svg .hex.allied_control { - fill: brown; + fill: firebrick; fill-opacity: 0.2; } +svg .side.axis_control { + stroke: seagreen; + stroke-dasharray: 54 100; + stroke-dashoffset: -8; +} + +svg .side.allied_control { + stroke: firebrick; + stroke-dasharray: 54 100; + stroke-dashoffset: -8; +} + +/* SUPPLY LINES */ + svg .hex.axis_supply { - fill: green; - fill-opacity: 0.3; + fill: seagreen; + fill-opacity: 0.4; } svg .hex.allied_supply { - fill: brown; - fill-opacity: 0.3; + fill: firebrick; + fill-opacity: 0.4; +} + +svg .side.axis_supply { + stroke: darkslategray; + 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 .side.allied_supply { + stroke: darkred; + 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: gold; - fill-opacity: 0.3; + fill: orange; } -svg .hex.tip { - fill: black; - fill-opacity: 0.6; +svg .side.allied_supply.axis_supply { + stroke: darkorange; } +/* UNITS */ + .minefield { position: absolute; pointer-events: none; @@ -644,7 +641,7 @@ svg .hex.tip { <div class="debug menu_item" onclick="send_restart('Crusader')">⚠ Restart Crusader</div> <div class="debug menu_item" onclick="send_restart('Battleaxe')">⚠ Restart Battleaxe</div> <div class="debug menu_item" onclick="send_restart('Gazala')">⚠ Restart Gazala</div> - <div class="debug menu_item" onclick="send_restart('Pursuit to Alamein')">⚠ Restart Pursuit</div> + <div class="debug menu_item" onclick="send_restart('Pursuit to Alamein')">⚠ Restart Alamein</div> <div class="debug menu_item" onclick="send_restart('1941-42')">⚠ Restart 1941-42</div> </div> </div> |