Merge pull request #34 from lpelypenko/fix-axe-violations

fix axe violations
lpelypenko · Aug 21, 2024 · 8b8152b · 8b8152b
2 parents 2db17c2 + c8f107f
commit 8b8152b
Show file tree

Hide file tree

Showing 14 changed files with 5,987 additions and 2,328 deletions.
diff --git a/artifacts/accessibilityReport.html b/artifacts/accessibilityReport.html
diff --git a/artifacts/tcAllPassedOnlyViolations.html b/artifacts/tcAllPassedOnlyViolations.html
@@ -13,6 +13,19 @@
                 display: flex;
                 justify-content: space-between;
                 align-items: start;
+                font-weight: 500;
+                line-height: 1.2;
+            }
+            .card-title {
+                font-size: 1.25rem;
+            }
+            .violationCardTitleItem {
+                font-size: 1rem;
+                font-weight: 500;
+            }
+            .card-text {
+                font-size: 0.95rem;
+                font-weight: 300;
             }
             .learnMore {
                 margin-bottom: 0.75rem;
@@ -23,7 +36,7 @@
                 color: #2557a7;
             }
             .violationNode {
-                font-size: 0.75rem;
+                font-size: 0.85rem;
             }
             .wrapBreakWord {
                 word-break: break-word;
@@ -75,14 +88,14 @@
         <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.5.0/highlight.min.js"></script>
         <title>Axe-core® Accessibility Results</title>
     </head>
-    <body>
+    <main role="main">
         <div style="padding: 2rem">
-            <h3>
+            <h1>
                 Axe-core® Accessibility Results
-            </h3>
+            </h1>
             <div class="summarySection">
             </div>
-            <h5>axe-core found <span class="badge badge-success">0</span> violations</h5>
+            <h2>axe-core found <span class="badge badge-success">0</span> violations</h2>
                 <tbody>
                 </tbody>
             </table>
@@ -91,5 +104,5 @@ <h5>axe-core found <span class="badge badge-success">0</span> violations</h5>
         <script>
             hljs.initHighlightingOnLoad();
         </script>
-    </body>
+    </main>
 </html>
diff --git a/artifacts/tcInapplicablePresent.html b/artifacts/tcInapplicablePresent.html
diff --git a/artifacts/tcIncludingCustomSummary.html b/artifacts/tcIncludingCustomSummary.html
diff --git a/artifacts/tcOnlyPasses.html b/artifacts/tcOnlyPasses.html
@@ -13,6 +13,19 @@
                 display: flex;
                 justify-content: space-between;
                 align-items: start;
+                font-weight: 500;
+                line-height: 1.2;
+            }
+            .card-title {
+                font-size: 1.25rem;
+            }
+            .violationCardTitleItem {
+                font-size: 1rem;
+                font-weight: 500;
+            }
+            .card-text {
+                font-size: 0.95rem;
+                font-weight: 300;
             }
             .learnMore {
                 margin-bottom: 0.75rem;
@@ -23,7 +36,7 @@
                 color: #2557a7;
             }
             .violationNode {
-                font-size: 0.75rem;
+                font-size: 0.85rem;
             }
             .wrapBreakWord {
                 word-break: break-word;
@@ -75,26 +88,26 @@
         <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.5.0/highlight.min.js"></script>
         <title>Axe-core® Accessibility Results</title>
     </head>
-    <body>
+    <main role="main">
         <div style="padding: 2rem">
-            <h3>
+            <h1>
                 Axe-core® Accessibility Results
-            </h3>
+            </h1>
             <div class="summarySection">
                 <div class="summary">
                     Page URL:
                     <a href="https:&#x2F;&#x2F;dequeuniversity.com&#x2F;demo&#x2F;mars&#x2F;" target="_blank" class="card-link">https:&#x2F;&#x2F;dequeuniversity.com&#x2F;demo&#x2F;mars&#x2F;</a>
                     <br />
                 </div>
             </div>
-            <h5>axe-core found <span class="badge badge-success">0</span> violations</h5>
+            <h2>axe-core found <span class="badge badge-success">0</span> violations</h2>
                 <tbody>
                 </tbody>
             </table>
             <div id="accordionPasses">
                 <div class="card">
                     <div class="card-header" id="headingOne">
-                        <h5 class="mb-0">
+                        <p class="mb-0">
                             <button
                                 class="btn btn-link"
                                 data-toggle="collapse"
@@ -105,7 +118,7 @@ <h5 class="mb-0">
                                 axe returned 0 passed axe
                                 checks
                             </button>
-                        </h5>
+                        </p>
                     </div>
                     <div
                         id="passes"
@@ -121,7 +134,7 @@ <h5 class="mb-0">
             <div id="accordionIncomplete">
                 <div class="card">
                     <div class="card-header" id="headingTwo">
-                        <h5 class="mb-0">
+                        <p class="mb-0">
                             <button
                                 class="btn btn-link"
                                 data-toggle="collapse"
@@ -132,7 +145,7 @@ <h5 class="mb-0">
                                 axe returned 0 incomplete checks. Expand
                                 details on click
                             </button>
-                        </h5>
+                        </p>
                     </div>
                     <div
                         id="incomplete"
@@ -161,7 +174,7 @@ <h5 class="mb-0">
             <div id="accordionInapplicable">
                 <div class="card">
                     <div class="card-header" id="headingThree">
-                        <h5 class="mb-0">
+                        <p class="mb-0">
                             <button
                                 class="btn btn-link"
                                 data-toggle="collapse"
@@ -172,7 +185,7 @@ <h5 class="mb-0">
                                 axe returned 0 inapplicable checks.
                                 Expand details on click
                             </button>
-                        </h5>
+                        </p>
                     </div>
                     <div
                         id="inapplicable"
@@ -202,5 +215,5 @@ <h5 class="mb-0">
         <script>
             hljs.initHighlightingOnLoad();
         </script>
-    </body>
+    </main>
 </html>