Merge branch '40459-svg-icon-fix' into 'master'

Resolve "Issue note icons wrong color"

Closes #40459

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

8 files changed, 69 insertions, 60 deletions

diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss
index dfa3d4c6fb9..fcb6611ae31 100644
--- a/app/assets/stylesheets/framework/buttons.scss
+++ b/app/assets/stylesheets/framework/buttons.scss
@@ -88,17 +88,6 @@
     border-color: $border-dark;
     color: $color;
   }
-
-  svg {
-
-    path {
-      fill: $color;
-    }
-
-    use {
-      stroke: $color;
-    }
-  }
 }
 
 @mixin btn-green {
diff --git a/app/assets/stylesheets/framework/common.scss b/app/assets/stylesheets/framework/common.scss
index 5e4ddf366ef..cb1aad90a9c 100644
--- a/app/assets/stylesheets/framework/common.scss
+++ b/app/assets/stylesheets/framework/common.scss
@@ -2,14 +2,43 @@
 .cgray { color: $common-gray; }
 .clgray { color: $common-gray-light; }
 .cred { color: $common-red; }
-svg.cred { fill: $common-red; }
 .cgreen { color: $common-green; }
-svg.cgreen { fill: $common-green; }
 .cdark { color: $common-gray-dark; }
+
+.text-plain,
+.text-plain:hover {
+  color: $gl-text-color;
+}
+
 .text-secondary {
   color: $gl-text-color-secondary;
 }
 
+.text-primary,
+.text-primary:hover {
+  color: $brand-primary;
+}
+
+.text-success,
+.text-success:hover {
+  color: $brand-success;
+}
+
+.text-danger,
+.text-danger:hover {
+  color: $brand-danger;
+}
+
+.text-warning,
+.text-warning:hover {
+  color: $brand-warning;
+}
+
+.text-info,
+.text-info:hover {
+  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/icons.scss b/app/assets/stylesheets/framework/icons.scss
index 1ab5e6a93f9..9e45ed52163 100644
--- a/app/assets/stylesheets/framework/icons.scss
+++ b/app/assets/stylesheets/framework/icons.scss
@@ -1,35 +1,63 @@
 .ci-status-icon-success,
 .ci-status-icon-passed {
-  color: $green-500;
+  &,
+  &:hover,
+  &:focus {
+    color: $green-500;
+  }
 }
 
 .ci-status-icon-failed {
-  color: $gl-danger;
+  &,
+  &:hover,
+  &:focus {
+    color: $gl-danger;
+  }
 }
 
 .ci-status-icon-pending,
 .ci-status-icon-failed_with_warnings,
 .ci-status-icon-success_with_warnings {
-  color: $orange-500;
+  &,
+  &:hover,
+  &:focus {
+    color: $orange-500;
+  }
 }
 
 .ci-status-icon-running {
-  color: $blue-400;
+  &,
+  &:hover,
+  &:focus {
+    color: $blue-400;
+  }
 }
 
 .ci-status-icon-canceled,
 .ci-status-icon-disabled,
 .ci-status-icon-not-found {
-  color: $gl-text-color;
+  &,
+  &:hover,
+  &:focus {
+    color: $gl-text-color;
+  }
 }
 
 .ci-status-icon-created,
 .ci-status-icon-skipped {
-  color: $gray-darkest;
+  &,
+  &:hover,
+  &:focus {
+    color: $gray-darkest;
+  }
 }
 
 .ci-status-icon-manual {
-  color: $gl-text-color;
+  &,
+  &:hover,
+  &:focus {
+    color: $gl-text-color;
+  }
 }
 
 .icon-link {
diff --git a/app/assets/stylesheets/framework/tw_bootstrap.scss b/app/assets/stylesheets/framework/tw_bootstrap.scss
index d5c6ddbb4a5..1c6e2bf3074 100644
--- a/app/assets/stylesheets/framework/tw_bootstrap.scss
+++ b/app/assets/stylesheets/framework/tw_bootstrap.scss
@@ -195,33 +195,6 @@ summary {
   }
 }
 
-// Typography =================================================================
-
-.text-primary,
-.text-primary:hover {
-  color: $brand-primary;
-}
-
-.text-success,
-.text-success:hover {
-  color: $brand-success;
-}
-
-.text-danger,
-.text-danger:hover {
-  color: $brand-danger;
-}
-
-.text-warning,
-.text-warning:hover {
-  color: $brand-warning;
-}
-
-.text-info,
-.text-info:hover {
-  color: $brand-info;
-}
-
 // Prevent datetimes on tooltips to break into two lines
 .local-timeago {
   white-space: nowrap;
diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss
index 2461b818219..9d5930e3966 100644
--- a/app/assets/stylesheets/pages/notes.scss
+++ b/app/assets/stylesheets/pages/notes.scss
@@ -780,12 +780,6 @@ ul.notes {
     }
   }
 
-  svg {
-    fill: currentColor;
-    height: 16px;
-    width: 16px;
-  }
-
   .loading {
     margin: 0;
     height: auto;
diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss
index aaad6dbba8e..f639f391b89 100644
--- a/app/assets/stylesheets/pages/projects.scss
+++ b/app/assets/stylesheets/pages/projects.scss
@@ -886,10 +886,6 @@ pre.light-well {
     font-size: $gl-font-size;
   }
 
-  a {
-    color: $gl-text-color;
-  }
-
   .avatar-container,
   .controls {
     flex: 0 0 auto;
diff --git a/app/views/projects/commit/_commit_box.html.haml b/app/views/projects/commit/_commit_box.html.haml
index 8b9c1bbb602..5f607c2ab25 100644
--- a/app/views/projects/commit/_commit_box.html.haml
+++ b/app/views/projects/commit/_commit_box.html.haml
@@ -67,8 +67,8 @@
   - if @commit.last_pipeline
     - last_pipeline = @commit.last_pipeline
     .well-segment.pipeline-info
-      .status-icon-container{ class: "ci-status-icon-#{last_pipeline.status}" }
-        = link_to project_pipeline_path(@project, last_pipeline.id) do
+      .status-icon-container
+        = link_to project_pipeline_path(@project, last_pipeline.id), class: "ci-status-icon-#{last_pipeline.status}" do
           = ci_icon_for_status(last_pipeline.status)
       #{ _('Pipeline') }
       = link_to "##{last_pipeline.id}", project_pipeline_path(@project, last_pipeline.id)
diff --git a/app/views/shared/projects/_project.html.haml b/app/views/shared/projects/_project.html.haml
index 52a8fe8bb67..98bfc7c4d36 100644
--- a/app/views/shared/projects/_project.html.haml
+++ b/app/views/shared/projects/_project.html.haml
@@ -20,7 +20,7 @@
             = project_icon(project, alt: '', class: 'avatar project-avatar s40')
     .project-details
       %h3.prepend-top-0.append-bottom-0
-        = link_to project_path(project), class: dom_class(project) do
+        = link_to project_path(project), class: 'text-plain' do
           %span.project-full-name
             %span.namespace-name
               - if project.namespace && !skip_namespace