Improve styling of the new user menu

On Clean:

1. Before logging in, verify that the "log in" text link is colored and not grey.
2. Log in as an administrator.
3. Create a basic custom menu with nested elements - the example one is fine.
4. Mouseover the user menu dropdown (the part that has the user's name and avatar).
   • Observe that the user's name turns from grey to black, just like the items in the custom menu.
5. Open the user menu dropdown.
   • Observe that the menu now has a minimum width set.
6. Open a dropdown from the custom menu and compare it to the user menu dropdown.
   • Observe that the border styles and drop shadows are the same.
7. Reload the page and pay attention to the position of the caret (the little down-facing arrowhead).
   • Observe that it didn't change position during page load.
8. Install the Hebrew (he) language pack and enable it.
   • Observe that the RTL styles look just as good as the LTR styles - i.e. caret not weirdly out of place.
9. Re-select English as your active language.
10. Create a course with an enrolled user with a really long name, like "Mynameis Alittletoolongformostpeopletoremember"
11. Select the user from the course participants list and use the Administration block to "log in as" that user.
    • Observe that the user menu dropdown now reflects this (i.e. it says that you are currently viewing as that user). Observe that the message that tells you this is not cut off by the avatars.
12. Disable Javascript in your browser.
    • Observe that the dropdown has been replaced by a horizontal list of icons, and the dropdown caret is no longer visible.
13. Enable the inverted navbar.
    • Observe that the styling has been updated appropriately.

On Base:

1. Install a bunch of language packs, particularly ones with long names.
   • Observe that the box for the user menu does not extend to the width of the select box for the language menu.
   • Observe that there's a decent amount of margin between the avatar(s) and the user text.