Fix unclickable labels in onboarding

This commit is contained in:
Kevin Froman 2020-08-20 01:29:29 -05:00
parent 6089cc3c98
commit 2cf7a8c8b3
2 changed files with 28 additions and 10 deletions

View File

@ -144,7 +144,7 @@
<div class="box">
<nav class="level">
<div class="level-left">
<div class="level-item"><i class="icon fas fa-eye"></i> <input type="checkbox" name="state" checked></div>
<div class="level-item"><i class="icon fas fa-eye" for="state"></i> <input type="checkbox" name="state" checked></div>
<label for="state">Mass surveillance</label>
</div>
<div class="level-right">
@ -157,7 +157,7 @@
<nav class="level">
<div class="level-left">
<div class="level-item">
<i class="icon fas fa-university"></i> <input type="checkbox" name="stateTarget">
<i class="icon fas fa-university" for="stateTarget"></i> <input type="checkbox" name="stateTarget">
</div>
<label for="stateTarget">State actor (direct target)</label>
</div>
@ -166,7 +166,7 @@
</div>
<div class="column is-4">
<div class="box">
<i class="icon fas fa-binoculars"></i> <input type="checkbox" name="local"> <label for="local">Nearby threat</label>
<i class="icon fas fa-binoculars" for="local"></i> <input type="checkbox" name="local"> <label for="local">Nearby threat</label>
</div>
</div>
</div>
@ -179,7 +179,7 @@
<div class="box">
<nav class="level">
<div class="level-left">
<i class="icon fas fa-envelope"></i> <input type="checkbox" name="useMail" checked> <label for="useMail">Use OnionrMail</label>
<i class="icon fas fa-envelope" for="useMail"></i> <input type="checkbox" name="useMail" checked> <label for="useMail">Use OnionrMail</label>
</div>
<div class="level-right">
</div>
@ -190,7 +190,7 @@
<div class="box">
<nav class="level">
<div class="level-left">
<i class="icon fas fa-comments"></i> <input type="checkbox" name="useCircles" checked> <label for="useMail">Use Circles (message board system)</label>
<i class="icon fas fa-comments" for="useCircles"></i> <input type="checkbox" name="useCircles" checked> <label for="useCircles">Use Circles (message board system)</label>
</div>
<div class="level-right">
</div>
@ -207,7 +207,7 @@
<div class="box">
<nav class="level">
<div class="level-left">
<i class="icon fas fa-palette"></i> <input type="checkbox" name="useDarkTheme" checked> <label for="useDark">Use Dark Theme</label>
<i class="icon fas fa-palette" for="useDarkTheme"></i> <input type="checkbox" name="useDarkTheme" checked> <label for="useDarkTheme">Use Dark Theme</label>
</div>
<div class="level-right">
</div>
@ -219,7 +219,7 @@
<nav class="level">
<div class="level-left">
<div class="level-item">
<i class="icon fas fa-dollar-sign"></i> <input type="checkbox" name="donate"> <label for="donate">Donating the price of a coffee to fund development</label>
<i class="icon fas fa-dollar-sign" for="donate"></i> <input type="checkbox" name="donate"> <label for="donate">Donating the price of a coffee to fund development</label>
</div>
</div>
</nav>
@ -236,7 +236,7 @@
<nav class="level">
<div class="level-left">
<div class="level-item">
<i class="icon fas fa-book-open"></i> <input checked type="checkbox" name="networkContributionPlain"> <label for="networkContributionPlain">Storing plaintext data</label>
<i class="icon fas fa-book-open" for="networkContributionPlain"></i> <input checked type="checkbox" name="networkContributionPlain"> <label for="networkContributionPlain">Storing plaintext data</label>
</div>
</div>
<div class="level-right">
@ -249,7 +249,7 @@
<nav class="level">
<div class="level-left">
<div class="level-item">
<i class="icon fas fa-network-wired"></i> <input checked type="checkbox" name="networkContribution"> <label for="networkContribution">Participating in data storage & sharing</label>
<i class="icon fas fa-network-wired" for="networkContribution"></i> <input checked type="checkbox" name="networkContribution"> <label for="networkContribution">Participating in data storage & sharing</label>
</div>
</div>
</nav>

View File

@ -66,3 +66,21 @@ document.getElementById('onboardingForm').onsubmit = function(e){
e.preventDefault()
}
/* Fix label clicking since bulma is weird */
let labelClickFix = function(labels) {
for (i = 0; i < labels.length; i++){
labels[i].onclick = function(event){
document.getElementsByName(event.target.getAttribute("for"))[0].checked ^= 1
}
}
}
let setupLabelFix = function(){
var labels = document.getElementsByTagName('label')
var icons = document.getElementsByTagName('i')
labelClickFix(labels)
labelClickFix(icons)
}
setupLabelFix()