fix(fxa-settings) fix label vertical centering in mobile

[millmason]

Because

• In Account Settings, in the "Linked Accounts" section, if the logged-in account has a linked account (either Apple or Google) then the label for that account ("Google", for example) will not line up with the icon for that linked account in mobile. Please see attached screenshots.

This pull request

• We add the class justify-center onto one of the divs wrapping the label. This causes no changes in desktop, and centers the label appropriately in mobile.

Issue that this pull request solves

Closes: #12009

Checklist

Put an x in the boxes that apply

• My commit is GPG signed.
• If applicable, I have modified or added tests which pass locally.
• I have added necessary documentation (if appropriate).
• I have verified that my changes render correctly in RTL (if appropriate).

Screenshots (Optional)

Before (desktop):

Before (mobile):

After (desktop):

After (mobile):

Other information (Optional)

If you have third-party auth set up in your local, you can view the original state by starting on the main branch, and logging into a user account with a linked account and visiting localhost:3030/settings. If you scroll down to the Linked Accounts section, you should see a list of the user's linked accounts. In Desktop, the label should be vertically centered relative to the associated icon. If you use the devtools to switch to a mobile view, you should see that the label is vertically aligned with the top of the associated icon.

You can view the changes by changing your branch to this one and following the above steps again. Everything should be the same except for the mobile view. In the mobile view, the label for a linked account should be vertically centered relative to the associated icon (exactly as in Desktop.)

If you don't have third-party auth set up in your local, you can approximate the changes in this PR by visiting https://accounts.stage.mozaws.net/?forceExperiment=thirdPartyAuth&forceExperimentGroup=google and creating an account linked to a Google account. When you have successfully logged in, scroll down to the Linked Accounts section on desktop and note that the "Google" label is aligned with the logo as expected. Then use the devtools to switch to the mobile view, and observe the misalignment. Finally, use the Inspect tool in devtools to click on the label itself. It will probably be this element: <p class="text-xs break-word" data-testid="provider-name">Google</p>.

Two elements up from that, you should see this div: <div class="flex flex-col flex-5 mobileLandscape:items-center mobileLandscape:flex-row"> .... </div>. Edit the list of classnames on that element to add justify-center, to reflect what we have in this PR. You should now see the label centered in mobile view.

[vbudhram]

@millsoper LGTM 👍🏽 Thanks for the screenshots :)