Maverick/SR6_Roll20_Sheet
1
1
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Refactor Radio Inputs to Labels for hit tracker

Browse source
This commit is contained in:
Sebastian Fischlmayr 2022-09-14 13:52:46 +02:00
parent 3458f39973
commit 395bfa1616
Signed by: Maverick
GPG key ID: 6379E413924A4E77
4 changed files with 37 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

9
output/main.css
View file

@ -31,6 +31,7 @@ input.sheet-tabstoggle[value="main"] ~ .main-tab {
border: 2px solid #500;
border-radius: 3px;
order: 1;
padding: 0;
position: relative;
}
@ -46,21 +47,17 @@ input.sheet-tabstoggle[value="main"] ~ .main-tab {
right: 4px;
}
.healthWrapper > .healthContainer > label.healthTrackerBox:checked {
.healthWrapper > .healthContainer > input:checked + .healthTrackerBox {
opacity: 0;
z-index: 0;
position: absolute;
}
.healthWrapper > .healthContainer > label.healthTrackerBox:checked ~ .healthTrackerBox {
.healthWrapper > .healthContainer > input:checked ~ .healthTrackerBox {
background-color: #444;
order: 3;
}
.healthWrapper > .healthContainer > label.healthTrackerBox:focus {
outline: none;
}
.abilityBox {
height: -webkit-fit-content;
height: -moz-fit-content;

21
output/main.html
View file

@ -90,20 +90,17 @@
</div>
<div class="healthBox">
<h2>Health</h2>
<input type="number" name="attr_physicalhealth" disabled="true" value="@{physicalHealth}">
<div class="healthWrapper">
<div class="healthContainer">
<label class="healthTrackerBox reset">
<input class="hidden vis" type="radio" name="attr_physicalHealth" value="0" checked="checked">
</label>
<label class="healthTrackerBox">
<input class="hidden vis" type="radio" name="attr_physicalHealth" value="1">
</label>
<label class="healthTrackerBox">
<input class="hidden vis" type="radio" name="attr_physicalHealth" value="2">
</label>
<label class="healthTrackerBox">
<input class="hidden vis" type="radio" name="attr_physicalHealth" value="3">
</label>
<input class="hidden disp" id="physK0" type="radio" name="attr_physicalHealth" value="0" checked="checked">
<label class="healthTrackerBox reset" for="physK0"></label>
<input class="hidden disp" id="physK1" type="radio" name="attr_physicalHealth" value="1">
<label class="healthTrackerBox" for="physK1"></label>
<input class="hidden disp" id="physK2" type="radio" name="attr_physicalHealth" value="2">
<label class="healthTrackerBox" for="physK2"></label>
<input class="hidden disp" id="physK3" type="radio" name="attr_physicalHealth" value="3">
<label class="healthTrackerBox" for="physK3"></label>
</div>
</div>
</div>