WIP: edge UI style

This commit is contained in:
Catalin Constantin Mititiuc 2025-06-16 22:41:32 -07:00
parent 2e465b69af
commit fdf59d5c0d
3 changed files with 7 additions and 10 deletions

View File

@ -36,12 +36,14 @@ svg text {
#hex-counter { #hex-counter {
padding: 2px; padding: 2px;
background-color: rgba(255, 255, 255, 0.5); background-color: rgba(255, 255, 255, 0.8);
border-radius: 2px; border-radius: 2px;
font-family: sans-serif;
} }
#hex-count { #hex-count {
font-family: monospace; font-family: monospace;
font-size: larger;
} }
polyline.move-trace { polyline.move-trace {
@ -378,14 +380,11 @@ div#content {
#edge-inputs { #edge-inputs {
position: absolute; position: absolute;
right: 0; right: 0;
height: 100%; /* height: 100%; */
background-color: rgba(0, 255, 255, 0.418);
pointer-events: none; pointer-events: none;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
/* align-content: space-around; */
align-items: end; align-items: end;
/* justify-content: space-between; */
} }
#edge-inputs > * { #edge-inputs > * {
@ -504,12 +503,10 @@ div#dice {
div#status { div#status {
margin: 3px; margin: 3px;
/* display: none; */ display: none;
/* visibility: hidden; */
user-select: none; user-select: none;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
/* right: 50px; */
white-space: nowrap; white-space: nowrap;
pointer-events: none; pointer-events: none;
} }

View File

@ -131,7 +131,7 @@
<span class="hidden"></span><span class="visible"></span> <span class="hidden"></span><span class="visible"></span>
</label> </label>
<input type="checkbox" data-allegiance="attacker" id="attacker-firing-arc-vis" /> <input type="checkbox" data-allegiance="attacker" id="attacker-firing-arc-vis" />
<label for="attacker-firing-arc-vis"> <label style="color: blue;" for="attacker-firing-arc-vis">
<span class="hidden"></span><span class="visible"></span> <span class="hidden"></span><span class="visible"></span>
</label> </label>
</div> </div>

View File

@ -92,7 +92,7 @@ function clearMoveEndedIndicators(records) {
function distance(count = '-') { function distance(count = '-') {
distanceOutput.querySelector('#hex-count').textContent = count; distanceOutput.querySelector('#hex-count').textContent = count;
distanceOutput.style.visibility = count === '-' ? 'hidden' : 'visible'; distanceOutput.style.display = count === '-' ? 'none' : 'inline';
} }
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random#getting_a_random_integer_between_two_values_inclusive // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random#getting_a_random_integer_between_two_values_inclusive