external-repos/pa11y-dashboard
2
0
Fork 1
mirror of https://github.com/pa11y/pa11y-dashboard.git synced 2025-09-25 06:41:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

A11y fixes for pa11y dashboard pages. (#306)

Browse Source 
* First draft of a11y fixes.

* Amended results title

* Amended results title (again)

* Back to top keyboard operation

Removed the 'data-role="top"' attribute, which implemented a cool animation to scroll to top but prevented the default behaviour, resulting in the keyboard focus not going back to top.

* Options Button

Fix to have a working options button, but using the mouse only. This is not a good solution because it cannot be operated via the keyboard.

* Fixed options menu css.

* Results view layout changes

* Undoing layout changes

* Graph layout fixes.

* Skip Rules Link

Added a link to skip the list of rules, which can get very long and annoying for any keyboard user not interested in selecting a rule. Most probably, implementing a collapsible list of rules would be a better solution here.

Co-authored-by: Carlos Muncharaz <carlos@muncharaz.eu>
This commit is contained in:
Sangita Mane
2022-10-11 14:17:43 +02:00
committed by GitHub
parent b9b049ec2b
commit 5202f59008
19 changed files with 8817 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
data/standards.js
View File

@@ -805,7 +805,7 @@ function getStandards() {
description: 'This element\'s text is placed on a background image. Ensure the contrast ratio between the text and all covered parts of the image are at least 4.5:1.' description: 'This element\'s text is placed on a background image. Ensure the contrast ratio between the text and all covered parts of the image are at least 4.5:1.'
}, },
{ {
name: 'WCAG2AA.Principle1.Guideline1_4.1_4_3.G145 ', name: 'WCAG2AA.Principle1.Guideline1_4.1_4_3.G1451',
description: 'This element\'s text is placed on a background image. Ensure the contrast ratio between the text and all covered parts of the image are at least 3:1.' description: 'This element\'s text is placed on a background image. Ensure the contrast ratio between the text and all covered parts of the image are at least 3:1.'
}, },
{ {
@@ -1430,11 +1430,11 @@ function getStandards() {
description: 'This element has insufficient contrast at this conformance level. Expected a contrast ratio of at least 4.5:1, but text in this element has a contrast ratio of /{value/}. Recommendation: /{colour recommendations/}.' description: 'This element has insufficient contrast at this conformance level. Expected a contrast ratio of at least 4.5:1, but text in this element has a contrast ratio of /{value/}. Recommendation: /{colour recommendations/}.'
}, },
{ {
name: 'WCAG2AAA.Principle1.Guideline1_4.1_4_6.G17 ', name: 'WCAG2AAA.Principle1.Guideline1_4.1_4_6.G17-1',
description: 'This element\'s text is placed on a background image. Ensure the contrast ratio between the text and all covered parts of the image are at least 7:1.' description: 'This element\'s text is placed on a background image. Ensure the contrast ratio between the text and all covered parts of the image are at least 7:1.'
}, },
{ {
name: 'WCAG2AAA.Principle1.Guideline1_4.1_4_6.G18 ', name: 'WCAG2AAA.Principle1.Guideline1_4.1_4_6.G18-1',
description: 'This element\'s text is placed on a background image. Ensure the contrast ratio between the text and all covered parts of the image are at least 4.5:1.' description: 'This element\'s text is placed on a background image. Ensure the contrast ratio between the text and all covered parts of the image are at least 4.5:1.'
}, },
{ {

8675
package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

2
public/css/site.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
public/js/site.min.js vendored
View File

File diff suppressed because one or more lines are too long

4
public/js/vendor/bootstrap/_layouts/default.html vendored
View File

@@ -43,9 +43,9 @@
</ul> </ul>
</div> </div>
</div> </div>
<div class="col-md-9" role="main"> <main class="col-md-9" role="main">
{{ content }} {{ content }}
</div> </main>
</div> </div>
</div> </div>

2
public/js/vendor/bootstrap/js/tab.js vendored
View File

@@ -68,10 +68,12 @@
function next() { function next() {
$active $active
.removeClass('active') .removeClass('active')
.attr('aria-selected', false)
.find('> .dropdown-menu > .active') .find('> .dropdown-menu > .active')
.removeClass('active') .removeClass('active')
element.addClass('active') element.addClass('active')
element.attr('aria-selected', true)
if (transition) { if (transition) {
element[0].offsetWidth // reflow for transition element[0].offsetWidth // reflow for transition

2
public/js/vendor/bootstrap/js/tests/unit/alert.js vendored
View File

@@ -32,7 +32,7 @@ $(function () {
$.support.transition = false $.support.transition = false
var alertHTML = '<div class="alert-message warning fade in">' var alertHTML = '<div class="alert-message warning fade in">'
+ '<a class="close" href="#" data-dismiss="alert">×</a>' + '<a class="close" href="#" data-dismiss="alert" aria-label="Close">×</a>'
+ '<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>' + '<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>'
+ '</div>' + '</div>'
, alert = $(alertHTML).appendTo('#qunit-fixture').alert() , alert = $(alertHTML).appendTo('#qunit-fixture').alert()

24
public/less/site.less
View File

@@ -95,6 +95,11 @@
li a { li a {
text-indent: -20px; text-indent: -20px;
} }
ul.options-menu {
list-style: none;
padding: 5px 0;
margin: 2px 10px 0 0;
}
} }
.dropdown-toggle { .dropdown-toggle {
@@ -262,6 +267,7 @@
} }
/* Task details page*/ /* Task details page*/
.task-header { .task-header {
margin-bottom: 30px; margin-bottom: 30px;
@@ -502,6 +508,10 @@ ul.date-links {
padding: 0; padding: 0;
margin: 0; margin: 0;
} }
.dates-list > li:first-child a {
font-weight: bold;
font-size: 16px;
}
.dates-list a { .dates-list a {
color: #fff; color: #fff;
@@ -709,6 +719,16 @@ ul.date-links {
} }
} }
/* Edit task page */
#skipRules {
position: absolute;
left: -999px;
}
#skipRules:focus {
position: static;
}
/* inline link list */ /* inline link list */
.inline-list { .inline-list {
@@ -760,3 +780,7 @@ ul.date-links {
opacity: 1; opacity: 1;
}; };
} }
section {
margin: 1em 0;
}

1
route/new.js
View File

@@ -1,3 +1,4 @@
/* eslint-disable complexity */
// This file is part of Pa11y Dashboard. // This file is part of Pa11y Dashboard.
// //
// Pa11y Dashboard is free software: you can redistribute it and/or modify // Pa11y Dashboard is free software: you can redistribute it and/or modify

8
view/layout/default.html
View File

@@ -47,19 +47,17 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
{{> breadcrumb}} {{> breadcrumb}}
<div class="container"> <main class="container" >
{{#if readonly}} {{#if readonly}}
<div class="row readonly-mode"> <div class="row readonly-mode">
{{else}} {{else}}
<div class="row"> <div class="row">
{{/if}} {{/if}}
<section> <div class="section">
<div class="section" role="main">
{{{body}}} {{{body}}}
</div> </div>
</section>
</div>
</div> </div>
</main>
{{> page-footer}} {{> page-footer}}

13
view/new.html
View File

@@ -78,8 +78,8 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
<div class="row"> <div class="row">
<div class="col-md-4 col-sm-4 col-xs-6"> <div class="col-md-4 col-sm-4 col-xs-6">
<label class="control-label" for="new-task-wait">Wait (milliseconds)</label> <label class="control-label" for="new-task-wait">Wait (milliseconds)</label>
<input class="form-control" id="new-task-wait" type="text" placeholder="E.g. 3000" name="wait" value="{{task.wait}}"/> <input class="form-control" id="new-task-wait" type="text" placeholder="E.g. 3000" name="wait" value="{{task.wait}}" aria-describedby="int3"/>
<em>(Note: default wait time is 0ms)</em> <em id="int3">(Note: default wait time is 0ms)</em>
</div> </div>
</div> </div>
</div> </div>
@@ -110,7 +110,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
<div class="row"> <div class="row">
<div class="col-md-4 col-sm-4 col-xs-6"> <div class="col-md-4 col-sm-4 col-xs-6">
<label class="control-label" for="new-task-password">Password</label> <label class="control-label" for="new-task-password">Password</label>
<input class="form-control" id="new-task-password" type="text" name="password" value="{{task.password}}"/> <em>(Note: this will be stored and displayed in plain-text - only suitable for use in a secure environment)</em> <input class="form-control" id="new-task-password" type="text" name="password" value="{{task.password}}" aria-describedby="pwd"/> <span id="pwd"><em>(Note: this will be stored and displayed in plain-text - only suitable for use in a secure environment)</em></span>
</div> </div>
</div> </div>
</div> </div>
@@ -119,8 +119,8 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
<div class="row"> <div class="row">
<div class="col-md-4 col-sm-4 col-xs-6"> <div class="col-md-4 col-sm-4 col-xs-6">
<label class="control-label" for="new-task-headers">HTTP Headers</label> <label class="control-label" for="new-task-headers">HTTP Headers</label>
<textarea class="form-control" id="new-task-headers" name="headers" placeholder="Cookie: foo=bar">{{task.headers}}</textarea> <textarea class="form-control" id="new-task-headers" name="headers" placeholder="Cookie: foo=bar" aria-describedby="int1">{{task.headers}}</textarea>
<em>(As key/value pairs, separated by newlines/colons)</em> <em id="int1">(As key/value pairs, separated by newlines/colons)</em>
</div> </div>
</div> </div>
</div> </div>
@@ -129,7 +129,8 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
<div class="row"> <div class="row">
<div class="col-md-4 col-sm-4 col-xs-6"> <div class="col-md-4 col-sm-4 col-xs-6">
<label class="control-label" for="new-task-hide-elements">Hide Elements</label> <label class="control-label" for="new-task-hide-elements">Hide Elements</label>
<input class="form-control" id="new-task-hide-elements" type="text" name="hideElements" value="{{task.hideElements}}" placeholder=".advert, #modal, div[aria-role=presentation]"/> <em>(CSS selector)</em> <input class="form-control" id="new-task-hide-elements" type="text" name="hideElements" value="{{task.hideElements}}" placeholder=".advert, #modal, div[aria-role=presentation]" aria-describedby="int2"/>
<em id="int2">(CSS selector)</em>
</div> </div>
</div> </div>
</div> </div>

5
view/partial/breadcrumb.html
View File

@@ -15,9 +15,10 @@ You should have received a copy of the GNU General Public License
along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>. along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
}} }}
{{#unless isHomePage}} {{#unless isHomePage}}
<div class="container"> <nav class="container" aria-labelledby="breadcrumb">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<h2 id="breadcrumb" class="sr-only">Breadcrumb Navigation</h2>
<ol class="breadcrumb"> <ol class="breadcrumb">
<li><a href="/">Dashboard</a></li> <li><a href="/">Dashboard</a></li>
{{#if isNewTaskPage}} {{#if isNewTaskPage}}
@@ -36,5 +37,5 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
</ol> </ol>
</div> </div>
</div> </div>
</div> </nav>
{{/unless}} {{/unless}}

6
view/partial/graph.html
View File

@@ -18,9 +18,8 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
<div class="graph-container graph-spacer ruled clearfix"> <div class="graph-container graph-spacer ruled clearfix">
<div class="row"> <div class="row">
<div class="col-md-3 col-sm-4 col-xs-3"> <div class="col-md-3 col-sm-4 col-xs-3">
<span class="btn btn-sm btn-default btn-full-width btn_action_export">Export graph</span> <button class="btn btn-sm btn-default btn-full-width btn_action_export" type="button">Export graph</button>
</div> </div>
<div class="col-md-5 col-sm-6 col-xs-9 pull-right"> <div class="col-md-5 col-sm-6 col-xs-9 pull-right">
<ul class="list-unstyled floated-list series-checkboxes clearfix" data-role="series-checkboxes"></ul> <ul class="list-unstyled floated-list series-checkboxes clearfix" data-role="series-checkboxes"></ul>
</div> </div>
@@ -59,7 +58,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
</div> </div>
</div> </div>
<button data-role='zoom-reset' class="btn btn-xs btn-primary pull-right btn-reset hidden">Reset Zoom <i class="glyphicon glyphicon-zoom-out"></i></button> <button data-role='zoom-reset' class="btn btn-xs btn-primary pull-right btn-reset hidden">Reset Zoom <i class="glyphicon glyphicon-zoom-out"></i></button>
</div>
</div> </div>
<div class="col-md-12 hidden"> <div class="col-md-12 hidden">
@@ -87,3 +86,4 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
</table> </table>
</div> </div>
</div> </div>
</div>

42
view/partial/result.html
View File

@@ -32,15 +32,14 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
</div> </div>
</div> </div>
</div> </div>
<div class="row date-selector-row"> <div class="row date-selector-row">
<div id="top" class="col-md-12 col-sm-12 clearfix"> <div class="col-md-12 col-sm-12 clearfix">
<div class="well dark-well"> <div class="well dark-well">
<div class="date-selector"> <div class="date-selector">
<div class="btn-group block-level clearfix"> <div class="btn-group block-level clearfix">
<h2 class="h4">
<span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>&nbsp;&nbsp;{{date-format task.lastResult.date format="DD MMM YYYY"}} <h2 class="h3" id="dates-navigation">Select a date to show stats for: <span class="glyphicon glyphicon-calendar"></span></h2>
</h2>
<h3 class="h5 show-stats" id="dates-navigation">Select a date to show stats for:</h3>
<nav aria-labelledby="dates-navigation"> <nav aria-labelledby="dates-navigation">
<ul class="dates-list"> <ul class="dates-list">
{{#results}} {{#results}}
@@ -56,31 +55,32 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
<div class="row"> <div class="row">
<div class="col-md-12 col-sm-12 clearfix"> <div class="col-md-12 col-sm-12 clearfix">
<div class="well"> <div class="well">
<h4 class="crunch-top">View results in browser</h4> <h2 class="crunch-top h3">View results in browser</h2>
<p class="crunch-bottom">Pa11y uses HTML_CodeSniffer to find accessibility issues. <a href="http://squizlabs.github.io/HTML_CodeSniffer/">Use their bookmarklet</a> to view results on the page you are testing.</p> <p class="crunch-bottom">Pa11y uses HTML_CodeSniffer to find accessibility issues. <a href="http://squizlabs.github.io/HTML_CodeSniffer/">Use their bookmarklet</a> to view results on the page you are testing.</p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-9"> <section class="col-md-9" id="top">
<ul class="nav nav-tabs category-list" role="tablist"> <h2 id="tabSectionHeading" class="crunch-top">Results</h2>
<li class="category-list__item category-list__item_type_error active" role="presentation"> <ul class="nav nav-tabs category-list" aria-labelledby="tabSectionHeading" role="tablist">
<li class="category-list__item category-list__item_type_error active" aria-selected="true" 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"> <a class="category-list__link" id="errors" href="#errors-list" aria-controls="errors-list" role="tab" data-toggle="tab" data-test="task-errors">
Errors ( {{mainResult.count.error}} ) Errors ( {{mainResult.count.error}} )
</a> </a>
</li> </li>
<li class="category-list__item category-list__item_type_warning" role="presentation"> <li class="category-list__item category-list__item_type_warning" aria-selected="false" role="presentation">
<a class="category-list__link" id="warnings" href="#warnings-list" aria-controls="warnings-list" role="tab" data-toggle="tab" data-test="task-warnings"> <a class="category-list__link" id="warnings" href="#warnings-list" aria-controls="warnings-list" role="tab" data-toggle="tab" data-test="task-warnings">
Warnings ( {{mainResult.count.warning}} ) Warnings ( {{mainResult.count.warning}} )
</a> </a>
</li> </li>
<li class="category-list__item category-list__item_type_notice" role="presentation"> <li class="category-list__item category-list__item_type_notice" aria-selected="false" role="presentation">
<a class="category-list__link" id="notices" href="#notices-list" aria-controls="notices-list" role="tab" data-toggle="tab" data-test="task-notices"> <a class="category-list__link" id="notices" href="#notices-list" aria-controls="notices-list" role="tab" data-toggle="tab" data-test="task-notices">
Notices ( {{mainResult.count.notice}} ) Notices ( {{mainResult.count.notice}} )
</a> </a>
</li> </li>
<li class="category-list__item category-list__item_type_ignore" role="presentation"> <li class="category-list__item category-list__item_type_ignore" aria-selected="false" role="presentation">
<a class="category-list__link" id="ignore" href="#ignore-list" aria-controls="ignore-list" role="tab" data-toggle="tab"> <a class="category-list__link" id="ignore" href="#ignore-list" aria-controls="ignore-list" role="tab" data-toggle="tab">
Ignored rules ( {{mainResult.ignore.length}} ) Ignored rules ( {{mainResult.ignore.length}} )
</a> </a>
@@ -88,7 +88,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
</ul> </ul>
<div class="tab-content"> <div class="tab-content">
<div id="errors-list" role="tabpanel" class="tab-pane tasks-list fade in active"> <div id="errors-list" role="tabpanel" class="tab-pane tasks-list fade in active" aria-labelledby="errors">
{{#if mainResult.count.error}} {{#if mainResult.count.error}}
{{#mainResult.errors}} {{#mainResult.errors}}
<div class="panel panel-default task task_type_error"> <div class="panel panel-default task task_type_error">
@@ -147,14 +147,14 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
</div> </div>
{{/mainResult.errors}} {{/mainResult.errors}}
<div class="to-top"> <div class="to-top">
<a class="link" href="#top" data-role="top"><span class="glyphicon glyphicon-chevron-up" aria-hidden="true"></span>Back to top</a> <a class="link" href="#top"><span class="glyphicon glyphicon-chevron-up" aria-hidden="true"></span>Back to top</a>
</div> </div>
{{else}} {{else}}
<div class="text">Well done! You have 0 errors. <span class="glyphicon glyphicon-ok pull-right" aria-hidden="true"></span></div> <div class="text">Well done! You have 0 errors. <span class="glyphicon glyphicon-ok pull-right" aria-hidden="true"></span></div>
{{/if}} {{/if}}
</div> </div>
<div id="warnings-list" role="tabpanel" class="tab-pane tasks-list fade"> <div id="warnings-list" role="tabpanel" class="tab-pane tasks-list fade" aria-labelledby="warning">
{{#if mainResult.count.warning}} {{#if mainResult.count.warning}}
{{#mainResult.warnings}} {{#mainResult.warnings}}
<div class="panel panel-default task task_type_warning"> <div class="panel panel-default task task_type_warning">
@@ -213,14 +213,14 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
</div> </div>
{{/mainResult.warnings}} {{/mainResult.warnings}}
<div class="to-top"> <div class="to-top">
<a class="link" href="#top" data-role="top"><span class="glyphicon glyphicon-chevron-up" aria-hidden="true"></span>Back to top</a> <a class="link" href="#top"><span class="glyphicon glyphicon-chevron-up" aria-hidden="true"></span>Back to top</a>
</div> </div>
{{else}} {{else}}
<div class="text">Well done! You have 0 warnings. <span class="glyphicon glyphicon-ok pull-right" aria-hidden="true"></span></div> <div class="text">Well done! You have 0 warnings. <span class="glyphicon glyphicon-ok pull-right" aria-hidden="true"></span></div>
{{/if}} {{/if}}
</div> </div>
<div id="notices-list" role="tabpanel" class="tab-pane tasks-list fade"> <div id="notices-list" role="tabpanel" class="tab-pane tasks-list fade" aria-labelledby="notices">
{{#if mainResult.count.notice}} {{#if mainResult.count.notice}}
{{#mainResult.notices}} {{#mainResult.notices}}
<div class="panel panel-default task task_type_notice"> <div class="panel panel-default task task_type_notice">
@@ -279,14 +279,14 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
</div> </div>
{{/mainResult.notices}} {{/mainResult.notices}}
<div class="to-top"> <div class="to-top">
<a class="link" href="#top" data-role="top"><span class="glyphicon glyphicon-chevron-up" aria-hidden="true"></span>Back to top</a> <a class="link" href="#top"><span class="glyphicon glyphicon-chevron-up" aria-hidden="true"></span>Back to top</a>
</div> </div>
{{else}} {{else}}
<div class="text">Well done! You have 0 notices. <span class="glyphicon glyphicon-ok pull-right" aria-hidden="true"></span></div> <div class="text">Well done! You have 0 notices. <span class="glyphicon glyphicon-ok pull-right" aria-hidden="true"></span></div>
{{/if}} {{/if}}
</div> </div>
<div id="ignore-list" role="tabpanel" class="tab-pane tasks-list fade"> <div id="ignore-list" role="tabpanel" class="tab-pane tasks-list fade" aria-labelledby="ignore">
{{#if mainResult.ignore.length}} {{#if mainResult.ignore.length}}
{{#mainResult.ignore}} {{#mainResult.ignore}}
<div class="panel panel-default task task_type_ignore"> <div class="panel panel-default task task_type_ignore">
@@ -316,11 +316,11 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
</div> </div>
{{/mainResult.ignore}} {{/mainResult.ignore}}
<div class="to-top"> <div class="to-top">
<a class="link" href="#top" data-role="top"><span class="glyphicon glyphicon-chevron-up" aria-hidden="true"></span>Back to top</a> <a class="link" href="#top"><span class="glyphicon glyphicon-chevron-up" aria-hidden="true"></span>Back to top</a>
</div> </div>
{{else}} {{else}}
<div class="text">You have no ignored rules.</div> <div class="text">You have no ignored rules.</div>
{{/if}} {{/if}}
</div> </div>
</div> </div>
</div> </section>

4
view/partial/task-header.html
View File

@@ -14,7 +14,7 @@ GNU General Public License for more details.
You should have received a copy of the GNU General Public License You should have received a copy of the GNU General Public License
along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>. along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
}} }}
<div class="col-md-12 zfix"> <section class="col-md-12 zfix">
<div class="ruled task-header"> <div class="ruled task-header">
<div class="row clearfix"> <div class="row clearfix">
<div class="col-md-12"> <div class="col-md-12">
@@ -41,4 +41,4 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
</div> </div>
</div> </div>
</div> </div>
</div> </section>

6
view/partial/tasks.html
View File

@@ -25,7 +25,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
<li class="col-md-4 col-sm-6 task-card add-task"> <li class="col-md-4 col-sm-6 task-card add-task">
<a class="well task-card-link crunch-bottom" data-role="add-task" href="/new" data-test="add-task"> <a class="well task-card-link crunch-bottom" data-role="add-task" href="/new" data-test="add-task">
<p class="h3 crunch">Add new URL</p> <p class="h3 crunch">Add new URL</p>
<p class="supersize-me crunch">+</p> <p class="supersize-me crunch" aria-hidden="true">+</p>
</a> </a>
</li> </li>
{{/unless}} {{/unless}}
@@ -56,8 +56,8 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
{{#unless ../readonly}} {{#unless ../readonly}}
<div class="btn-group options-button text-right"> <div class="btn-group options-button text-right">
<button type="button" class="btn btn-info btn-xs dropdown-toggle" data-toggle="dropdown"><span class="sr-only">Options</span><span class="glyphicon glyphicon-cog"></span></button> <button type="button" class="btn btn-info btn-xs dropdown-toggle" data-toggle="dropdown"><span class="sr-only">Options</span><span class="glyphicon glyphicon-cog"></span></button>
<nav aria-label="task tools"> <nav class="dropdown-menu pull-right" aria-label="task tools">
<ul class="dropdown-menu pull-right"> <ul class="options-menu">
<li><a href="{{href}}/edit">Edit this task</a></li> <li><a href="{{href}}/edit">Edit this task</a></li>
<li><a href="{{href}}/delete">Delete this task</a></li> <li><a href="{{href}}/delete">Delete this task</a></li>
<li class="divider"></li> <li class="divider"></li>

2
view/result/index.html
View File

@@ -16,7 +16,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
}} }}
{{#content "title"}} {{#content "title"}}
{{task.name}} - {{simplify-url task.url}} ({{task.standard}}) - {{date-format mainResult.date format="DD MMM YYYY"}} Pa11y Dashboard Results - {{task.name}} - {{date-format mainResult.date format="DD MMM YYYY"}}
{{/content}} {{/content}}
{{> result-header}} {{> result-header}}

6
view/task/edit.html
View File

@@ -22,7 +22,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
{{#edited}} {{#edited}}
<div class="col-md-12 clearfix" data-test="alert"> <div class="col-md-12 clearfix" data-test="alert">
<div class="alert alert-success"> <div class="alert alert-success">
<button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button> <button aria-hidden="true" data-dismiss="alert" class="close" type="button" aria-label="Close">×</button>
<strong>Success!</strong> <strong>Success!</strong>
<p>Your changes have been saved.</p> <p>Your changes have been saved.</p>
</div> </div>
@@ -146,7 +146,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
</div> </div>
</div> </div>
<p class="control-label"><b>Ignore these rules</b> <a target="_blank" href="https://github.com/pa11y/pa11y/wiki/HTML-CodeSniffer-Rules">(full list of rules here)</a></p> <p class="control-label"><b>Ignore these rules</b> (<a target="_blank" href="https://github.com/pa11y/pa11y/wiki/HTML-CodeSniffer-Rules">full list of rules here</a>) <a href="#submitEditBtn" id="skipRules">Skip list of rules</a></p>
<div class="standards-lists"> <div class="standards-lists">
{{#standards}} {{#standards}}
@@ -166,7 +166,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
{{/standards}} {{/standards}}
</div> </div>
<button type="submit" class="btn btn-success">Save changes <span class="glyphicon glyphicon-save"></span></button> <button type="submit" id="submitEditBtn" class="btn btn-success">Save changes <span class="glyphicon glyphicon-save"></span></button>
<a href="/{{task.id}}/edit" class="btn btn-primary">Undo <span class="glyphicon glyphicon-refresh"></span></a> <a href="/{{task.id}}/edit" class="btn btn-primary">Undo <span class="glyphicon glyphicon-refresh"></span></a>
</form> </form>

10
view/task/index.html
View File

@@ -16,13 +16,13 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
}} }}
{{#content "title"}} {{#content "title"}}
{{task.name}} - {{simplify-url task.url}} ({{task.standard}}) Pa11y Dashboard Results for {{task.name}} - ({{task.standard}})
{{/content}} {{/content}}
{{#added}} {{#added}}
<div class="col-md-12 clearfix" data-test="alert"> <div class="col-md-12 clearfix" data-test="alert">
<div class="alert alert-success"> <div class="alert alert-success">
<button data-dismiss="alert" class="close" type="button">×</button> <button data-dismiss="alert" class="close" type="button" aria-label="Close">×</button>
<strong>Whoop whoop!</strong> <strong>Whoop whoop!</strong>
<p>Your new URL has been added.</p> <p>Your new URL has been added.</p>
</div> </div>
@@ -32,7 +32,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
{{#running}} {{#running}}
<div class="col-md-12 clearfix" data-test="alert"> <div class="col-md-12 clearfix" data-test="alert">
<div class="alert alert-success"> <div class="alert alert-success">
<button data-dismiss="alert" class="close" type="button">×</button> <button data-dismiss="alert" class="close" type="button" aria-label="Close">×</button>
<strong>New results incoming!</strong> <strong>New results incoming!</strong>
<p> <p>
New results are being generated for this URL in the background. New results are being generated for this URL in the background.
@@ -45,7 +45,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
{{#ruleIgnored}} {{#ruleIgnored}}
<div class="col-md-12 clearfix" data-test="alert"> <div class="col-md-12 clearfix" data-test="alert">
<div class="alert alert-success"> <div class="alert alert-success">
<button data-dismiss="alert" class="close" type="button">×</button> <button data-dismiss="alert" class="close" type="button" aria-label="Close">×</button>
<strong>Rule ignored!</strong> <strong>Rule ignored!</strong>
<p> <p>
You've ignored an accessibility rule for this URL. You've ignored an accessibility rule for this URL.
@@ -58,7 +58,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
{{#ruleUnignored}} {{#ruleUnignored}}
<div class="col-md-12 clearfix" data-test="alert"> <div class="col-md-12 clearfix" data-test="alert">
<div class="alert alert-success"> <div class="alert alert-success">
<button data-dismiss="alert" class="close" type="button">×</button> <button data-dismiss="alert" class="close" type="button" aria-label="Close">×</button>
<strong>Rule unignored!</strong> <strong>Rule unignored!</strong>
<p> <p>
You've removed an ignored accessibility rule for this URL. You've removed an ignored accessibility rule for this URL.