Merge pull request #20777 from edx/fsheets/about-page-message

Add in messaging for 403 errors on about pages & update error color for a11y

lms/static/sass/multicourse/_course_about.scss

@@ -188,8 +188,8 @@
 
           #register_error {
             background: $error-color;
-            border: 1px solid rgb(202, 17, 17);
-            color: rgb(143, 14, 14);
+            border: 1px $error-color;
+            color: $white;
             display: none;
             padding: 12px;
             margin-top: ($baseline/4);

lms/templates/courseware/course_about.html

@@ -50,7 +50,7 @@ from six import string_types
         $.ajax({
           url: "${reverse('add_course_to_cart', args=[text_type(course.id)]) | n, js_escaped_string}",
           type: "POST",
-          /* Rant: HAD TO USE COMPLETE B/C PROMISE.DONE FOR SOME REASON DOES NOT WORK ON THIS PAGE. */
+          /* Using `complete` as promise.done did not work on this page */
           complete: add_course_complete_handler
         })
         event.preventDefault();
@@ -58,13 +58,17 @@ from six import string_types
     % endif
 
     $('#class_enroll_form').on('ajax:complete', function(event, xhr) {
-      if(xhr.status == 200) {
+      if (xhr.status == 200) {
         if (xhr.responseText == "") {
           location.href = "${reverse('dashboard') | n, js_escaped_string}";
         }
         else {
           location.href = xhr.responseText;
         }
+      } else if (xhr.status == 403) {
+        $('#register_error').text(
+            (xhr.responseText ? xhr.responseText : "${_("An error has occurred. Please ensure that you are logged in to enroll.") | n, js_escaped_string}")
+        ).css("display", "block");
       } else {
         $('#register_error').text(
             (xhr.responseText ? xhr.responseText : "${_("An error occurred. Please try again later.") | n, js_escaped_string}")