Add .text-underline Utility Class

Style status box links using bootstrap and other utility classes instead
of styling all `a` tags in the status-box.

app/assets/stylesheets/framework/common.scss

@@ -52,6 +52,11 @@
   word-break: break-all;
 }
 
+.text-underline,
+.text-underline:hover {
+  text-decoration: underline;
+}
+
 .hint { font-style: italic; color: $gl-gray-400; }
 .light { color: $gl-text-color; }
 

app/assets/stylesheets/framework/issue_box.scss

@@ -32,11 +32,6 @@
   &.status-box-issue-closed,
   &.status-box-mr-merged {
     background-color: $blue-500;
-
-    a {
-      color: inherit;
-      text-decoration: underline;
-    }
   }
 
   &.status-box-open {

app/views/projects/issues/show.html.haml

@@ -16,7 +16,7 @@
       = sprite_icon('mobile-issue-close', size: 16, css_class: 'd-block d-sm-none')
       .d-none.d-sm-block
         - if @issue.moved?
-          - moved_link_start = "<a href=\"#{issue_path(@issue.moved_to)}\">".html_safe
+          - moved_link_start = "<a href=\"#{issue_path(@issue.moved_to)}\" class=\"text-white text-underline\">".html_safe
           - moved_link_end = '</a>'.html_safe
           = s_('IssuableStatus|Closed (%{moved_link_start}moved%{moved_link_end})').html_safe % {moved_link_start: moved_link_start,
             moved_link_end: moved_link_end}