<!--IssueSummary start--> <details> <summary> Everyone can contribute. [Help move this issue forward](https://handbook.gitlab.com/handbook/marketing/developer-relations/contributor-success/community-contributors-workflows/#contributor-links) while earning points, leveling up and collecting rewards. </summary> - [Work on this issue](https://contributors.gitlab.com/manage-issue?action=work&projectId=278964&issueIid=510495) - [Close this issue](https://contributors.gitlab.com/manage-issue?action=close&projectId=278964&issueIid=510495) </details> <!--IssueSummary end--> ## Problem to solve The `text-area` field for "Default description template for merge requests" does not have the necessary `gl-form-input` class, and also doesn't have an accessible label. ## Screenshots {width="400px"} ## Proposal Make textarea use `gl-form-input` and ensure it has an accessible label. ## Implementation guide Add the `gl-form-input` class and make the label use the actual `<label>` element: ```diff diff --git a/ee/app/views/projects/settings/merge_requests/_merge_request_settings.html.haml b/ee/app/views/projects/settings/merge_requests/_merge_request_settings.html.haml index 9331e2b7376c..38341241f09b 100644 --- a/ee/app/views/projects/settings/merge_requests/_merge_request_settings.html.haml +++ b/ee/app/views/projects/settings/merge_requests/_merge_request_settings.html.haml @@ -22,13 +22,13 @@ - if @project.feature_available?(:issuable_default_templates) .form-group - %b= _('Default description template for merge requests') + %label.gl-mb-0{ for: 'merge_requests_template' }= _('Default description template for merge requests') %p.gl-text-subtle = s_('ProjectSettings|Used for every new merge request.') - link = link_to('', help_page_path('user/project/description_templates.md', anchor: 'create-a-merge-request-template'), target: '_blank', rel: 'noopener noreferrer') = safe_format(s_('ProjectSettings|%{link_start}What are description templates?%{link_end}'), tag_pair(link, :link_start, :link_end)) - = form.text_area :merge_requests_template, class: "form-control", rows: 3, data: { testid: 'default-merge-request-template-field' } + = form.text_area :merge_requests_template, id: 'merge_requests_template', class: "form-control gl-form-input", rows: 3, data: { testid: 'default-merge-request-template-field' } .gl-text-subtle - link = link_to('', help_page_path('user/markdown.md'), target: '_blank', rel: 'noopener noreferrer') ```