Add feedback border design tokens
While working through border color (red) migrations in https://gitlab.com/gitlab-org/gitlab/-/merge_requests/211443, it's apparent that some aren't a 1:1 with action or control errors. By adding feedback border design tokens the existing design intent can remain where gl-border-red-500 is used today.
This also has the potential to support states for cards, dashboards, and potential alert updates where a full border has been explored.
These are the files that need to be updated, grouped by how the border is used:
Control (Addressed in gitlab-org/gitlab!211443 (merged))
app/assets/javascripts/blob/filepath_form_mediator.js: 'gl-border !gl-border-solid gl-border-red-500 !gl-shadow-none' (applied to input to indicate a bad file name)
app/assets/javascripts/new_branch_form.js:const NAME_ERROR_CLASS = 'gl-border-red-500' (applied to a form element)
ee/app/assets/javascripts/vulnerabilities/components/severity_modal.vue: :class="{ '!gl-border !gl-border-red-500': !commentValid }" (applied to input)
Feedback
app/assets/javascripts/diffs/components/diff_file.vue: 'gl-border-red-500': file.conflict_type (applied to div to indicate a conflict)
ee/app/assets/javascripts/operations/components/dashboard/project.vue: 'gl-border-red-500': this.hasPipelineFailed (applied to header to indicate pipeline failure)
Edited by Jeremy Elder