Skip to content

E
edx-platform
Commit 21aa7edd by clrux
Options

Merge pull request #9909 from edx/clrux/ac-179 

AC-179 fixing skip links
parents b94204a8 2a4e141e
Showing with 42 additions and 40 deletions
cms/static/sass/_base.scss
...@@ -648,21 +648,22 @@ hr.divider { ...@@ -648,21 +648,22 @@ hr.divider {
// ui - skipnav // ui - skipnav
.nav-skip { .nav-skip {
@extend %t-action3; @extend %t-action3;
display: block; display: inline-block;
position: absolute; position: absolute;
left: 0px; left: 0px;
top: -($baseline*30); top: -($baseline*30);
width: 1px;
height: 1px;
overflow: hidden; overflow: hidden;
background: $white; background: $white;
border-bottom: 1px solid $gray-l4; border-bottom: 1px solid $gray-l4;
padding: ($baseline*0.75) ($baseline/2); padding: ($baseline*0.75) ($baseline/2);
&:focus, &:active { &:focus,
position: static; &:active {
position: relative;
top: auto;
width: auto; width: auto;
height: auto; height: auto;
margin: 0;
} }
} }
...@@ -725,4 +726,3 @@ hr.divider { ...@@ -725,4 +726,3 @@ hr.divider {
color: $gray-l1; color: $gray-l1;
} }
} }
cms/static/sass/elements/_navigation.scss
...@@ -25,21 +25,22 @@ nav { ...@@ -25,21 +25,22 @@ nav {
// skip navigation // skip navigation
.nav-skip { .nav-skip {
@include font-size(13); @include font-size(13);
display: block; display: inline-block;
position: absolute; position: absolute;
left: 0px; left: 0px;
top: -($baseline*30); top: -($baseline*30);
width: 1px;
height: 1px;
overflow: hidden; overflow: hidden;
background: $white; background: $white;
border-bottom: 1px solid $gray-l4; border-bottom: 1px solid $gray-l4;
padding: ($baseline*0.75) ($baseline/2); padding: ($baseline*0.75) ($baseline/2);
&:focus, &:active { &:focus,
position: static; &:active {
position: relative;
top: auto;
width: auto; width: auto;
height: auto; height: auto;
margin: 0;
} }
} }
......
cms/templates/base.html
...@@ -63,7 +63,7 @@ from openedx.core.djangolib.js_utils import ( ...@@ -63,7 +63,7 @@ from openedx.core.djangolib.js_utils import (
<%block name="page_alert"></%block> <%block name="page_alert"></%block>
</div> </div>
<div id="content"> <div id="content" tabindex="-1">
<%block name="content"></%block> <%block name="content"></%block>
</div> </div>
......
cms/templates/course-create-rerun.html
...@@ -21,7 +21,7 @@ from django.template.defaultfilters import escapejs ...@@ -21,7 +21,7 @@ from django.template.defaultfilters import escapejs
</%block> </%block>
<%block name="content"> <%block name="content">
<div id="content"> <div id="content" tabindex="-1">
<div class="wrapper-mast wrapper"> <div class="wrapper-mast wrapper">
<header class="mast mast-wizard has-actions"> <header class="mast mast-wizard has-actions">
<h1 class="page-header"> <h1 class="page-header">
......
common/test/acceptance/tests/lms/test_account_settings.py
...@@ -462,7 +462,6 @@ class AccountSettingsA11yTest(AccountSettingsTestMixin, WebAppTest): ...@@ -462,7 +462,6 @@ class AccountSettingsA11yTest(AccountSettingsTestMixin, WebAppTest):
self.account_settings_page.a11y_audit.config.set_rules({ self.account_settings_page.a11y_audit.config.set_rules({
'ignore': [ 'ignore': [
'link-href', # TODO: AC-233, AC-238 'link-href', # TODO: AC-233, AC-238
'skip-link', # TODO: AC-179
], ],
}) })
self.account_settings_page.a11y_audit.check_for_accessibility_errors() self.account_settings_page.a11y_audit.check_for_accessibility_errors()
common/test/acceptance/tests/lms/test_learner_profile.py
...@@ -795,7 +795,6 @@ class LearnerProfileA11yTest(LearnerProfileTestMixin, WebAppTest): ...@@ -795,7 +795,6 @@ class LearnerProfileA11yTest(LearnerProfileTestMixin, WebAppTest):
profile_page.a11y_audit.config.set_rules({ profile_page.a11y_audit.config.set_rules({
"ignore": [ "ignore": [
'skip-link', # TODO: AC-179
'link-href', # TODO: AC-231 'link-href', # TODO: AC-231
], ],
}) })
......
common/test/acceptance/tests/lms/test_lms_dashboard.py
...@@ -235,8 +235,7 @@ class LmsDashboardA11yTest(BaseLmsDashboardTest): ...@@ -235,8 +235,7 @@ class LmsDashboardA11yTest(BaseLmsDashboardTest):
self.dashboard_page.a11y_audit.config.set_rules({ self.dashboard_page.a11y_audit.config.set_rules({
"ignore": [ "ignore": [
'skip-link', # TODO: AC-179 'link-href', # TODO: AC-238
'link-href', # TODO: AC-238, AC-179
], ],
}) })
......
common/test/acceptance/tests/studio/test_studio_library.py
...@@ -659,7 +659,6 @@ class StudioLibraryA11yTest(StudioLibraryTest): ...@@ -659,7 +659,6 @@ class StudioLibraryA11yTest(StudioLibraryTest):
'color-contrast', # TODO: AC-225 'color-contrast', # TODO: AC-225
'link-href', # TODO: AC-226 'link-href', # TODO: AC-226
'nav-aria-label', # TODO: AC-227 'nav-aria-label', # TODO: AC-227
'skip-link', # TODO: AC-228
'icon-aria-hidden', # TODO: AC-229 'icon-aria-hidden', # TODO: AC-229
], ],
}) })
......
lms/static/js/spec/search/search_spec.js
...@@ -490,7 +490,7 @@ define([ ...@@ -490,7 +490,7 @@ define([
'<div class="courseware-results"></div>' + '<div class="courseware-results"></div>' +
'<section id="course-content"></section>' + '<section id="course-content"></section>' +
'<section id="dashboard-search-results"></section>' + '<section id="dashboard-search-results"></section>' +
'<section id="my-courses"></section>' '<section id="my-courses" tabindex="-1"></section>'
); );
TemplateHelpers.installTemplates([ TemplateHelpers.installTemplates([
...@@ -705,7 +705,7 @@ define([ ...@@ -705,7 +705,7 @@ define([
loadFixtures('js/fixtures/search/dashboard_search_form.html'); loadFixtures('js/fixtures/search/dashboard_search_form.html');
appendSetFixtures( appendSetFixtures(
'<section id="dashboard-search-results"></section>' + '<section id="dashboard-search-results"></section>' +
'<section id="my-courses"></section>' '<section id="my-courses" tabindex="-1"></section>'
); );
loadTemplates.call(this); loadTemplates.call(this);
DashboardSearchFactory(); DashboardSearchFactory();
...@@ -753,4 +753,4 @@ define([ ...@@ -753,4 +753,4 @@ define([
}); });
}); });
}); });
\ No newline at end of file
lms/static/sass/base/_base.scss
...@@ -336,20 +336,21 @@ mark { ...@@ -336,20 +336,21 @@ mark {
.nav-skip { .nav-skip {
@extend %ui-print-excluded; @extend %ui-print-excluded;
display: block; display: inline-block;
position: absolute; position: absolute;
left: 0; left: 0;
top: -($baseline*30); top: -($baseline*30);
width: 1px;
height: 1px;
overflow: hidden; overflow: hidden;
background: $white; background: $white;
border-bottom: 1px solid $border-color-4; border-bottom: 1px solid $border-color-4;
padding: ($baseline*0.75) ($baseline/2); padding: ($baseline*0.75) ($baseline/2);
&:focus, &:active { &:focus,
position: static; &:active {
position: relative;
top: auto;
width: auto; width: auto;
height: auto; height: auto;
margin: 0;
} }
} }
lms/static/sass/course/instructor/_instructor_2.scss
...@@ -1712,7 +1712,7 @@ input[name="subject"] { ...@@ -1712,7 +1712,7 @@ input[name="subject"] {
height: 40px; height: 40px;
border-radius: 3px; border-radius: 3px;
} }
#coupon-content, #course-content, #registration-content, #regcode-content { #coupon-content, #course-content, #content, #registration-content, #regcode-content {
padding: $baseline; padding: $baseline;
header { header {
margin: 0; margin: 0;
......
lms/static/sass/multicourse/_dashboard.scss
...@@ -316,6 +316,10 @@ ...@@ -316,6 +316,10 @@
// ==================== // ====================
.dashboard .my-courses { .dashboard .my-courses {
&:focus {
outline: none;
}
// UI: individual course item // UI: individual course item
.course { .course {
@include box-sizing(box); @include box-sizing(box);
......
lms/templates/courseware/courseware-chromeless.html
...@@ -37,7 +37,7 @@ ${static.get_page_title_breadcrumbs(course_name())} ...@@ -37,7 +37,7 @@ ${static.get_page_title_breadcrumbs(course_name())}
<%static:css group='style-student-notes'/> <%static:css group='style-student-notes'/>
% endif % endif
<%block name="nav_skip">${"#seq_content" if section_title else "#course-content"}</%block> <%block name="nav_skip">${"#content" if section_title else "#content"}</%block>
<%include file="../discussion/_js_head_dependencies.html" /> <%include file="../discussion/_js_head_dependencies.html" />
${fragment.head_html()} ${fragment.head_html()}
......
lms/templates/courseware/courseware.html
...@@ -62,7 +62,7 @@ ${static.get_page_title_breadcrumbs(course_name())} ...@@ -62,7 +62,7 @@ ${static.get_page_title_breadcrumbs(course_name())}
<%static:css group='style-student-notes'/> <%static:css group='style-student-notes'/>
% endif % endif
<%block name="nav_skip">${"#seq_content" if section_title else "#course-content"}</%block> <%block name="nav_skip">${"#content" if section_title else "#content"}</%block>
<%include file="../discussion/_js_head_dependencies.html" /> <%include file="../discussion/_js_head_dependencies.html" />
${fragment.head_html()} ${fragment.head_html()}
......
lms/templates/courseware/progress.html
...@@ -18,7 +18,7 @@ from django.utils.http import urlquote_plus ...@@ -18,7 +18,7 @@ from django.utils.http import urlquote_plus
<%namespace name="progress_graph" file="/courseware/progress_graph.js"/> <%namespace name="progress_graph" file="/courseware/progress_graph.js"/>
<%block name="pagetitle">${_("{course_number} Progress").format(course_number=course.display_number_with_default) | h}</%block> <%block name="pagetitle">${_("{course_number} Progress").format(course_number=course.display_number_with_default) | h}</%block>
<%block name="nav_skip">#course-info-progress</%block> <%block name="nav_skip">#content</%block>
<%block name="js_extra"> <%block name="js_extra">
<script type="text/javascript" src="${static.url('js/vendor/flot/jquery.flot.js') | h}"></script> <script type="text/javascript" src="${static.url('js/vendor/flot/jquery.flot.js') | h}"></script>
......
lms/templates/dashboard.html
...@@ -74,7 +74,7 @@ import json ...@@ -74,7 +74,7 @@ import json
</div> </div>
<section class="container dashboard" id="dashboard-main"> <section class="container dashboard" id="dashboard-main">
<section class="my-courses" id="my-courses" role="main" aria-label="Content"> <section class="my-courses" id="my-courses" role="main" tabindex="-1">
<header class="wrapper-header-courses"> <header class="wrapper-header-courses">
<h2 class="header-courses">${_("My Courses")}</h2> <h2 class="header-courses">${_("My Courses")}</h2>
</header> </header>
......
lms/templates/discussion/index.html
...@@ -39,7 +39,8 @@ from django.core.urlresolvers import reverse ...@@ -39,7 +39,8 @@ from django.core.urlresolvers import reverse
data-sort-preference="${sort_preference | h}" data-sort-preference="${sort_preference | h}"
data-flag-moderator="${flag_moderator | h}" data-flag-moderator="${flag_moderator | h}"
data-user-cohort-id="${user_cohort | h}" data-user-cohort-id="${user_cohort | h}"
data-course-settings="${course_settings | h}"> data-course-settings="${course_settings | h}"
tabindex="-1">
<div class="discussion-body"> <div class="discussion-body">
<div class="forum-nav" role="complementary" aria-label="${_("Discussion thread list")}"></div> <div class="forum-nav" role="complementary" aria-label="${_("Discussion thread list")}"></div>
<div class="discussion-column" role="main" aria-label="Discussion" id="discussion-column"> <div class="discussion-column" role="main" aria-label="Discussion" id="discussion-column">
......
lms/templates/instructor/instructor_dashboard_2/instructor_dashboard_2.html
...@@ -20,7 +20,7 @@ from django.core.urlresolvers import reverse ...@@ -20,7 +20,7 @@ from django.core.urlresolvers import reverse
## 6. And tests go in lms/djangoapps/instructor/tests/ ## 6. And tests go in lms/djangoapps/instructor/tests/
<%block name="pagetitle">${_("Instructor Dashboard")}</%block> <%block name="pagetitle">${_("Instructor Dashboard")}</%block>
<%block name="nav_skip">#instructor-dashboard-content</%block> <%block name="nav_skip">#content</%block>
<%block name="headextra"> <%block name="headextra">
<%static:css group='style-course-vendor'/> <%static:css group='style-course-vendor'/>
......
lms/templates/main.html
...@@ -124,7 +124,7 @@ from branding import api as branding_api ...@@ -124,7 +124,7 @@ from branding import api as branding_api
<%include file="${static.get_template_path('header.html')}" /> <%include file="${static.get_template_path('header.html')}" />
% endif % endif
<div class="content-wrapper" id="content"> <div role="main" class="content-wrapper" id="content" tabindex="-1">
${self.body()} ${self.body()}
<%block name="bodyextra"/> <%block name="bodyextra"/>
</div> </div>
......
lms/templates/main_django.html
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
{% with course=request.course %} {% with course=request.course %}
{% include "header.html"|microsite_template_path %} {% include "header.html"|microsite_template_path %}
{% endwith %} {% endwith %}
<div class="content-wrapper" id="content"> <div role="main" class="content-wrapper" id="content" tabindex="-1">
{% block body %}{% endblock %} {% block body %}{% endblock %}
{% block bodyextra %}{% endblock %} {% block bodyextra %}{% endblock %}
</div> </div>
......
lms/templates/ux/reference/teams-base.html
...@@ -95,7 +95,7 @@ Teams | Course name ...@@ -95,7 +95,7 @@ Teams | Course name
<%block name="headextra"> <%block name="headextra">
<%static:css group='style-course-vendor'/> <%static:css group='style-course-vendor'/>
<%static:css group='style-course'/> <%static:css group='style-course'/>
<%block name="nav_skip">${"#seq_content" if section_title else "#course-content"}</%block> <%block name="nav_skip">${"#content" if section_title else "#content"}</%block>
</%block> </%block>
<%block name="js_extra"> <%block name="js_extra">
......
lms/templates/ux/reference/teams-create.html
...@@ -94,7 +94,7 @@ Create New Team | [Course name] ...@@ -94,7 +94,7 @@ Create New Team | [Course name]
<%block name="headextra"> <%block name="headextra">
<%static:css group='style-course-vendor'/> <%static:css group='style-course-vendor'/>
<%static:css group='style-course'/> <%static:css group='style-course'/>
<%block name="nav_skip">${"#seq_content" if section_title else "#course-content"}</%block> <%block name="nav_skip">${"#content" if section_title else "#content"}</%block>
</%block> </%block>
<%block name="js_extra"> <%block name="js_extra">
......
lms/templates/wiki/article.html
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<div class="article-wrapper"> <div class="article-wrapper">
<article class="main-article" id="main-article"> <article class="main-article" id="main-article" tabindex="-1">
{% if selected_tab != "edit" %} {% if selected_tab != "edit" %}
<h1>{{ article.current_revision.title }}</h1> <h1>{{ article.current_revision.title }}</h1>
......
themes/edx.org/lms/templates/dashboard.html
...@@ -75,7 +75,7 @@ import json ...@@ -75,7 +75,7 @@ import json
</div> </div>
<section class="container dashboard" id="dashboard-main"> <section class="container dashboard" id="dashboard-main">
<section class="my-courses" id="my-courses" role="main" aria-label="Content"> <section class="my-courses" id="my-courses" role="main" aria-label="Content" tabindex="-1">
<header class="wrapper-header-courses"> <header class="wrapper-header-courses">
<h2 class="header-courses">${_("My Courses")}</h2> <h2 class="header-courses">${_("My Courses")}</h2>
</header> </header>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment