Merge branch 'revert-2ed6cd9e' into 'master'

Revert "Merge branch 'new-navigation-prototype' into 'master'"

This reverts merge request !3494

See merge request !3607

19 files changed, 130 insertions, 109 deletions

diff --git a/app/assets/javascripts/sidebar.js.coffee b/app/assets/javascripts/sidebar.js.coffee
index e1778511240..860d4f438d0 100644
--- a/app/assets/javascripts/sidebar.js.coffee
+++ b/app/assets/javascripts/sidebar.js.coffee
@@ -4,6 +4,7 @@ expanded = 'page-sidebar-expanded'
 toggleSidebar = ->
   $('.page-with-sidebar').toggleClass("#{collapsed} #{expanded}")
   $('header').toggleClass("header-collapsed header-expanded")
+  $('.toggle-nav-collapse i').toggleClass("fa-angle-right fa-angle-left")
   $.cookie("collapsed_nav", $('.page-with-sidebar').hasClass(collapsed), { path: '/' })
 
   setTimeout ( ->
diff --git a/app/assets/stylesheets/framework/gitlab-theme.scss b/app/assets/stylesheets/framework/gitlab-theme.scss
index fa9038ebaca..c83cf881596 100644
--- a/app/assets/stylesheets/framework/gitlab-theme.scss
+++ b/app/assets/stylesheets/framework/gitlab-theme.scss
@@ -33,15 +33,10 @@
       background: $color;
     }
 
-    .complex-sidebar .nav-primary {
-      border-right: 1px solid lighten($color, 3%);
-    }
-
     .sidebar-wrapper {
       background: $color-darker;
 
       .sidebar-user {
-        border-top: 1px solid lighten($color, 3%);
         background: $color-darker;
         color: $color-light;
 
@@ -67,6 +62,7 @@
 
         .count {
           color: $color-light;
+          background: $color-dark;
         }
       }
 
diff --git a/app/assets/stylesheets/framework/header.scss b/app/assets/stylesheets/framework/header.scss
index 724980b2208..b3397d16016 100644
--- a/app/assets/stylesheets/framework/header.scss
+++ b/app/assets/stylesheets/framework/header.scss
@@ -123,11 +123,11 @@ header {
 }
 
 @mixin collapsed-header {
-  margin-left: 40px;
+  margin-left: $sidebar_collapsed_width;
 }
 
 .header-collapsed {
-  margin-left: 40px;
+  margin-left: $sidebar_collapsed_width;
 
   @media (min-width: $screen-md-min) {
     @include collapsed-header;
diff --git a/app/assets/stylesheets/framework/sidebar.scss b/app/assets/stylesheets/framework/sidebar.scss
index c741c826ae0..18189e985c4 100644
--- a/app/assets/stylesheets/framework/sidebar.scss
+++ b/app/assets/stylesheets/framework/sidebar.scss
@@ -144,7 +144,7 @@
     }
 
     a {
-      padding: 7px 12px;
+      padding: 7px 15px;
       font-size: $gl-font-size;
       line-height: 24px;
       color: $gray;
@@ -169,12 +169,10 @@
       }
 
       .count {
-        &:before {
-          content: '(';
-        }
-        &:after {
-          content: ')';
-        }
+        float: right;
+        background: #eee;
+        padding: 0 8px;
+        @include border-radius(6px);
       }
 
       &.back-link i {
@@ -193,27 +191,6 @@
   }
 }
 
-.expand-nav a {
-  color: $gl-icon-color;
-  width: 60px;
-  position: fixed;
-  top: 0;
-  left: 0;
-  font-size: 20px;
-  background: transparent;
-  height: 59px;
-  text-align: center;
-  line-height: 59px;
-  border-bottom: 1px solid #eee;
-  transition-duration: .3s;
-  outline: none;
-  z-index: 100;
-
-  &:hover {
-    text-decoration: none;
-  }
-}
-
 .collapse-nav a {
   width: $sidebar_width;
   position: fixed;
@@ -233,12 +210,55 @@
 }
 
 .page-sidebar-collapsed {
+  padding-left: $sidebar_collapsed_width;
+
   .sidebar-wrapper {
-    display: none;
+    width: $sidebar_collapsed_width;
+
+    .header-logo {
+      width: $sidebar_collapsed_width;
+
+      a {
+        padding-left: ($sidebar_collapsed_width - 36) / 2;
+
+        .gitlab-text-container {
+          display: none;
+        }
+      }
+    }
+
+    .nav-sidebar {
+      width: $sidebar_collapsed_width;
+
+      li {
+        width: auto;
+
+        a {
+          span {
+            display: none;
+          }
+        }
+      }
+    }
+
+    .collapse-nav a {
+      width: $sidebar_collapsed_width;
+    }
+
+    .sidebar-user {
+      padding-left: ($sidebar_collapsed_width - 36) / 2;
+      width: $sidebar_collapsed_width;
+
+      .username {
+        display: none;
+      }
+    }
   }
 }
 
 .page-sidebar-expanded {
+  padding-left: $sidebar_collapsed_width;
+
   @media (min-width: $screen-md-min) {
     padding-left: $sidebar_width;
   }
@@ -289,48 +309,3 @@
     padding-right: $sidebar_collapsed_width;
   }
 }
