Make deploy keys table more clearly structured

What does this MR do?

• Converts three tables into a tabbed interface.
• The individual deploy keys use a card view on small screens (same as pipeline s view)
• For more info, see in issue description: https://gitlab.com/gitlab-org/gitlab-ce/issues/41082#design

Are there points in the code the reviewer needs to double check?

• Vertical Alignment of icons

Why was this MR needed?

To make the deploy keys more usable with a lot of keys and projects per key.

Screenshots (if relevant)

Behaviour video:

new-deploy-tokens

Small screen screenshot:

Does this MR meet the acceptance criteria?

• Changelog entry added, if necessary
• [n/a] Documentation created/updated
• [n/a] API support added
• Tests added for this feature/bug
• Review
  • Has been reviewed by UX
  • Has been reviewed by Frontend
  • [n/a] Has been reviewed by Backend
  • [n/a] Has been reviewed by Database
• Conform by the merge request performance guides
• Conform by the style guides
• Squashed related commits together
• Internationalization required/considered
• End-to-end tests pass (package-and-qa manual pipeline job)

What are the relevant issue numbers?

Closes #41082 (closed)