Update severity badges
### Background: From this issue: https://gitlab.com/gitlab-org/gitlab/issues/34352 we are redesigning our severity badges to be more clear, quickly identifiable, scaleable, and accessible. ### Proposal: New badge designs: | Old badge | New badge | New badge color | | - | - | - | | ![Screen_Shot_2020-01-27_at_1.26.43_PM](/uploads/9cab84a1535d6015897611d1e2ed6abd/Screen_Shot_2020-01-27_at_1.26.43_PM.png) | ![Severity_critical-label](/uploads/ee4d1f8f73ca2af7a15954c351bb62d8/Severity_critical-label.png) | `#8B2615` | | ![Screen_Shot_2020-01-27_at_1.27.21_PM](/uploads/402abbca7485298832c35be32cfb96de/Screen_Shot_2020-01-27_at_1.27.21_PM.png) | ![Severity_high-label](/uploads/cde48647f1d1e403de36c95eff186dab/Severity_high-label.png) | `#C0341D` | | ![Screen_Shot_2020-01-27_at_1.25.38_PM](/uploads/a02597429affeef24d445e9707f94461/Screen_Shot_2020-01-27_at_1.25.38_PM.png) | ![Severity_medium-label](/uploads/ecdd5250a29d8ac8b3d5134e5b619408/Severity_medium-label.png) | `#FCA429` | | ![Screen_Shot_2020-01-27_at_1.25.47_PM](/uploads/ab5a636ad579b1819d8020961216da17/Screen_Shot_2020-01-27_at_1.25.47_PM.png) | ![Severity_low-label](/uploads/4c7f854ef1fe8b5dcb0699070b864c0c/Severity_low-label.png) | `#FDBC60` | | ![Screen_Shot_2020-01-27_at_1.28.21_PM](/uploads/4e55d479bd879e969aacaea6062e2e3e/Screen_Shot_2020-01-27_at_1.28.21_PM.png) | ![Severity_info-label](/uploads/a8386cf8a32f0883b98c5bd36446b12d/Severity_info-label.png) | `#418CD8` | | ![Screen_Shot_2020-01-27_at_1.25.53_PM](/uploads/fa68e41daf5611dda328aab70f7dee40/Screen_Shot_2020-01-27_at_1.25.53_PM.png) | ![Severity_unknown-label](/uploads/4cc2e2c19dda8e1db5b5aecfda3ce0b6/Severity_unknown-label.png) | `#919191` | Text styling: - Severity label text is always in GitLab's default paragraph style and color (unless defined otherwise) - Severity label text is always sentence case (unless defined otherwise) - Severity label text always has 8px padding between the icon and the severity text Severity icon: - Colors defined in table - Icon is 12px x 12px #### Locations to change: These locations use the same list styling/component **Note**: In the Dependency list all the items should be left aligned. | Location | Before | After | | - | - | - | | Project, Group, and Instance security dashboard, Pipeline vulnerability list | TBA | ![](https://gitlab.com/gitlab-org/gitlab/uploads/d9e77b25ac163c05f0d4c43bfef8cbf7/In_use__IRL__small.png) | | Vulnerability charts | ![Screen_Shot_2020-01-27_at_4.06.52_PM](https://gitlab.com/gitlab-org/gitlab/uploads/e3fea5ce4fbd195dd325cdcac27d081f/Screen_Shot_2020-01-27_at_4.06.52_PM.png) | ![new-severity-labels](https://gitlab.com/gitlab-org/gitlab/uploads/457a57acfe9458d388718666d6c377a8/new-severity-labels.png) | | Vulnerability modal | ![vulnerability-modal-today](https://gitlab.com/gitlab-org/gitlab/uploads/16613fea8584c79e7c8805b5461f379e/vulnerability-modal-today.png) | ![vulnerability-modal-proposed](https://gitlab.com/gitlab-org/gitlab/uploads/0c1def04594b8f7fd2bca3e49f3a3080/vulnerability-modal-proposed.png) | | Dependency List | ![all-tab](https://gitlab.com/gitlab-org/gitlab/uploads/905866e141cc055db976c4e610bd7de5/all-tab.png) | ![all-tab-new-severities](https://gitlab.com/gitlab-org/gitlab/uploads/526522310bfc8a8ff93aaa28230a735e/all-tab-new-severities.png) |
issue