Merge branch '24129-underline-all-links' into 'master'

Add underline hover state to all links

Closes #24129

See merge request gitlab-org/gitlab-ce!15638

24 files changed, 59 insertions, 42 deletions

diff --git a/app/assets/stylesheets/framework/common.scss b/app/assets/stylesheets/framework/common.scss
index cb1aad90a9c..a42fab50db5 100644
--- a/app/assets/stylesheets/framework/common.scss
+++ b/app/assets/stylesheets/framework/common.scss
@@ -39,7 +39,6 @@
   color: $brand-info;
 }
 
-.underlined-link { text-decoration: underline; }
 .hint { font-style: italic; color: $hint-color; }
 .light { color: $common-gray; }
 
diff --git a/app/assets/stylesheets/framework/gfm.scss b/app/assets/stylesheets/framework/gfm.scss
index 34a35734acc..5621505996d 100644
--- a/app/assets/stylesheets/framework/gfm.scss
+++ b/app/assets/stylesheets/framework/gfm.scss
@@ -14,6 +14,5 @@
 
   &:hover {
     background-color: $user-mention-bg-hover;
-    text-decoration: none;
   }
 }
diff --git a/app/assets/stylesheets/framework/wells.scss b/app/assets/stylesheets/framework/wells.scss
index 68824ff8418..735fc4babd7 100644
--- a/app/assets/stylesheets/framework/wells.scss
+++ b/app/assets/stylesheets/framework/wells.scss
@@ -20,6 +20,11 @@
 
       .ref-name {
         font-size: 12px;
+
+        &:hover {
+          text-decoration: underline;
+          color: $gl-text-color;
+        }
       }
     }
 
diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss
index 63c51747f92..b33825a506e 100644
--- a/app/assets/stylesheets/pages/issuable.scss
+++ b/app/assets/stylesheets/pages/issuable.scss
@@ -110,6 +110,10 @@
       padding: 6px 10px;
       border-radius: $label-border-radius;
     }
+
+    &:hover .color-label {
+      text-decoration: underline;
+    }
   }
 
   &.has-labels {
@@ -174,6 +178,14 @@
         color: $gray-darkest;
       }
     }
+
+    &.assignee {
+      .author_link:hover {
+        .author {
+          text-decoration: underline;
+        }
+      }
+    }
   }
 
   .block-first {
@@ -468,7 +480,6 @@
   a:not(.btn-retry) {
     &:hover {
       color: $md-link-color;
-      text-decoration: none;
 
       .avatar {
         border-color: rgba($avatar-border, .2);
diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss
index 4fe182c9fce..a6009ab328e 100644
--- a/app/assets/stylesheets/pages/notes.scss
+++ b/app/assets/stylesheets/pages/notes.scss
@@ -208,7 +208,6 @@ ul.notes {
 
       a {
         color: $gl-link-color;
-        text-decoration: none;
       }
 
       p {
@@ -395,6 +394,10 @@ ul.notes {
     &:focus,
     &:hover {
       text-decoration: none;
+
+      .note-header-author-name {
+        text-decoration: underline;
+      }
     }
   }
 
@@ -461,6 +464,10 @@ ul.notes {
   .system-note-message {
     white-space: normal;
   }
+
+  a:hover {
+    text-decoration: underline;
+  }
 }
 
 /**
diff --git a/app/assets/stylesheets/pages/profile.scss b/app/assets/stylesheets/pages/profile.scss
index 28dc71dc641..ac745019319 100644
--- a/app/assets/stylesheets/pages/profile.scss
+++ b/app/assets/stylesheets/pages/profile.scss
@@ -73,7 +73,7 @@
 .profile-link-holder {
   display: inline;
 
-  a {
+  a:not(.text-link) {
     text-decoration: none;
   }
 }
diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss
index 2dc0c288a6d..4c1e6d46242 100644
--- a/app/assets/stylesheets/pages/projects.scss
+++ b/app/assets/stylesheets/pages/projects.scss
@@ -811,6 +811,7 @@ a.deploy-project-label {
         &:hover,
         &:focus {
           color: $gl-text-color;
+          text-decoration: underline;
         }
       }
     }
diff --git a/app/assets/stylesheets/pages/wiki.scss b/app/assets/stylesheets/pages/wiki.scss
index e150f96f3fa..d8fec583121 100644
--- a/app/assets/stylesheets/pages/wiki.scss
+++ b/app/assets/stylesheets/pages/wiki.scss
@@ -124,7 +124,11 @@
 
     &:hover,
     &.active {
-      color: $black;
+      text-decoration: none;
+
+      span {
+        text-decoration: underline;
+      }
     }
   }
 
diff --git a/app/helpers/commits_helper.rb b/app/helpers/commits_helper.rb
index f9a666fa1e6..f68e2cd3afa 100644
--- a/app/helpers/commits_helper.rb
+++ b/app/helpers/commits_helper.rb
@@ -63,7 +63,7 @@ module CommitsHelper
   # Returns a link formatted as a commit branch link
   def commit_branch_link(url, text)
     link_to(url, class: 'label label-gray ref-name branch-link') do
-      icon('code-fork') + " #{text}"
+      icon('code-fork', class: 'append-right-5') + "#{text}"
     end
   end
 
@@ -77,7 +77,7 @@ module CommitsHelper
   # Returns a link formatted as a commit tag link
   def commit_tag_link(url, text)
     link_to(url, class: 'label label-gray ref-name') do
-      icon('tag') + " #{text}"
+      icon('tag', class: 'append-right-5') + "#{text}"
     end
   end
 
diff --git a/app/views/projects/_readme.html.haml b/app/views/projects/_readme.html.haml
index 44aa9eb3826..32901d30b96 100644
--- a/app/views/projects/_readme.html.haml
+++ b/app/views/projects/_readme.html.haml
@@ -19,5 +19,5 @@
         distributed with computer software, forming part of its documentation.
       %p
         We recommend you to
-        = link_to "add a README", add_special_file_path(@project, file_name: 'README.md'), class: 'underlined-link'
+        = link_to "add a README", add_special_file_path(@project, file_name: 'README.md')
         file to the repository and GitLab will render it here instead of this message.
diff --git a/app/views/projects/artifacts/_tree_directory.html.haml b/app/views/projects/artifacts/_tree_directory.html.haml
index 03be6f15313..1a9ce8d0508 100644
--- a/app/views/projects/artifacts/_tree_directory.html.haml
+++ b/app/views/projects/artifacts/_tree_directory.html.haml
@@ -3,6 +3,6 @@
 %tr.tree-item{ 'data-link' => path_to_directory }
   %td.tree-item-file-name
     = tree_icon('folder', '755', directory.name)
-    = link_to path_to_directory do
-      %span.str-truncated= directory.name
+    = link_to path_to_directory, class: 'str-truncated' do
+      %span= directory.name
   %td
diff --git a/app/views/projects/artifacts/_tree_file.html.haml b/app/views/projects/artifacts/_tree_file.html.haml
index a97ddb3c377..cfb91568061 100644
--- a/app/views/projects/artifacts/_tree_file.html.haml
+++ b/app/views/projects/artifacts/_tree_file.html.haml
@@ -6,12 +6,12 @@
   %td.tree-item-file-name
     = tree_icon('file', blob.mode, blob.name)
     - if external_link
-      = link_to path_to_file, class: 'tree-item-file-external-link js-artifact-tree-tooltip',
+      = link_to path_to_file, class: 'tree-item-file-external-link js-artifact-tree-tooltip str-truncated',
           target: '_blank', rel: 'noopener noreferrer', title: _('Opens in a new window') do
-        %span.str-truncated>= blob.name
+        %span>= blob.name
       = icon('external-link', class: 'js-artifact-tree-external-icon')
     - else
-      = link_to path_to_file do
-        %span.str-truncated= blob.name
+      = link_to path_to_file, class: 'str-truncated' do
+        %span= blob.name
   %td
     = number_to_human_size(blob.size, precision: 2)
diff --git a/app/views/projects/branches/_branch.html.haml b/app/views/projects/branches/_branch.html.haml
index 6e02ae6c9cc..573050e597d 100644
--- a/app/views/projects/branches/_branch.html.haml
+++ b/app/views/projects/branches/_branch.html.haml
@@ -8,8 +8,7 @@
 %li{ class: "js-branch-#{branch.name}" }
   %div
     = link_to project_tree_path(@project, branch.name), class: 'item-title str-truncated ref-name' do
-      = icon('code-fork')
-      = branch.name
+      = icon('code-fork', class: 'append-right-5') + "#{branch.name}"
      
     - if branch.name == @repository.root_ref
       %span.label.label-primary default
diff --git a/app/views/projects/commits/_commit.html.haml b/app/views/projects/commits/_commit.html.haml
index a66177f20e9..1b91a94a9f8 100644
--- a/app/views/projects/commits/_commit.html.haml
+++ b/app/views/projects/commits/_commit.html.haml
@@ -41,6 +41,6 @@
         - if commit.status(ref)
           = render_commit_status(commit, ref: ref)
 
-        = link_to commit.short_id, project_commit_path(project, commit), class: "commit-sha btn btn-transparent"
+        = link_to commit.short_id, project_commit_path(project, commit), class: "commit-sha btn btn-transparent btn-link"
         = clipboard_button(text: commit.id, title: _("Copy commit SHA to clipboard"))
         = link_to_browse_code(project, commit)
diff --git a/app/views/projects/empty.html.haml b/app/views/projects/empty.html.haml
index af564b93dc3..58e89a481a9 100644
--- a/app/views/projects/empty.html.haml
+++ b/app/views/projects/empty.html.haml
@@ -14,12 +14,12 @@
     %p
       Otherwise you can start with adding a
       = succeed ',' do
-        = link_to "README", add_special_file_path(@project, file_name: 'README.md'), class: 'underlined-link'
+        = link_to "README", add_special_file_path(@project, file_name: 'README.md')
       a
       = succeed ',' do
-        = link_to "LICENSE", add_special_file_path(@project, file_name: 'LICENSE'), class: 'underlined-link'
+        = link_to "LICENSE", add_special_file_path(@project, file_name: 'LICENSE')
       or a
-      = link_to '.gitignore', add_special_file_path(@project, file_name: '.gitignore'), class: 'underlined-link'
+      = link_to '.gitignore', add_special_file_path(@project, file_name: '.gitignore')
       to this project.
     %p
       You will need to be owner or have the master permission level for the initial push, as the master branch is automatically protected.
diff --git a/app/views/projects/protected_branches/shared/_index.html.haml b/app/views/projects/protected_branches/shared/_index.html.haml
index ba7d98228c3..e662b877fbb 100644
--- a/app/views/projects/protected_branches/shared/_index.html.haml
+++ b/app/views/projects/protected_branches/shared/_index.html.haml
@@ -16,7 +16,7 @@
         %li prevent pushes from everybody except Masters
         %li prevent <strong>anyone</strong> from force pushing to the branch
         %li prevent <strong>anyone</strong> from deleting the branch
-      %p Read more about #{link_to "protected branches", help_page_path("user/project/protected_branches"), class: "underlined-link"} and #{link_to "project permissions", help_page_path("user/permissions"), class: "underlined-link"}.
+      %p Read more about #{link_to "protected branches", help_page_path("user/project/protected_branches")} and #{link_to "project permissions", help_page_path("user/permissions")}.
 
     - if can? current_user, :admin_project, @project
       = content_for :create_protected_branch
diff --git a/app/views/projects/protected_tags/shared/_index.html.haml b/app/views/projects/protected_tags/shared/_index.html.haml
index e764a37bbd7..24baf1cfc89 100644
--- a/app/views/projects/protected_tags/shared/_index.html.haml
+++ b/app/views/projects/protected_tags/shared/_index.html.haml
@@ -16,7 +16,7 @@
         %li Prevent <strong>anyone</strong> from updating the tag
         %li Prevent <strong>anyone</strong> from deleting the tag
 
-    %p Read more about #{link_to "protected tags", help_page_path("user/project/protected_tags"), class: "underlined-link"}.
+    %p Read more about #{link_to "protected tags", help_page_path("user/project/protected_tags")}.
 
     - if can? current_user, :admin_project, @project
       = yield :create_protected_tag
diff --git a/app/views/projects/tree/_blob_item.html.haml b/app/views/projects/tree/_blob_item.html.haml
index fd8175e1e01..c51af901699 100644
--- a/app/views/projects/tree/_blob_item.html.haml
+++ b/app/views/projects/tree/_blob_item.html.haml
@@ -2,8 +2,8 @@
   %td.tree-item-file-name
     = tree_icon(type, blob_item.mode, blob_item.name)
     - file_name = blob_item.name
-    = link_to project_blob_path(@project, tree_join(@id || @commit.id, blob_item.name)), title: file_name do
-      %span.str-truncated= file_name
+    = link_to project_blob_path(@project, tree_join(@id || @commit.id, blob_item.name)), class: 'str-truncated', title: file_name do
+      %span= file_name
   %td.hidden-xs.tree-commit
   %td.tree-time-ago.cgray.text-right
     = render 'projects/tree/spinner'
diff --git a/app/views/projects/tree/_tree_item.html.haml b/app/views/projects/tree/_tree_item.html.haml
index 56197382a70..af3816fc9f4 100644
--- a/app/views/projects/tree/_tree_item.html.haml
+++ b/app/views/projects/tree/_tree_item.html.haml
@@ -2,8 +2,8 @@
   %td.tree-item-file-name
     = tree_icon(type, tree_item.mode, tree_item.name)
     - path = flatten_tree(@path, tree_item)
-    = link_to project_tree_path(@project, tree_join(@id || @commit.id, path)), title: path do
-      %span.str-truncated= path
+    = link_to project_tree_path(@project, tree_join(@id || @commit.id, path)), class: 'str-truncated', title: path do
+      %span= path
   %td.hidden-xs.tree-commit
   %td.tree-time-ago.text-right
     = render 'projects/tree/spinner'
diff --git a/app/views/projects/wikis/_sidebar.html.haml b/app/views/projects/wikis/_sidebar.html.haml
index 5b781294d68..2c7551c6f8c 100644
--- a/app/views/projects/wikis/_sidebar.html.haml
+++ b/app/views/projects/wikis/_sidebar.html.haml
@@ -6,9 +6,8 @@
 
       - git_access_url = project_wikis_git_access_path(@project)
       = link_to git_access_url, class: active_nav_link?(path: 'wikis#git_access') ? 'active' : '' do
-        = succeed '&nbsp;' do
-          = icon('cloud-download')
-        = _("Clone repository")
+        = icon('cloud-download', class: 'append-right-5')
+        %span= _("Clone repository")
 
     .blocks-container
       .block.block-first
diff --git a/app/views/shared/_label.html.haml b/app/views/shared/_label.html.haml
index 23a418ad640..3fcc33044e9 100644
--- a/app/views/shared/_label.html.haml
+++ b/app/views/shared/_label.html.haml
@@ -38,9 +38,9 @@
             = link_to 'Delete', destroy_label_path(label), title: 'Delete', method: :delete, data: {confirm: 'Remove this label? Are you sure?'}
 
   .pull-right.hidden-xs.hidden-sm.hidden-md
-    = link_to_label(label, subject: subject, type: :merge_request, css_class: 'btn btn-transparent btn-action') do
+    = link_to_label(label, subject: subject, type: :merge_request, css_class: 'btn btn-transparent btn-action btn-link') do
       view merge requests
-    = link_to_label(label, subject: subject, css_class: 'btn btn-transparent btn-action') do
+    = link_to_label(label, subject: subject, css_class: 'btn btn-transparent btn-action btn-link') do
       view open issues
 
     - if current_user
diff --git a/app/views/shared/notes/_note.html.haml b/app/views/shared/notes/_note.html.haml
index b6085fd3af0..c978d9e4821 100644
--- a/app/views/shared/notes/_note.html.haml
+++ b/app/views/shared/notes/_note.html.haml
@@ -31,8 +31,7 @@
       .note-header
         .note-header-info
           %a{ href: user_path(note.author) }
-            %span.note-header-author-name
-              = sanitize(note.author.name)
+            %span.note-header-author-name= sanitize(note.author.name)
             %span.note-headline-light
               = note.author.to_reference
           %span.note-headline-light
diff --git a/app/views/users/show.html.haml b/app/views/users/show.html.haml
index cc59f8660fd..4f4e81c705f 100644
--- a/app/views/users/show.html.haml
+++ b/app/views/users/show.html.haml
@@ -51,7 +51,7 @@
         .cover-desc
           - unless @user.public_email.blank?
             .profile-link-holder.middle-dot-divider
-              = link_to @user.public_email, "mailto:#{@user.public_email}"
+              = link_to @user.public_email, "mailto:#{@user.public_email}", class: 'text-link'
           - unless @user.skype.blank?
             .profile-link-holder.middle-dot-divider
               = link_to "skype:#{@user.skype}", title: "Skype" do
@@ -66,7 +66,7 @@
                 = icon('twitter-square')
           - unless @user.website_url.blank?
             .profile-link-holder.middle-dot-divider
-              = link_to @user.short_website_url, @user.full_website_url
+              = link_to @user.short_website_url, @user.full_website_url, class: 'text-link'
           - unless @user.location.blank?
             .profile-link-holder.middle-dot-divider
               = icon('map-marker')
diff --git a/doc/development/doc_styleguide.md b/doc/development/doc_styleguide.md
index aaa7032cadb..db13e0e6249 100644
--- a/doc/development/doc_styleguide.md
+++ b/doc/development/doc_styleguide.md
@@ -170,12 +170,6 @@ You can combine one or more of the following:
     = link_to 'Help page', help_page_path('user/permissions'),  class: 'btn btn-info'
     ```
 
-1. **Underlining a link.**
-
-    ```haml
-    = link_to 'Help page', help_page_path('user/permissions'), class: 'underlined-link'
-    ```
-
 1. **Using links inline of some text.**
 
     ```haml