From 5868e3aef8b4214a9cada0db9f16ab22a2bfc88c Mon Sep 17 00:00:00 2001
From: Carla Duarte <cduarte@edx.org>
Date: Wed, 3 Mar 2021 15:34:50 -0500
Subject: [PATCH] AA-517: fix duplicate IDs in MessageBannerView

---
 lms/static/js/views/message_banner.js          | 2 +-
 lms/static/sass/elements/_system-feedback.scss | 4 ++--
 lms/templates/fields/message_banner.underscore | 4 ++--
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/lms/static/js/views/message_banner.js b/lms/static/js/views/message_banner.js
index d7d9729fd2..a061dcdad9 100644
--- a/lms/static/js/views/message_banner.js
+++ b/lms/static/js/views/message_banner.js
@@ -11,7 +11,7 @@
         var MessageBannerView = Backbone.View.extend({
 
             events: {
-                'click #close': 'closeBanner'
+                'click .close-btn': 'closeBanner'
             },
 
             closeBanner: function(event) {
diff --git a/lms/static/sass/elements/_system-feedback.scss b/lms/static/sass/elements/_system-feedback.scss
index 0a16127ff3..6cddd3e837 100644
--- a/lms/static/sass/elements/_system-feedback.scss
+++ b/lms/static/sass/elements/_system-feedback.scss
@@ -116,7 +116,7 @@
 
   &.recovery-email-alert,
   &.learner-portal-enabled-alert {
-    &#banner-msg {
+    &.banner-msg {
       position: relative;
       top: -10px;
       padding: 20px 40px;
@@ -138,7 +138,7 @@
   }
 
   &.learner-portal-enabled-alert {
-    &#banner-msg {
+    &.banner-msg {
       margin-bottom: 10px;
     }
   }
diff --git a/lms/templates/fields/message_banner.underscore b/lms/templates/fields/message_banner.underscore
index dc019c5d03..1acfa4dbd6 100644
--- a/lms/templates/fields/message_banner.underscore
+++ b/lms/templates/fields/message_banner.underscore
@@ -1,5 +1,5 @@
-<div id="banner-msg" class="wrapper-msg urgency-<%- urgency %> <%- type %> <% if (isRecoveryEmailMsg == true) { %> recovery-email-alert <% } %> <% if (isLearnerPortalEnabled == true) { %> learner-portal-enabled-alert <% } %>" role="alert">
-  <i <% if (hideCloseBtn == true) { %> hidden <% } %> id="close" class="fa fa-close close-icon"></i>
+<div class="banner-msg wrapper-msg urgency-<%- urgency %> <%- type %> <% if (isRecoveryEmailMsg == true) { %> recovery-email-alert <% } %> <% if (isLearnerPortalEnabled == true) { %> learner-portal-enabled-alert <% } %>" role="alert">
+  <i <% if (hideCloseBtn == true) { %> hidden <% } %> class="fa fa-close close-icon close-btn"></i>
     <div class="msg">
         <div class="msg-content">
             <div class="copy">