diff options
| author | silverwind <me@silverwind.io> | 2024-03-31 01:00:58 +0100 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2024-03-31 02:00:58 +0200 |
| commit | 640850e15f56bbe01f5d8ea407f99c79dc38457e (patch) | |
| tree | c7ad6357b6422db54163626d92bfbd8493059c4a /web_src/js/modules | |
| parent | 72a5d3faa8b65042a4fc7525d511d8942a47dafe (diff) | |
| download | gitea-640850e15f56bbe01f5d8ea407f99c79dc38457e.tar.gz gitea-640850e15f56bbe01f5d8ea407f99c79dc38457e.zip | |
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.
Diffstat (limited to 'web_src/js/modules')
| -rw-r--r-- | web_src/js/modules/fomantic/checkbox.js | 17 |
1 files changed, 13 insertions, 4 deletions
diff --git a/web_src/js/modules/fomantic/checkbox.js b/web_src/js/modules/fomantic/checkbox.js index ffe853b28f..7f2b340296 100644 --- a/web_src/js/modules/fomantic/checkbox.js +++ b/web_src/js/modules/fomantic/checkbox.js @@ -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'); } } |