-
-.complex-sidebar {
-  display: inline-block;
-
-  .nav-primary {
-    width: 61px;
-    float: left;
-    height: 100vh;
-
-    .nav-sidebar {
-      width: 60px;
-
-      li a {
-        width: 60px;
-
-        span {
-          display: none;
-        }
-      }
-    }
-  }
-
-  .nav-secondary {
-    $nav-secondary-width: 168px;
-
-    float: left;
-    width: $nav-secondary-width;
-
-    .nav-sidebar {
-      width: $nav-secondary-width;
-
-      li {
-        width: $nav-secondary-width;
-
-        a {
-          width: $nav-secondary-width;
-
-          i {
-            display: none;
-          }
-        }
-      }
-    }
-  }
-}
diff --git a/app/views/layouts/_collapse_button.html.haml b/app/views/layouts/_collapse_button.html.haml
new file mode 100644
index 00000000000..2ed51d87ca1
--- /dev/null
+++ b/app/views/layouts/_collapse_button.html.haml
@@ -0,0 +1,4 @@
+- if nav_menu_collapsed?
+  = link_to icon('angle-right'), '#', class: 'toggle-nav-collapse', title: "Open/Close"
+- else
+  = link_to icon('angle-left'), '#', class: 'toggle-nav-collapse', title: "Open/Close"
diff --git a/app/views/layouts/_page.html.haml b/app/views/layouts/_page.html.haml
index 9be36273c7d..c799e9c588d 100644
--- a/app/views/layouts/_page.html.haml
+++ b/app/views/layouts/_page.html.haml
@@ -1,7 +1,5 @@
 .page-with-sidebar{ class: "#{page_sidebar_class} #{page_gutter_class}" }
   = render "layouts/broadcast"
-  .expand-nav
-    = link_to icon('bars'), '#', class: 'toggle-nav-collapse', title: "Open sidebar"
   .sidebar-wrapper.nicescroll{ class: nav_sidebar_class }
     .header-logo
       %a#logo
@@ -10,19 +8,15 @@
         .gitlab-text-container
           %h3 GitLab
 
-    - primary_sidebar = current_user ? 'dashboard' : 'explore'
-
-    - if defined?(sidebar) && sidebar && sidebar != primary_sidebar
-      .complex-sidebar
-        .nav-primary
-          = render "layouts/nav/#{primary_sidebar}"
-        .nav-secondary
-          = render "layouts/nav/#{sidebar}"
+    - if defined?(sidebar) && sidebar
+      = render "layouts/nav/#{sidebar}"
+    - elsif current_user
+      = render 'layouts/nav/dashboard'
     - else
-      = render "layouts/nav/#{primary_sidebar}"
+      = render 'layouts/nav/explore'
 
     .collapse-nav
-      = link_to icon('angle-left'), '#', class: 'toggle-nav-collapse', title: "Hide sidebar"
+      = render partial: 'layouts/collapse_button'
     - if current_user
       = link_to current_user, class: 'sidebar-user', title: "Profile" do
         = image_tag avatar_icon(current_user, 60), alt: 'Profile', class: 'avatar avatar s36'
diff --git a/app/views/layouts/nav/_admin.html.haml b/app/views/layouts/nav/_admin.html.haml
index 22d1d4d8597..280a1b93729 100644
--- a/app/views/layouts/nav/_admin.html.haml
+++ b/app/views/layouts/nav/_admin.html.haml
@@ -95,7 +95,7 @@
           Spam Logs
           %span.count= number_with_delimiter(SpamLog.count(:all))
 
-  = nav_link(controller: :application_settings) do
+  = nav_link(controller: :application_settings, html_options: { class: 'separate-item'}) do
     = link_to admin_application_settings_path, title: 'Settings' do
       = icon('cogs fw')
       %span
