Fix unclickable labels in onboarding
This commit is contained in:
		
							parent
							
								
									6089cc3c98
								
							
						
					
					
						commit
						2cf7a8c8b3
					
				
					 2 changed files with 28 additions and 10 deletions
				
			
		|  | @ -144,7 +144,7 @@ | ||||||
|                                       <div class="box"> |                                       <div class="box"> | ||||||
|                                         <nav class="level"> |                                         <nav class="level"> | ||||||
|                                           <div class="level-left"> |                                           <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> |                                             <label for="state">Mass surveillance</label> | ||||||
|                                           </div> |                                           </div> | ||||||
|                                           <div class="level-right"> |                                           <div class="level-right"> | ||||||
|  | @ -157,7 +157,7 @@ | ||||||
|                                         <nav class="level"> |                                         <nav class="level"> | ||||||
|                                           <div class="level-left"> |                                           <div class="level-left"> | ||||||
|                                             <div class="level-item"> |                                             <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> |                                             </div> | ||||||
|                                             <label for="stateTarget">State actor (direct target)</label> |                                             <label for="stateTarget">State actor (direct target)</label> | ||||||
|                                           </div> |                                           </div> | ||||||
|  | @ -166,7 +166,7 @@ | ||||||
|                                     </div> |                                     </div> | ||||||
|                                     <div class="column is-4"> |                                     <div class="column is-4"> | ||||||
|                                       <div class="box"> |                                       <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> |                                     </div> | ||||||
|                                 </div> |                                 </div> | ||||||
|  | @ -179,7 +179,7 @@ | ||||||
|                                       <div class="box"> |                                       <div class="box"> | ||||||
|                                         <nav class="level"> |                                         <nav class="level"> | ||||||
|                                           <div class="level-left"> |                                           <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> | ||||||
|                                           <div class="level-right"> |                                           <div class="level-right"> | ||||||
|                                           </div> |                                           </div> | ||||||
|  | @ -190,7 +190,7 @@ | ||||||
|                                       <div class="box"> |                                       <div class="box"> | ||||||
|                                         <nav class="level"> |                                         <nav class="level"> | ||||||
|                                           <div class="level-left"> |                                           <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> | ||||||
|                                           <div class="level-right"> |                                           <div class="level-right"> | ||||||
|                                           </div> |                                           </div> | ||||||
|  | @ -207,7 +207,7 @@ | ||||||
|                                           <div class="box"> |                                           <div class="box"> | ||||||
|                                             <nav class="level"> |                                             <nav class="level"> | ||||||
|                                               <div class="level-left"> |                                               <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> | ||||||
|                                               <div class="level-right"> |                                               <div class="level-right"> | ||||||
|                                               </div> |                                               </div> | ||||||
|  | @ -219,7 +219,7 @@ | ||||||
|                                             <nav class="level"> |                                             <nav class="level"> | ||||||
|                                               <div class="level-left"> |                                               <div class="level-left"> | ||||||
|                                                 <div class="level-item"> |                                                 <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> | ||||||
|                                               </div> |                                               </div> | ||||||
|                                             </nav> |                                             </nav> | ||||||
|  | @ -236,7 +236,7 @@ | ||||||
|                                           <nav class="level"> |                                           <nav class="level"> | ||||||
|                                             <div class="level-left"> |                                             <div class="level-left"> | ||||||
|                                               <div class="level-item"> |                                               <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> |                                             </div> | ||||||
|                                             <div class="level-right"> |                                             <div class="level-right"> | ||||||
|  | @ -249,7 +249,7 @@ | ||||||
|                                           <nav class="level"> |                                           <nav class="level"> | ||||||
|                                             <div class="level-left"> |                                             <div class="level-left"> | ||||||
|                                               <div class="level-item"> |                                               <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> | ||||||
|                                             </div> |                                             </div> | ||||||
|                                           </nav> |                                           </nav> | ||||||
|  |  | ||||||
|  | @ -66,3 +66,21 @@ document.getElementById('onboardingForm').onsubmit = function(e){ | ||||||
| 
 | 
 | ||||||
|     e.preventDefault() |     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() | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue