[IN-95][osf-style] Fix navbar to handle long names

[baylee-d]

Purpose

To configure the navbar to handle long names

Changes

Because new buttons and changes can happen to the navbar in the future, flexbox is a good solution to make sure that the navbar is dynamic to whatever is inside of it.

• Remove floats and instead replace the styling with flexbox
• Add styling to the profile image

Testing

This is a change to a lot of the navbar styles. Probably need regression tests to make sure everything is still working

Note

Will need to update osf.io and all ember apps to the latest osf-style after merging this in. Will also need to do some minor changes to the osf.io and ember navbar to get styles to apply.

Ticket

https://openscience.atlassian.net/browse/IN-95

[alexschiller]

@jamescdavis, flexbox evangelist extraordinaire, can you give this a quick pass?

[baylee-d]

I went through and remove the !important calls and added a few comments in the parts where min-width was added for flexbox.