Follow-up from "Make it easier to find invited group members"

Everyone can contribute. Help move this issue forward while earning points, leveling up and collecting rewards.

The following discussion from gitlab-ce!28436 should be addressed:

Attaching more detailed mockups with some additional improvements. Ideally, I'd like these to be done in this MR but if not possible, let's at least move the second counter (below the tabs) and let's just say either:

  • Members with access to { group name } for existing tab
  • Members with pending access to { group name } for pending tab

Let's also just say 'Existing' and 'Pending' in our tabs. It's clear from the IA that the user is filtering Members (title above).

Additional improvements

  • use a table without borders on the sides
  • search box should be the one with the button because the user needs to confirm their search before it's triggered
  • labels for the 2FA and 'Sort by' dropdowns
  • use grey background for the filtering/sorting area above the table (like we do on other pages)

I'm including designs for mobile devices as well, the current ones seem to be in poor shape (see below)

gitlab.com_groups_gitlab-org_-group_members_iPhone_5_SE

Desktop - existing Desktop - pending Mobile - existing Mobile - pending
image image image image

If not possible, let's create a new issue for these additional improvements.

Edited by 🤖 GitLab Bot 🤖