-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathpopup.html
43 lines (39 loc) · 2.46 KB
/
popup.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="cantoggle.css">
<link rel="stylesheet" type="text/css" href="popup.css">
</head>
<body>
<main>
<div>
<img src="images/alt48.png" alt>
<h1>Text Alternative Checker</h1>
</div>
<p>This feature toggles the Text Alternatives Checker to the on/off position for images found on the page.</p>
<div class="can-toggle">
<input id="showAlt" type="checkbox">
<label for="showAlt">
Text Alternative Checker
<div class="can-toggle__switch" data-checked="On" data-unchecked="Off"></div>
</label>
</div>
<h2>Key:</h2>
<dl>
<dt><img src="images/image-black.svg" width="16" height="16" alt="Icon of link indication"></dt>
<dd>An image element. Reference: <a href="https://www.w3.org/WAI/tutorials/images/" target="_blank">image</a></dd>
<dt><img src="images/link-black.svg" width="16" height="16" alt="Icon of link indication"></dt>
<dd>An image with a link wrapped around it. Reference: <a href="https://www.w3.org/WAI/tutorials/images/functional/" target="_blank">functional image</a></dd>
<dt><img src="images/caution-black.svg" width="16" height="16" alt="Icon of needs review indication"></dt>
<dd>An image with a link wrapped around it that has a text alternative which needs review for context, redundancy, and other considerations. Reference: <a href="https://www.w3.org/WAI/tutorials/images/functional/" target="_blank">functional image</a>, <a href="https://www.w3.org/TR/WCAG21/#link-purpose-in-context" target="_blank">link purpose</a> </dd>
<dt><img src="images/police-black.svg" width="16" height="16" alt="Icon of removed from API indication"></dt>
<dd>An image with a link wrapped around it that has a null value. Reference: <a href="https://www.w3.org/WAI/tutorials/images/functional/" target="_blank">functional image</a></dd>
<dt><img src="images/web-image-black.svg" width="16" height="16" alt="Icon of link indication"></dt>
<dd>Background Image. Reference: <a href="https://www.w3.org/WAI/tutorials/images/decorative/" target="_blank">decorative image</a></dd>
</dl>
<p>Does this page have an issue with the plugin? Help us track it! <a href="#" id="logIssue">Log This Page</a>. Visit our <a href="https://github.com/sethkane/textaltcheck" target="_blank">Github Page</a> to ask questions, provide feedback, and more.</p>
</main>
<script src="google.js"></script>
<script src="popup.js"></script>
</body>
</html>