Merge pull request #13457 from edx/bjacobel/discussion-color-contrast

Fix color-contrast a11y failures in Discussions

common/test/acceptance/tests/discussion/test_discussion.py

@@ -211,7 +211,6 @@ class DiscussionHomePageTest(UniqueCourseTest):
         self.page.a11y_audit.config.set_rules({
             "ignore": [
                 'section',  # TODO: AC-491
-                'color-contrast',  # TNL-4635
                 'icon-aria-hidden',  # TNL-4637
             ]
         })
@@ -457,7 +456,6 @@ class DiscussionTabMultipleThreadTest(BaseDiscussionTestCase):
         self.thread_page_1.a11y_audit.config.set_rules({
             "ignore": [
                 'section',  # TODO: AC-491
-                'color-contrast',  # TNL-4639
                 'icon-aria-hidden',  # TNL-4641
             ]
         })
@@ -467,7 +465,6 @@ class DiscussionTabMultipleThreadTest(BaseDiscussionTestCase):
         self.thread_page_2.a11y_audit.config.set_rules({
             "ignore": [
                 'section',  # TODO: AC-491
-                'color-contrast',  # TNL-4639
                 'icon-aria-hidden',  # TNL-4641
             ]
         })
@@ -529,7 +526,7 @@ class DiscussionOpenClosedThreadTest(BaseDiscussionTestCase):
         page.a11y_audit.config.set_rules({
             'ignore': [
                 'section',  # TODO: AC-491
-                'color-contrast',  # TNL-4644
+                'color-contrast',  # Commented out for now because they reproducibly fail on Jenkis but not locally
                 'icon-aria-hidden',  # TNL-4645
             ]
         })
@@ -539,7 +536,7 @@ class DiscussionOpenClosedThreadTest(BaseDiscussionTestCase):
         page.a11y_audit.config.set_rules({
             'ignore': [
                 'section',  # TODO: AC-491
-                'color-contrast',  # TNL-4644
+                'color-contrast',  # Commented out for now because they reproducibly fail on Jenkis but not locally
                 'icon-aria-hidden',  # TNL-4645
             ]
         })
@@ -827,7 +824,6 @@ class DiscussionResponseEditTest(BaseDiscussionTestCase):
         page.a11y_audit.config.set_rules({
             'ignore': [
                 'section',  # TODO: AC-491
-                'color-contrast',  # TNL-4644
                 'icon-aria-hidden',  # TNL-4645
             ]
         })
@@ -926,7 +922,6 @@ class DiscussionCommentEditTest(BaseDiscussionTestCase):
         page.a11y_audit.config.set_rules({
             'ignore': [
                 'section',  # TODO: AC-491
-                'color-contrast',  # TNL-4644
                 'icon-aria-hidden',  # TNL-4645
             ]
         })
@@ -1333,7 +1328,6 @@ class DiscussionSearchAlertTest(UniqueCourseTest):
         self.page.a11y_audit.config.set_rules({
             'ignore': [
                 'section',  # TODO: AC-491
-                'color-contrast',  # TNL-4639
                 'icon-aria-hidden',  # TNL-4641
             ]
         })

lms/static/sass/course/layout/_courseware_header.scss

@@ -43,20 +43,11 @@
         text-decoration: none;
 
         &:hover,
-        &:focus {
+        &:focus,
+        &.active {
           color: $uxpl-blue-hover-active;
           border-bottom: 4px solid $uxpl-blue-hover-active;
         }
-
-        &.active {
-          border-bottom: 4px solid $uxpl-blue-base;
-          color: $uxpl-blue-base;
-
-          &:hover,
-          &:focus {
-            color: $uxpl-blue-base;
-          }
-        }
       }
     }
   }

lms/static/sass/discussion/_discussion.scss

@@ -444,7 +444,7 @@ section.discussion-pagination {
   .response-display-count {
     display: block;
     padding: ($baseline/2) 0;
-    color: $gray;
+    color: $forum-color-response-count;
     font-size: $forum-base-font-size;
   }
 

lms/static/sass/discussion/_mixins.scss

@@ -61,7 +61,7 @@
   @include padding-left($baseline/4);
   padding-top: 3px;
   width: 100%;
-  color: $gray-l2;
+  color: $forum-color-editor-preview-label;
   font-size: $forum-small-font-size;
 }
 

lms/static/sass/discussion/utilities/_variables-v1.scss

@@ -19,6 +19,8 @@ $forum-color-hover-thread: #f6f6f6 !default;
 $forum-color-reading-thread: $gray-d3 !default;
 $forum-color-read-post: $blue !default;
 $forum-color-never-read-post: $gray-d3 !default;
+$forum-color-editor-preview-label: $gray-d2 !default;
+$forum-color-response-count: $gray-d2 !default;
 
 // post images
 $post-image-dimension: ($baseline*3) !default;  // image size  + margin

lms/static/sass/discussion/utilities/_variables-v2.scss

@@ -19,6 +19,8 @@ $forum-color-hover-thread: palette(grayscale, x-back) !default;
 $forum-color-reading-thread: palette(primary, base) !default;
 $forum-color-read-post: palette(grayscale, base) !default;
 $forum-color-never-read-post: palette(primary, base) !default;
+$forum-color-editor-preview-label: palette(grayscale, base) !default;
+$forum-color-response-count: palette(grayscale, base) !default;
 
 // post images
 $post-image-dimension: ($baseline*3) !default;  // image size  + margin