From 0752375e468b6a41195d41bb35a9cf2f09dd5b2f Mon Sep 17 00:00:00 2001
From: Diana Huang <dkh@edx.org>
Date: Tue, 22 Oct 2013 14:21:35 -0400
Subject: [PATCH] Indicate active status more clearly for people with vision
 impairments

* bold text when active
* add in some extra text for screen readers

LMS-1306
---
 lms/static/sass/course/wiki/_wiki.scss        | 1 +
 lms/templates/wiki/includes/article_menu.html | 5 +++++
 2 files changed, 6 insertions(+)

diff --git a/lms/static/sass/course/wiki/_wiki.scss b/lms/static/sass/course/wiki/_wiki.scss
index 467a6a2c3e..022d08b81f 100644
--- a/lms/static/sass/course/wiki/_wiki.scss
+++ b/lms/static/sass/course/wiki/_wiki.scss
@@ -277,6 +277,7 @@ section.wiki {
       &.active {
         a {
           color: $link-color;
+          font-weight: bold;
 
           .icon-view,
           .icon-home {
diff --git a/lms/templates/wiki/includes/article_menu.html b/lms/templates/wiki/includes/article_menu.html
index 9deb344e88..d2ca563793 100644
--- a/lms/templates/wiki/includes/article_menu.html
+++ b/lms/templates/wiki/includes/article_menu.html
@@ -9,6 +9,7 @@
   <a href="${reverse('wiki:get', kwargs={'article_id' : article.id, 'path' : urlpath.path})}">
     <span class="icon-home icon"></span>
     View
+    ${"<span class='sr'>(active)</span>" if selected_tab == "view" else ""}
   </a>
 </li>
 
@@ -17,6 +18,7 @@
     <a href="${reverse('wiki:edit', kwargs={'article_id' : article.id, 'path' : urlpath.path})}">
       <span class="icon-edit icon"></span>
       Edit
+    ${"<span class='sr'>(active)</span>" if selected_tab == "edit" else ""}
     </a>
   </li>
 %endif
@@ -25,6 +27,7 @@
   <a href="${reverse('wiki:history', kwargs={'article_id' : article.id, 'path' : urlpath.path})}">
     <span class="icon-changes icon"></span>
     Changes
+    ${"<span class='sr'>(active)</span>" if selected_tab == "history" else ""}
   </a>
 </li>
 
@@ -34,6 +37,7 @@
       <a href="${reverse('wiki:plugin', kwargs={'slug' : plugin.slug, 'article_id' : article.id, 'path' : urlpath.path}) }">
         <span class="${plugin.article_tab[1]} icon"></span>
         ${plugin.article_tab[0]}
+    ${"<span class='sr'>(active)</span>" if selected_tab == plugin.slug else ""}
       </a>
     </li>
   %endif
@@ -49,6 +53,7 @@ ${_("This should be enabled for all non-anonymous users once the notifications a
   <a href="${reverse('wiki:settings', kwargs={'article_id' : article.id, 'path' : urlpath.path})}">
     <span class="icon-settings icon"></span>
     ${_("Settings")}
+    ${"<span class='sr'>(active)</span>" if selected_tab == "settings" else ""}
   </a>
 </li>
 %endif