Revert side nav to full width; remove border under nav; remove tooltips on nav...

Revert side nav to full width; remove border under nav; remove tooltips on nav links; stop page content shifting with side nav; put project nav in container

app/assets/javascripts/application.js.coffee

@@ -169,12 +169,6 @@ $ ->
     container: 'body'
   )
 
-  $('.page-with-sidebar').tooltip(
-    selector: '.sidebar-collapsed .nav-sidebar a, .sidebar-collapsed a.sidebar-user'
-    placement: 'right'
-    container: 'body'
-  )
-
   # Form submitter
   $('.trigger-submit').on 'change', ->
     $(@).parents('form').submit()

app/assets/stylesheets/framework/gitlab-theme.scss

@@ -8,29 +8,6 @@
  */
 @mixin gitlab-theme($color-light, $color, $color-darker, $color-dark) {
   .page-with-sidebar {
-    .gitlab-text-container {
-      background: $color-darker;
-
-      a {
-        color: $color-light;
-
-        h3 {
-          color: $color-light;
-        }
-      }
-
-      &:hover {
-        background-color: $color-dark;
-        a {
-          color: $white-light;
-          text-decoration: none;
-
-          h3 {
-            color: $white-light;
-          }
-        }
-      }
-    }
 
     .collapse-nav a {
       color: $white-light;

app/assets/stylesheets/framework/header.scss

@@ -28,7 +28,6 @@ header {
     height: $header-height;
     background-color: $background-color;
     border: none;
-    border-bottom: 1px solid $border-color;
 
     @media (max-width: $screen-xs-min) {
       padding: 0 16px;
@@ -132,6 +131,10 @@ header {
       transition-duration: .3s;
       z-index: 999;
 
+      &:hover {
+        cursor: pointer;
+      }
+
       @media (max-width: $screen-xs-max) {
         right: 25px;
         left: auto;
@@ -141,7 +144,7 @@ header {
     .title {
       margin: 0;
       font-size: 19px;
-      max-width: 250px;
+      max-width: 400px;
       display: inline-block;
       line-height: $header-height;
       font-weight: normal;
@@ -151,8 +154,8 @@ header {
       vertical-align: top;
       white-space: nowrap;
 
-      @media (max-width: $screen-xs-max) {
-        max-width: 220px;
+      @media (max-width: $screen-sm-max) {
+        max-width: 190px;
       }
 
       a {

app/assets/stylesheets/framework/nav.scss

@@ -350,12 +350,10 @@
   }
 
   .nav-control {
-    padding-left: 0;
-    transition-duration: .3s;
 
     .fade-right {
       @media (min-width: $screen-xs-max) {
-        right: 67px;
+        right: 68px;
       }
       @media (max-width: $screen-xs-min) {
         right: 0;
@@ -364,23 +362,6 @@
   }
 }
 
-.page-sidebar-collapsed {
-
-  .nav-control {
-    @media (min-width: $screen-md-min) {
-      padding-left: 32px;
-      transition-duration: .3s;
-    }
-  }
-
-  .layout-nav {
-
-    @media (max-width: $screen-sm-min) {
-      padding-left: 0;
-    }
-  }
-}
-
 .scrolling-tabs-container {
   position: relative;
 

app/assets/stylesheets/framework/sidebar.scss

@@ -35,31 +35,11 @@
 }
 
 .sidebar-wrapper {
-  .gitlab-text-container {
-    height: $header-height;
-    padding: 0 19px;
-    width: $sidebar_width;
-    position: fixed;
-    z-index: 999;
-    overflow: hidden;
-    transition-duration: .3s;
-
-    &:hover {
-      background-color: #eee;
-    }
-
-    h3 {
-      font-size: 19px;
-      line-height: 50px;
-      font-weight: normal;
-      margin: 0;
-    }
-  }
 
   .sidebar-user {
     padding: 15px 22px;
     position: fixed;
-    bottom: 40px;
+    bottom: 0;
     width: $sidebar_width;
     overflow: hidden;
     transition-duration: .3s;
@@ -104,10 +84,10 @@
     }
 
     a {
-      text-align: center;
-      padding: 8px;
+      width: $sidebar_width;
+      padding: 7px 15px 7px 23px;
       font-size: $gl-font-size;
-      color: $gray;
+      line-height: 24px;
       display: block;
       text-decoration: none;
       font-weight: normal;
@@ -125,10 +105,9 @@
         font-size: 16px;
       }
 
-      .nav-link-text {
-        margin-top: 3px;
-        font-size: 13px;
-        line-height: 18px;
+      i,
+      svg {
+        margin-right: 13px;
       }
 
       &.back-link i {
@@ -150,7 +129,7 @@
 .collapse-nav a {
   width: $sidebar_width;
   position: fixed;
-  bottom: 0;
+  top: 0;
   left: 0;
   font-size: 13px;
   background: transparent;
@@ -177,15 +156,6 @@
   .sidebar-wrapper {
     width: 0;
 
-    .gitlab-text-container {
-      width: 0;
-      padding: 0;
-
-      h3 {
-        display: none;
-      }
-    }
-
     .nav-sidebar {
       width: $sidebar_collapsed_width;
 
@@ -217,7 +187,6 @@
 }
 
 .page-sidebar-expanded {
-  padding-left: $sidebar_width;
 
   @media (max-width: $screen-sm-max) {
     padding-left: 0;
@@ -240,14 +209,6 @@
       }
     }
   }
-
-  .layout-nav {
-    padding-right: 0;
-
-    @media (min-width: $screen-md-min) {
-      padding-right: $sidebar_width;
-    }
-  }
 }
 
 .right-sidebar-collapsed {

app/assets/stylesheets/framework/variables.scss

@@ -2,7 +2,7 @@
  * Layout
  */
 $sidebar_collapsed_width: 62px;
-$sidebar_width: 90px;
+$sidebar_width: 220px;
 $gutter_collapsed_width: 62px;
 $gutter_width: 290px;
 $gutter_inner_width: 258px;

app/views/layouts/_collapse_button.html.haml

-= link_to icon('angle-left'), '#', class: 'toggle-nav-collapse', title: "Open/Close"
+= link_to icon('bars'), '#', class: 'toggle-nav-collapse', title: "Open/Close"

app/views/layouts/_page.html.haml

 .page-with-sidebar.page-sidebar-collapsed{ class: "#{page_gutter_class}" }
   .sidebar-wrapper.nicescroll{ class: nav_sidebar_class }
-    .gitlab-text-container
-      = link_to root_path, class: 'gitlab-text-container-link', title: 'Dashboard', id: 'js-shortcuts-home' do
-        %h3 GitLab
 
     - if defined?(sidebar) && sidebar
       = render "layouts/nav/#{sidebar}"
@@ -18,7 +15,7 @@
         = image_tag avatar_icon(current_user, 60), alt: 'Profile', class: 'avatar avatar s46'
   - if defined?(nav) && nav
     .layout-nav
-      .container-fluid
+      %div{ class: (container_class) }
         = render "layouts/nav/#{nav}"
   .content-wrapper{ class: "#{layout_nav_class}" }
     = render "layouts/broadcast"

app/views/layouts/ci/_page.html.haml

 .page-with-sidebar{ class: page_sidebar_class }
   = render "layouts/broadcast"
   .sidebar-wrapper.nicescroll{ class: nav_sidebar_class }
-    .header-logo
-      %a#logo
-        = brand_header_logo
-      = link_to root_path, class: 'gitlab-text-container-link', title: 'Dashboard', id: 'js-shortcuts-home' do
-        .gitlab-text-container
-          %h3 GitLab
 
     - if defined?(sidebar) && sidebar
       = render "layouts/ci/#{sidebar}"

app/views/layouts/nav/_admin.html.haml

@@ -2,102 +2,102 @@
   = nav_link(controller: :dashboard, html_options: {class: 'home'}) do
     = link_to admin_root_path, title: 'Overview' do
       = icon('dashboard fw')
-      .nav-link-text
+      %span
         Overview
   = nav_link(controller: [:admin, :projects]) do
     = link_to admin_namespaces_projects_path, title: 'Projects' do
       = icon('cube fw')
-      .nav-link-text
+      %span
         Projects
   = nav_link(controller: :users) do
     = link_to admin_users_path, title: 'Users' do
       = icon('user fw')
-      .nav-link-text
+      %span
         Users
   = nav_link(controller: :groups) do
     = link_to admin_groups_path, title: 'Groups' do
       = icon('group fw')
-      .nav-link-text
+      %span
         Groups
   = nav_link(controller: :deploy_keys) do
     = link_to admin_deploy_keys_path, title: 'Deploy Keys' do
       = icon('key fw')
-      .nav-link-text
+      %span
         Deploy Keys
   = nav_link path: ['runners#index', 'runners#show'] do
     = link_to admin_runners_path, title: 'Runners' do
       = icon('cog fw')
-      .nav-link-text
+      %span
         Runners
   = nav_link path: 'builds#index' do
     = link_to admin_builds_path, title: 'Builds' do
       = icon('link fw')
-      .nav-link-text
+      %span
         Builds
   = nav_link(controller: :logs) do
     = link_to admin_logs_path, title: 'Logs' do
       = icon('file-text fw')
-      .nav-link-text
+      %span
         Logs
   = nav_link(controller: :health_check) do
     = link_to admin_health_check_path, title: 'Health Check' do
       = icon('medkit fw')
-      .nav-link-text
+      %span
         Health Check
   = nav_link(controller: :broadcast_messages) do
     = link_to admin_broadcast_messages_path, title: 'Messages' do
       = icon('bullhorn fw')
-      .nav-link-text
+      %span
         Messages
   = nav_link(controller: :hooks) do
     = link_to admin_hooks_path, title: 'Hooks' do
       = icon('external-link fw')
-      .nav-link-text
+      %span
         Hooks
   = nav_link(controller: :background_jobs) do
     = link_to admin_background_jobs_path, title: 'Background Jobs' do
       = icon('cog fw')
-      .nav-link-text
+      %span
         Background Jobs
   = nav_link(controller: :appearances) do
     = link_to admin_appearances_path, title: 'Appearances' do
       = icon('image')
-      .nav-link-text
+      %span
         Appearance
 
   = nav_link(controller: :applications) do
     = link_to admin_applications_path, title: 'Applications' do
       = icon('cloud fw')
-      .nav-link-text
+      %span
         Applications
 
   = nav_link(controller: :services) do
     = link_to admin_application_settings_services_path, title: 'Service Templates' do
       = icon('copy fw')
-      .nav-link-text
+      %span
         Service Templates
 
   = nav_link(controller: :labels) do
     = link_to admin_labels_path, title: 'Labels' do
       = icon('tags fw')
-      .nav-link-text
+      %span
         Labels
 
   = nav_link(controller: :abuse_reports) do
     = link_to admin_abuse_reports_path, title: "Abuse Reports" do
       = icon('exclamation-circle fw')
-      .nav-link-text
+      %span
         Abuse Reports
 
   - if askimet_enabled?
     = nav_link(controller: :spam_logs) do
       = link_to admin_spam_logs_path, title: "Spam Logs" do
         = icon('exclamation-triangle fw')
-        .nav-link-text
+        %span
           Spam Logs
 
   = nav_link(controller: :application_settings, html_options: { class: 'separate-item'}) do
     = link_to admin_application_settings_path, title: 'Settings' do
       = icon('cogs fw')
-      .nav-link-text
+      %span
         Settings

app/views/layouts/nav/_dashboard.html.haml

@@ -2,50 +2,50 @@
   = nav_link(path: ['root#index', 'projects#trending', 'projects#starred', 'dashboard/projects#index'], html_options: {class: "#{project_tab_class} home"}) do
     = link_to dashboard_projects_path, title: 'Projects', class: 'dashboard-shortcuts-projects' do
       = navbar_icon('project')
-      .nav-link-text
+      %span
         Projects
   = nav_link(controller: :todos) do
     = link_to dashboard_todos_path, title: 'Todos' do
       = icon('bell fw')
-      .nav-link-text
+      %span
         Todos
   = nav_link(path: 'dashboard#activity') do
     = link_to activity_dashboard_path, class: 'dashboard-shortcuts-activity', title: 'Activity' do
       = navbar_icon('activity')
-      .nav-link-text
+      %span
         Activity
   = nav_link(controller: [:groups, 'groups/milestones', 'groups/group_members']) do
     = link_to dashboard_groups_path, title: 'Groups' do
       = navbar_icon('group')
-      .nav-link-text
+      %span
         Groups
   = nav_link(controller: 'dashboard/milestones') do
     = link_to dashboard_milestones_path, title: 'Milestones' do
       = navbar_icon('milestones')
-      .nav-link-text
+      %span
         Milestones
   = nav_link(path: 'dashboard#issues') do
     = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'dashboard-shortcuts-issues' do
       = navbar_icon('issues')
-      .nav-link-text
+      %span
         Issues
   = nav_link(path: 'dashboard#merge_requests') do
     = link_to assigned_mrs_dashboard_path, title: 'Merge Requests', class: 'dashboard-shortcuts-merge_requests' do
       = navbar_icon('mr')
-      .nav-link-text
+      %span
         Merge Requests
   = nav_link(controller: :snippets) do
     = link_to dashboard_snippets_path, title: 'Snippets' do
       = icon('clipboard fw')
-      .nav-link-text
+      %span
         Snippets
   = nav_link(controller: :help) do
     = link_to help_path, title: 'Help' do
       = icon('question-circle fw')
-      .nav-link-text
+      %span
         Help
   = nav_link(html_options: {class: profile_tab_class}) do
     = link_to profile_path, title: 'Profile Settings', data: {placement: 'bottom'} do
       = icon('user fw')
-      .nav-link-text
+      %span
         Profile Settings

app/views/layouts/nav/_explore.html.haml

@@ -2,20 +2,20 @@
   = nav_link(path: ['dashboard#show', 'root#show', 'projects#trending', 'projects#starred', 'projects#index'], html_options: {class: 'home'}) do
     = link_to explore_root_path, title: 'Projects' do
       = icon('bookmark fw')
-      .nav-link-text
+      %span
         Projects
   = nav_link(controller: [:groups, 'groups/milestones', 'groups/group_members']) do
     = link_to explore_groups_path, title: 'Groups' do
       = icon('group fw')
-      .nav-link-text
+      %span
         Groups
   = nav_link(controller: :snippets) do
     = link_to explore_snippets_path, title: 'Snippets' do
       = icon('clipboard fw')
-      .nav-link-text
+      %span
         Snippets
   = nav_link(controller: :help) do
     = link_to help_path, title: 'Help' do
       = icon('question-circle fw')
-      .nav-link-text
+      %span
         Help