Design: Styling changes to grouping on the Vulnerability Report

Problems to solve

Filters, grouping, and groups look like one huge visual element, when in fact the former 2 are settings that apply to the results. We should make more of a distinction to communicate this visually.

Users also have to manually decipher where there are findings and where there are not. Everything is bolded right now, and they may have to scan past many 0 critical, 0 high, and 0 others before they get to an actual vulnerability count.

Also, fix inconsistencies (dropdown to button).

Proposal

  • Change the grouping dropdown to a button
  • Remove background (gray) color from group headers
  • Increase header size of group name to h4
  • Move the vulnerability counts by severity to a new line, under the group title
  • Only bold the copy of the severities where there are results

image.png

Compared to current:

Screenshot 2024-08-14 at 5.04.19 PM.png

Edited by Becka Lippert