Resolve "Replace gl-border-red-500"

What does this MR do and why?

  • Replace instances of gl-border-red-500 used for errors with is-invalid for consistent error presentation. The underlying hex value should remain unchanged, so there should be no noticeable visual difference from the changes.
  • Update vulnerability severity button to use danger button classes.

Screenshots or screen recordings

Before After
File name before File name after
New branch before New branch after
Change severity before Change severity after

How to set up and validate locally

File name

  1. Navigate to http://gitlab.com/[project] → "+" → "New file"
  2. In developer tools, add is-invalid to the input classes.

New branch name

  1. Navigation to http://gitlab.com/[project] → Branches → "New branch"
  2. Enter an invalid branch name, for example /test-branch.
  3. Move focus away from the input to see the border change.

Vulnerability severity

  1. Navigation to http://gitlab.com/[project] → Secure → Vulnerability report
  2. Click on a vulnerability name to go to its summary page.
  3. In the top right 'Edit vulnerability' dropdown choose 'Change severity.'
  4. Without making a selection or entering content into the textarea click 'Change severity'.

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Related to #540307

Edited by Jeremy Elder

Merge request reports

Loading