tcitcs/pa11y-dashboard
2
0
Fork 0
forked from external-repos/pa11y-dashboard
Code Pull Requests Activity

Fixed the a11y errors on Pa11y dashboard results and add new url page (#285)

Browse Source 
* Fixed the a11y errors on Pa11y dashboard results page and add new url page.

* Removed few more unnecessary roles along with Holli's suggestions implemented.

* Added close button ARIA label

Co-authored-by: Hollie Kay <1948361+hollsk@users.noreply.github.com>

Co-authored-by: Hollie Kay <1948361+hollsk@users.noreply.github.com>
This commit is contained in:
Sangita Mane
2021-05-26 16:38:38 +02:00
committed by GitHub
parent 6d4b8c9676
commit 4c0bd924ab
13 changed files with 67 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
view/partial/result.html
View File

@@ -40,12 +40,14 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
<h2 class="h4">
<span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>&nbsp;&nbsp;{{date-format task.lastResult.date format="DD MMM YYYY"}}
</h2>
<h3 class="h5 show-stats">Select a date to show stats for:</h3>
<ul role="navigation" class="dates-list">
{{#results}}
<li><a class="" href="{{href}}">{{date-format date format="DD MMM YYYY"}}</a></li>
{{/results}}
</ul>
<h3 class="h5 show-stats" id="dates-navigation">Select a date to show stats for:</h3>
<nav aria-labelledby="dates-navigation">
<ul class="dates-list">
{{#results}}
<li><a class="" href="{{href}}">{{date-format date format="DD MMM YYYY"}}</a></li>
{{/results}}
</ul>
</nav>
</div>
</div>
</div>
@@ -61,7 +63,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
</div>
</div>
<div class="col-md-9" role="main">
<div class="col-md-9">
<ul class="nav nav-tabs category-list" role="tablist">
<li class="category-list__item category-list__item_type_error active" role="presentation">
<a class="category-list__link" id="errors" href="#errors-list" aria-controls="errors-list" role="tab" data-toggle="tab" data-test="task-errors">
@@ -116,10 +118,10 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
<div class="task-details collapse" id="error-index-{{@index}}">
{{#if solutions.length}}
<div class="subtitle" id="error-solutions">Solutions:</div>
<ul class="list-unstyled solutions-list" role="list" aria-labelledby="error-solutions">
<div class="subtitle">Solutions:</div>
<ul class="list-unstyled solutions-list">
{{#each solutions}}
<li class="list-unstyled__item" role="listitem">
<li class="list-unstyled__item">
<a class="link" href="{{url}}" target="_blank">
<span class="glyphicon glyphicon-share" aria-hidden="true"></span>&nbsp;{{title}}
</a>
@@ -129,10 +131,10 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
{{/if}}
{{#if items.length}}
<div class="subtitle" id="error-selectors">Selectors:</div>
<ul class="list-unstyled selectors-list" role="list" aria-labelledby="error-selectors">
<div class="subtitle">Selectors:</div>
<ul class="list-unstyled selectors-list">
{{#each items}}
<li class="list-unstyled__item" role="listitem">
<li class="list-unstyled__item">
<span title="Context" data-role="context-popover" data-toggle="popover" data-content="{{context}}">
<code class="code">{{selector}}</code>
</span>
@@ -182,10 +184,10 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
<div class="task-details collapse" id="warning-index-{{@index}}">
{{#if solutions.length}}
<div class="subtitle" id="warning-solutions">Solutions:</div>
<ul class="list-unstyled solutions-list" role="list" aria-labelledby="warning-solutions">
<div class="subtitle">Solutions:</div>
<ul class="list-unstyled solutions-list">
{{#each solutions}}
<li class="list-unstyled__item" role="listitem">
<li class="list-unstyled__item">
<a class="link" href="{{url}}" target="_blank">
<span class="glyphicon glyphicon-share" aria-hidden="true"></span>&nbsp;{{title}}
</a>
@@ -195,10 +197,10 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
{{/if}}
{{#if items.length}}
<div class="subtitle" id="warning-selectors">Selectors:</div>
<ul class="list-unstyled selectors-list" role="list" aria-labelledby="warning-selectors">
<div class="subtitle">Selectors:</div>
<ul class="list-unstyled selectors-list">
{{#each items}}
<li class="list-unstyled__item" role="listitem">
<li class="list-unstyled__item">
<span title="Context" data-role="context-popover" data-toggle="popover" data-content="{{context}}">
<code class="code">{{selector}}</code>
</span>
@@ -248,10 +250,10 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
<div class="task-details collapse" id="notice-index-{{@index}}">
{{#if solutions.length}}
<div class="subtitle" id="notice-solutions">Solutions:</div>
<ul class="list-unstyled solutions-list" role="list" aria-labelledby="notice-solutions">
<div class="subtitle">Solutions:</div>
<ul class="list-unstyled solutions-list">
{{#each solutions}}
<li class="list-unstyled__item" role="listitem">
<li class="list-unstyled__item">
<a class="link" href="{{url}}" target="_blank">
<span class="glyphicon glyphicon-share" aria-hidden="true"></span>&nbsp;{{title}}
</a>
@@ -261,10 +263,10 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
{{/if}}
{{#if items.length}}
<div class="subtitle" id="notice-selectors">Selectors:</div>
<ul class="list-unstyled selectors-list" role="list" aria-labelledby="notice-selectors">
<div class="subtitle">Selectors:</div>
<ul class="list-unstyled selectors-list">
{{#each items}}
<li class="list-unstyled__item" role="listitem">
<li class="list-unstyled__item">
<span title="Context" data-role="context-popover" data-toggle="popover" data-content="{{context}}">
<code class="code">{{selector}}</code>
</span>