A11y fixes for pa11y dashboard pages. (#306)

* 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

View File

@@ -16,13 +16,13 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
}}
{{#content "title"}}
{{task.name}} - {{simplify-url task.url}} ({{task.standard}})
Pa11y Dashboard Results for {{task.name}} - ({{task.standard}})
{{/content}}
{{#added}}
<div class="col-md-12 clearfix" data-test="alert">
<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>
<p>Your new URL has been added.</p>
</div>
@@ -32,7 +32,7 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
{{#running}}
<div class="col-md-12 clearfix" data-test="alert">
<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>
<p>
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}}
<div class="col-md-12 clearfix" data-test="alert">
<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>
<p>
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}}
<div class="col-md-12 clearfix" data-test="alert">
<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>
<p>
You've removed an ignored accessibility rule for this URL.