gitlabhq/gitlabhq — pull request #6159 by dblessing (2014-01-25 16:28:37+00:00)
Title: Mobile UI improvements

These changes drastically improve the mobile experience. The changes mostly pertain to navigation plus the no ssh key message.

Note: Some of the navbar toggles have a blue outline around them in these screenshots. That's because I took the screenshots with Chrome in mobile emulation mode. Clicking some links causes it to be outlined. This does not happen on mobile. All of these changes were tested on an actual mobile device.

Also, there is a one-liner in here that disables tooltips for touch enabled devices. Tooltips on mobile end up requiring 2 taps to execute the click. The first tap renders the tooltip and the second executes the link.

## Before:
The main nav looks decent but if there are too many items they just go off the screen. The navbar toggle is small.
![before1](https://f.cloud.github.com/assets/2394772/2001973/9b86b3de-85db-11e3-8cd9-7932fb397238.png)

Tap the navbar toggle and you get a mess.
![before2](https://f.cloud.github.com/assets/2394772/2001974/9b9462b8-85db-11e3-83d7-1910c785ec9d.png)

The no ssh key message is small. The links are hard to tap with big fingers ;)
![before3](https://f.cloud.github.com/assets/2394772/2001987/6d555384-85dc-11e3-91f3-70f61d726bcd.png)

Please let me know if you have any questions about specific changes.

## After:
Navbar toggle is bigger and is spaced nicely.

![after1](https://f.cloud.github.com/assets/2394772/2001978/ededd2ec-85db-11e3-9665-74c98d77da0e.png)

Tap the navbar toggle and you see bigger header nav buttons. Also, the main nav is stacked and will expand to fit any number of items.
![after2](https://f.cloud.github.com/assets/2394772/2001979/edeeb932-85db-11e3-94f4-02cf85c6cff6.png)

The links are bigger and centered. Also, for mobile only I added an "Add key" link that is easier to tap than the inline link.
![after3](https://f.cloud.github.com/assets/2394772/2001993/8dbb5e66-85dc-11e3-85cd-0c373f7b6d42.png)

The no ssh key message when nav is expanded.
![after4](https://f.cloud.github.com/assets/2394772/2001994/8dbb8c56-85dc-11e3-96ba-16965734f4a3.png)

Shots of the light theme to show that things still look as expected.
![after5](https://f.cloud.github.com/assets/2394772/2002003/e6ef9a24-85dc-11e3-8254-a45a1f708d19.png)
![after6](https://f.cloud.github.com/assets/2394772/2002004/e6f186c2-85dc-11e3-85ff-11c8dc99b2e7.png)