Edited tooltips by adding a consistent right-side tooltip

10 files changed, 82 insertions, 66 deletions

diff --git a/app/assets/stylesheets/generic/sidebar.scss b/app/assets/stylesheets/generic/sidebar.scss
index b96664d30db..af621b1a33e 100644
--- a/app/assets/stylesheets/generic/sidebar.scss
+++ b/app/assets/stylesheets/generic/sidebar.scss
@@ -165,6 +165,10 @@
   }
 }
 
+.page-sidebar-expanded data {
+  display: none;
+}
+
 @media(min-width: $screen-md-max) {
   .page-sidebar-collapsed {
     @include folded-sidebar;
@@ -175,6 +179,18 @@
   }
 }
 
+.page-sidebar-collapsed {
+  .nav-sidebar li {
+    width: 52px;
+  }
+}
+
+.page-sidebar-collapsed {
+  .nav-sidebar span {
+    display: none;
+  }
+}
+
 .sidebar-user {
   position: fixed;
   bottom: 0;
diff --git a/app/views/layouts/nav/_admin.html.haml b/app/views/layouts/nav/_admin.html.haml
index 2065be3828a..9e11b921f57 100644
--- a/app/views/layouts/nav/_admin.html.haml
+++ b/app/views/layouts/nav/_admin.html.haml
@@ -5,54 +5,54 @@
       %span
         Overview
   = nav_link(controller: :projects) do
-    = link_to admin_namespaces_projects_path, title: 'Projects', data: {placement: 'right'} do
+    = link_to admin_namespaces_projects_path, title: 'Projects', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('cube fw')
       %span
         Projects
   = nav_link(controller: :users) do
-    = link_to admin_users_path, title: 'Users', data: {placement: 'right'} do
+    = link_to admin_users_path, title: 'Users', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('user fw')
       %span
         Users
   = nav_link(controller: :groups) do
-    = link_to admin_groups_path, title: 'Groups', data: {placement: 'right'} do
+    = link_to admin_groups_path, title: 'Groups', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('group fw')
       %span
         Groups
   = nav_link(controller: :deploy_keys) do
-    = link_to admin_deploy_keys_path, title: 'Deploy Keys', data: {placement: 'right'} do
+    = link_to admin_deploy_keys_path, title: 'Deploy Keys', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('key fw')
       %span
         Deploy Keys
   = nav_link(controller: :logs) do
-    = link_to admin_logs_path, title: 'Logs', data: {placement: 'right'} do
+    = link_to admin_logs_path, title: 'Logs', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('file-text fw')
       %span
         Logs
   = nav_link(controller: :broadcast_messages) do
-    = link_to admin_broadcast_messages_path, title: 'Broadcast Messages', data: {placement: 'right'} do
+    = link_to admin_broadcast_messages_path, title: 'Broadcast Messages', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('bullhorn fw')
       %span
         Messages
   = nav_link(controller: :hooks) do
-    = link_to admin_hooks_path, title: 'Hooks', data: {placement: 'right'} do
+    = link_to admin_hooks_path, title: 'Hooks', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('external-link fw')
       %span
         Hooks
   = nav_link(controller: :background_jobs) do
-    = link_to admin_background_jobs_path, title: 'Background Jobs', data: {placement: 'right'} do
+    = link_to admin_background_jobs_path, title: 'Background Jobs', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('cog fw')
       %span
         Background Jobs
 
   = nav_link(controller: :applications) do
-    = link_to admin_applications_path, title: 'Applications', data: {placement: 'right'} do
+    = link_to admin_applications_path, title: 'Applications', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('cloud fw')
       %span
         Applications
 
   = nav_link(controller: :services) do
-    = link_to admin_application_settings_services_path, title: 'Service Templates', data: {placement: 'right'} do
+    = link_to admin_application_settings_services_path, title: 'Service Templates', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('copy fw')
       %span
         Service Templates
@@ -65,7 +65,7 @@
         %span.count= AbuseReport.count(:all)
 
   = nav_link(controller: :application_settings, html_options: { class: 'separate-item'}) do
-    = link_to admin_application_settings_path, title: 'Settings', data: {placement: 'right'} do
+    = link_to admin_application_settings_path, title: 'Settings', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('cogs fw')
       %span
         Settings
diff --git a/app/views/layouts/nav/_dashboard.html.haml b/app/views/layouts/nav/_dashboard.html.haml
index 687c1fc3dd2..f98ec1dfd57 100644
--- a/app/views/layouts/nav/_dashboard.html.haml
+++ b/app/views/layouts/nav/_dashboard.html.haml
@@ -1,38 +1,38 @@
 %ul.nav.nav-sidebar
   = nav_link(path: ['dashboard#show', 'root#show'], html_options: {class: 'home'}) do
-    = link_to dashboard_path, title: 'Home', class: 'shortcuts-activity', data: {placement: 'right'} do
+    = link_to dashboard_path, title: 'Home', class: 'shortcuts-activity', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('dashboard fw')
       %span
         Your Projects
   = nav_link(path: 'projects#starred') do
-    = link_to starred_dashboard_projects_path, title: 'Starred Projects', data: {placement: 'right'} do
+    = link_to starred_dashboard_projects_path, title: 'Starred Projects', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('star fw')
       %span
         Starred Projects
   = nav_link(controller: :groups) do
-    = link_to dashboard_groups_path, title: 'Groups', data: {placement: 'right'} do
+    = link_to dashboard_groups_path, title: 'Groups', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('group fw')
       %span
         Groups
   = nav_link(controller: :milestones) do
-    = link_to dashboard_milestones_path, title: 'Milestones', data: {placement: 'right'} do
+    = link_to dashboard_milestones_path, title: 'Milestones', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('clock-o fw')
       %span
         Milestones
   = nav_link(path: 'dashboard#issues') do
-    = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'shortcuts-issues', data: {placement: 'right'} do
+    = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'shortcuts-issues', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('exclamation-circle fw')
       %span
         Issues
         %span.count= current_user.assigned_issues.opened.count
   = nav_link(path: 'dashboard#merge_requests') do
-    = link_to assigned_mrs_dashboard_path, title: 'Merge Requests', class: 'shortcuts-merge_requests', data: {placement: 'right'} do
+    = link_to assigned_mrs_dashboard_path, title: 'Merge Requests', class: 'shortcuts-merge_requests', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('tasks fw')
       %span
         Merge Requests
         %span.count= current_user.assigned_merge_requests.opened.count
   = nav_link(controller: :help) do
-    = link_to help_path, title: 'Help', data: {placement: 'right'} do
+    = link_to help_path, title: 'Help', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('question-circle fw')
       %span
         Help
diff --git a/app/views/layouts/nav/_explore.html.haml b/app/views/layouts/nav/_explore.html.haml
index 66870e84ceb..8073b7a6367 100644
--- a/app/views/layouts/nav/_explore.html.haml
+++ b/app/views/layouts/nav/_explore.html.haml
@@ -1,18 +1,18 @@
 %ul.nav.nav-sidebar
   = nav_link(path: 'projects#trending') do
-    = link_to explore_root_path, title: 'Trending Projects', data: {placement: 'right'} do
+    = link_to explore_root_path, title: 'Trending Projects', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('comments fw')
       %span Trending Projects
   = nav_link(path: 'projects#starred') do
-    = link_to starred_explore_projects_path, title: 'Most-starred Projects', data: {placement: 'right'} do
+    = link_to starred_explore_projects_path, title: 'Most-starred Projects', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('star fw')
       %span Most-starred Projects
   = nav_link(path: 'projects#index') do
-    = link_to explore_projects_path, title: 'All Projects', data: {placement: 'right'} do
+    = link_to explore_projects_path, title: 'All Projects', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('bookmark fw')
       %span All Projects
   = nav_link(controller: :groups) do
-    = link_to explore_groups_path, title: 'All Groups', data: {placement: 'right'} do
+    = link_to explore_groups_path, title: 'All Groups', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('group fw')
       %span All Groups
 
diff --git a/app/views/layouts/nav/_group.html.haml b/app/views/layouts/nav/_group.html.haml
index 695ce68a201..035de4c82e7 100644
--- a/app/views/layouts/nav/_group.html.haml
+++ b/app/views/layouts/nav/_group.html.haml
@@ -1,6 +1,6 @@
 %ul.nav.nav-sidebar
   = nav_link do
-    = link_to root_path, title: 'Back to dashboard', data: {placement: 'right'}, class: 'back-link' do
+    = link_to root_path, title: 'Back to dashboard', data: {toggle: 'tooltip', placement: 'right', container: 'body'}, class: 'back-link' do
       = icon('caret-square-o-left fw')
       %span
         Back to Dashboard
@@ -8,38 +8,38 @@
   %li.separate-item
 
   = nav_link(path: 'groups#show', html_options: {class: 'home'}) do
-    = link_to group_path(@group), title: 'Home', data: {placement: 'right'} do
+    = link_to group_path(@group), title: 'Home', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('dashboard fw')
       %span
         Group
   - if current_user
     = nav_link(controller: [:group, :milestones]) do
-      = link_to group_milestones_path(@group), title: 'Milestones', data: {placement: 'right'} do
+      = link_to group_milestones_path(@group), title: 'Milestones', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('clock-o fw')
         %span
           Milestones
   = nav_link(path: 'groups#issues') do
-    = link_to issues_group_path(@group), title: 'Issues', data: {placement: 'right'} do
+    = link_to issues_group_path(@group), title: 'Issues', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('exclamation-circle fw')
       %span
         Issues
         - if current_user
           %span.count= Issue.opened.of_group(@group).count
   = nav_link(path: 'groups#merge_requests') do
-    = link_to merge_requests_group_path(@group), title: 'Merge Requests', data: {placement: 'right'} do
+    = link_to merge_requests_group_path(@group), title: 'Merge Requests', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('tasks fw')
       %span
         Merge Requests
         - if current_user
           %span.count= MergeRequest.opened.of_group(@group).count
   = nav_link(controller: [:group_members]) do
-    = link_to group_group_members_path(@group), title: 'Members', data: {placement: 'right'} do
+    = link_to group_group_members_path(@group), title: 'Members', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('users fw')
       %span
         Members
   - if can?(current_user, :admin_group, @group)
     = nav_link(html_options: { class: "separate-item" }) do
-      = link_to edit_group_path(@group), title: 'Settings', data: {placement: 'right'} do
+      = link_to edit_group_path(@group), title: 'Settings', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon ('cogs fw')
         %span
           Settings
diff --git a/app/views/layouts/nav/_group_settings.html.haml b/app/views/layouts/nav/_group_settings.html.haml
index 8075fe32fbc..964bc90c175 100644
--- a/app/views/layouts/nav/_group_settings.html.haml
+++ b/app/views/layouts/nav/_group_settings.html.haml
@@ -1,6 +1,6 @@
 %ul.nav.nav-sidebar
   = nav_link do
-    = link_to group_path(@group), title: 'Back to group', data: {placement: 'right'}, class: 'back-link' do
+    = link_to group_path(@group), title: 'Back to group', data: {toggle: 'tooltip', placement: 'right', container: 'body'}, class: 'back-link' do
       = icon('caret-square-o-left fw')
       %span
         Back to group
@@ -9,12 +9,12 @@
 
   %ul.sidebar-subnav
     = nav_link(path: 'groups#edit') do
-      = link_to edit_group_path(@group), title: 'Group Settings', data: {placement: 'right'} do
+      = link_to edit_group_path(@group), title: 'Group Settings', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon ('pencil-square-o fw')
         %span
           Group Settings
     = nav_link(path: 'groups#projects') do
-      = link_to projects_group_path(@group), title: 'Projects', data: {placement: 'right'} do
+      = link_to projects_group_path(@group), title: 'Projects', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('folder fw')
         %span
           Projects
diff --git a/app/views/layouts/nav/_profile.html.haml b/app/views/layouts/nav/_profile.html.haml
index 33fd5fcef6c..1159a8fbd75 100644
--- a/app/views/layouts/nav/_profile.html.haml
+++ b/app/views/layouts/nav/_profile.html.haml
@@ -1,6 +1,6 @@
 %ul.nav.nav-sidebar
   = nav_link do
-    = link_to root_path, title: 'Back to dashboard', data: {placement: 'right'}, class: 'back-link' do
+    = link_to root_path, title: 'Back to dashboard', data: {toggle: 'tooltip', placement: 'right', container: 'body'}, class: 'back-link' do
       = icon('caret-square-o-left fw')
       %span
         Back to Dashboard
@@ -8,52 +8,52 @@
   %li.separate-item
 
   = nav_link(path: 'profiles#show', html_options: {class: 'home'}) do
-    = link_to profile_path, title: 'Profile', data: {placement: 'right'} do
+    = link_to profile_path, title: 'Profile', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('user fw')
       %span
         Profile
   = nav_link(controller: [:accounts, :two_factor_auths]) do
-    = link_to profile_account_path, title: 'Account', data: {placement: 'right'} do
+    = link_to profile_account_path, title: 'Account', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('gear fw')
       %span
         Account
   = nav_link(path: ['profiles#applications', 'applications#edit', 'applications#show', 'applications#new', 'applications#create']) do
-    = link_to applications_profile_path, title: 'Applications', data: {placement: 'right'} do
+    = link_to applications_profile_path, title: 'Applications', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('cloud fw')
       %span
         Applications
   = nav_link(controller: :emails) do
-    = link_to profile_emails_path, title: 'Emails', data: {placement: 'right'} do
+    = link_to profile_emails_path, title: 'Emails', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('envelope-o fw')
       %span
         Emails
         %span.count= current_user.emails.count + 1
   - unless current_user.ldap_user?
     = nav_link(controller: :passwords) do
-      = link_to edit_profile_password_path, title: 'Password', data: {placement: 'right'} do
+      = link_to edit_profile_password_path, title: 'Password', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('lock fw')
         %span
           Password
   = nav_link(controller: :notifications) do
-    = link_to profile_notifications_path, title: 'Notifications', data: {placement: 'right'} do
+    = link_to profile_notifications_path, title: 'Notifications', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('inbox fw')
       %span
         Notifications
 
   = nav_link(controller: :keys) do
-    = link_to profile_keys_path, title: 'SSH Keys', data: {placement: 'right'} do
+    = link_to profile_keys_path, title: 'SSH Keys', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('key fw')
       %span
         SSH Keys
         %span.count= current_user.keys.count
   = nav_link(controller: :preferences) do
-    = link_to profile_preferences_path, title: 'Preferences', data: {placement: 'right'} do
+    = link_to profile_preferences_path, title: 'Preferences', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       -# TODO (rspeicher): Better icon?
       = icon('image fw')
       %span
         Preferences
   = nav_link(path: 'profiles#audit_log') do
-    = link_to audit_log_profile_path, title: 'Audit Log', data: {placement: 'right'} do
+    = link_to audit_log_profile_path, title: 'Audit Log', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('history fw')
       %span
         Audit Log
diff --git a/app/views/layouts/nav/_project.html.haml b/app/views/layouts/nav/_project.html.haml
index d17d1c5fbd4..eff3f1a2f27 100644
--- a/app/views/layouts/nav/_project.html.haml
+++ b/app/views/layouts/nav/_project.html.haml
@@ -1,13 +1,13 @@
 %ul.nav.nav-sidebar
   - if @project.group
     = nav_link do
-      = link_to group_path(@project.group), title: 'Back to group', data: {placement: 'right'}, class: 'back-link' do
+      = link_to group_path(@project.group), title: 'Back to group', data: {toggle: 'tooltip', placement: 'right', container: 'body'}, class: 'back-link' do
         = icon('caret-square-o-left fw')
         %span
           Back to Group
   - else
     = nav_link do
-      = link_to root_path, title: 'Back to dashboard', data: {placement: 'right'}, class: 'back-link' do
+      = link_to root_path, title: 'Back to dashboard', data: {toggle: 'tooltip', placement: 'right', container: 'body'}, class: 'back-link' do
         = icon('caret-square-o-left fw')
         %span
           Back to Dashboard
@@ -15,53 +15,53 @@
   %li.separate-item
 
   = nav_link(path: 'projects#show', html_options: {class: 'home'}) do
-    = link_to project_path(@project), title: 'Project', class: 'shortcuts-project', data: {placement: 'right'} do
+    = link_to project_path(@project), title: 'Project', class: 'shortcuts-project', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('home fw')
       %span
         Project
   = nav_link(path: 'projects#activity') do
-    = link_to activity_project_path(@project), title: 'Project Activity', class: 'shortcuts-project-activity', data: {placement: 'right'} do
+    = link_to activity_project_path(@project), title: 'Project Activity', class: 'shortcuts-project-activity', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('dashboard fw')
       %span
         Activity
   - if project_nav_tab? :files
     = nav_link(controller: %w(tree blob blame edit_tree new_tree)) do
-      = link_to namespace_project_tree_path(@project.namespace, @project, @ref || @repository.root_ref), title: 'Files',  class: 'shortcuts-tree', data: {placement: 'right'} do
+      = link_to namespace_project_tree_path(@project.namespace, @project, @ref || @repository.root_ref), title: 'Files',  class: 'shortcuts-tree', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('files-o fw')
         %span
           Files
 
   - if project_nav_tab? :commits
     = nav_link(controller: %w(commit commits compare repositories tags branches)) do
-      = link_to namespace_project_commits_path(@project.namespace, @project, @ref || @repository.root_ref), title: 'Commits', class: 'shortcuts-commits', data: {placement: 'right'} do
+      = link_to namespace_project_commits_path(@project.namespace, @project, @ref || @repository.root_ref), title: 'Commits', class: 'shortcuts-commits', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('history fw')
         %span
           Commits
 
   - if project_nav_tab? :network
     = nav_link(controller: %w(network)) do
-      = link_to namespace_project_network_path(@project.namespace, @project, @ref || @repository.root_ref), title: 'Network', class: 'shortcuts-network', data: {placement: 'right'} do
+      = link_to namespace_project_network_path(@project.namespace, @project, @ref || @repository.root_ref), title: 'Network', class: 'shortcuts-network', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('code-fork fw')
         %span
           Network
 
   - if project_nav_tab? :graphs
     = nav_link(controller: %w(graphs)) do
-      = link_to namespace_project_graph_path(@project.namespace, @project, @ref || @repository.root_ref), title: 'Graphs',  class: 'shortcuts-graphs', data: {placement: 'right'} do
+      = link_to namespace_project_graph_path(@project.namespace, @project, @ref || @repository.root_ref), title: 'Graphs',  class: 'shortcuts-graphs', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('area-chart fw')
         %span
           Graphs
 
   - if project_nav_tab? :milestones
     = nav_link(controller: :milestones) do
-      = link_to namespace_project_milestones_path(@project.namespace, @project), title: 'Milestones', data: {placement: 'right'} do
+      = link_to namespace_project_milestones_path(@project.namespace, @project), title: 'Milestones', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('clock-o fw')
         %span
           Milestones
 
   - if project_nav_tab? :issues
     = nav_link(controller: :issues) do
-      = link_to url_for_project_issues(@project, only_path: true), title: 'Issues', class: 'shortcuts-issues', data: {placement: 'right'} do
+      = link_to url_for_project_issues(@project, only_path: true), title: 'Issues', class: 'shortcuts-issues', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('exclamation-circle fw')
         %span
           Issues
@@ -70,7 +70,7 @@
 
   - if project_nav_tab? :merge_requests
     = nav_link(controller: :merge_requests) do
-      = link_to namespace_project_merge_requests_path(@project.namespace, @project), title: 'Merge Requests', class: 'shortcuts-merge_requests', data: {placement: 'right'} do
+      = link_to namespace_project_merge_requests_path(@project.namespace, @project), title: 'Merge Requests', class: 'shortcuts-merge_requests', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('tasks fw')
         %span
           Merge Requests
@@ -78,35 +78,35 @@
 
   - if project_nav_tab? :settings
     = nav_link(controller: [:project_members, :teams]) do
-      = link_to namespace_project_project_members_path(@project.namespace, @project), title: 'Members', class: 'team-tab tab', data: {placement: 'right'} do
+      = link_to namespace_project_project_members_path(@project.namespace, @project), title: 'Members', class: 'team-tab tab', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('users fw')
         %span
           Members
 
   - if project_nav_tab? :labels
     = nav_link(controller: :labels) do
-      = link_to namespace_project_labels_path(@project.namespace, @project), title: 'Labels', data: {placement: 'right'} do
+      = link_to namespace_project_labels_path(@project.namespace, @project), title: 'Labels', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('tags fw')
         %span
           Labels
 
   - if project_nav_tab? :wiki
     = nav_link(controller: :wikis) do
-      = link_to get_project_wiki_path(@project), title: 'Wiki', class: 'shortcuts-wiki', data: {placement: 'right'} do
+      = link_to get_project_wiki_path(@project), title: 'Wiki', class: 'shortcuts-wiki', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('book fw')
         %span
           Wiki
 
   - if project_nav_tab? :snippets
     = nav_link(controller: :snippets) do
-      = link_to namespace_project_snippets_path(@project.namespace, @project), title: 'Snippets', class: 'shortcuts-snippets', data: {placement: 'right'} do
+      = link_to namespace_project_snippets_path(@project.namespace, @project), title: 'Snippets', class: 'shortcuts-snippets', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('file-text-o fw')
         %span
           Snippets
 
   - if project_nav_tab? :settings
     = nav_link(html_options: {class: "#{project_tab_class} separate-item"}) do
-      = link_to edit_project_path(@project), title: 'Settings', data: {placement: 'right'} do
+      = link_to edit_project_path(@project), title: 'Settings', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('cogs fw')
         %span
           Settings
diff --git a/app/views/layouts/nav/_project_settings.html.haml b/app/views/layouts/nav/_project_settings.html.haml
index 857fb199957..f5b4eb35012 100644
--- a/app/views/layouts/nav/_project_settings.html.haml
+++ b/app/views/layouts/nav/_project_settings.html.haml
@@ -1,6 +1,6 @@
 %ul.nav.nav-sidebar
   = nav_link do
-    = link_to project_path(@project), title: 'Back to project', data: {placement: 'right'}, class: 'back-link' do
+    = link_to project_path(@project), title: 'Back to project', data: {toggle: 'tooltip', placement: 'right', container: 'body'}, class: 'back-link' do
       = icon('caret-square-o-left fw')
       %span
         Back to project
@@ -9,27 +9,27 @@
 
   %ul.sidebar-subnav
     = nav_link(path: 'projects#edit') do
-      = link_to edit_project_path(@project), title: 'Project Settings', data: {placement: 'right'} do
+      = link_to edit_project_path(@project), title: 'Project Settings', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('pencil-square-o fw')
         %span
           Project Settings
     = nav_link(controller: :deploy_keys) do
-      = link_to namespace_project_deploy_keys_path(@project.namespace, @project), title: 'Deploy Keys', data: {placement: 'right'} do
+      = link_to namespace_project_deploy_keys_path(@project.namespace, @project), title: 'Deploy Keys', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('key fw')
         %span
           Deploy Keys
     = nav_link(controller: :hooks) do
-      = link_to namespace_project_hooks_path(@project.namespace, @project), title: 'Web Hooks', data: {placement: 'right'} do
+      = link_to namespace_project_hooks_path(@project.namespace, @project), title: 'Web Hooks', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('link fw')
         %span
           Web Hooks
     = nav_link(controller: :services) do
-      = link_to namespace_project_services_path(@project.namespace, @project), title: 'Services', data: {placement: 'right'} do
+      = link_to namespace_project_services_path(@project.namespace, @project), title: 'Services', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('cogs fw')
         %span
           Services
     = nav_link(controller: :protected_branches) do
-      = link_to namespace_project_protected_branches_path(@project.namespace, @project), title: 'Protected Branches', data: {placement: 'right'} do
+      = link_to namespace_project_protected_branches_path(@project.namespace, @project), title: 'Protected Branches', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('lock fw')
         %span
           Protected Branches
diff --git a/app/views/layouts/nav/_snippets.html.haml b/app/views/layouts/nav/_snippets.html.haml
index 458b76a2c99..3fddb60550f 100644
--- a/app/views/layouts/nav/_snippets.html.haml
+++ b/app/views/layouts/nav/_snippets.html.haml
@@ -1,12 +1,12 @@
 %ul.nav.nav-sidebar
   - if current_user
     = nav_link(path: user_snippets_path(current_user), html_options: {class: 'home'}) do
-      = link_to user_snippets_path(current_user), title: 'Your snippets', data: {placement: 'right'} do
+      = link_to user_snippets_path(current_user), title: 'Your snippets', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
         = icon('dashboard fw')
         %span
           Your Snippets
   = nav_link(path: snippets_path) do
-    = link_to snippets_path, title: 'Discover snippets', data: {placement: 'right'} do
+    = link_to snippets_path, title: 'Discover snippets', data: {toggle: 'tooltip', placement: 'right', container: 'body'} do
       = icon('globe fw')
       %span
         Discover Snippets