Merge branch 'improve-navigation' into 'master'

Improve GitLab UI

* move logout button to top right

![Screenshot_2015-06-08_16.56.13](https://gitlab.com/gitlab-org/gitlab-ce/uploads/7de04fab52ad6b742dbea100674f9671/Screenshot_2015-06-08_16.56.13.png)

* remove issue/mr title truncation on index pages. For smaller screens it allow to read complete title of issue

![Screenshot_2015-06-08_16.57.55](https://gitlab.com/gitlab-org/gitlab-ce/uploads/9dcaadfba14f8561c12fcd29a2e70112/Screenshot_2015-06-08_16.57.55.png)

* Improve mobile UI for several pages

See merge request !783

23 files changed, 65 insertions, 52 deletions

diff --git a/app/assets/stylesheets/generic/forms.scss b/app/assets/stylesheets/generic/forms.scss
index 7e070b4f386..4282832e2bf 100644
--- a/app/assets/stylesheets/generic/forms.scss
+++ b/app/assets/stylesheets/generic/forms.scss
@@ -49,14 +49,6 @@ label {
   width: 250px;
 }
 
-.input-mx-250 {
-  max-width: 250px;
-}
-
-.input-mn-300 {
-  min-width: 300px;
-}
-
 .custom-form-control {
   width: 150px;
 }
diff --git a/app/assets/stylesheets/generic/header.scss b/app/assets/stylesheets/generic/header.scss
index a97671d0f06..5e8701830e7 100644
--- a/app/assets/stylesheets/generic/header.scss
+++ b/app/assets/stylesheets/generic/header.scss
@@ -202,9 +202,17 @@ header {
       }
     }
 
-    li {
-      display: table-cell;
-      width: 1%;
+    .navbar-collapse {
+      padding-left: 5px;
+
+      li {
+        display: table-cell;
+        width: 1%;
+
+        a {
+          margin-left: 8px !important;
+        }
+      }
     }
   }
 }
diff --git a/app/assets/stylesheets/generic/mobile.scss b/app/assets/stylesheets/generic/mobile.scss
index e61b39f1ac3..f04c8eef904 100644
--- a/app/assets/stylesheets/generic/mobile.scss
+++ b/app/assets/stylesheets/generic/mobile.scss
@@ -64,6 +64,21 @@
     margin-left: 15px !important;
     max-width: 70% !important;
   }
+
+  .issue-info, .merge-request-info {
+    display: none;
+  }
+
+  .issue-details {
+    .creator,
+    .page-title .btn-close {
+      display: none;
+    }
+  }
+
+  %ul.notes .note-role, .note-actions {
+    display: none;
+  }
 }
 
 @media (max-width: $screen-sm-max) {
diff --git a/app/assets/stylesheets/generic/sidebar.scss b/app/assets/stylesheets/generic/sidebar.scss
index 0cbb996f4e8..65e06e14c73 100644
--- a/app/assets/stylesheets/generic/sidebar.scss
+++ b/app/assets/stylesheets/generic/sidebar.scss
@@ -130,14 +130,6 @@
       .username {
         display: none;
       }
-
-      .avatar {
-        margin-bottom: 10px;
-      }
-
-      .logout-holder {
-        text-align: center;
-      }
     }
   }
 }
@@ -188,9 +180,8 @@
   bottom: 0;
   width: 100%;
   padding: 10px;
-  color: #fff;
 
-  .avatar {
+  .username {
     margin-top: 5px;
   }
 }
