@govtechsg/oobee 0.10.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (123) hide show
  1. package/.dockerignore +22 -0
  2. package/.github/pull_request_template.md +11 -0
  3. package/.github/workflows/docker-test.yml +54 -0
  4. package/.github/workflows/image.yml +107 -0
  5. package/.github/workflows/publish.yml +18 -0
  6. package/.idea/modules.xml +8 -0
  7. package/.idea/purple-a11y.iml +9 -0
  8. package/.idea/vcs.xml +6 -0
  9. package/.prettierrc.json +12 -0
  10. package/.vscode/extensions.json +5 -0
  11. package/.vscode/settings.json +10 -0
  12. package/CODE_OF_CONDUCT.md +128 -0
  13. package/DETAILS.md +163 -0
  14. package/Dockerfile +60 -0
  15. package/INSTALLATION.md +146 -0
  16. package/INTEGRATION.md +785 -0
  17. package/LICENSE +22 -0
  18. package/README.md +587 -0
  19. package/SECURITY.md +5 -0
  20. package/__mocks__/mock-report.html +1431 -0
  21. package/__mocks__/mockFunctions.ts +32 -0
  22. package/__mocks__/mockIssues.ts +64 -0
  23. package/__mocks__/mock_all_issues/000000001.json +64 -0
  24. package/__mocks__/mock_all_issues/000000002.json +53 -0
  25. package/__mocks__/mock_all_issues/fake-file.txt +0 -0
  26. package/__tests__/logs.test.ts +25 -0
  27. package/__tests__/mergeAxeResults.test.ts +278 -0
  28. package/__tests__/utils.test.ts +118 -0
  29. package/a11y-scan-results.zip +0 -0
  30. package/eslint.config.js +53 -0
  31. package/exclusions.txt +2 -0
  32. package/gitlab-pipeline-template.yml +54 -0
  33. package/jest.config.js +1 -0
  34. package/package.json +96 -0
  35. package/scripts/copyFiles.js +44 -0
  36. package/scripts/install_oobee_dependencies.cmd +13 -0
  37. package/scripts/install_oobee_dependencies.command +101 -0
  38. package/scripts/install_oobee_dependencies.ps1 +110 -0
  39. package/scripts/oobee_shell.cmd +13 -0
  40. package/scripts/oobee_shell.command +11 -0
  41. package/scripts/oobee_shell.sh +55 -0
  42. package/scripts/oobee_shell_ps.ps1 +54 -0
  43. package/src/cli.ts +401 -0
  44. package/src/combine.ts +240 -0
  45. package/src/constants/__tests__/common.test.ts +44 -0
  46. package/src/constants/cliFunctions.ts +305 -0
  47. package/src/constants/common.ts +1840 -0
  48. package/src/constants/constants.ts +443 -0
  49. package/src/constants/errorMeta.json +319 -0
  50. package/src/constants/itemTypeDescription.ts +11 -0
  51. package/src/constants/oobeeAi.ts +141 -0
  52. package/src/constants/questions.ts +181 -0
  53. package/src/constants/sampleData.ts +187 -0
  54. package/src/crawlers/__tests__/commonCrawlerFunc.test.ts +51 -0
  55. package/src/crawlers/commonCrawlerFunc.ts +656 -0
  56. package/src/crawlers/crawlDomain.ts +877 -0
  57. package/src/crawlers/crawlIntelligentSitemap.ts +156 -0
  58. package/src/crawlers/crawlLocalFile.ts +193 -0
  59. package/src/crawlers/crawlSitemap.ts +356 -0
  60. package/src/crawlers/custom/extractAndGradeText.ts +57 -0
  61. package/src/crawlers/custom/flagUnlabelledClickableElements.ts +964 -0
  62. package/src/crawlers/custom/utils.ts +486 -0
  63. package/src/crawlers/customAxeFunctions.ts +82 -0
  64. package/src/crawlers/pdfScanFunc.ts +468 -0
  65. package/src/crawlers/runCustom.ts +117 -0
  66. package/src/index.ts +173 -0
  67. package/src/logs.ts +66 -0
  68. package/src/mergeAxeResults.ts +964 -0
  69. package/src/npmIndex.ts +284 -0
  70. package/src/screenshotFunc/htmlScreenshotFunc.ts +411 -0
  71. package/src/screenshotFunc/pdfScreenshotFunc.ts +762 -0
  72. package/src/static/ejs/partials/components/categorySelector.ejs +4 -0
  73. package/src/static/ejs/partials/components/categorySelectorDropdown.ejs +57 -0
  74. package/src/static/ejs/partials/components/pagesScannedModal.ejs +70 -0
  75. package/src/static/ejs/partials/components/reportSearch.ejs +47 -0
  76. package/src/static/ejs/partials/components/ruleOffcanvas.ejs +105 -0
  77. package/src/static/ejs/partials/components/scanAbout.ejs +263 -0
  78. package/src/static/ejs/partials/components/screenshotLightbox.ejs +13 -0
  79. package/src/static/ejs/partials/components/summaryScanAbout.ejs +141 -0
  80. package/src/static/ejs/partials/components/summaryScanResults.ejs +16 -0
  81. package/src/static/ejs/partials/components/summaryTable.ejs +20 -0
  82. package/src/static/ejs/partials/components/summaryWcagCompliance.ejs +94 -0
  83. package/src/static/ejs/partials/components/topFive.ejs +6 -0
  84. package/src/static/ejs/partials/components/wcagCompliance.ejs +70 -0
  85. package/src/static/ejs/partials/footer.ejs +21 -0
  86. package/src/static/ejs/partials/header.ejs +230 -0
  87. package/src/static/ejs/partials/main.ejs +40 -0
  88. package/src/static/ejs/partials/scripts/bootstrap.ejs +8 -0
  89. package/src/static/ejs/partials/scripts/categorySelectorDropdownScript.ejs +190 -0
  90. package/src/static/ejs/partials/scripts/categorySummary.ejs +141 -0
  91. package/src/static/ejs/partials/scripts/highlightjs.ejs +335 -0
  92. package/src/static/ejs/partials/scripts/popper.ejs +7 -0
  93. package/src/static/ejs/partials/scripts/reportSearch.ejs +248 -0
  94. package/src/static/ejs/partials/scripts/ruleOffcanvas.ejs +801 -0
  95. package/src/static/ejs/partials/scripts/screenshotLightbox.ejs +71 -0
  96. package/src/static/ejs/partials/scripts/summaryScanResults.ejs +14 -0
  97. package/src/static/ejs/partials/scripts/summaryTable.ejs +78 -0
  98. package/src/static/ejs/partials/scripts/utils.ejs +441 -0
  99. package/src/static/ejs/partials/styles/bootstrap.ejs +12375 -0
  100. package/src/static/ejs/partials/styles/highlightjs.ejs +54 -0
  101. package/src/static/ejs/partials/styles/styles.ejs +1843 -0
  102. package/src/static/ejs/partials/styles/summaryBootstrap.ejs +12458 -0
  103. package/src/static/ejs/partials/summaryHeader.ejs +70 -0
  104. package/src/static/ejs/partials/summaryMain.ejs +75 -0
  105. package/src/static/ejs/report.ejs +420 -0
  106. package/src/static/ejs/summary.ejs +47 -0
  107. package/src/static/mustache/.prettierrc +4 -0
  108. package/src/static/mustache/Attention Deficit.mustache +11 -0
  109. package/src/static/mustache/Blind.mustache +11 -0
  110. package/src/static/mustache/Cognitive.mustache +7 -0
  111. package/src/static/mustache/Colorblindness.mustache +20 -0
  112. package/src/static/mustache/Deaf.mustache +12 -0
  113. package/src/static/mustache/Deafblind.mustache +7 -0
  114. package/src/static/mustache/Dyslexia.mustache +14 -0
  115. package/src/static/mustache/Low Vision.mustache +7 -0
  116. package/src/static/mustache/Mobility.mustache +15 -0
  117. package/src/static/mustache/Sighted Keyboard Users.mustache +42 -0
  118. package/src/static/mustache/report.mustache +1709 -0
  119. package/src/types/print-message.d.ts +28 -0
  120. package/src/types/types.ts +46 -0
  121. package/src/types/xpath-to-css.d.ts +3 -0
  122. package/src/utils.ts +332 -0
  123. package/tsconfig.json +15 -0
