diff options
| author | Danilo M. <danix@danix.xyz> | 2026-04-17 09:27:05 +0200 |
|---|---|---|
| committer | Danilo M. <danix@danix.xyz> | 2026-04-17 09:27:05 +0200 |
| commit | 92819ec472bc2cfa2f448e7282956bb2a5fc1d1a (patch) | |
| tree | c553822ada95740116257e3bd13a82b71601fc9b /themes | |
| parent | beeddeeeac2189bdc1c6c3b19cfac14717531bf5 (diff) | |
| download | danixxyz-92819ec472bc2cfa2f448e7282956bb2a5fc1d1a.tar.gz danixxyz-92819ec472bc2cfa2f448e7282956bb2a5fc1d1a.zip | |
feat: ensure all form inputs have associated labels (for/id attributes)
- Added id to checkbox: agree-terms
- Added id/for to checkboxes: interest-tech, interest-design
- Added id/for to radio buttons: preference-option-a, preference-option-b
- All 13 form inputs now have matching label associations
- Improves WCAG 2.1 AA compliance (3.3.2 Labels or Instructions)
Diffstat (limited to 'themes')
| -rw-r--r-- | themes/danix-xyz-hacker/layouts/partials/form-components.html | 20 |
1 files changed, 10 insertions, 10 deletions
diff --git a/themes/danix-xyz-hacker/layouts/partials/form-components.html b/themes/danix-xyz-hacker/layouts/partials/form-components.html index ddfa9ad..6c6416b 100644 --- a/themes/danix-xyz-hacker/layouts/partials/form-components.html +++ b/themes/danix-xyz-hacker/layouts/partials/form-components.html @@ -61,8 +61,8 @@ ============================================ --> <div class="form-group"> - <label class="flex items-center gap-3 cursor-pointer"> - <input type="checkbox" class="form-checkbox"> + <label for="agree-terms" class="flex items-center gap-3 cursor-pointer"> + <input type="checkbox" id="agree-terms" class="form-checkbox"> <span>{{ i18n "form_agree_terms" | default "I agree to the terms" }}</span> </label> </div> @@ -70,12 +70,12 @@ <!-- Multiple Checkboxes --> <div class="form-group space-y-2"> <p class="font-semibold">{{ i18n "form_select_interests" | default "Select your interests" }}</p> - <label class="flex items-center gap-3 cursor-pointer"> - <input type="checkbox" class="form-checkbox" name="interests"> + <label for="interest-tech" class="flex items-center gap-3 cursor-pointer"> + <input type="checkbox" id="interest-tech" class="form-checkbox" name="interests"> <span>{{ i18n "form_interest_tech" | default "Technology" }}</span> </label> - <label class="flex items-center gap-3 cursor-pointer"> - <input type="checkbox" class="form-checkbox" name="interests"> + <label for="interest-design" class="flex items-center gap-3 cursor-pointer"> + <input type="checkbox" id="interest-design" class="form-checkbox" name="interests"> <span>{{ i18n "form_interest_design" | default "Design" }}</span> </label> </div> @@ -86,12 +86,12 @@ <div class="form-group space-y-2"> <p class="font-semibold">{{ i18n "form_select_preference" | default "Select a preference" }}</p> - <label class="flex items-center gap-3 cursor-pointer"> - <input type="radio" name="preference" class="form-radio"> + <label for="preference-option-a" class="flex items-center gap-3 cursor-pointer"> + <input type="radio" id="preference-option-a" name="preference" class="form-radio"> <span>{{ i18n "form_option_a" | default "Option A" }}</span> </label> - <label class="flex items-center gap-3 cursor-pointer"> - <input type="radio" name="preference" class="form-radio"> + <label for="preference-option-b" class="flex items-center gap-3 cursor-pointer"> + <input type="radio" id="preference-option-b" name="preference" class="form-radio"> <span>{{ i18n "form_option_b" | default "Option B" }}</span> </label> </div> |