diff --git a/app/views/layouts/nav/_dashboard.html.haml b/app/views/layouts/nav/_dashboard.html.haml
index f1052eadf81..5cef652da14 100644
--- a/app/views/layouts/nav/_dashboard.html.haml
+++ b/app/views/layouts/nav/_dashboard.html.haml
@@ -15,12 +15,12 @@
       = icon('dashboard fw')
       %span
         Activity
-  = nav_link(path: ['dashboard/groups#index', 'explore/groups#index']) do
+  = nav_link(controller: :groups) do
     = link_to dashboard_groups_path, title: 'Groups' do
       = icon('group fw')
       %span
         Groups
-  = nav_link(path: 'dashboard#milestones') do
+  = nav_link(controller: :milestones) do
     = link_to dashboard_milestones_path, title: 'Milestones' do
       = icon('clock-o fw')
       %span
@@ -48,6 +48,7 @@
       %span
         Help
 
+  %li.separate-item
   = nav_link(controller: :profile) do
     = link_to profile_path, title: 'Profile Settings', data: {placement: 'bottom'} do
       = icon('user fw')
diff --git a/app/views/layouts/nav/_group.html.haml b/app/views/layouts/nav/_group.html.haml
index 0b7de9633ec..55940741dc0 100644
--- a/app/views/layouts/nav/_group.html.haml
+++ b/app/views/layouts/nav/_group.html.haml
@@ -1,4 +1,12 @@
 %ul.nav.nav-sidebar
+  = nav_link do
+    = link_to root_path, title: 'Go to dashboard', class: 'back-link' do
+      = icon('caret-square-o-left fw')
+      %span
+        Go to dashboard
+
+  %li.separate-item
+
   = nav_link(path: 'groups#show', html_options: {class: 'home'}) do
     = link_to group_path(@group), title: 'Home' do
       = icon('group fw')
@@ -34,7 +42,7 @@
       %span
         Members
   - if can?(current_user, :admin_group, @group)
-    = nav_link do
+    = nav_link(html_options: { class: "separate-item" }) do
       = link_to edit_group_path(@group), title: 'Settings' do
         = icon ('cogs fw')
         %span
diff --git a/app/views/layouts/nav/_profile.html.haml b/app/views/layouts/nav/_profile.html.haml
index cc119fd64e6..3b9d31a6fc5 100644
--- a/app/views/layouts/nav/_profile.html.haml
+++ b/app/views/layouts/nav/_profile.html.haml
@@ -1,4 +1,12 @@
 %ul.nav.nav-sidebar
+  = nav_link do
+    = link_to root_path, title: 'Go to dashboard', class: 'back-link' do
+      = icon('caret-square-o-left fw')
+      %span
+        Go to dashboard
+
+  %li.separate-item
+
   = nav_link(path: 'profiles#show', html_options: {class: 'home'}) do
     = link_to profile_path, title: 'Profile Settings' do
       = icon('user fw')
diff --git a/app/views/layouts/nav/_project.html.haml b/app/views/layouts/nav/_project.html.haml
index d0f82b5f57f..86b46e8c75e 100644
--- a/app/views/layouts/nav/_project.html.haml
+++ b/app/views/layouts/nav/_project.html.haml
@@ -1,4 +1,19 @@
 %ul.nav.nav-sidebar
+  - if @project.group
+    = nav_link do
+      = link_to group_path(@project.group), title: 'Go to group', class: 'back-link' do
+        = icon('caret-square-o-left fw')
+        %span
+          Go to group
+  - else
+    = nav_link do
+      = link_to root_path, title: 'Go to dashboard', class: 'back-link' do
+        = icon('caret-square-o-left fw')
+        %span
+          Go to dashboard
+
+  %li.separate-item
+
   = nav_link(path: 'projects#show', html_options: {class: 'home'}) do
     = link_to project_path(@project), title: 'Project', class: 'shortcuts-project' do
       = icon('bookmark fw')
@@ -98,7 +113,7 @@
           Snippets
 
   - if project_nav_tab? :settings
-    = nav_link(html_options: {class: "#{project_tab_class}"}) do
+    = nav_link(html_options: {class: "#{project_tab_class} separate-item"}) do
       = link_to edit_project_path(@project), title: 'Settings' do
         = icon('cogs fw')
         %span
diff --git a/features/groups.feature b/features/groups.feature
index 49e939807b5..419a5d3963d 100644
--- a/features/groups.feature
+++ b/features/groups.feature
@@ -7,6 +7,10 @@ Feature: Groups
     When I visit group "NonExistentGroup" page
     Then page status code should be 404
 
+  Scenario: I should have back to group button
+    When I visit group "Owned" page
+    Then I should see back to dashboard button
+
   @javascript
   Scenario: I should see group "Owned" dashboard list
     When I visit group "Owned" page
