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

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;
 }

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;
+        }
+      }
     }
   }
 }

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) {

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;
   }
 }

app/assets/stylesheets/pages/dashboard.scss

@@ -29,7 +29,7 @@
   line-height: 24px;
 
   .str-truncated {
-    max-width: 72%;
+    max-width: 76%;
   }
 
   a {

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;
+  }
+}

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;
         }
       }
     }

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

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
 

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"
 

app/views/explore/projects/_filter.html.haml

 .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"
 

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)

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

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'

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|

app/views/projects/merge_requests/_merge_request.html.haml

 %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|

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'

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)

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

app/views/shared/_issuable_search_form.html.haml

 = 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']

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

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

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