Update Compliance Dashboard to use a grid layout

What does this MR do?

In preparation for #217939 (closed) and other future compliance dashboard changes, I needed to change the compliance dashboard to work more like a table.

The problem with tables, however, is that the columns aren't as fluid as flexbox in terms of positioning and size. So I've made a faux-table using CSS grid to get the fluid layout the design is looking for while retaining the structure of tables.

I've also updated the labels to be lowercase across the board to be consistent and in-line with the designs.

Screenshots

	Smaller screens	Larger screens
Before
After

Video

Responsiveness
Grabación_de_pantalla_2020-07-09_a_las_12.44.58

Does this MR meet the acceptance criteria?

Conformity

• Changelog entry
• Code review guidelines
• Merge request performance guidelines
• Style guides
• Separation of EE specific content

Availability and Testing

• Review and add/update tests for this feature/bug. Consider all test levels. See the Test Planning Process.
• Tested in all supported browsers

Related #217938 (closed)