Fix broadcast notification icon appearance

The icon got replaced in the effort to remove font awesome icon. However
the icon color was white for all brodcast messages, although this color
does not work for notification broadcast messages that have a white
background.

app/assets/stylesheets/framework/broadcast_messages.scss

@@ -15,10 +15,6 @@
 
 .broadcast-banner-message {
   text-align: center;
-
-  .broadcast-message-dismiss {
-    color: inherit;
-  }
 }
 
 .broadcast-notification-message {
@@ -36,10 +32,6 @@
   &.preview {
     position: static;
   }
-
-  .broadcast-message-dismiss {
-    color: $gray-700;
-  }
 }
 
 .toggle-colors {

app/views/shared/_broadcast_message.html.haml

@@ -8,5 +8,5 @@
     = render_broadcast_message(message)
   .gl-flex-grow-1.gl-flex-basis-0.gl-text-right
     - if (message.notification? || message.dismissable?) && opts[:preview].blank?
-      %button.broadcast-message-dismiss.js-dismiss-current-broadcast-notification.btn.btn-link.gl-button{ 'aria-label' => _('Close'), :type => 'button', data: { id: message.id, expire_date: message.ends_at.iso8601 } }
-        = sprite_icon('close', size: 16, css_class: 'gl-icon gl-text-white gl-mx-3!')
+      %button.js-dismiss-current-broadcast-notification.btn.btn-link.gl-button{ 'aria-label' => _('Close'), :type => 'button', data: { id: message.id, expire_date: message.ends_at.iso8601 } }
+        = sprite_icon('close', size: 16, css_class: "gl-icon gl-mx-3! #{is_banner ? 'gl-text-white' : 'gl-text-gray-700'}")

changelogs/unreleased/nicolasdular-fix-bm-close-icon.yml

+---
+title: Fix broadcast notification close icon appearance
+merge_request: 46804
+author:
+type: fixed