changed report colors to conform to WCAG 2 AA thresholds

cisagov · Nov 24, 2024 · cefafce · cefafce
1 parent 9680fb1
commit cefafce
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 3 deletions.
diff --git a/PowerShell/ScubaGear/Modules/CreateReport/CreateReport.psm1 b/PowerShell/ScubaGear/Modules/CreateReport/CreateReport.psm1
@@ -226,7 +226,7 @@ function New-Report {
     # Finish building the html report
     $Title = "$($FullName) Baseline Report"
     $AADWarning = "Exclusions must only be used if they are approved within an organization's security risk acceptance process.
-    Please reference <a href=`"$($ScubaGitHubUrl)/blob/v$($SettingsExport.module_version)/docs/configuration/configuration.md#entra-id-configuration`" target=`"_blank`">this section in the README file</a>
+    Please reference <a href=`"$($ScubaGitHubUrl)/blob/main/docs/configuration/configuration.md#entra-id-configuration`" target=`"_blank`" class=`" aad-link`">this section in the README file</a>
     file for a list of the policies that accept exclusions and the instructions for setting up exclusions in the configuration file.
     <i>Exclusions can introduce grave risks to your system and must be managed carefully.</i>"
     $NoWarning = "<br/>"

diff --git a/PowerShell/ScubaGear/Modules/CreateReport/scripts/main.js b/PowerShell/ScubaGear/Modules/CreateReport/scripts/main.js
@@ -18,6 +18,7 @@ const colorRows = () => {
             }
             else if (rows[i].children[statusCol].innerHTML === "Fail") {
                 rows[i].style.background = "var(--test-fail)";
+                rows[i].style.color = "var(--test-error-color)";
             }
             else if (rows[i].children[statusCol].innerHTML === "Warning") {
                 rows[i].style.background = "var(--test-warning)";

diff --git a/PowerShell/ScubaGear/Modules/CreateReport/styles/main.css b/PowerShell/ScubaGear/Modules/CreateReport/styles/main.css
@@ -38,7 +38,7 @@ html[data-theme='dark'] {
     --note-color: #ee4e04;
     --header-bottom: rgb(221, 221, 221);
     --link-color: #85B065;
-    --unvisited-link-color: #0092CC;
+    --unvisited-link-color: #E6F598;
     --text-color: #bdbdbd;
     --uuid-color: #999999;
     --border-color: #7b7b7b;
@@ -76,6 +76,23 @@ h4 {
     margin-bottom: 0.313em;
 }
 
+h4 .aad-link {
+    font-family: Arial, Helvetica, sans-serif;
+    color: var(--unvisited-link-color);
+    text-decoration: underline;
+}
+
+h4 .aad-link:visited {
+    font-family: Arial, Helvetica, sans-serif;
+    color: var(--link-color);
+}
+
+h4 .aad-link:hover {
+    font-family: Arial, Helvetica, sans-serif;
+    color: var(--link-color);
+    text-decoration: none;
+}
+
 
 .links {
     display: flex;
@@ -232,7 +249,7 @@ th.conditions {
 }
 
 #toggle-text {
-    color: #404040;
+    color: var(--text-color);
     margin: 0.313em 3.125em;
     font-family: Arial, Helvetica, sans-serif;
     font-size: 0.875em;

diff --git a/PowerShell/ScubaGear/Sample-Reports/IndividualReports/AADReport.html b/PowerShell/ScubaGear/Sample-Reports/IndividualReports/AADReport.html