fix: Accessibility - change color for WCAG AA (#19472)

* fix: Accessibility - change color for WCAG AA Signed-off-by: julieng <[email protected]> * fix: #ffffff to #fff to comply with stylelint Signed-off-by: julieng <[email protected]> * Factoring in #19249 Signed-off-by: julieng <[email protected]> --------- Signed-off-by: julieng <[email protected]>
goharbor · Oct 25, 2023 · d3907f6 · d3907f6
1 parent adb066c
commit d3907f6
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 50 deletions.
diff --git a/...e/left-side-nav/interrogation-services/vulnerability-database/security-hub.component.scss b/...e/left-side-nav/interrogation-services/vulnerability-database/security-hub.component.scss
@@ -3,29 +3,28 @@
 }
 
 .label-critical {
-  background:red;
-  color:#621501;
+  background:#ff4d2e;
+  color:#000;
 }
 
-
 .label-danger {
-  background:#e64524!important;
-  color:#621501!important;
+  background:#ff8f3d!important;
+  color:#000!important;
 }
 
 .label-medium {
-  background-color: orange;
-  color:#621501;
+  background-color: #ffce66;
+  color:#000;
 }
 
 .label-low {
-  background: #007CBB;
-  color:#cab6b1;
+  background: #fff1ad;
+  color:#000;
 }
 
 .label-none {
-  background-color: grey;
-  color:#bad7ba;
+  background-color: #2ec0ff;
+  color:#000;
 }
 
 .no-border {

diff --git a/...ervices/vulnerability-database/vulnerability-summary/vulnerability-summary.component.scss b/...ervices/vulnerability-database/vulnerability-summary/vulnerability-summary.component.scss
@@ -64,31 +64,29 @@ $row-height: 48px;
   align-items: center;
 }
 
-
 .label-critical {
-  background:red;
-  color:#621501;
+  background:#ff4d2e;
+  color:#000;
 }
 
-
 .label-danger {
-  background:#e64524!important;
-  color:#621501!important;
+  background:#ff8f3d!important;
+  color:#000!important;
 }
 
 .label-medium {
-  background-color: orange;
-  color:#621501;
+  background-color: #ffce66;
+  color:#000;
 }
 
 .label-low {
-  background: #007CBB;
-  color:#cab6b1;
+  background: #fff1ad;
+  color:#000;
 }
 
 .label-none {
-  background-color: grey;
-  color:#bad7ba;
+  background-color: #2ec0ff;
+  color:#000;
 }
 
 .no-border {

diff --git a/...ifact/artifact-additions/artifact-vulnerabilities/artifact-vulnerabilities.component.scss b/...ifact/artifact-additions/artifact-vulnerabilities/artifact-vulnerabilities.component.scss
@@ -19,29 +19,28 @@
 }
 
 .label-critical {
-  background:red;
-  color:#621501;
+  background:#ff4d2e;
+  color:#000;
 }
 
-
 .label-danger {
-  background:#e64524!important;
-  color:#621501!important;
+  background:#ff8f3d!important;
+  color:#000!important;
 }
 
 .label-medium {
-  background-color: orange;
-  color:#621501;
+  background-color: #ffce66;
+  color:#000;
 }
 
 .label-low {
-  background: #007CBB;
-  color:#cab6b1;
+  background: #fff1ad;
+  color:#000;
 }
 
 .label-none {
-  background-color: grey;
-  color:#bad7ba;
+  background-color: #2ec0ff;
+  color:#000;
 }
 
 .no-border {

diff --git a/.../artifact/vulnerability-scanning/result-tip-histogram/result-tip-histogram.component.scss b/.../artifact/vulnerability-scanning/result-tip-histogram/result-tip-histogram.component.scss
@@ -54,23 +54,23 @@ $twenty-two-pixel: 18px;
 }
 
 .bar-block-critical {
-    background-color: red;
+    background-color: #ff4d2e;
 }
 
 .bar-block-high {
-    background-color: #e64524;
+    background-color: #ff8f3d;
 }
 
 .bar-block-medium {
-    background-color: orange;
+    background-color: #ffce66;
 }
 
 .bar-block-low {
-    background-color: #007CBB;
+    background-color: #fff1ad;
 }
 
 .bar-block-none {
-    background-color: green;
+    background-color: #2ec0ff;
 }
 
 .bar-block-unknown {

diff --git a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/scanning.scss b/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/scanning.scss
@@ -157,29 +157,28 @@ hr{
 }
 
 .label-critical {
-    background:red;
-    color:#621501;
+    background:#ff4d2e;
+    color:#000;
 }
 
-
 .label-danger {
-    background:#e64524!important;
-    color:#621501!important;
+    background:#ff8f3d!important;
+    color:#000!important;
 }
 
 .label-medium {
-    background-color: orange;
-    color:#621501;
+    background-color: #ffce66;
+    color:#000;
 }
 
 .label-low {
-    background: #007CBB;
-    color:#cab6b1;
+    background: #fff1ad;
+    color:#000;
 }
 
 .label-none {
-    background-color: grey;
-    color:#bad7ba;
+    background-color: #2ec0ff;
+    color:#000;
 }
 
 .no-border {