package/src/static/mustache/report.mustache ADDED
@@ -0,0 +1,1709 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head lang="en">
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1">
6
+ <title>Accessibility Report</title>
7
+ <link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;600;700&family=Ubuntu:wght@500&display=swap" rel="stylesheet">
8
+ <style>
9
+ *,
10
+ ::after,
11
+ ::before {
12
+ box-sizing: border-box;
13
+ }
14
+ body,
15
+ html {
16
+ font-family: Lato, sans-serif;
17
+ background-color: #f6f8f9;
18
+ color: #444;
19
+ }
20
+ body {
21
+ display: flex;
22
+ -webkit-box-orient: vertical;
23
+ -webkit-box-direction: normal;
24
+ -webkit-flex-direction: column;
25
+ -ms-flex-direction: column;
26
+ flex-direction: column;
27
+ -webkit-box-flex: 1;
28
+ -webkit-flex: 1 0 auto;
29
+ -ms-flex: 1 0 auto;
30
+ flex: 1 0 auto;
31
+ min-height: 100vh;
32
+ line-height: 1.5;
33
+ margin: 0;
34
+ text-align: left;
35
+ }
36
+ body.dark {
37
+ background-color: #121212 !important;
38
+ color: #e1e1e1;
39
+ }
40
+ h1 {
41
+ font-family: Ubuntu, sans-serif;
42
+ font-size: 28px;
43
+ font-weight: 700;
44
+ margin-top: 0;
45
+ margin-bottom: 0.5rem;
46
+ font-weight: 500;
47
+ line-height: 1.2;
48
+ color: #000;
49
+ }
50
+ body.dark h1 {
51
+ color: #fff;
52
+ }
53
+
54
+ h2 {
55
+ font-size: 18px;
56
+ font-weight: 700;
57
+ margin-top: 0;
58
+ margin-bottom: 1rem;
59
+ line-height: 1.2;
60
+ }
61
+ p {
62
+ font-size: 16px;
63
+ margin-top: 0;
64
+ margin-bottom: 1rem;
65
+ }
66
+ a {
67
+ color: #0b02b5;
68
+ text-decoration: none;
69
+ }
70
+ body.dark a {
71
+ color: #a68fce !important;
72
+ }
73
+ a:hover {
74
+ color: #08017e;
75
+ text-decoration: none;
76
+ }
77
+ body.dark a:hover {
78
+ color: #cfcdfe !important;
79
+ }
80
+ svg {
81
+ overflow: hidden;
82
+ vertical-align: middle;
83
+ }
84
+ hr {
85
+ margin-top: 1rem;
86
+ margin-bottom: 1rem;
87
+ border: 0;
88
+ border-top: 1px solid rgba(0, 0, 0, 0.1);
89
+ }
90
+ body.dark hr {
91
+ border-color: #383838;
92
+ }
93
+ label {
94
+ display: inline-block;
95
+ margin-bottom: 1rem;
96
+ }
97
+ input {
98
+ margin: 0;
99
+ font-family: inherit;
100
+ font-size: inherit;
101
+ line-height: inherit;
102
+ }
103
+ .form-control {
104
+ display: block;
105
+ width: 100%;
106
+ height: calc(1.5em + 0.75rem + 2px);
107
+ padding: 0.375rem 0.75rem;
108
+ font-size: 1rem;
109
+ font-weight: 400;
110
+ line-height: 1.5;
111
+ color: #495057;
112
+ background-color: #fff;
113
+ background-clip: padding-box;
114
+ border: 1px solid #ced4da;
115
+ border-radius: 0.25rem;
116
+ }
117
+ body.dark .form-control {
118
+ background-color: #333;
119
+ border: 1px solid #383838;
120
+ color: #e1e1e1;
121
+ }
122
+ .form-control:focus {
123
+ color: #444;
124
+ background-color: #fff;
125
+ border-color: #0b02b5;
126
+ box-shadow: none;
127
+ outline: 0;
128
+ }
129
+ body.dark .form-control:focus {
130
+ border-color: #A68FCE;
131
+ }
132
+ .form-control-sm {
133
+ font-size: 16px;
134
+ line-height: 1.5;
135
+ }
136
+
137
+ .header {
138
+ background-color: #fff;
139
+ box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
140
+ }
141
+ body.dark .header {
142
+ background-color: #272727;
143
+ }
144
+ .header-toggle {
145
+ text-align: right;
146
+ display: flex;
147
+ align-items: center;
148
+ justify-content: end;
149
+ }
150
+ @media (max-width: 767px) {
151
+ .header-toggle {
152
+ border-top: 1px solid #e1e7eb;
153
+ padding-top: 1.5rem !important;
154
+ margin-top: 1.5rem !important;
155
+ }
156
+ }
157
+ .show-ondark {
158
+ max-height: 0;
159
+ overflow: hidden;
160
+ padding-top: 0;
161
+ padding-bottom: 0;
162
+ border-bottom: 1px solid #e1e7eb;
163
+ }
164
+ body.dark .show-ondark {
165
+ max-height: 100px;
166
+ padding-top: 0.5rem;
167
+ padding-bottom: 0.5rem;
168
+ border-bottom: 1px solid #383838;
169
+ -webkit-transition: max-height 0.8s;
170
+ -moz-transition: max-height 0.8s;
171
+ transition: max-height 0.8s;
172
+ }
173
+ .main {
174
+ -webkit-box-flex: 1;
175
+ -webkit-flex: 1 0 auto;
176
+ -ms-flex: 1 0 auto;
177
+ flex: 1 0 auto;
178
+ width: 100%;
179
+ }
180
+ .footer {
181
+ -webkit-box-flex: 0;
182
+ -webkit-flex: none;
183
+ -ms-flex: none;
184
+ flex: none;
185
+ background-color: #fff;
186
+ box-shadow: 0 -2px 4px 0 rgba(0, 0, 0, 0.1);
187
+ }
188
+ body.dark .footer {
189
+ background-color: #272727;
190
+ }
191
+ .container-fluid {
192
+ width: 100%;
193
+ padding-right: 15px;
194
+ padding-left: 15px;
195
+ margin-right: auto;
196
+ margin-left: auto;
197
+ }
198
+ .row {
199
+ display: -ms-flexbox;
200
+ display: flex;
201
+ -ms-flex-wrap: wrap;
202
+ flex-wrap: wrap;
203
+ margin-right: -15px;
204
+ margin-left: -15px;
205
+ }
206
+ .col {
207
+ -ms-flex-preferred-size: 0;
208
+ flex-basis: 0;
209
+ -webkit-box-flex: 1;
210
+ -ms-flex-positive: 1;
211
+ flex-grow: 1;
212
+ max-width: 100%;
213
+ }
214
+ .col,
215
+ .col-lg-9,
216
+ .col-12,
217
+ .col-md-8,
218
+ .col-sm-12,
219
+ .col-sm-6 {
220
+ position: relative;
221
+ width: 100%;
222
+ padding-right: 15px;
223
+ padding-left: 15px;
224
+ }
225
+ .col-12 {
226
+ -ms-flex: 0 0 100%;
227
+ flex: 0 0 100%;
228
+ max-width: 100%;
229
+ }
230
+ @media (min-width: 992px) {
231
+ .col-lg-9 {
232
+ -webkit-box-flex: 0;
233
+ -ms-flex: 0 0 75%;
234
+ flex: 0 0 75%;
235
+ max-width: 75%;
236
+ }
237
+ }
238
+ @media (min-width: 768px) {
239
+ .col-md-8 {
240
+ -ms-flex: 0 0 66.666667%;
241
+ flex: 0 0 66.666667%;
242
+ max-width: 66.666667%;
243
+ }
244
+ .col-md-6 {
245
+ -ms-flex: 0 0 50%;
246
+ flex: 0 0 50%;
247
+ max-width: 50%;
248
+ }
249
+ .col-md-4 {
250
+ -ms-flex: 0 0 33.333333%;
251
+ flex: 0 0 33.333333%;
252
+ max-width: 33.333333%;
253
+ }
254
+ }
255
+ @media (min-width: 576px) {
256
+ .col-sm-6 {
257
+ -ms-flex: 0 0 50%;
258
+ flex: 0 0 50%;
259
+ max-width: 50%;
260
+ }
261
+ .col-sm-12 {
262
+ -ms-flex: 0 0 100%;
263
+ flex: 0 0 100%;
264
+ max-width: 100%;
265
+ }
266
+ }
267
+ .pb-2 {
268
+ padding-bottom: 0.5rem !important;
269
+ }
270
+ .pt-2 {
271
+ padding-top: 0.5rem !important;
272
+ }
273
+ .pl-0 {
274
+ padding-left: 0 !important;
275
+ }
276
+ .pl-3 {
277
+ padding-left: 1rem !important;
278
+ }
279
+ .pb-4 {
280
+ padding-bottom: 1.5rem !important;
281
+ }
282
+ .pt-4 {
283
+ padding-top: 1.5rem !important;
284
+ }
285
+ .mb-0 {
286
+ margin-bottom: 0 !important;
287
+ }
288
+ .mb-3 {
289
+ margin-bottom: 1rem!important;
290
+ }
291
+ .mt-4 {
292
+ margin-top: 1.5rem !important;
293
+ }
294
+ .d-flex {
295
+ display: -ms-flexbox !important;
296
+ display: flex !important;
297
+ }
298
+ .flex-shrink-0 {
299
+ -ms-flex-negative: 0 !important;
300
+ flex-shrink: 0 !important;
301
+ }
302
+ .text-center {
303
+ text-align: center !important;
304
+ }
305
+ @media (min-width: 576px) {
306
+ .text-sm-left {
307
+ text-align: left !important;
308
+ }
309
+ .text-sm-right {
310
+ text-align: right !important;
311
+ }
312
+ .d-sm-none {
313
+ display: none !important;
314
+ }
315
+ }
316
+
317
+ #oobee-table {
318
+ background-color: #fff;
319
+ width: 100%;
320
+ }
321
+ body.dark #oobee-table {
322
+ background-color: #272727;
323
+ }
324
+ table.dataTable {
325
+ margin-top: 0 !important;
326
+ }
327
+ .dataTables_scroll {
328
+ box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
329
+ background-color: #fff;
330
+ }
331
+ body.dark .dataTables_scroll {
332
+ background-color: #1e1e1e;
333
+ }
334
+ tbody > tr {
335
+ vertical-align: top;
336
+ }
337
+ tbody > tr:hover {
338
+ background-color: #f0f0ff;
339
+ }
340
+ body.dark tbody > tr:hover {
341
+ background-color: #303033;
342
+ }
343
+ th {
344
+ height: 47px;
345
+ color: #000;
346
+ background-color: #fff;
347
+ border-bottom: 2px solid #0b02b5 !important;
348
+ padding-left: 16px;
349
+ font-weight: 600;
350
+ }
351
+ body.dark th {
352
+ border-bottom: 2px solid #a68fce !important;
353
+ background-color: #272727;
354
+ color: #e1e1e1;
355
+ }
356
+ th.sorting_disabled {
357
+ padding-right: 16px;
358
+ }
359
+ td {
360
+ padding-top: 12px;
361
+ padding-bottom: 12px;
362
+ padding-left: 16px;
363
+ padding-right: 16px;
364
+ border-top: 1px solid #e1e7eb;
365
+ border-bottom: 1px solid #e1e7eb;
366
+ }
367
+ body.dark td {
368
+ border-top: 1px solid #383838;
369
+ border-bottom: 1px solid #383838;
370
+ }
371
+ .dt-nowrap {
372
+ white-space: nowrap;
373
+ }
374
+ td.issue {
375
+ min-width: 400px;
376
+ }
377
+ td.element {
378
+ text-overflow: ellipsis;
379
+ white-space: nowrap;
380
+ overflow: hidden;
381
+ max-width: 300px;
382
+ word-break: break-all;
383
+ }
384
+ td.element:hover {
385
+ overflow: visible;
386
+ white-space: normal;
387
+ height: auto;
388
+ }
389
+ th.element > span {
390
+ padding-left: 5px;
391
+ font-size: 14px;
392
+ font-weight: 400;
393
+ color: #969799;
394
+ }
395
+ td.page {
396
+ color: #0b02b5;
397
+ text-overflow: ellipsis;
398
+ white-space: nowrap;
399
+ overflow: hidden;
400
+ max-width: 150px;
401
+ word-break: break-all;
402
+ }
403
+ td.page:hover {
404
+ overflow: visible;
405
+ white-space: normal;
406
+ height: auto;
407
+ }
408
+ body.dark td.page {
409
+ color: #a68fce;
410
+ }
411
+ .wcag-clause {
412
+ font-size: 14px;
413
+ }
414
+ .hidden {
415
+ display: none;
416
+ }
417
+ .impact {
418
+ padding: 3px 5px;
419
+ color: #fff;
420
+ border-radius: 5px;
421
+ font-size: 12px;
422
+ font-weight: 700;
423
+ text-transform: uppercase;
424
+ }
425
+ body.dark .impact {
426
+ color: #121212;
427
+ }
428
+ .critical {
429
+ background-color: #d0021b;
430
+ }
431
+ body.dark .critical {
432
+ background-color: #d46e78;
433
+ }
434
+ .serious {
435
+ background-color: #fa6400;
436
+ }
437
+ body.dark .serious {
438
+ background-color: #f0a571;
439
+ }
440
+ .moderate {
441
+ background-color: #f7b500;
442
+ }
443
+ body.dark .moderate {
444
+ background-color: #f4d377;
445
+ }
446
+ .minor {
447
+ background-color: #969799;
448
+ }
449
+ body.dark .minor {
450
+ background-color: #c0c1c2;
451
+ }
452
+ .critical-stroke-icon {
453
+ stroke: #d0021b;
454
+ }
455
+ .critical-fill-icon {
456
+ fill: #d0021b;
457
+ }
458
+ body.dark .critical-stroke-icon {
459
+ stroke: #d46e78;
460
+ }
461
+ body.dark .critical-fill-icon {
462
+ fill: #d46e78;
463
+ }
464
+ .serious-stroke-icon {
465
+ stroke: #fa6400;
466
+ }
467
+ .serious-fill-icon {
468
+ fill: #fa6400;
469
+ }
470
+ body.dark .serious-stroke-icon {
471
+ stroke: #f0a571;
472
+ }
473
+ body.dark .serious-fill-icon {
474
+ fill: #f0a571;
475
+ }
476
+ .moderate-stroke-icon {
477
+ stroke: #f7b500;
478
+ }
479
+ .moderate-fill-icon {
480
+ fill: #f7b500;
481
+ }
482
+ body.dark .moderate-stroke-icon {
483
+ stroke: #f4d377;
484
+ }
485
+ body.dark .moderate-fill-icon {
486
+ fill: #f4d377;
487
+ }
488
+ .minor-stroke-icon {
489
+ stroke: #969799;
490
+ }
491
+ .minor-fill-icon {
492
+ fill: #969799;
493
+ }
494
+ body.dark .minor-stroke-icon {
495
+ stroke: #c0c1c2;
496
+ }
497
+ body.dark .minor-fill-icon {
498
+ fill: #c0c1c2;
499
+ }
500
+ .link-icon {
501
+ fill: #0b02b5;
502
+ }
503
+ .link-icon:hover {
504
+ fill: #08017e;
505
+ }
506
+ body.dark .link-icon {
507
+ fill: #a68fce;
508
+ }
509
+ body.dark .link-icon:hover {
510
+ fill: #cfcdfe;
511
+ }
512
+
513
+ .tooltip {
514
+ position: absolute;
515
+ z-index: 1070;
516
+ display: block;
517
+ margin: 0;
518
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
519
+ font-style: normal;
520
+ font-weight: 400;
521
+ line-height: 1.5;
522
+ text-align: left;
523
+ text-align: start;
524
+ text-decoration: none;
525
+ text-shadow: none;
526
+ text-transform: none;
527
+ letter-spacing: normal;
528
+ word-break: normal;
529
+ word-spacing: normal;
530
+ white-space: normal;
531
+ line-break: auto;
532
+ font-size: 0.875rem;
533
+ word-wrap: break-word;
534
+ opacity: 0;
535
+ }
536
+ .tooltip.show {
537
+ opacity: 0.9;
538
+ }
539
+ .bs-tooltip-auto[x-placement^="bottom"],
540
+ .bs-tooltip-bottom {
541
+ padding: 0.4rem 0;
542
+ }
543
+ .bs-tooltip-bottom .arrow,
544
+ bs-tooltip-auto[x-placement^="bottom"] .arrow {
545
+ top: 0;
546
+ }
547
+ .bs-tooltip-auto[x-placement^="top"] .arrow,
548
+ .bs-tooltip-top .arrow {
549
+ bottom: 0;
550
+ }
551
+ .tooltip .arrow {
552
+ position: absolute;
553
+ display: block;
554
+ width: 0.8rem;
555
+ height: 0.4rem;
556
+ }
557
+ .tooltip .arrow::before {
558
+ position: absolute;
559
+ content: "";
560
+ border-color: transparent;
561
+ border-style: solid;
562
+ }
563
+ .bs-tooltip-auto[x-placement^="bottom"] .arrow::before,
564
+ .bs-tooltip-bottom .arrow::before {
565
+ bottom: 0;
566
+ border-width: 0 0.4rem 0.4rem;
567
+ border-bottom-color: #000;
568
+ }
569
+ .bs-tooltip-auto[x-placement^="top"] .arrow::before,
570
+ .bs-tooltip-top .arrow::before {
571
+ top: 0;
572
+ border-width: 0.4rem 0.4rem 0;
573
+ border-top-color: #000;
574
+ }
575
+ .bs-tooltip-auto[x-placement^="top"],
576
+ .bs-tooltip-top {
577
+ padding: 0.4rem 0;
578
+ padding-top: 0.4rem;
579
+ padding-right: 0;
580
+ padding-bottom: 0.4rem;
581
+ padding-left: 0;
582
+ }
583
+ .tooltip-inner {
584
+ max-width: 200px;
585
+ padding: 0.25rem 0.5rem;
586
+ color: #fff;
587
+ text-align: center;
588
+ background-color: #000;
589
+ border-radius: 0.25rem;
590
+ }
591
+
592
+ div.dataTables_wrapper div.dataTables_filter input {
593
+ margin-left: 0.5em;
594
+ display: inline-block;
595
+ width: auto;
596
+ }
597
+ table.dataTable {
598
+ clear: both;
599
+ /* margin-top: 6px !important; */
600
+ margin-bottom: 6px !important;
601
+ max-width: none !important;
602
+ border-collapse: separate !important;
603
+ border-spacing: 0;
604
+ }
605
+ div.dataTables_scrollBody table {
606
+ border-top: none;
607
+ margin-top: 0 !important;
608
+ margin-bottom: 0 !important;
609
+ }
610
+ table.dataTable td,
611
+ table.dataTable th {
612
+ -webkit-box-sizing: content-box;
613
+ box-sizing: content-box;
614
+ }
615
+ div.dataTables_scrollBody table tbody tr:first-child td,
616
+ div.dataTables_scrollBody table tbody tr:first-child th {
617
+ border-top: none;
618
+ position: relative;
619
+ }
620
+ div.dataTables_scrollHead table.dataTable {
621
+ margin-bottom: 0 !important;
622
+ }
623
+ table.dataTable thead .sorting,
624
+ table.dataTable thead .sorting_asc,
625
+ table.dataTable thead .sorting_asc_disabled,
626
+ table.dataTable thead .sorting_desc,
627
+ table.dataTable thead .sorting_desc_disabled {
628
+ cursor: pointer;
629
+ position: relative;
630
+ }
631
+ table.dataTable thead > tr > td.sorting,
632
+ table.dataTable thead > tr > td.sorting_asc,
633
+ table.dataTable thead > tr > td.sorting_desc,
634
+ table.dataTable thead > tr > th.sorting,
635
+ table.dataTable thead > tr > th.sorting_asc,
636
+ table.dataTable thead > tr > th.sorting_desc {
637
+ padding-right: 30px;
638
+ }
639
+ table.dataTable thead .sorting:after,
640
+ table.dataTable thead .sorting:before,
641
+ table.dataTable thead .sorting_asc:after,
642
+ table.dataTable thead .sorting_asc:before,
643
+ table.dataTable thead .sorting_asc_disabled:after,
644
+ table.dataTable thead .sorting_asc_disabled:before,
645
+ table.dataTable thead .sorting_desc:after,
646
+ table.dataTable thead .sorting_desc:before,
647
+ table.dataTable thead .sorting_desc_disabled:after,
648
+ table.dataTable thead .sorting_desc_disabled:before {
649
+ position: absolute;
650
+ bottom: 0.9em;
651
+ display: block;
652
+ opacity: 0.3;
653
+ }
654
+ table.dataTable thead .sorting:before,
655
+ table.dataTable thead .sorting_asc:before,
656
+ table.dataTable thead .sorting_asc_disabled:before,
657
+ table.dataTable thead .sorting_desc:before,
658
+ table.dataTable thead .sorting_desc_disabled:before {
659
+ right: 1em;
660
+ content: "\2191";
661
+ }
662
+ table.dataTable thead .sorting:after,
663
+ table.dataTable thead .sorting_asc:after,
664
+ table.dataTable thead .sorting_asc_disabled:after,
665
+ table.dataTable thead .sorting_desc:after,
666
+ table.dataTable thead .sorting_desc_disabled:after {
667
+ right: 0.5em;
668
+ content: "\2193";
669
+ }
670
+ table.dataTable tbody td.select-checkbox:before,
671
+ table.dataTable tbody th.select-checkbox:before {
672
+ content: " ";
673
+ margin-top: -6px;
674
+ margin-left: -11px;
675
+ border: 1px solid #000;
676
+ border-radius: 3px;
677
+ }
678
+ table.dataTable tbody td.select-checkbox:after,
679
+ table.dataTable tbody td.select-checkbox:before,
680
+ table.dataTable tbody th.select-checkbox:after,
681
+ table.dataTable tbody th.select-checkbox:before {
682
+ display: block;
683
+ position: absolute;
684
+ top: 1.2em;
685
+ left: 50%;
686
+ width: 12px;
687
+ height: 12px;
688
+ box-sizing: border-box;
689
+ }
690
+ table.dataTable tr.selected td.select-checkbox:after,
691
+ table.dataTable tr.selected th.select-checkbox:after {
692
+ content: "\2714";
693
+ margin-top: -11px;
694
+ margin-left: -4px;
695
+ text-align: center;
696
+ text-shadow: 1px 1px #b0bed9, -1px -1px #b0bed9, 1px -1px #b0bed9, -1px 1px #b0bed9;
697
+ }
698
+ table.dataTable tbody td.select-checkbox,
699
+ table.dataTable tbody th.select-checkbox {
700
+ position: relative;
701
+ }
702
+ div.dataTables_wrapper div.dataTables_info {
703
+ padding-top: 0.85em;
704
+ white-space: nowrap;
705
+ }
706
+ table.dataTable thead .sorting:before,
707
+ table.dataTable thead .sorting_asc:before,
708
+ table.dataTable thead .sorting_asc_disabled:before,
709
+ table.dataTable thead .sorting_desc:before,
710
+ table.dataTable thead .sorting_desc_disabled:before {
711
+ right: 1em;
712
+ content: "\2191";
713
+ }
714
+ table.dataTable thead .sorting:after,
715
+ table.dataTable thead .sorting_asc:after,
716
+ table.dataTable thead .sorting_asc_disabled:after,
717
+ table.dataTable thead .sorting_desc:after,
718
+ table.dataTable thead .sorting_desc_disabled:after {
719
+ right: 0.5em;
720
+ content: "\2193";
721
+ }
722
+ table.dataTable thead .sorting:after,
723
+ table.dataTable thead .sorting:before,
724
+ table.dataTable thead .sorting_asc:after,
725
+ table.dataTable thead .sorting_asc:before,
726
+ table.dataTable thead .sorting_asc_disabled:after,
727
+ table.dataTable thead .sorting_asc_disabled:before,
728
+ table.dataTable thead .sorting_desc:after,
729
+ table.dataTable thead .sorting_desc:before,
730
+ table.dataTable thead .sorting_desc_disabled:after,
731
+ table.dataTable thead .sorting_desc_disabled:before {
732
+ position: absolute;
733
+ bottom: 0.9em;
734
+ display: block;
735
+ opacity: 0.3;
736
+ }
737
+ table.dataTable thead .sorting_asc:before,
738
+ table.dataTable thead .sorting_desc:after {
739
+ opacity: 1;
740
+ }
741
+ table.dataTable thead .sorting_asc:before,
742
+ table.dataTable thead .sorting_desc:after {
743
+ opacity: 1;
744
+ }
745
+
746
+ table.dataTable tbody > tr.selected,
747
+ table.dataTable tbody > tr > .selected,
748
+ table.dataTable.display tbody > tr.even.selected > .sorting_1,
749
+ table.dataTable.display tbody > tr.odd.selected,
750
+ table.dataTable.display tbody > tr.odd.selected > .sorting_1 {
751
+ background-color: #f6ffed;
752
+ }
753
+ body.dark table.dataTable tbody > tr.selected,
754
+ body.dark table.dataTable.display tbody > tr.even.selected > .sorting_1,
755
+ body.dark table.dataTable.display tbody > tr.odd.selected,
756
+ body.dark table.dataTable.display tbody > tr.odd.selected > .sorting_1,
757
+ table.dataTable tbody > tr > .selected {
758
+ background-color: #2e352c;
759
+ }
760
+ table.dataTable.display tbody > tr.even.selected:hover > .sorting_1,
761
+ table.dataTable.display tbody > tr.odd.selected:hover > .sorting_1,
762
+ table.dataTable.display tbody > tr.selected:hover {
763
+ background-color: #ecffda;
764
+ }
765
+ body.dark table.dataTable.display tbody > tr.even.selected:hover > .sorting_1,
766
+ body.dark table.dataTable.display tbody > tr.odd.selected:hover > .sorting_1,
767
+ body.dark table.dataTable.display tbody > tr.selected:hover {
768
+ background-color: #3a4238;
769
+ }
770
+ tbody > tr:hover .checkbox-label .checkbox-style {
771
+ border-color: #969799;
772
+ }
773
+ body.dark tbody > tr:hover .checkbox-label .checkbox-style {
774
+ border-color: #e1e7eb;
775
+ }
776
+ table.dataTable tbody tr:hover td.select-checkbox:before,
777
+ table.dataTable tbody tr:hover th.select-checkbox:before {
778
+ border-color: #969799;
779
+ }
780
+ body.dark table.dataTable tbody tr:hover td.select-checkbox:before,
781
+ table.dataTable tbody tr:hover th.select-checkbox:before {
782
+ border-color: #e1e7eb;
783
+ }
784
+ table.dataTable tbody td.select-checkbox:before,
785
+ table.dataTable tbody th.select-checkbox:before {
786
+ position: absolute;
787
+ top: 22px;
788
+ height: 20px;
789
+ width: 20px;
790
+ background-color: transparent;
791
+ border-radius: 5px;
792
+ transition: all 0.3s ease-out;
793
+ -webkit-transition: all 0.3s ease-out;
794
+ -moz-transition: all 0.3s ease-out;
795
+ -ms-transition: all 0.3s ease-out;
796
+ -o-transition: all 0.3s ease-out;
797
+ border: 2px solid #e1e7eb;
798
+ cursor: pointer;
799
+ }
800
+ body.dark table.dataTable tbody td.select-checkbox:before,
801
+ table.dataTable tbody th.select-checkbox:before {
802
+ border-color: #969799;
803
+ }
804
+ table.dataTable tbody tr.selected td.select-checkbox:before,
805
+ table.dataTable tbody tr.selected th.select-checkbox:before {
806
+ background-color: #0a0;
807
+ color: #fff;
808
+ border-radius: 5px;
809
+ -webkit-transform: rotate(0) scale(1);
810
+ -ms-transform: rotate(0) scale(1);
811
+ transform: rotate(0) scale(1);
812
+ opacity: 1;
813
+ border: 2px solid #0a0 !important;
814
+ }
815
+ body.dark table.dataTable tbody tr.selected td.select-checkbox:before,
816
+ table.dataTable tbody tr.selected th.select-checkbox:before {
817
+ background-color: #98d490;
818
+ color: #121212;
819
+ border: 2px solid #98d490 !important;
820
+ }
821
+ table.dataTable tr.selected td.select-checkbox:after,
822
+ table.dataTable tr.selected th.select-checkbox:after {
823
+ content: "";
824
+ -webkit-transform: rotate(45deg) scale(1);
825
+ -ms-transform: rotate(45deg) scale(1);
826
+ transform: rotate(45deg) scale(1);
827
+ opacity: 1;
828
+ top: 29px;
829
+ left: 50%;
830
+ width: 6px;
831
+ height: 12px;
832
+ border: solid #fff;
833
+ border-width: 0 2px 2px 0;
834
+ background-color: transparent;
835
+ border-radius: 0;
836
+ }
837
+ body.dark table.dataTable tr.selected td.select-checkbox:after,
838
+ table.dataTable tr.selected th.select-checkbox:after {
839
+ border-color: #121212;
840
+ }
841
+ .toggleWrapper {
842
+ padding: 0 50px;
843
+ }
844
+ .toggleWrapper input {
845
+ position: absolute;
846
+ left: -99em;
847
+ }
848
+ .toggle {
849
+ cursor: pointer;
850
+ display: inline-block;
851
+ position: relative;
852
+ width: 45px;
853
+ height: 26px;
854
+ background-color: #83d8ff;
855
+ border-radius: 84px;
856
+ transition: background-color 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95);
857
+ margin-bottom: 0;
858
+ margin-top: 10px;
859
+ }
860
+ .toggle:before {
861
+ content: "Light";
862
+ position: absolute;
863
+ left: -50px;
864
+ font-size: 18px;
865
+ color: #0b02b5;
866
+ }
867
+ .toggle:after {
868
+ content: "Dark";
869
+ position: absolute;
870
+ right: -48px;
871
+ font-size: 18px;
872
+ color: #969799;
873
+ }
874
+ .toggle__handler {
875
+ display: inline-block;
876
+ position: relative;
877
+ z-index: 1;
878
+ top: 2px;
879
+ left: -21px;
880
+ width: 22px;
881
+ height: 22px;
882
+ background-color: #fff;
883
+ border-radius: 50px;
884
+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
885
+ transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
886
+ transform: rotate(-45deg);
887
+ cursor: pointer;
888
+ }
889
+ .toggle__handler .crater {
890
+ position: absolute;
891
+ background-color: #e8cda5;
892
+ opacity: 0;
893
+ transition: opacity 0.2s ease-in-out;
894
+ border-radius: 100%;
895
+ }
896
+ .toggle__handler .crater--1 {
897
+ top: 9px;
898
+ left: 6px;
899
+ width: 2px;
900
+ height: 2px;
901
+ }
902
+ .toggle__handler .crater--2 {
903
+ top: 13px;
904
+ left: 11px;
905
+ width: 3px;
906
+ height: 3px;
907
+ }
908
+ .toggle__handler .crater--3 {
909
+ top: 5px;
910
+ left: 13px;
911
+ width: 4px;
912
+ height: 4px;
913
+ }
914
+ .star {
915
+ position: absolute;
916
+ background-color: #fff;
917
+ transition: all 0.3s cubic-bezier(0.445, 0.05, 0.55, 0.95);
918
+ border-radius: 50%;
919
+ }
920
+ .star--1 {
921
+ top: 6px;
922
+ left: 8px;
923
+ z-index: 0;
924
+ width: 30px;
925
+ height: 1px;
926
+ }
927
+ .star--2 {
928
+ top: 10px;
929
+ left: 15px;
930
+ z-index: 1;
931
+ width: 19px;
932
+ height: 1px;
933
+ }
934
+ .star--3 {
935
+ top: 14px;
936
+ left: 12px;
937
+ z-index: 0;
938
+ width: 30px;
939
+ height: 1px;
940
+ }
941
+ .star--4,
942
+ .star--5,
943
+ .star--6 {
944
+ opacity: 0;
945
+ transition: all 0.3s 0 cubic-bezier(0.445, 0.05, 0.55, 0.95);
946
+ }
947
+ .star--4 {
948
+ top: 19px;
949
+ left: 14px;
950
+ z-index: 0;
951
+ width: 1px;
952
+ height: 1px;
953
+ transform: translate3d(3px, 0, 0);
954
+ }
955
+ .star--5 {
956
+ top: 6px;
957
+ left: 15px;
958
+ z-index: 0;
959
+ width: 2px;
960
+ height: 2px;
961
+ transform: translate3d(3px, 0, 0);
962
+ }
963
+ .star--6 {
964
+ top: 16px;
965
+ left: 18px;
966
+ z-index: 0;
967
+ width: 1px;
968
+ height: 1px;
969
+ transform: translate3d(3px, 0, 0);
970
+ }
971
+ input:checked + .toggle {
972
+ background-color: #749dd6;
973
+ }
974
+ input:checked + .toggle:before {
975
+ color: #969799;
976
+ }
977
+ input:checked + .toggle:after {
978
+ color: #a68fce;
979
+ }
980
+ input:checked + .toggle .toggle__handler {
981
+ background-color: #ffe5b5;
982
+ transform: translate3d(19px, 0, 0) rotate(0);
983
+ }
984
+ input:checked + .toggle .toggle__handler .crater {
985
+ opacity: 1;
986
+ }
987
+ input:checked + .toggle .star--1 {
988
+ width: 2px;
989
+ height: 2px;
990
+ }
991
+ input:checked + .toggle .star--2 {
992
+ width: 3px;
993
+ height: 3px;
994
+ transform: translate3d(-5px, 0, 0);
995
+ }
996
+ input:checked + .toggle .star--3 {
997
+ width: 2px;
998
+ height: 2px;
999
+ transform: translate3d(-7px, 0, 0);
1000
+ }
1001
+ input:checked + .toggle .star--4,
1002
+ input:checked + .toggle .star--5,
1003
+ input:checked + .toggle .star--6 {
1004
+ opacity: 1;
1005
+ transform: translate3d(0, 0, 0);
1006
+ }
1007
+ input:checked + .toggle .star--4 {
1008
+ transition: all 0.3s 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95);
1009
+ }
1010
+ input:checked + .toggle .star--5 {
1011
+ transition: all 0.3s 0.3s cubic-bezier(0.445, 0.05, 0.55, 0.95);
1012
+ }
1013
+ input:checked + .toggle .star--6 {
1014
+ transition: all 0.3s 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95);
1015
+ }
1016
+ #loader {
1017
+ margin: 15vh auto;
1018
+ border: 10px solid #cfcdfe;
1019
+ border-radius: 50%;
1020
+ border-top: 10px solid #5d30cf;
1021
+ width: 60px;
1022
+ height: 60px;
1023
+ -webkit-animation: spin 2s linear infinite;
1024
+ animation: spin 2s linear infinite;
1025
+ }
1026
+ body.dark #loader {
1027
+ border: 10px solid #514865 !important;
1028
+ border-top: 10px solid #a68fce !important;
1029
+ }
1030
+ @-webkit-keyframes spin {
1031
+ 0% {
1032
+ -webkit-transform: rotate(0);
1033
+ }
1034
+ 100% {
1035
+ -webkit-transform: rotate(360deg);
1036
+ }
1037
+ }
1038
+ @keyframes spin {
1039
+ 0% {
1040
+ transform: rotate(0);
1041
+ }
1042
+ 100% {
1043
+ transform: rotate(360deg);
1044
+ }
1045
+ }
1046
+ .impact-icon-size {
1047
+ display: inline-block;
1048
+ min-width: 16px;
1049
+ }
1050
+ .wcag-clause:not(:last-child):after {
1051
+ content: ", ";
1052
+ }
1053
+ div.dataTables_wrapper span.select-info span.select-item:first-child {
1054
+ display: block;
1055
+ padding: 2px 8px;
1056
+ background: #00AA00;
1057
+ border-radius: 5px;
1058
+ margin-top: 6px;
1059
+ width: max-content;
1060
+ }
1061
+ body.dark div.dataTables_wrapper span.select-info span.select-item:first-child {
1062
+ background: #98D490;
1063
+ color: #121212;
1064
+ }
1065
+ div.dataTables_wrapper span.select-item{
1066
+ color: #FFFFFF;
1067
+ }
1068
+ div.dataTables_wrapper div.dataTables_info {
1069
+ text-align: left;
1070
+ padding-top: 1rem;
1071
+ }
1072
+ @media screen and (max-width: 767px) {
1073
+ .dataTables_wrapper .dataTables_info,
1074
+ .dataTables_wrapper .dataTables_paginate {
1075
+ float: none;
1076
+ text-align: center;
1077
+ }
1078
+ .dataTables_wrapper .dataTables_paginate {
1079
+ margin-top: 0.5em;
1080
+ }
1081
+ }
1082
+
1083
+ /* pre-header DOM elements */
1084
+ .top {
1085
+ display: flex;
1086
+ justify-content: space-between;
1087
+ }
1088
+
1089
+ @media (max-width: 767px) {
1090
+ .top {
1091
+ flex-flow: column-reverse;
1092
+ }
1093
+ }
1094
+
1095
+ .bottom {
1096
+ display: flex;
1097
+ justify-content: space-between;
1098
+ }
1099
+
1100
+ @media (max-width: 767px) {
1101
+ .bottom {
1102
+ display: block;
1103
+ }
1104
+ }
1105
+
1106
+ /*pagination button */
1107
+ .dataTables_wrapper .dataTables_paginate .pagination {
1108
+ display: flex;
1109
+ flex-direction: row;
1110
+ justify-content: flex-end;
1111
+ align-items: flex-start;
1112
+ padding: 0px;
1113
+ gap: 4px;
1114
+ }
1115
+ .dataTables_wrapper .dataTables_paginate .paginate_button {
1116
+ background-color: #ffffff;
1117
+ border: 1px solid #ced4da;
1118
+ display: inline-block;
1119
+ min-width: 2.5em;
1120
+ padding: .5em .75em;
1121
+ text-align: center;
1122
+ cursor: pointer;
1123
+ }
1124
+
1125
+ body.dark .dataTables_wrapper .dataTables_paginate .paginate_button {
1126
+ background: #121212;
1127
+ border: 1px solid #383838;
1128
+ }
1129
+
1130
+ .dataTables_wrapper .dataTables_paginate .paginate_button a{
1131
+ color: #444444;
1132
+ }
1133
+ body.dark .dataTables_wrapper .dataTables_paginate .paginate_button a{
1134
+ color: #E1E1E1!important;
1135
+ }
1136
+
1137
+ .dataTables_wrapper .dataTables_paginate .paginate_button.active {
1138
+ border: 1px solid #0B02B5;
1139
+ cursor: default;
1140
+ pointer-events: none;
1141
+ }
1142
+ body.dark .dataTables_wrapper .dataTables_paginate .paginate_button.active {
1143
+ border: 1px solid #a68fce;
1144
+ }
1145
+
1146
+ .dataTables_wrapper .dataTables_paginate .paginate_button.active a {
1147
+ color: #0B02B5;
1148
+ font-weight: 700;
1149
+ }
1150
+ body.dark .dataTables_wrapper .dataTables_paginate .paginate_button.active a{
1151
+ color: #a68fce!important;
1152
+ }
1153
+
1154
+ .dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
1155
+ background: #FFFFFF;
1156
+ border: 1px solid #CED4DA;
1157
+ cursor: not-allowed;
1158
+ pointer-events: none;
1159
+ }
1160
+ body.dark .dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
1161
+ border: 1px solid #272727;
1162
+ background: #121212;
1163
+ }
1164
+
1165
+ .dataTables_wrapper .dataTables_paginate .paginate_button.disabled a {
1166
+ color: #CED4DA;
1167
+ }
1168
+ body.dark .dataTables_wrapper .dataTables_paginate .paginate_button.disabled a {
1169
+ color: #383838!important;
1170
+ }
1171
+
1172
+ .btn-outline {
1173
+ padding: 6px 12px;
1174
+ background: #FFFFFF;
1175
+ border: 1px solid #0B02B5;
1176
+ color: #0B02B5;
1177
+ font-size: 16px;
1178
+ line-height: 24px;
1179
+ border-radius: 2px;
1180
+ font-family: Lato, sans-serif;
1181
+ cursor: pointer;
1182
+ }
1183
+
1184
+ body.dark .btn-outline {
1185
+ background: #121212;
1186
+ border: 1px solid #A68FCE;
1187
+ color: #A68FCE;
1188
+ }
1189
+
1190
+ .btn-outline svg{
1191
+ fill: #0B02B5;
1192
+ margin-right: 8px;
1193
+ margin-bottom: 2px;
1194
+ }
1195
+
1196
+ body.dark .btn-outline svg{
1197
+ fill: #A68FCE;
1198
+ }
1199
+
1200
+ .btn-outline:hover {
1201
+ background-color: #f0f0ff!important;
1202
+ }
1203
+
1204
+ body.dark .btn-outline:hover {
1205
+ background-color: #2E2E33!important;
1206
+ }
1207
+
1208
+ .btn-outline:active {
1209
+ background-color: #CFCDFE!important;
1210
+ }
1211
+
1212
+ body.dark .btn-outline:active {
1213
+ background-color: #514865!important;
1214
+ }
1215
+
1216
+ .card {
1217
+ position: relative;
1218
+ display: -webkit-box;
1219
+ display: -ms-flexbox;
1220
+ display: flex;
1221
+ -webkit-box-orient: vertical;
1222
+ -webkit-box-direction: normal;
1223
+ -ms-flex-direction: column;
1224
+ flex-direction: column;
1225
+ min-width: 0;
1226
+ height: 100%;
1227
+ word-wrap: break-word;
1228
+ background-color: #fff;
1229
+ background-clip: border-box;
1230
+ background-color: #fff;
1231
+ box-shadow: 0 2px 4px 0 rgb(0 0 0 / 20%);
1232
+ }
1233
+
1234
+ body.dark .card {
1235
+ background-color: #272727;
1236
+ box-shadow: 0 2px 4px 0 rgb(0 0 0 / 70%);
1237
+ }
1238
+
1239
+ .card-body {
1240
+ -webkit-box-flex: 1;
1241
+ -ms-flex: 1 1 auto;
1242
+ flex: 1 1 auto;
1243
+ padding: 1rem;
1244
+ }
1245
+
1246
+ .info-card .d-flex {
1247
+ gap: 16px;
1248
+ }
1249
+
1250
+ .info-card .d-flex svg {
1251
+ min-width: 24px;
1252
+ }
1253
+
1254
+ .info-card .d-flex svg path {
1255
+ fill: #0B02B5;
1256
+ }
1257
+
1258
+ body.dark .info-card .d-flex svg path {
1259
+ fill: #A68FCE;
1260
+ }
1261
+
1262
+ .meta-section {
1263
+ display: flex;
1264
+ justify-content: space-around;
1265
+ }
1266
+
1267
+ .meta-item {
1268
+ text-align: center;
1269
+ display: flex;
1270
+ flex-direction: column;
1271
+ align-items: center;
1272
+ justify-content: start;
1273
+ }
1274
+
1275
+ @media (max-width: 767px) {
1276
+ .meta-section {
1277
+ flex-direction: column!important;
1278
+ justify-content: start!important;
1279
+ }
1280
+ .meta-item {
1281
+ flex-direction: row!important;
1282
+ text-align: left!important;
1283
+ margin-bottom: 8px;
1284
+ }
1285
+ .meta-item svg {
1286
+ height: 40px!important;
1287
+ width: 40px!important;
1288
+ }
1289
+
1290
+ .meta-item span, .meta-item a {
1291
+ padding-left: 8px;
1292
+ }
1293
+ }
1294
+
1295
+ .meta-item a {
1296
+ max-width: 200px;
1297
+ }
1298
+
1299
+ .meta-item svg {
1300
+ fill: #CED4DA;
1301
+ height: 100px;
1302
+ }
1303
+
1304
+ body.dark .meta-item svg {
1305
+ fill: #505050;
1306
+ }
1307
+
1308
+ .impact-row {
1309
+ display: flex;
1310
+ justify-content: space-between;
1311
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);;
1312
+ padding-bottom: 0.5rem;
1313
+ margin-bottom: 0.5rem;
1314
+ }
1315
+
1316
+ .impact-row:last-child {
1317
+ border: none;
1318
+ padding: 0;
1319
+ margin: 0;
1320
+ }
1321
+
1322
+ body.dark .impact-row {
1323
+ border-color: #383838;
1324
+ }
1325
+
1326
+ .sr-only:not(:focus):not(:active) {
1327
+ clip: rect(0 0 0 0);
1328
+ clip-path: inset(50%);
1329
+ height: 1px;
1330
+ overflow: hidden;
1331
+ position: absolute;
1332
+ white-space: nowrap;
1333
+ width: 1px;
1334
+ }
1335
+ </style>
1336
+ </head>
1337
+ <body onbeforeunload="return closeWarning()" onload="load()">
1338
+ <div class="header">
1339
+ <div class="container-fluid">
1340
+ <div class="row pt-4 pb-4">
1341
+ <div class="col-md-8 col-12">
1342
+ <div class="d-flex">
1343
+ <svg class="flex-shrink-0" width="70px" height="70px" viewBox="0 0 60 60">
1344
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1345
+ <g transform="translate(-28.000000, -32.000000)">
1346
+ <g transform="translate(28.000000, 27.000000)">
1347
+ <g transform="translate(0.000000, 5.000000)">
1348
+ <circle fill="#533BE2" cx="30" cy="30" r="30"></circle>
1349
+ <path d="M28.4502649,29.642801 C28.3252903,29.5414933 28.1233305,29.5414933 27.998356,29.6424933 L27.0933986,30.3752304 C26.9688039,30.4764355 26.9688039,30.6402913 27.0937784,30.7415989 L29.6684816,32.8265056 C29.7610412,32.9014609 29.8808243,33 30.0032664,33 C30.1255819,33 30.2585336,32.9014609 30.3510932,32.8265056 L34.9061425,29.1747147 C35.0312436,29.0735096 35.0312436,28.9095512 34.9063957,28.8083461 L34.0016916,28.0757116 C33.8765904,27.9747116 33.6746306,27.9747116 33.5495294,28.0760192 L30.0097241,30.9053522 L28.4502649,29.642801 Z" fill="#FFFFFF"></path>
1350
+ <path d="M30.5,35 C28.0147604,35 26,33.2092086 26,31 C26,28.7908982 28.0147604,27 30.5,27 C32.9852396,27 35,28.7908982 35,31 C35,33.2092086 32.9852396,35 30.5,35 M37.5248476,29.7923531 C36.8297901,29.8155839 36.1869369,29.4327578 35.9256839,28.8409617 C35.6735552,28.2688636 35.858003,27.5330795 36.3480544,27.1193147 C36.5094029,26.9819641 36.5289218,26.7547949 36.395408,26.5947488 C36.0434903,26.1788429 35.6399457,25.8007272 35.1957464,25.4701435 C35.0238877,25.3417854 34.7739534,25.3598776 34.6257715,25.5114665 C34.1531601,25.9954589 33.4009317,26.1522934 32.7548447,25.901037 C32.1616549,25.6706562 31.7613443,25.1209325 31.7419409,24.5238907 L31.7419409,22.1316558 C31.7419409,22.0174288 31.672181,21.9129439 31.5618819,21.861986 L29.7675292,21.0321012 C29.5513199,20.9321125 29.2972277,21.0778134 29.2972277,21.301771 L29.2972277,24.4391037 C29.2934163,25.0723298 28.8916042,25.6335084 28.2702334,25.869456 C27.6309606,26.1115057 26.8855466,25.9553135 26.4158225,25.4806349 C26.2683336,25.3312941 26.0215177,25.3129878 25.8500055,25.4383484 C25.4033807,25.7644358 24.9998362,26.1349506 24.650113,26.5396158 C24.5131342,26.6980561 24.5321911,26.930578 24.696196,27.0680357 C25.1913293,27.4823358 25.3753151,28.2266842 25.1164876,28.8018869 C24.84484,29.4002133 24.1904371,29.7777937 23.4881033,29.7406459 C23.2673896,29.7285487 23.07555,29.8782106 23.0499098,30.082042 C22.9851163,30.6012552 22.9831528,31.1252859 23.0455209,31.645998 C23.0695442,31.8473671 23.2567639,31.9969219 23.4748212,31.9901775 C24.1702252,31.967589 24.8130784,32.3496658 25.0749089,32.9421042 C25.3253051,33.5103483 25.1427053,34.2495581 24.6519609,34.6631088 C24.4903814,34.7997101 24.470516,35.0282709 24.6046074,35.1876748 C24.9573335,35.604223 25.361109,35.9830881 25.8042689,36.3121729 C25.9763586,36.440424 26.2260619,36.4215824 26.3740128,36.2707429 C26.8468552,35.7868576 27.5986216,35.6307724 28.2454016,35.8821359 C28.8485241,36.1167989 29.2786328,36.6901816 29.2972277,37.3508136 L29.2972277,37.868421 C29.2972277,37.97494 29.3621367,38.0723594 29.4650441,38.1198915 L31.3032854,38.9701166 C31.5048267,39.0632539 31.7419409,38.927402 31.7419409,38.7186461 L31.7419409,37.3600202 C31.7421719,37.3544534 31.7434423,37.3488866 31.7434423,37.3434268 C31.7268108,36.7379278 32.0894697,36.1569442 32.7295509,35.9128605 C33.3688237,35.6699543 34.1138913,35.8263606 34.5843083,36.3016816 C34.7317972,36.45038 34.9780356,36.4694357 35.1492014,36.343861 C35.5931697,36.0209853 35.9969452,35.6502563 36.3495559,35.2443065 C36.4881516,35.0849027 36.4686327,34.8532372 36.3043968,34.7151372 C35.8082241,34.2991242 35.6244692,33.5548829 35.8838742,32.9821425 C36.1548289,32.3819962 36.8091162,32.0045228 37.5116811,32.0414565 C37.7323947,32.0535536 37.9248118,31.9035706 37.9498745,31.7003815 C37.9833685,31.4346728 38,31.1674653 38,30.8995085 C38,30.6451475 37.9849855,30.3907865 37.9544944,30.1363185 C37.9304711,29.9347353 37.7430204,29.7855016 37.5248476,29.7923531 Z" fill="#FFFFFF"></path>
1351
+ <path d="M29,17.4279646 C29,17.5512652 29.0705877,17.6640501 29.1820788,17.7191714 L41.4375735,23.766452 L41.4375735,35.734939 C41.4375735,35.8582397 41.5080443,35.9710245 41.6196524,36.0259147 L43.5240006,36.965288 C43.7427757,37.073335 44,36.9160602 44,36.6743123 L44,22.9825046 C44,22.5023599 43.7253625,22.063354 43.2905003,21.8489934 L29.4758825,15.0346369 C29.2571075,14.9267055 29,15.0840959 29,15.3258438 L29,17.4279646 Z" fill="#FFFFFF"></path>
1352
+ <path d="M32,42.5719259 C32,42.4487411 31.9294129,42.3359565 31.8178057,42.2808354 L19.5624065,36.2335699 L19.5624065,24.2651127 C19.5624065,24.1418123 19.4919362,24.0290277 19.3803291,23.9740221 L17.4759957,23.0346512 C17.2572223,22.92672 17,23.0839944 17,23.3257418 L17,37.0173998 C17,37.4976588 17.2746354,37.9366636 17.7094942,38.1510237 L31.5241212,44.9653631 C31.7427777,45.0732943 32,44.9159043 32,44.674157 L32,42.5719259 Z" fill="#FFFFFF"></path>
1353
+ </g>
1354
+ </g>
1355
+ </g>
1356
+ </g>
1357
+ </svg>
1358
+ <div class="pl-3">
1359
+ <h1>Accessibility Report</h1>
1360
+ <p class="mb-0">Measure of compliance against WCAG 2.1 standards</p>
1361
+ </div>
1362
+ </div>
1363
+ </div>
1364
+ <div class="col header-toggle">
1365
+ <div class="toggleWrapper">
1366
+ <input type="checkbox" class="dm" id="dm"/>
1367
+ <label for="dm" class="toggle">
1368
+ <span class="toggle__handler">
1369
+ <span class="crater crater--1"></span>
1370
+ <span class="crater crater--2"></span>
1371
+ <span class="crater crater--3"></span>
1372
+ </span>
1373
+ <span class="star star--1"></span>
1374
+ <span class="star star--2"></span>
1375
+ <span class="star star--3"></span>
1376
+ <span class="star star--4"></span>
1377
+ <span class="star star--5"></span>
1378
+ <span class="star star--6"></span>
1379
+ </label>
1380
+ </div>
1381
+ </div>
1382
+ </div>
1383
+ </div>
1384
+ </div>
1385
+
1386
+ <div class="main">
1387
+ <div id="loader"></div>
1388
+ <div class="container-fluid" style="visibility:hidden;" id="report">
1389
+ <div class="row">
1390
+ <div class="col-12 mt-4">
1391
+ <div class="card info-card">
1392
+ <div class="card-body d-flex">
1393
+ <svg width="24" height="24" viewBox="0 0 24 24">
1394
+ <title>Info Icon</title>
1395
+ <path d="M12 0C5.37321 0 0 5.37321 0 12C0 18.6268 5.37321 24 12 24C18.6268 24 24 18.6268 24 12C24 5.37321 18.6268 0 12 0ZM12 21.9643C6.49821 21.9643 2.03571 17.5018 2.03571 12C2.03571 6.49821 6.49821 2.03571 12 2.03571C17.5018 2.03571 21.9643 6.49821 21.9643 12C21.9643 17.5018 17.5018 21.9643 12 21.9643Z"/>
1396
+ <path d="M10.7144 7.28571C10.7144 7.99579 11.29 8.57143 12.0001 8.57143C12.7102 8.57143 13.2858 7.99579 13.2858 7.28571C13.2858 6.57563 12.7102 6 12.0001 6C11.29 6 10.7144 6.57563 10.7144 7.28571ZM12.6429 10.2857H11.3572C11.2394 10.2857 11.1429 10.3821 11.1429 10.5V17.7857C11.1429 17.9036 11.2394 18 11.3572 18H12.6429C12.7608 18 12.8572 17.9036 12.8572 17.7857V10.5C12.8572 10.3821 12.7608 10.2857 12.6429 10.2857Z"/>
1397
+ </svg>
1398
+ <p class="mb-0">
1399
+ Only a subset of accessibility issues can be automatically detected so you should consider manual testing.</p>
1400
+ </div>
1401
+ </div>
1402
+ </div>
1403
+ </div>
1404
+
1405
+ <div class="row">
1406
+ <div class="col-lg-9 mt-4">
1407
+ <div class="card">
1408
+ <div class="card-body">
1409
+ <h2>ABOUT THIS SCAN</h2>
1410
+ <ul class="meta-section d-flex pl-0 mb-0">
1411
+ <li class="meta-item">
1412
+ <span class="sr-only">Date & time of scan: </span>
1413
+ <svg viewBox="0 0 100 100" aria-hidden="true">
1414
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M28 17.7059C28 15.6592 29.679 14 31.75 14C33.821 14 35.5 15.6592 35.5 17.7059V21.4118H50.5V17.7059C50.5 15.6592 52.179 14 54.25 14C56.321 14 58 15.6592 58 17.7059V21.4118H61.75C67.9632 21.4118 73 26.3893 73 32.5294V48.0515C72.5045 48.0174 72.0043 48 71.5 48C70.0891 48 68.71 48.1359 67.375 48.3953V43.6471H18.625V65.8824C18.625 68.9524 21.1434 71.4412 24.25 71.4412H50.0864C50.2599 73.3797 50.6907 75.2441 51.3443 77H24.25C18.0368 77 13 72.0225 13 65.8824V32.5294C13 26.3893 18.0368 21.4118 24.25 21.4118H28V17.7059ZM50.5 26.9706V28.8235C50.5 30.8702 52.179 32.5294 54.25 32.5294C56.321 32.5294 58 30.8702 58 28.8235V26.9706H61.75C64.8566 26.9706 67.375 29.4594 67.375 32.5294V39.9412H18.625V32.5294C18.625 29.4594 21.1434 26.9706 24.25 26.9706H28V28.8235C28 30.8702 29.679 32.5294 31.75 32.5294C33.821 32.5294 35.5 30.8702 35.5 28.8235V26.9706H50.5ZM82.3333 70C82.3333 76.8115 76.8115 82.3333 70 82.3333C63.1885 82.3333 57.6667 76.8115 57.6667 70C57.6667 63.1885 63.1885 57.6667 70 57.6667C76.8115 57.6667 82.3333 63.1885 82.3333 70ZM86 70C86 78.8366 78.8365 86 70 86C61.1635 86 54 78.8366 54 70C54 61.1634 61.1635 54 70 54C78.8365 54 86 61.1634 86 70ZM70 60C69.2636 60 68.6667 60.597 68.6667 61.3333V69.6667C68.6667 70.0904 68.8643 70.468 69.1725 70.7122C69.2089 70.7582 69.2488 70.8023 69.2922 70.8443L73.2192 74.6382C73.7487 75.1499 74.5928 75.1353 75.1045 74.6058C75.6161 74.0762 75.6016 73.2321 75.072 72.7204L71.3333 69.1083V61.3333C71.3333 60.597 70.7364 60 70 60Z">
1415
+ </svg>
1416
+ <span>{{startTime}}</span>
1417
+ </li>
1418
+ <li class="meta-item">
1419
+ <span class="sr-only">URL: </span>
1420
+ <svg viewBox="0 0 100 100" aria-hidden="true">
1421
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M14 26C14 23.8 15.8 22 18 22H82C84.2 22 86 23.8 86 26V74C86 76.2 84.2 78 82 78H18C15.8 78 14 76.2 14 74V26ZM20 33H80V73H20V33ZM39.1 31.2C40.7 31.2 42 29.9 42 28.3C42 26.7 40.7 25.4 39.1 25.4C37.5 25.4 36.2 26.7 36.2 28.3C36.2 29.9 37.6 31.2 39.1 31.2ZM34.9 28.4C34.9 30 33.6 31.3 32 31.3C30.4 31.3 29.1 30 29.1 28.4C29.1 26.8 30.4 25.5 32 25.5C33.6 25.5 34.9 26.8 34.9 28.4ZM24.9 31.2C26.5 31.2 27.8 29.9 27.8 28.3C27.8 26.7 26.5 25.4 24.9 25.4C23.3 25.4 22 26.8 22 28.4C22 30 23.3 31.2 24.9 31.2Z">
1422
+ </svg>
1423
+ <a class="domainDetails" target="_blank">{{domainScanned}}</a>
1424
+ </li>
1425
+ <li class="meta-item">
1426
+ <span class="sr-only">Screen size: </span>
1427
+ <!-- <svg viewBox="0 0 100 100" aria-hidden="true">
1428
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M36.6667 17C33.353 17 30.6667 19.6456 30.6667 22.9091V76.0909C30.6667 79.3544 33.353 82 36.6667 82H61.6667C64.9805 82 67.6667 79.3544 67.6667 76.0909V22.9091C67.6667 19.6456 64.9805 17 61.6667 17H36.6667ZM63.6667 24.8788H34.6667V72.1515H63.6667V24.8788ZM43.6667 20.447C43.6667 20.175 43.8906 19.9545 44.1667 19.9545H55.1667C55.4429 19.9545 55.6667 20.175 55.6667 20.447C55.6667 20.7189 55.4429 20.9394 55.1667 20.9394H44.1667C43.8906 20.9394 43.6667 20.7189 43.6667 20.447ZM49.6667 80.0303C51.3236 80.0303 52.6667 78.7075 52.6667 77.0758C52.6667 75.444 51.3236 74.1212 49.6667 74.1212C48.0099 74.1212 46.6667 75.444 46.6667 77.0758C46.6667 78.7075 48.0099 80.0303 49.6667 80.0303Z">
1429
+ </svg>
1430
+ <span>iPhone 11 Pro</span> -->
1431
+ <div class="device-icon">{{{deviceIconHtml}}}</div>
1432
+ <!-- <svg viewBox="0 0 100 100" aria-hidden="true">
1433
+ <path d="M80.24 19.76H19.76C16.9736 19.76 14.72 22.0208 14.72 24.8072V65.1776C14.72 67.964 16.9736 70.2248 19.76 70.2248H42.44V75.1928H37.4C36.0104 75.1928 34.88 76.3232 34.88 77.7128C34.88 79.1096 36.0104 80.2328 37.4 80.2328H62.6C63.9896 80.2328 65.12 79.1024 65.12 77.7128C65.12 76.316 63.9896 75.1928 62.6 75.1928H57.56V70.2248H80.24C83.0264 70.2248 85.28 67.964 85.28 65.1776V24.8072C85.28 22.0208 83.0264 19.76 80.24 19.76ZM80.24 63.68C80.24 64.5512 79.5344 65.2568 78.6632 65.2568H21.3368C20.4656 65.2568 19.76 64.5512 19.76 63.68V26.4632C19.76 25.592 20.4656 24.8864 21.3368 24.8864H78.6704C79.5416 24.8864 80.2472 25.592 80.2472 26.4632L80.24 63.68Z">
1434
+ </svg> -->
1435
+ <span>{{deviceUsed}}</span>
1436
+ <!-- <span>Desktop</span> -->
1437
+ <!-- <svg viewBox="0 0 100 100" aria-hidden="true">
1438
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M25 35C25 29.4772 29.4772 25 35 25H65C70.5228 25 75 29.4772 75 35V65C75 70.5228 70.5228 75 65 75H35C29.4772 75 25 70.5228 25 65V35ZM34.2466 52.3973C32.9226 52.3973 31.8493 53.4705 31.8493 54.7945V65.7534C31.8493 67.0774 32.9226 68.1507 34.2466 68.1507C34.3627 68.1507 34.4769 68.1424 34.5887 68.1265C34.7007 68.1425 34.8151 68.1508 34.9315 68.1508H45.8904C47.2144 68.1508 48.2877 67.0775 48.2877 65.7535C48.2877 64.4296 47.2144 63.3563 45.8904 63.3563H36.6438V54.7945C36.6438 53.4706 35.5705 52.3973 34.2466 52.3973ZM68.8356 45.2055C68.8356 46.5295 67.7623 47.6027 66.4384 47.6027C65.1144 47.6027 64.0411 46.5295 64.0411 45.2055V36.6437L54.7945 36.6437C53.4706 36.6437 52.3973 35.5704 52.3973 34.2465C52.3973 32.9225 53.4706 31.8492 54.7945 31.8492L65.7534 31.8492C65.8698 31.8492 65.9843 31.8575 66.0963 31.8735C66.208 31.8576 66.3222 31.8493 66.4384 31.8493C67.7623 31.8493 68.8356 32.9226 68.8356 34.2466V45.2055Z">
1439
+ </svg>
1440
+ <span>360px width viewport</span> -->
1441
+ </li>
1442
+ <li class="meta-item">
1443
+ <svg viewBox="0 0 100 100" aria-hidden="true">
1444
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M31.4532 23.0037C31.5057 23.0013 31.5584 23 31.6115 23L67.6961 23.0001C70.3915 23.0001 71.9487 26.0714 70.3633 28.2609L62.3913 39.2705C61.5502 40.432 61.5502 42.0056 62.3913 43.1671L70.3633 54.1767C71.9487 56.3662 70.3915 59.4375 67.6961 59.4375H34.5961V72.6875C34.5961 74.517 33.1195 76 31.298 76C29.4766 76 28 74.517 28 72.6875V26.3126C28 24.4832 29.4766 23.0001 31.298 23.0001C31.3501 23.0001 31.4018 23.0013 31.4532 23.0037Z">
1445
+ </svg>
1446
+ <div><span>{{issueImpact.totalUnique}}</span> unique issues <svg style="padding-left:2px;width:15px!important;height:15px!important;" viewBox="0 0 10 10" data-toggle="tooltip" data-original-title="Issues with different description">
1447
+ <title>Tooltip</title><path d="M8.53769 1.46676C6.58628 -0.487057 3.42048 -0.488999 1.46664 1.46239C-0.487173 3.41384 -0.489139 6.57965 1.4623 8.53349C3.41369 10.4873 6.57954 10.4893 8.53338 8.53784C10.4872 6.58644 10.4891 3.42057 8.53769 1.46676ZM5.00154 8.02915C4.73707 8.02915 4.52267 7.81478 4.52267 7.55028C4.52267 7.28578 4.73705 7.07138 5.00154 7.07138C5.26602 7.07138 5.48042 7.28576 5.48042 7.55028C5.48039 7.81475 5.26602 8.02915 5.00154 8.02915ZM5.7801 5.14584C5.50656 5.30575 5.48318 5.50248 5.482 6.06934C5.48193 6.10683 5.48181 6.14464 5.48159 6.18268C5.47989 6.45061 5.26223 6.66664 4.99466 6.66664C4.99361 6.66664 4.99255 6.66664 4.99152 6.66664C4.72256 6.66494 4.50593 6.44552 4.50761 6.17654C4.50785 6.1399 4.50792 6.10347 4.50799 6.06737C4.50919 5.48478 4.51066 4.75978 5.28854 4.30508C5.91269 3.94022 5.99135 3.70054 5.91816 3.38604C5.83216 3.01662 5.49481 2.92088 5.23156 2.95098C5.14316 2.96113 4.7023 3.03386 4.7023 3.47C4.7023 3.73891 4.48425 3.95698 4.21529 3.95698C3.94634 3.95698 3.72832 3.73891 3.72832 3.47C3.72832 2.68881 4.30077 2.07749 5.12042 1.98338C5.96459 1.88654 6.68225 2.37251 6.8667 3.16526C7.14242 4.34952 6.15271 4.92806 5.7801 5.14584Z">
1448
+ </svg>
1449
+ </div>
1450
+ </li>
1451
+ </ul>
1452
+ </div>
1453
+ </div>
1454
+ </div>
1455
+ <div class="col mt-4">
1456
+ <div class="card">
1457
+ <div class="card-body">
1458
+ <h2>ISSUES BY IMPACT <span>({{issueImpact.totalIssues}})</span> </h2>
1459
+ <ul class="pl-0 mb-0">
1460
+ <li class="impact-row">
1461
+ <span class="impact critical">critical</span>
1462
+ {{issueImpact.totalCritical}}
1463
+ </li>
1464
+ <li class="impact-row">
1465
+ <span class="impact serious">serious</span>
1466
+ {{issueImpact.totalSerious}}
1467
+ </li>
1468
+ <li class="impact-row">
1469
+ <span class="impact moderate">moderate</span>
1470
+ {{issueImpact.totalModerate}}
1471
+ </li>
1472
+ <li class="impact-row">
1473
+ <span class="impact minor">minor</span>
1474
+ {{issueImpact.totalMinor}}
1475
+ </li>
1476
+ </ul>
1477
+ </div>
1478
+ </div>
1479
+ </div>
1480
+ </div>
1481
+
1482
+ <div class="row">
1483
+ <div class="col-12 pt-4 pb-4">
1484
+ <table id="oobee-table" class="display" style="width:100%">
1485
+ <thead>
1486
+ <tr>
1487
+ <th>IMPACT</th>
1488
+ <th class="dt-nowrap">ISSUE</th>
1489
+ <th class="dt-nowrap">PAGE</th>
1490
+ <th class="element">HTML ELEMENT <span>Hover to view full</span></th>
1491
+ <th class="dt-nowrap text-center">HELP URL</th>
1492
+ <th class="dt-nowrap text-center">FIXED?</th>
1493
+ </tr>
1494
+ </thead>
1495
+ <tbody>
1496
+ {{#allissues}}
1497
+ <tr>
1498
+ <td><span class="impact {{impact}}"><span class="hidden">{{order}}</span>{{impact}}</span><br>
1499
+ {{#disabilities}}
1500
+ <div class="impact-icon-size">
1501
+ {{{.}}}
1502
+ </div>
1503
+ {{/disabilities}}
1504
+ </td>
1505
+ <td class="issue">{{description}}<br>
1506
+ {{#wcagLinks}}
1507
+ <a class="wcag-clause" href="{{href}}" target="_blank">WCAG {{wcag}}</a>
1508
+ {{/wcagLinks}}
1509
+ </td>
1510
+ <td class="page"><a href="{{url}}" target="_blank">{{page}}</a></td>
1511
+ <td class="element">{{htmlElement}}</td>
1512
+ <td class="text-center dt-nowrap"><a href="{{helpUrl}}" target="_blank">
1513
+ <svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1">
1514
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1515
+ <g class="link-icon" transform="translate(-1259.000000, -254.000000)" fill-rule="nonzero">
1516
+ <g transform="translate(24.000000, 184.000000)">
1517
+ <g transform="translate(-3.000000, 50.000000)">
1518
+ <g transform="translate(1238.000000, 20.000000)">
1519
+ <path d="M15,2.22044605e-14 L8,2.22044605e-14 L8,2 L12.6,2 L6.3,8.3 L7.7,9.7 L14,3.4 L14,8 L16,8 L16,1 C16,0.4 15.6,2.22044605e-14 15,2.22044605e-14 Z" id="Path"></path>
1520
+ <path d="M14,16 L1,16 C0.4,16 0,15.6 0,15 L0,2 C0,1.4 0.4,1 1,1 L5,1 L5,3 L2,3 L2,14 L13,14 L13,11 L15,11 L15,15 C15,15.6 14.6,16 14,16 Z" id="Path"></path>
1521
+ </g>
1522
+ </g>
1523
+ </g>
1524
+ </g>
1525
+ </g>
1526
+ </svg>
1527
+ </a></td>
1528
+ <td class="text-center dt-nowrap">
1529
+ </td>
1530
+ </tr>
1531
+ {{/allissues}}
1532
+ </tbody>
1533
+ </table>
1534
+ </div>
1535
+ </div>
1536
+ </div>
1537
+ </div>
1538
+
1539
+ <div class="footer">
1540
+ <div class="container-fluid">
1541
+ <div class="row text-center pt-2 pb-2">
1542
+ <div class="col-sm-6 text-sm-left">
1543
+ <a href="mailto:enquiries_HATS@tech.gov.sg">Help us improve</a>
1544
+ <hr class="d-sm-none">
1545
+ </div>
1546
+ <div class="col-sm-6 text-sm-right">
1547
+ Product of <a href="https://go.gov.sg/accessibility" target="_blank">GovTech Accessibility Enabling Team</a>
1548
+ </div>
1549
+ </div>
1550
+ </div>
1551
+ </div>
1552
+
1553
+ <script src="https://code.jquery.com/jquery-3.6.1.js"></script>
1554
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
1555
+ <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
1556
+ <script src="https://cdn.datatables.net/1.13.1/js/jquery.dataTables.min.js"></script>
1557
+ <script src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap4.min.js"></script>
1558
+ <script src="https://cdn.datatables.net/select/1.3.1/js/dataTables.select.min.js"></script>
1559
+
1560
+ <script src="https://cdn.datatables.net/buttons/2.3.2/js/dataTables.buttons.min.js"></script>
1561
+ <script src="https://cdn.datatables.net/buttons/2.3.2/js/buttons.html5.min.js"></script>
1562
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
1563
+
1564
+ <!--for full numbers, no ellipse pagination-->
1565
+ <script src="https://cdn.datatables.net/plug-ins/1.13.1/pagination/full_numbers_no_ellipses.js"></script>
1566
+
1567
+ <script>
1568
+ function closeWarning() {}
1569
+ $(document).ready(function () {
1570
+ ((window.onbeforeunload = function (e) {
1571
+ var t = 'Sure you want to leave?';
1572
+ return void 0 === e && (e = window.event), e && (e.returnValue = t), t;
1573
+ }),
1574
+ $(function () {
1575
+ $('[data-toggle="tooltip"]').tooltip();
1576
+ }),
1577
+ document.getElementById('dm').addEventListener(
1578
+ 'change',
1579
+ function (e) {
1580
+ if (e.target.checked) {
1581
+ var t = document.body;
1582
+ t.classList.add('dark');
1583
+ } else {
1584
+ var t = document.body;
1585
+ t.classList.remove('dark');
1586
+ }
1587
+ },
1588
+ !1,
1589
+ ),
1590
+ window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches)
1591
+ ? ((document.getElementById('dm').checked = !0), document.body.classList.add('dark'))
1592
+ : document.body.classList.remove('dark');
1593
+ });
1594
+ </script>
1595
+ <script>
1596
+ function addAriaPagination() {
1597
+ $("#oobee-table_paginate .pagination .active").attr("aria-current", "page")
1598
+
1599
+ $('#bottom-pagination .dataTables_paginate ul li').each(function(){
1600
+ var pageNumber = $(this).text()
1601
+ if (!isNaN(pageNumber)){
1602
+ $(this).attr('aria-label', 'Go to Page ' + pageNumber)
1603
+ }
1604
+ if (pageNumber ===1 && $(this).attr('aria-current')){
1605
+ $()
1606
+ }
1607
+ })
1608
+ }
1609
+
1610
+ $(document).ready(function (){
1611
+ var table = $('#oobee-table').DataTable({
1612
+ pageLength: 50,
1613
+ columnDefs:[
1614
+ { targets: [3, 4, 5], orderable: !1 },
1615
+ { width: 500, targets: 1 },
1616
+ { width: 150, targets: 2 },
1617
+ { width: 300, targets: 3 },
1618
+ { orderable: !1, className: "select-checkbox", targets: 5 },
1619
+ ],
1620
+ select:{style:"multi",selector:"td:last-child"},
1621
+ language:{
1622
+ select: {rows:{_:"%d issues fixed",0:"0 issue fixed",1:"1 issue fixed"}},
1623
+ emptyTable: "No issues found",
1624
+ info: "Showing _START_ to _END_ of _TOTAL_ issues",
1625
+ infoEmpty: "Showing 0 to 0 of 0 issues",
1626
+ infoFiltered: "(filtered from _MAX_ total issues)",
1627
+ lengthMenu: "Display _MENU_ issues",
1628
+ processing: "Processing...",
1629
+ search: "Search issues:",
1630
+ zeroRecords: "No matching issues found",
1631
+ paginate: {
1632
+ "first": "First",
1633
+ "last": "Last",
1634
+ "previous": "<",
1635
+ "next": ">",
1636
+ },
1637
+ aria: {
1638
+ "sortAscending": ": activate to sort column ascending",
1639
+ "sortDescending": ": activate to sort column descending",
1640
+ },
1641
+ },
1642
+ dom: '<"top"fB>rt<"bottom"i<"#bottom-pagination"p>>',
1643
+ buttons: [
1644
+ {
1645
+ extend: 'csvHtml5',
1646
+ text: '<svg width="16" height="16" viewBox="0 0 18 18"><path d="M8.16675 10.6667L4.65732 7.11757L3.34777 8.42713L9.00008 14L14.4651 8.4549L13.1556 7.14534L9.83341 10.6667V0.666706H8.16675V10.6667ZM17.3334 17.3334V15.6667H0.666748V17.3334H17.3334Z"/></svg>Export CSV',
1647
+ className: "btn-outline mb-3",
1648
+ exportOptions : {
1649
+ orthogonal: 'csvExport',
1650
+ modifier : {
1651
+ order : 'index',
1652
+ page : 'all',
1653
+ selected: null,
1654
+ },
1655
+ format: {
1656
+ body: function ( data, row, column, node ) {
1657
+ switch(column){
1658
+ case 4:
1659
+ return data.match(/\bhttps?:\/\/\S+/gi)[0];
1660
+ break;
1661
+ case 5:
1662
+ return node.closest('tr').classList.contains("selected") ? "Yes" : "No";
1663
+ break;
1664
+ default:
1665
+ return node.textContent;
1666
+ }
1667
+ }
1668
+ },
1669
+ }
1670
+ },
1671
+ ],
1672
+ order:[[0,"desc"]],
1673
+ scrollX:!0,
1674
+ pagingType: 'full_numbers_no_ellipses',
1675
+ info: true,
1676
+ initComplete: function(settings,json){
1677
+ addAriaPagination();
1678
+ },
1679
+ "drawCallback": function () {
1680
+ $('li.paginate_button').addClass('btn-outline');
1681
+ $('li.paginate_button.active a').addClass('disabled')
1682
+ $('li.paginate_button.active a').attr('aria-disabled', 'true')
1683
+ $('li.paginate_button.disabled a').addClass('disabled')
1684
+ $('li.paginate_button.disabled a').attr('aria-disabled', 'true')
1685
+ }
1686
+ });
1687
+
1688
+ $("#oobee-table").on('draw.dt', function() {
1689
+ addAriaPagination();
1690
+ })
1691
+
1692
+ /*DT pagination */
1693
+ var pagItems = document.querySelectorAll('.paginate_button');
1694
+
1695
+ $("#oobee-table_paginate").attr("aria-label", "Pagination navigation")
1696
+ $("#oobee-table_first").attr("aria-label", "Go to first page")
1697
+ $("#oobee-table_previous").attr("aria-label", "Go to previous page")
1698
+ $("#oobee-table_next").attr("aria-label", "Go to next page")
1699
+ $("#oobee-table_last").attr("aria-label", "Go to last page")
1700
+
1701
+ const domainUsed = `https://${$(".domainDetails").html()}`
1702
+ console.log("DOMAIN: ", domainUsed)
1703
+ $(".domainDetails").attr("href", domainUsed)
1704
+ });
1705
+
1706
+ var timeout;function load() {timeout = setTimeout(showPage, 2000);} function showPage() {document.getElementById("loader").style.display = "none";document.getElementById("report").style.visibility = "visible";}
1707
+ </script>
1708
+ </body>
1709
+ </html>