mozilla/treeherder-ui — pull request #264 by tojonmz (2014-11-10 05:07:13+00:00)
Title: Bug 1095211 -  Add a bit more polish and tooltips to the navbar

This work fixes Bugzilla bug [1095211](https://bugzilla.mozilla.org/show_bug.cgi?id=1095211).

I'm pretty pleased with the results of this work. This adds a bunch of graphic design, UI polish, and consistency to the right hand navbar. Specifically:

* arbitrary Repo, Filter, Help, Collapse, etc, button spacing has been eliminated
* Repo, Filter, Login button font size has been reduced 1px so they aren't so overwhelming
* a clean help icon has been used instead of "Help"
* we get rid of the grey buttons in the dark navbar for a peaceful appearance
* we use 1 pixel button borders do delineate the dark bar button boundaries
* we reduce the height of the unclassified failures button 1 pixel so it floats - evocative of a job button
* we add tooltips for all menus and buttons, instead of only some having them
* we remove the double icons in the Collapse jobs/revisions menu
* we use `fa-bar` for the concept of collapse, since it is a lot cleaner visually than the `fa-list`
* we use the much cleaner `fa-angle` for drop down menus
* we do some -ve margins and one `!important` to override some crazy `.btn` class inheritance

What we *aren't* doing in this change, and intend to do later:

* a new icon for the problematic Show/hide hidden jobs
* possible color change to a sympathetic orange hue for the Unclassified failures button

Here is the before and after:

![navbarrightcurrent](https://cloud.githubusercontent.com/assets/3660661/4971203/63ecd17e-6893-11e4-9ee0-df7d874016e5.jpg)

![navbarrightproposed](https://cloud.githubusercontent.com/assets/3660661/4971204/68c72550-6893-11e4-81ae-bb0ed052f283.jpg)

Here is the more subtle highlight color and an example of a new tooltip for the Filters button. I am consciously only highlighting the text:

![navbarrighthighlighttooltip](https://cloud.githubusercontent.com/assets/3660661/4971211/9304a8bc-6869-11e4-8f41-52d7f945886b.jpg)

Here are the new tooltips for the lower navbar. Button widths have also been equalized.

![navbarrightshowhidden](https://cloud.githubusercontent.com/assets/3660661/4971219/b9b5bb4a-6869-11e4-9a7a-8ebe7ba58ab8.jpg)

![navbarrightcollapseexpand](https://cloud.githubusercontent.com/assets/3660661/4971222/c001e37a-6869-11e4-92e6-54989c8efce5.jpg)

![navbarrightjobrevisionmenu](https://cloud.githubusercontent.com/assets/3660661/4971223/c2259a48-6869-11e4-982c-0eb25c093c58.jpg)

I've done a bunch of testing on Firefox and Chrome, and am very happy with the results. If we could try this on dev, or if someone could try the branch locally with a vagrant backend underneath so they can log in and ensure the "Login" field is sufficient for the user email, that would be great. I put in a significant left-hand padding to be sure we are ok there.

Tested on Windows:
FF Release **33.0.2**
Chrome Latest Release **38.0.2125.111 m**

Adding @wlach for review, and @edmorley and @rvandermeulen for visibility.