Added dead state for air units; other minor CSS improvments.

This commit is contained in:
PeekabooSteam
2023-03-12 14:06:06 +00:00
parent df6210bec9
commit 4f90078b9f
4 changed files with 237 additions and 95 deletions

View File

@@ -354,7 +354,7 @@
<div class="example">
<div class="caption">0% (empty)</div>
<div class="unit unit-air" data-pilot="ai" data-has-low-fuel="true" data-coalition="red" data-is-selected="true">
<div class="unit unit-air unit-aircraft" data-pilot="ai" data-has-low-fuel data-coalition="red" data-is-selected>
<div class="unit-selected-spotlight"></div>
<div class="unit-hotgroup">
<div class="unit-hotgroup-id">4</div>
@@ -378,7 +378,7 @@
<div class="caption">10%</div>
<div class="unit unit-air" data-pilot="ai" data-has-low-fuel="true" data-coalition="red" data-is-selected="true">
<div class="unit unit-air unit-aircraft" data-pilot="ai" data-has-low-fuel data-coalition="red" data-is-selected>
<div class="unit-selected-spotlight"></div>
<div class="unit-hotgroup">
<div class="unit-hotgroup-id">4</div>
@@ -401,7 +401,7 @@
<div class="example">
<div class="caption">20%</div>
<div class="unit unit-air" data-pilot="ai" data-has-low-fuel="true" data-coalition="red">
<div class="unit unit-air unit-aircraft" data-pilot="ai" data-has-low-fuel data-coalition="red">
<div class="unit-selected-spotlight"></div>
<div class="unit-hotgroup">
<div class="unit-hotgroup-id">4</div>
@@ -424,7 +424,7 @@
<div class="example">
<div class="caption">50%</div>
<div class="unit unit-air" data-pilot="ai" data-coalition="red" data-is-selected="true">
<div class="unit unit-air unit-aircraft" data-pilot="ai" data-coalition="red" data-is-selected>
<div class="unit-selected-spotlight"></div>
<div class="unit-hotgroup">
<div class="unit-hotgroup-id">4</div>
@@ -447,7 +447,7 @@
<div class="example">
<div class="caption">75%</div>
<div class="unit unit-air" data-pilot="ai" data-coalition="red">
<div class="unit unit-air unit-aircraft" data-pilot="ai" data-coalition="red">
<div class="unit-selected-spotlight"></div>
<div class="unit-hotgroup">
<div class="unit-hotgroup-id">4</div>
@@ -470,7 +470,7 @@
<div class="example">
<div class="caption">100%</div>
<div class="unit unit-air" data-pilot="ai" data-coalition="red" data-is-selected="true">
<div class="unit unit-air unit-aircraft" data-pilot="ai" data-coalition="red" data-is-selected>
<div class="unit-selected-spotlight"></div>
<div class="unit-hotgroup">
<div class="unit-hotgroup-id">4</div>
@@ -501,7 +501,7 @@
<div class="example">
<div class="unit unit-air" data-status="rtb" data-pilot="ai">
<div class="unit unit-air unit-aircraft" data-status="rtb" data-pilot="ai">
<div class="unit-selected-spotlight"></div>
<div class="unit-status"></div>
<div class="unit-vvi" style="height: 50px; transform:rotate(135deg);"></div>
@@ -531,7 +531,7 @@
<div class="example">
<div class="unit unit-air" data-status="rtb" data-coalition="blue" data-is-in-hotgroup="true" data-is-selected="true">
<div class="unit unit-air unit-aircraft" data-status="rtb" data-coalition="blue" data-is-in-hotgroup data-is-selected>
<div class="unit-selected-spotlight"></div>
<div class="unit-status"></div>
<div class="unit-vvi" style="height: 50px; transform:rotate(315deg);"></div>
@@ -560,7 +560,7 @@
<div class="example">
<div class="unit unit-air" data-status="rtb" data-pilot="ai" data-coalition="red" data-is-in-hotgroup="true">
<div class="unit unit-air unit-aircraft" data-status="rtb" data-pilot="ai" data-coalition="red" data-is-in-hotgroup>
<div class="unit-selected-spotlight"></div>
<div class="unit-status"></div>
<div class="unit-vvi" style="height: 50px; transform:rotate(270deg);"></div>
@@ -590,7 +590,7 @@
<div class="example">
<div class="unit unit-air" data-status="hold" data-pilot="ai">
<div class="unit unit-air unit-aircraft" data-status="hold" data-pilot="ai">
<div class="unit-selected-spotlight"></div>
<div class="unit-status"></div>
<div class="unit-vvi" style="height: 50px; transform:rotate(135deg);"></div>
@@ -620,7 +620,7 @@
<div class="example">
<div class="unit unit-air" data-status="hold" data-coalition="blue" data-is-in-hotgroup="true" data-is-selected="true">
<div class="unit unit-air unit-aircraft" data-status="hold" data-coalition="blue" data-is-in-hotgroup data-is-selected>
<div class="unit-selected-spotlight"></div>
<div class="unit-status"></div>
<div class="unit-vvi" style="height: 50px; transform:rotate(315deg);"></div>
@@ -649,7 +649,104 @@
<div class="example">
<div class="unit unit-air" data-status="hold" data-pilot="ai" data-coalition="red" data-is-in-hotgroup="true">
<div class="unit unit-air unit-aircraft" data-status="hold" data-pilot="ai" data-coalition="red" data-is-in-hotgroup>
<div class="unit-selected-spotlight"></div>
<div class="unit-status"></div>
<div class="unit-vvi" style="height: 50px; transform:rotate(280deg);"></div>
<div class="unit-hotgroup">
<div class="unit-hotgroup-id">4</div>
</div>
<div class="unit-marker"></div>
<div class="unit-short-label">18</div>
<div class="unit-fuel">
<div class="unit-fuel-level" style="width:100%;"></div>
</div>
<div class="unit-ammo">
<div class="unit-ammo-fox-1"></div>
<div class="unit-ammo-fox-2"></div>
<div class="unit-ammo-fox-3"></div>
<div class="unit-ammo-other"></div>
</div>
<div class="unit-summary">
<div class="unit-callsign">Springfield 3-1 | Longname</div>
<div class="unit-heading">260</div>
<div class="unit-altitude">31</div>
</div>
</div>
</div>
</div>
</div>
<div class="content">
<div class="content-header">Dead</div>
<div class="content-body">
<div class="example">
<div class="unit unit-air unit-aircraft" data-status="hold" data-pilot="ai" data-is-dead>
<div class="unit-selected-spotlight"></div>
<div class="unit-status"></div>
<div class="unit-vvi" style="height: 50px; transform:rotate(135deg);"></div>
<div class="unit-hotgroup">
<div class="unit-hotgroup-id">4</div>
</div>
<div class="unit-marker"></div>
<div class="unit-short-label">18</div>
<div class="unit-fuel">
<div class="unit-fuel-level" style="width:100%;"></div>
</div>
<div class="unit-ammo">
<div class="unit-ammo-fox-1"></div>
<div class="unit-ammo-fox-2"></div>
<div class="unit-ammo-fox-3"></div>
<div class="unit-ammo-other"></div>
</div>
<div class="unit-summary">
<div class="unit-callsign">Springfield 3-1 | Longname</div>
<div class="unit-heading">260</div>
<div class="unit-altitude">31</div>
</div>
</div>
</div>
<div class="example">
<div class="unit unit-air unit-aircraft" data-status="hold" data-coalition="blue" data-is-in-hotgroup data-is-selected data-is-dead>
<div class="unit-selected-spotlight"></div>
<div class="unit-status"></div>
<div class="unit-vvi" style="height: 50px; transform:rotate(315deg);"></div>
<div class="unit-hotgroup">
<div class="unit-hotgroup-id">4</div>
</div>
<div class="unit-marker"></div>
<div class="unit-short-label">18</div>
<div class="unit-fuel">
<div class="unit-fuel-level" style="width:100%;"></div>
</div>
<div class="unit-ammo">
<div class="unit-ammo-fox-1"></div>
<div class="unit-ammo-fox-2"></div>
<div class="unit-ammo-fox-3"></div>
<div class="unit-ammo-other"></div>
</div>
<div class="unit-summary">
<div class="unit-callsign">Springfield 3-1 | Longname</div>
<div class="unit-heading">260</div>
<div class="unit-altitude">31</div>
</div>
</div>
</div>
<div class="example">
<div class="unit unit-air unit-aircraft" data-status="hold" data-pilot="ai" data-coalition="red" data-is-dead>
<div class="unit-selected-spotlight"></div>
<div class="unit-status"></div>
<div class="unit-vvi" style="height: 50px; transform:rotate(280deg);"></div>