diff --git a/features/project/project.feature b/features/project/project.feature
index aa22401c88e..f1f3ed26065 100644
--- a/features/project/project.feature
+++ b/features/project/project.feature
@@ -18,6 +18,15 @@ Feature: Project
     Then I should see the default project avatar
     And I should not see the "Remove avatar" button
 
+  Scenario: I should have back to group button
+    And project "Shop" belongs to group
+    And I visit project "Shop" page
+    Then I should see back to group button
+
+  Scenario: I should have back to group button
+    And I visit project "Shop" page
+    Then I should see back to dashboard button
+
   Scenario: I should have readme on page
     And I visit project "Shop" page
     Then I should see project "Shop" README
diff --git a/features/steps/group/milestones.rb b/features/steps/group/milestones.rb
index b6ce5bc9cec..a167d259837 100644
--- a/features/steps/group/milestones.rb
+++ b/features/steps/group/milestones.rb
@@ -5,9 +5,7 @@ class Spinach::Features::GroupMilestones < Spinach::FeatureSteps
   include SharedUser
 
   step 'I click on group milestones' do
-    page.within '.nav-secondary' do
-      click_link("Milestones")
-    end
+    click_link 'Milestones'
   end
 
   step 'I should see group milestones index page has no milestones' do
diff --git a/features/steps/groups.rb b/features/steps/groups.rb
index 483370f41c6..e5b7db4c5e3 100644
--- a/features/steps/groups.rb
+++ b/features/steps/groups.rb
@@ -4,6 +4,10 @@ class Spinach::Features::Groups < Spinach::FeatureSteps
   include SharedGroup
   include SharedUser
 
+  step 'I should see back to dashboard button' do
+    expect(page).to have_content 'Go to dashboard'
+  end
+
   step 'I should see group "Owned"' do
     expect(page).to have_content '@owned'
   end
diff --git a/features/steps/project/active_tab.rb b/features/steps/project/active_tab.rb
index 4584fc4d754..19d81453d8c 100644
--- a/features/steps/project/active_tab.rb
+++ b/features/steps/project/active_tab.rb
@@ -82,9 +82,7 @@ class Spinach::Features::ProjectActiveTab < Spinach::FeatureSteps
   # Sub Tabs: Issues
 
   step 'I click the "Milestones" tab' do
-    page.within '.nav-secondary' do
-      click_link('Milestones')
-    end
+    click_link('Milestones')
   end
 
   step 'I click the "Labels" tab' do
diff --git a/features/steps/project/fork.rb b/features/steps/project/fork.rb
index d9b16afa9b8..527f7853da9 100644
--- a/features/steps/project/fork.rb
+++ b/features/steps/project/fork.rb
@@ -36,7 +36,7 @@ class Spinach::Features::ProjectFork < Spinach::FeatureSteps
   end
 
   step 'I goto the Merge Requests page' do
-    page.within '.nav-secondary' do
+    page.within '.page-sidebar-expanded' do
       click_link "Merge Requests"
     end
   end
diff --git a/features/steps/project/project.rb b/features/steps/project/project.rb
index 8f1d4a223a9..ef185861e00 100644
--- a/features/steps/project/project.rb
+++ b/features/steps/project/project.rb
@@ -114,9 +114,7 @@ class Spinach::Features::Project < Spinach::FeatureSteps
   end
 
   step 'I should not see "Snippets" button' do
-    page.within '.nav-secondary' do
-      expect(page).not_to have_link 'Snippets'
-    end
+    expect(page).not_to have_link 'Snippets'
   end
 
   step 'project "Shop" belongs to group' do
@@ -125,6 +123,14 @@ class Spinach::Features::Project < Spinach::FeatureSteps
     @project.save!
   end
 
+  step 'I should see back to dashboard button' do
+    expect(page).to have_content 'Go to dashboard'
+  end
+
+  step 'I should see back to group button' do
+    expect(page).to have_content 'Go to group'
+  end
+
   step 'I click notifications drop down button' do
     click_link 'notifications-button'
   end
diff --git a/features/steps/shared/project_tab.rb b/features/steps/shared/project_tab.rb
index fa7d24ce611..4fc2ece79ff 100644
--- a/features/steps/shared/project_tab.rb
+++ b/features/steps/shared/project_tab.rb
@@ -41,7 +41,7 @@ module SharedProjectTab
   end
 
   step 'the active main tab should be Settings' do
-    page.within '.nav-secondary' do
+    page.within '.nav-sidebar' do
       expect(page).to have_content('Go to project')
     end
   end