fix(comparison-table): adjust checkmark color (#392)

allianz · Sep 23, 2021 · d218b95 · d218b95
1 parent 5fd0a42
commit d218b95
Show file tree

Hide file tree

Showing 6 changed files with 42 additions and 20 deletions.
diff --git a/...omparison-table/comparison-table-form-elements/comparison-table-form-elements-example.css b/...omparison-table/comparison-table-form-elements/comparison-table-form-elements-example.css
@@ -1,5 +1,5 @@
 .container {
-  background: var(--documentation-comparison-table-example-background-color, #0f2a3d);
+  background: var(--documentation-comparison-table-example-background-color);
   padding: 12px;
 }
 
@@ -26,11 +26,15 @@
 }
 
 .minus-icon {
-  color: var(--documentation-comparison-table-example-minus-color, #ada8a8);
+  color: var(--documentation-comparison-table-example-minus-color);
 }
 
 .check-icon {
-  color: var(--success, #26AE31);
+  color: var(--success);
+}
+
+::ng-deep .is-selected .check-icon {
+  color: var(--success-02, --success);
 }
 
 .header-container {

diff --git a/...parison-table/comparison-table-hidden-columns/comparison-table-hidden-columns-example.css b/...parison-table/comparison-table-hidden-columns/comparison-table-hidden-columns-example.css
@@ -1,6 +1,6 @@
 .container {
   padding: 12px;
-  background: var(--documentation-comparison-table-example-background-color, #0f2a3d);
+  background: var(--documentation-comparison-table-example-background-color);
 }
 
 .product-title {
@@ -80,9 +80,13 @@
 }
 
 .minus-icon {
-  color: var(--documentation-comparison-table-example-minus-color, #ada8a8);
+  color: var(--documentation-comparison-table-example-minus-color);
 }
 
 .check-icon {
-  color: var(--success, #26AE31);
-}
+  color: var(--success);
+}
+
+::ng-deep .is-selected .check-icon {
+  color: var(--success-02, --success);
+}
diff --git a/...amples/comparison-table/comparison-table-row-group/comparison-table-row-group-example.css b/...amples/comparison-table/comparison-table-row-group/comparison-table-row-group-example.css
@@ -1,5 +1,5 @@
 .container {
-  background: var(--documentation-comparison-table-example-background-color, #0f2a3d);
+  background: var(--documentation-comparison-table-example-background-color);
   padding: 12px;
 }
 
@@ -25,10 +25,13 @@
 }
 
 .minus-icon {
-  color: var(--documentation-comparison-table-example-minus-color, #ada8a8);
+  color: var(--documentation-comparison-table-example-minus-color);
 }
 
 .check-icon {
-  color: var(--success, #26AE31);
+  color: var(--success);
 }
 
+::ng-deep .is-selected .check-icon {
+  color: var(--success-02, --success);
+}
diff --git a/...n-table/comparison-table-with-intersection/comparison-table-with-intersection-example.css b/...n-table/comparison-table-with-intersection/comparison-table-with-intersection-example.css
@@ -1,6 +1,6 @@
 .container {
   padding: 12px;
-  background: var(--documentation-comparison-table-example-background-color, #0f2a3d);
+  background: var(--documentation-comparison-table-example-background-color);
 }
 
 .product-title {
@@ -83,13 +83,16 @@
 }
 
 .minus-icon {
-  color: var(--documentation-comparison-table-example-minus-color, #ada8a8);
+  color: var(--documentation-comparison-table-example-minus-color);
 }
 
 .check-icon {
-  color: var(--success, #26AE31);
+  color: var(--success);
 }
 
+::ng-deep .is-selected .check-icon {
+  color: var(--success-02, --success);
+}
 .service-lists {
   display: flex;
 }
@@ -99,9 +102,9 @@
 }
 
 ul.benefits-list ::ng-deep nx-icon {
-  color: var(--success, #26AE31);
+  color: var(--success);
 }
 
 .benefits-list li {
   text-align: left;
-}
+}
diff --git a/...e/comparison-table-with-toggle-sections/comparison-table-with-toggle-sections-example.css b/...e/comparison-table-with-toggle-sections/comparison-table-with-toggle-sections-example.css
@@ -1,5 +1,5 @@
 .container {
-  background: var(--documentation-comparison-table-example-background-color, #0f2a3d);
+  background: var(--documentation-comparison-table-example-background-color);
   padding: 12px;
 }
 
@@ -26,11 +26,15 @@
 }
 
 .minus-icon {
-  color: var(--documentation-comparison-table-example-minus-color, #ada8a8);
+  color: var(--documentation-comparison-table-example-minus-color);
 }
 
 .check-icon {
-  color: var(--success, #26AE31);
+  color: var(--success);
+}
+
+::ng-deep .is-selected .check-icon {
+  color: var(--success-02, --success);
 }
 
 .header-container {

diff --git a/...ila/documentation/examples/comparison-table/comparison-table/comparison-table-example.css b/...ila/documentation/examples/comparison-table/comparison-table/comparison-table-example.css
@@ -80,11 +80,15 @@
 }
 
 .minus-icon {
-  color: var(--documentation-comparison-table-example-minus-color, #ada8a8);
+  color: var(--documentation-comparison-table-example-minus-color);
 }
 
 .check-icon {
-  color: var(--success, #26AE31);
+  color: var(--success);
+}
+
+::ng-deep .is-selected .check-icon {
+  color: var(--success-02, --success);
 }
 
 .spinner {