Adjust approvals table

What does this MR do and why?

Here's a bunch of missing UI improvements for the MR approval rules. I tried to provide extra context when needed and linked to the discussions in the issue. Here's a summary:

• renaming column header from "Name" to "Rule"
• fixing alignment in action column when in MR edit
• adding accessibility tests and fixes
• unifying vertical alignment within table rows
• applying padding within table rows from the new design
• change empty rule action button into an icon button (unify with the rest of rules controls)

MR acceptance checklist

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

Screenshots or screen recordings

There are slight padding/margin changes (i.e., fixes) in various places.

Before	After

How to set up and validate locally

Numbered steps to set up and validate the change are strongly suggested.

1. Choose a project and go to Settings > Merge request
2. Scroll down to Merge request approvals.
3. To test changes in MR edit view select an existing MR and click Edit buttn
4. Scroll down, between Reviewers and Milestone, expand Approval rules.

Related to #432719 (closed)