From 0612e914dc8864deb47f9edb96567686285a6023 Mon Sep 17 00:00:00 2001
From: Peter Fogg <pfogg@edx.org>
Date: Fri, 11 Sep 2015 14:02:24 -0400
Subject: [PATCH] Various accessibility fixes for Teams.

Update teams breadcrumb aria-label, make team membership display as a
<ul>, fix contrast issues, and remove an extraneous angle bracket.
---
 .../templates/components/search-field.underscore       |  2 +-
 common/test/acceptance/pages/lms/teams.py              |  2 +-
 .../teams/static/teams/js/views/teams_tab.js           |  2 +-
 .../static/teams/templates/team-member.underscore      | 10 ++++++----
 .../static/teams/templates/team-profile.underscore     |  2 +-
 lms/static/sass/_developer.scss                        |  8 ++++++++
 lms/static/sass/views/_teams.scss                      |  6 +++---
 7 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/common/static/common/templates/components/search-field.underscore b/common/static/common/templates/components/search-field.underscore
index aac29f640d..c25d8640f6 100644
--- a/common/static/common/templates/components/search-field.underscore
+++ b/common/static/common/templates/components/search-field.underscore
@@ -1,7 +1,7 @@
 <div class="page-header-search wrapper-search-<%= type %>">
     <form class="search-form">
         <div class="wrapper-search-input">
-            <label for="search-<%= type %>" class="search-label">><%- searchLabel %></label>
+            <label for="search-<%= type %>" class="search-label"><%- searchLabel %></label>
             <input id="search-<%= type %>" class="search-field" type="text" value="<%- searchString %>" placeholder="<%- searchLabel %>" />
             <button type="button" class="action action-clear <%= searchLabel ? '' : 'is-hidden' %>" aria-label="<%- gettext('Clear search') %>">
                 <i class="icon fa fa-times-circle" aria-hidden="true"></i><span class="sr"><%- gettext('Search') %></span>
diff --git a/common/test/acceptance/pages/lms/teams.py b/common/test/acceptance/pages/lms/teams.py
index 9637237f02..f6d9760127 100644
--- a/common/test/acceptance/pages/lms/teams.py
+++ b/common/test/acceptance/pages/lms/teams.py
@@ -508,7 +508,7 @@ class TeamPage(CoursePage, PaginatedUIMixin, BreadcrumbsMixin):
 
     def click_first_profile_image(self):
         """Clicks on first team member's profile image"""
-        self.q(css='.page-content-secondary .members-info > .team-member').first.click()
+        self.q(css='.page-content-secondary .members-info .team-member').first.click()
 
     @property
     def first_member_username(self):
diff --git a/lms/djangoapps/teams/static/teams/js/views/teams_tab.js b/lms/djangoapps/teams/static/teams/js/views/teams_tab.js
index e83abeb0ed..87f4d4ab54 100644
--- a/lms/djangoapps/teams/static/teams/js/views/teams_tab.js
+++ b/lms/djangoapps/teams/static/teams/js/views/teams_tab.js
@@ -31,7 +31,7 @@
                   TeamMembersEditView, TeamProfileHeaderActionsView, TeamUtils, InstructorToolsView, teamsTemplate) {
             var TeamsHeaderModel = HeaderModel.extend({
                 initialize: function () {
-                    _.extend(this.defaults, {nav_aria_label: gettext('teams')});
+                    _.extend(this.defaults, {nav_aria_label: gettext('Topics')});
                     HeaderModel.prototype.initialize.call(this);
                 }
             });
diff --git a/lms/djangoapps/teams/static/teams/templates/team-member.underscore b/lms/djangoapps/teams/static/teams/templates/team-member.underscore
index a400554328..f53e4734fb 100644
--- a/lms/djangoapps/teams/static/teams/templates/team-member.underscore
+++ b/lms/djangoapps/teams/static/teams/templates/team-member.underscore
@@ -1,6 +1,8 @@
-<span class="team-member">
+<li>
+  <span class="team-member">
     <a class="member-profile" href="<%= memberProfileUrl %>">
-        <p class="tooltip-custom"><%= username %></p>
-        <img class="image-url" src="<%= imageUrl %>" alt="profile page" />
+      <p class="tooltip-custom"><%= username %></p>
+      <img class="image-url" src="<%= imageUrl %>" alt="profile page" />
     </a>
-</span>
+  </span>
+</li>
diff --git a/lms/djangoapps/teams/static/teams/templates/team-profile.underscore b/lms/djangoapps/teams/static/teams/templates/team-profile.underscore
index 36a689665a..02df7e8979 100644
--- a/lms/djangoapps/teams/static/teams/templates/team-profile.underscore
+++ b/lms/djangoapps/teams/static/teams/templates/team-profile.underscore
@@ -21,7 +21,7 @@
             <% if (hasMembers) { %>
                 <span class="sr"><%- gettext("Team member profiles") %></span>
             <% } %>
-            <div class="members-info"></div>
+            <ul class="members-info"></ul>
         </div>
 
         <div class="team-capacity">
diff --git a/lms/static/sass/_developer.scss b/lms/static/sass/_developer.scss
index e31d9747e7..4c06be2445 100644
--- a/lms/static/sass/_developer.scss
+++ b/lms/static/sass/_developer.scss
@@ -275,6 +275,14 @@
     }
   }
 
+  .members-info {
+    margin: 0;
+    padding: 0;
+    li {
+      display: inline;
+    }
+  }
+
   .edit-members {
     @extend %ui-no-list;
 
diff --git a/lms/static/sass/views/_teams.scss b/lms/static/sass/views/_teams.scss
index 7f1c47d827..6be88b85f0 100644
--- a/lms/static/sass/views/_teams.scss
+++ b/lms/static/sass/views/_teams.scss
@@ -175,7 +175,7 @@
   .listing-tools {
     @extend %t-copy-sub1;
     margin: ($baseline/10) $baseline;
-    color: $gray-l1;
+    color: $gray-d1;
 
     label { // override
       color: inherit;
@@ -716,11 +716,11 @@
 
     .u-field.error {
       input, textarea {
-        border-color: $error-red;
+        border-color: $danger-red;
       }
 
       .u-field-message-help, .u-field-description-message {
-        color: $error-red !important;
+        color: $danger-red !important;
       }
     }