Packages

excessibility

0.10.2
0.14.0 0.13.0 0.12.1 0.12.0 0.11.0 0.10.2 0.10.1 0.10.0 0.9.0 0.8.6 0.8.5 0.8.4 0.8.3 0.8.2 0.8.1 0.8.0 0.7.0 0.6.1 0.6.0 0.5.13 0.5.12 0.5.11 0.5.10 0.5.9 0.5.8 0.5.7 0.5.6 0.5.5 0.5.4 0.5.3 0.5.2 0.5.1 0.5.0 0.4.0 0.3.0 0.2.0 0.1.0

Library for accessibility snapshot testing in Phoenix applications using axe-core and Playwright.

HexDocs

Current section

Files

Jump to
Readme
37 Versions
6 Dependencies
Dependants
Files
Activity
excessibility assets node_modules pa11y lib reporters report.html
Raw

assets/node_modules/pa11y/lib/reporters/report.html 

<!DOCTYPE html>

<html lang="en">

<head>



	<meta charset="utf-8"/>

	<title>Accessibility Report For "{{& pageUrl}}" ({{date}})</title>



	<style>



		html, body {

			margin: 0;

			padding: 0;

			background-color: #fff;

			font-family: Arial, Helvetica, sans-serif;

			font-size: 16px;

			line-height: 22px;

			color: #333;

		}

		li {

			margin-bottom: 15px;

		}

		h1, h2, p, pre, ul {

			margin-top: 0;

			margin-bottom: 0;

		}

		h1 {

			margin-bottom: 10px;

			font-size: 24px;

			line-height: 24px;

		}

		h2 {

			font-size: 16px;

		}

		pre {

			white-space: pre-wrap;

			overflow: auto;

		}



		.page {

			max-width: 800px;

			margin: 0 auto;

			padding: 25px;

		}



		.counts {

			margin-top: 30px;

			font-size: 20px;

		}

		.count {

			display: inline-block;

			padding: 5px;

			border-radius: 5px;

			border: 1px solid #eee;

		}



		.clean-list {

			margin-left: 0;

			padding-left: 0;

			list-style: none;

		}

		.results-list {

			margin-top: 30px;

		}



		.result {

			padding: 10px;

			border-radius: 5px;

			border: 1px solid #eee;

		}

		.error {

			background-color: #fdd;

			border-color: #ff9696;

		}

		.warning {

			background-color: #ffd;

			border-color: #e7c12b;

		}

		.notice {

			background-color: #eef4ff;

			border-color: #b6d0ff;

		}



	</style>



</head>

<body>



	<div class="page">



		<h1>Accessibility Report For "{{& pageUrl}}"</h1>

		<p>Generated at: {{date}}</p>



		<p class="counts">

			<span class="count error">{{errorCount}} errors</span>

			<span class="count warning">{{warningCount}} warnings</span>

			<span class="count notice">{{noticeCount}} notices</span>

		</p>



		<ul class="clean-list results-list">

			{{#issues}}

			<li class="result {{type}}">

				<h2>{{typeLabel}}: {{message}}</h2>

				<p>{{code}}</p>

				<pre>{{context}} (select with "{{selector}}")</pre>

			</li>

			{{/issues}}

		</ul>



	</div>



</body>

</html>