mirror of
				https://github.com/go-gitea/gitea
				synced 2025-10-30 19:08:37 +00:00 
			
		
		
		
	Fix unclickable checkboxes (#30195)
Fix https://github.com/go-gitea/gitea/issues/30185, regression from https://github.com/go-gitea/gitea/pull/30162. The checkboxes were unclickable because the label was positioned over the checkbox with `padding`. Now it uses `margin` so the checkbox itself will be clickable in all cases. Secondly, I changed the for/id linking to also add missing `for` attributes when `id` is present. The other way around (only `for` present) is currently not handled and I think there are likey no occurences in the code and introducing new non-generated `id`s might cause problems elsewhere if we do, so I skipped on that.
This commit is contained in:
		| @@ -6,10 +6,19 @@ export function initAriaCheckboxPatch() { | ||||
|     if (el.hasAttribute('data-checkbox-patched')) continue; | ||||
|     const label = el.querySelector('label'); | ||||
|     const input = el.querySelector('input'); | ||||
|     if (!label || !input || input.getAttribute('id') || label.getAttribute('for')) continue; | ||||
|     const id = generateAriaId(); | ||||
|     input.setAttribute('id', id); | ||||
|     label.setAttribute('for', id); | ||||
|     if (!label || !input) continue; | ||||
|     const inputId = input.getAttribute('id'); | ||||
|     const labelFor = label.getAttribute('for'); | ||||
|  | ||||
|     if (inputId && !labelFor) { // missing "for" | ||||
|       label.setAttribute('for', inputId); | ||||
|     } else if (!inputId && !labelFor) { // missing both "id" and "for" | ||||
|       const id = generateAriaId(); | ||||
|       input.setAttribute('id', id); | ||||
|       label.setAttribute('for', id); | ||||
|     } else { | ||||
|       continue; | ||||
|     } | ||||
|     el.setAttribute('data-checkbox-patched', 'true'); | ||||
|   } | ||||
| } | ||||
|   | ||||
		Reference in New Issue
	
	Block a user