diff --git a/app/assets/stylesheets/pages/dashboard.scss b/app/assets/stylesheets/pages/dashboard.scss
index af9c83e5dc8..09e8d57a100 100644
--- a/app/assets/stylesheets/pages/dashboard.scss
+++ b/app/assets/stylesheets/pages/dashboard.scss
@@ -29,7 +29,7 @@
   line-height: 24px;
 
   .str-truncated {
-    max-width: 72%;
+    max-width: 76%;
   }
 
   a {
diff --git a/app/assets/stylesheets/pages/issues.scss b/app/assets/stylesheets/pages/issues.scss
index 3572f33e91f..ed938f86b35 100644
--- a/app/assets/stylesheets/pages/issues.scss
+++ b/app/assets/stylesheets/pages/issues.scss
@@ -145,3 +145,9 @@ h2.issue-title {
 .issue-form .select2-container {
   width: 250px !important;
 }
+
+.issues-holder {
+  .issue-info {
+    margin-left: 20px;
+  }
+}
diff --git a/app/assets/stylesheets/themes/gitlab-theme.scss b/app/assets/stylesheets/themes/gitlab-theme.scss
index 1b06b4aa925..10fcaf18fa9 100644
--- a/app/assets/stylesheets/themes/gitlab-theme.scss
+++ b/app/assets/stylesheets/themes/gitlab-theme.scss
@@ -30,8 +30,12 @@
       border-right: 1px solid $color-darker;
 
       .sidebar-user {
-        a {
-          color: $color-light;
+        color: $color-light;
+
+        &:hover {
+          background-color: $color-dark;
+          color: #FFF;
+          text-decoration: none;
         }
       }
     }
diff --git a/app/views/admin/groups/index.html.haml b/app/views/admin/groups/index.html.haml
index e00b23ad99f..5ce7cdf2f8d 100644
--- a/app/views/admin/groups/index.html.haml
+++ b/app/views/admin/groups/index.html.haml
@@ -11,7 +11,7 @@
 = form_tag admin_groups_path, method: :get, class: 'form-inline' do
   = hidden_field_tag :sort, @sort
   .form-group
-    = text_field_tag :name, params[:name], class: "form-control input-mn-300"
+    = text_field_tag :name, params[:name], class: "form-control"
   = button_tag "Search", class: "btn submit btn-primary"
 
   .pull-right
diff --git a/app/views/dashboard/groups/index.html.haml b/app/views/dashboard/groups/index.html.haml
index cfb386e131f..0a354373b9b 100644
--- a/app/views/dashboard/groups/index.html.haml
+++ b/app/views/dashboard/groups/index.html.haml
@@ -2,7 +2,7 @@
 %h3.page-title
   Group Membership
   - if current_user.can_create_group?
-    %span.pull-right
+    %span.pull-right.hidden-xs
       = link_to new_group_path, class: "btn btn-new" do
         %i.fa.fa-plus
         New Group
@@ -17,7 +17,7 @@
     - @group_members.each do |group_member|
       - group = group_member.group
       %li
-        .pull-right
+        .pull-right.hidden-xs
           - if can?(current_user, :admin_group, group)
             = link_to edit_group_path(group), class: "btn-sm btn btn-grouped" do
               %i.fa.fa-cogs
@@ -27,7 +27,7 @@
             %i.fa.fa-sign-out
             Leave
 
-        = image_tag group_icon(group), class: "avatar s40 avatar-tile"
+        = image_tag group_icon(group), class: "avatar s40 avatar-tile hidden-xs"
         = link_to group, class: 'group-name' do
           %strong= group.name
 
diff --git a/app/views/explore/groups/index.html.haml b/app/views/explore/groups/index.html.haml
index c05d45e0100..f3f0b778539 100644
--- a/app/views/explore/groups/index.html.haml
+++ b/app/views/explore/groups/index.html.haml
@@ -4,7 +4,7 @@
     = form_tag explore_groups_path, method: :get, class: 'form-inline form-tiny' do |f|
       = hidden_field_tag :sort, @sort
       .form-group
-        = search_field_tag :search, params[:search], placeholder: "Filter by name", class: "form-control search-text-input input-mn-300", id: "groups_search"
+        = search_field_tag :search, params[:search], placeholder: "Filter by name", class: "form-control search-text-input", id: "groups_search"
       .form-group
         = button_tag 'Search', class: "btn btn-primary wide"
 
diff --git a/app/views/explore/projects/_filter.html.haml b/app/views/explore/projects/_filter.html.haml
index b3963a9d901..82622a58ed2 100644
--- a/app/views/explore/projects/_filter.html.haml
+++ b/app/views/explore/projects/_filter.html.haml
@@ -1,7 +1,7 @@
 .pull-left
   = form_tag explore_projects_filter_path, method: :get, class: 'form-inline form-tiny' do |f|
     .form-group
-      = search_field_tag :search, params[:search], placeholder: "Filter by name", class: "form-control search-text-input input-mn-300", id: "projects_search"
+      = search_field_tag :search, params[:search], placeholder: "Filter by name", class: "form-control search-text-input", id: "projects_search"
     .form-group
       = button_tag 'Search', class: "btn btn-primary wide"
 
diff --git a/app/views/groups/group_members/index.html.haml b/app/views/groups/group_members/index.html.haml
index 903ca877218..a70d1ff0697 100644
--- a/app/views/groups/group_members/index.html.haml
+++ b/app/views/groups/group_members/index.html.haml
@@ -14,7 +14,7 @@
 .clearfix.js-toggle-container
   = form_tag group_group_members_path(@group), method: :get, class: 'form-inline member-search-form'  do
     .form-group
-      = search_field_tag :search, params[:search], { placeholder: 'Find existing member by name', class: 'form-control search-text-input input-mn-300' }
+      = search_field_tag :search, params[:search], { placeholder: 'Find existing member by name', class: 'form-control search-text-input' }
     = button_tag 'Search', class: 'btn'
 
   - if current_user && current_user.can?(:admin_group, @group)
diff --git a/app/views/layouts/_page.html.haml b/app/views/layouts/_page.html.haml
index 54fcbca6bc6..f17f6fdd91c 100644
--- a/app/views/layouts/_page.html.haml
+++ b/app/views/layouts/_page.html.haml
@@ -8,14 +8,10 @@
     .collapse-nav
       = render partial: 'layouts/collapse_button'
     - if current_user
-      .sidebar-user
-        = link_to current_user, class: 'profile-pic', id: 'profile-pic', data: {toggle: 'tooltip', placement: 'top'} do
-          = image_tag avatar_icon(current_user.email, 60), alt: 'User activity', class: 'avatar avatar s32'
+      = link_to current_user, class: 'sidebar-user' do
+        = image_tag avatar_icon(current_user.email, 60), alt: 'User activity', class: 'avatar avatar s32'
         .username
           = current_user.username
-        .logout-holder
-          = link_to destroy_user_session_path, class: 'logout', method: :delete, title: 'Sign out', data: {toggle: 'tooltip', placement: 'top'} do
-            = icon('sign-out')
   .content-wrapper
     .container-fluid
       .content
diff --git a/app/views/layouts/header/_default.html.haml b/app/views/layouts/header/_default.html.haml
index 2970af377f5..8b4510d6516 100644
--- a/app/views/layouts/header/_default.html.haml
+++ b/app/views/layouts/header/_default.html.haml
@@ -19,7 +19,7 @@
           %li.visible-sm.visible-xs
             = link_to search_path, title: 'Search', data: {toggle: 'tooltip', placement: 'bottom'} do
               = icon('search')
-          %li
+          %li.hidden-xs
             = link_to help_path, title: 'Help', data: {toggle: 'tooltip', placement: 'bottom'} do
               = icon('question-circle fw')
           %li
@@ -33,11 +33,14 @@
               = link_to admin_root_path, title: 'Admin area', data: {toggle: 'tooltip', placement: 'bottom'} do
                 = icon('wrench fw')
           - if current_user.can_create_project?
-            %li
+            %li.hidden-xs
               = link_to new_project_path, title: 'New project', data: {toggle: 'tooltip', placement: 'bottom'} do
                 = icon('plus fw')
           %li
             = link_to profile_path, title: 'Profile settings', data: {toggle: 'tooltip', placement: 'bottom'} do
               = icon('cog fw')
+          %li
+            = link_to destroy_user_session_path, class: 'logout', method: :delete, title: 'Sign out', data: {toggle: 'tooltip', placement: 'bottom'} do
+              = icon('sign-out')
 
 = render 'shared/outdated_browser'
diff --git a/app/views/projects/issues/_issue.html.haml b/app/views/projects/issues/_issue.html.haml
index a4e25e5ce88..64d62b45657 100644
--- a/app/views/projects/issues/_issue.html.haml
+++ b/app/views/projects/issues/_issue.html.haml
@@ -4,7 +4,7 @@
       = check_box_tag dom_id(issue,"selected"), nil, false, 'data-id' => issue.id, class: "selected_issue", disabled: !can?(current_user, :modify_issue, issue)
 
   .issue-title
-    %span.str-truncated
+    %span.issue-title-text
       = link_to_gfm issue.title, issue_path(issue), class: "row_title"
     .issue-labels
       - issue.labels.each do |label|
diff --git a/app/views/projects/merge_requests/_merge_request.html.haml b/app/views/projects/merge_requests/_merge_request.html.haml
index 65f5c3d6a19..c16df27ee8f 100644
--- a/app/views/projects/merge_requests/_merge_request.html.haml
+++ b/app/views/projects/merge_requests/_merge_request.html.haml
@@ -1,6 +1,6 @@
 %li{ class: mr_css_classes(merge_request) }
   .merge-request-title
-    %span.str-truncated
+    %span.merge-request-title-text
       = link_to_gfm merge_request.title, merge_request_path(merge_request), class: "row_title"
     .merge-request-labels
       - merge_request.labels.each do |label|
diff --git a/app/views/projects/merge_requests/index.html.haml b/app/views/projects/merge_requests/index.html.haml
index 841d1e1cfe9..fa591b0537e 100644
--- a/app/views/projects/merge_requests/index.html.haml
+++ b/app/views/projects/merge_requests/index.html.haml
@@ -4,9 +4,10 @@
     = render 'shared/issuable_search_form', path: namespace_project_merge_requests_path(@project.namespace, @project)
 
     - if can? current_user, :write_merge_request, @project
-      = link_to new_namespace_project_merge_request_path(@project.namespace, @project), class: "btn btn-new pull-left", title: "New Merge Request" do
-        %i.fa.fa-plus
-        New Merge Request
+      .pull-left.hidden-xs
+        = link_to new_namespace_project_merge_request_path(@project.namespace, @project), class: "btn btn-new", title: "New Merge Request" do
+          %i.fa.fa-plus
+          New Merge Request
   = render 'shared/issuable_filter', type: :merge_requests
 .merge-requests-holder
   = render 'merge_requests'
diff --git a/app/views/projects/project_members/index.html.haml b/app/views/projects/project_members/index.html.haml
index 6edb92acd4d..162583e4b1d 100644
--- a/app/views/projects/project_members/index.html.haml
+++ b/app/views/projects/project_members/index.html.haml
@@ -11,7 +11,7 @@
 .clearfix.js-toggle-container
   = form_tag namespace_project_project_members_path(@project.namespace, @project), method: :get, class: 'form-inline member-search-form'  do
     .form-group
-      = search_field_tag :search, params[:search], { placeholder: 'Find existing member by name', class: 'form-control search-text-input input-mn-300' }
+      = search_field_tag :search, params[:search], { placeholder: 'Find existing member by name', class: 'form-control search-text-input' }
     = button_tag 'Search', class: 'btn'
 
   - if can?(current_user, :admin_project_member, @project)
diff --git a/app/views/search/_form.html.haml b/app/views/search/_form.html.haml
index 47016daf1f0..5ee70be1ad6 100644
--- a/app/views/search/_form.html.haml
+++ b/app/views/search/_form.html.haml
@@ -5,7 +5,7 @@
   = hidden_field_tag :scope, params[:scope]
   .search-holder.clearfix
     .form-group
-      = search_field_tag :search, params[:search], placeholder: "Search for projects, issues etc", class: "form-control search-text-input input-mn-300", id: "dashboard_search", autofocus: true
+      = search_field_tag :search, params[:search], placeholder: "Search for projects, issues etc", class: "form-control search-text-input", id: "dashboard_search", autofocus: true
       = button_tag 'Search', class: "btn btn-primary"
     - unless params[:snippets].eql? 'true'
       .pull-right
diff --git a/app/views/shared/_issuable_search_form.html.haml b/app/views/shared/_issuable_search_form.html.haml
index 639d203dcd6..58c3de64b77 100644
--- a/app/views/shared/_issuable_search_form.html.haml
+++ b/app/views/shared/_issuable_search_form.html.haml
@@ -1,6 +1,6 @@
 = form_tag(path, method: :get, id: "issue_search_form", class: 'pull-left issue-search-form') do
   .append-right-10.hidden-xs.hidden-sm
-    = search_field_tag :issue_search, params[:issue_search], { placeholder: 'Filter by title or description', class: 'form-control issue_search search-text-input input-mn-300' }
+    = search_field_tag :issue_search, params[:issue_search], { placeholder: 'Filter by title or description', class: 'form-control issue_search search-text-input' }
     = hidden_field_tag :state, params['state']
     = hidden_field_tag :scope, params['scope']
     = hidden_field_tag :assignee_id, params['assignee_id']
diff --git a/app/views/shared/_project.html.haml b/app/views/shared/_project.html.haml
index 722a7f7ce0f..4537f8eec86 100644
--- a/app/views/shared/_project.html.haml
+++ b/app/views/shared/_project.html.haml
@@ -16,6 +16,3 @@
       %span.pull-right.light
         %i.fa.fa-star
         = project.star_count
-    - else
-      %span.arrow
-        %i.fa.fa-angle-right
diff --git a/app/views/users/show.html.haml b/app/views/users/show.html.haml
index 6ed45fedfa2..1694818aef6 100644
--- a/app/views/users/show.html.haml
+++ b/app/views/users/show.html.haml
@@ -13,7 +13,7 @@
       %h3
         = @user.name
         - if @user == current_user
-          .pull-right
+          .pull-right.hidden-xs
             = link_to profile_path, class: 'btn btn-sm' do
               %i.fa.fa-pencil-square-o
               Edit Profile settings
diff --git a/features/steps/profile/profile.rb b/features/steps/profile/profile.rb
index 32888eb17d9..d16e6bbea57 100644
--- a/features/steps/profile/profile.rb
+++ b/features/steps/profile/profile.rb
@@ -168,7 +168,7 @@ class Spinach::Features::Profile < Spinach::FeatureSteps
   end
 
   step 'I click on my profile picture' do
-    click_link 'profile-pic'
+    find(:css, '.sidebar-user').click
   end
 
   step 'I should see my user page' do