Merge pull request #486 from gemini-testing/sp.colorScheme

chore(css): sync colors for components
gemini-testing · Aug 10, 2023 · 0791d99 · 0791d99
2 parents 7904417 + 0a6bd0b
commit 0791d99
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 24 deletions.
diff --git a/lib/static/components/header/summary/summary.css b/lib/static/components/header/summary/summary.css
@@ -13,19 +13,19 @@
 }
 
 .summary__key_passed {
-    color: #169737;
+    color: var(--report-color-success);
 }
 
 .summary__key_failed {
-    color: #cf0c3d;
+    color: var(--report-color-fail);
 }
 
 .summary__key_retries {
     color: #ff9a9a;
 }
 
 .summary__key_skipped {
-    color: #8c8c8c;
+    color: var(--report-color-skip);
 }
 
 .summary__value {
@@ -54,7 +54,7 @@
 }
 
 .ui.db-info.db-info_failed {
-    color: #cf0c3d !important;
+    color: var(--report-color-fail) !important;
 }
 
 .ui.basic.db-info.db-info_failed:hover {
@@ -67,11 +67,11 @@
 }
 
 .db-info__row_success {
-    color: #038035;
+    color: var(--report-color-success);
     font-weight: bold;
 }
 
 .db-info__row_fail {
-    color: #c00;
+    color: var(--report-color-fail);
     font-weight: bold;
 }
diff --git a/lib/static/gui.css b/lib/static/gui.css
@@ -31,14 +31,14 @@
 
 .section_status_success > .section__title .bullet_type-simple:before,
 .state-title_success:before {
-    color: #038035;
+    color: var(--report-color-success);
 }
 
 .section_status_fail > .section__title .bullet_type-simple:before,
 .section_status_error > .section__title .bullet_type-simple:before,
 .state-title_fail:before,
 .state-title_error:before {
-    color: #c00;
+    color: var(--report-color-fail);
 }
 
 .section_status_skipped > .section__title .bullet_type-simple:before,
@@ -74,8 +74,8 @@
 .section_status_updated > .section__title .bullet_type-simple::before,
 .section_status_updated > .section__title .ui.checkbox label:before,
 .section_status_updated > .section__title .ui.checkbox label:after {
-    color: #038035 !important;
-    border-color: #038035 !important;
+    color: var(--report-color-success) !important;
+    border-color: var(--report-color-success) !important;
 }
 
 .report_show-only-errors .section_status_updated {

diff --git a/lib/static/styles.css b/lib/static/styles.css
@@ -398,21 +398,21 @@ details[open] > .details__summary:before {
 }
 
 .section_status_skipped > .section__title {
-    color: #8c8c8c;
+    color: var(--report-color-skip);
 }
 
 .section_status_skipped > .section__title .ui.checkbox label:before,
 .section_status_skipped > .section__title .ui.checkbox label:after {
-    color: #8c8c8c !important;
-    border-color: #8c8c8c !important;
+    color: var(--report-color-skip) !important;
+    border-color: var(--report-color-skip) !important;
 }
 
 .section_status_skipped > .section__title:hover {
     color: #c6c6c6;
 }
 
 .section__title_skipped {
-    color: #8c8c8c;
+    color: var(--report-color-skip);
     cursor: default;
     margin-left: 5px;
     font-weight: normal;
@@ -421,7 +421,7 @@ details[open] > .details__summary:before {
 }
 
 .section__title.section__title_skipped:hover {
-    color: #8c8c8c;
+    color: var(--report-color-skip);
 }
 
 .section__title_skipped:before {
@@ -431,15 +431,15 @@ details[open] > .details__summary:before {
 .section_status_success > .section__title,
 .state-title_success,
 .state-title_updated {
-    color: #038035;
+    color: var(--report-color-success);
 }
 
 .section_status_success > .section__title .ui.checkbox label:before,
 .section_status_success > .section__title .ui.checkbox label:after,
 .section_status_updated > .section__title .ui.checkbox label:before,
 .section_status_updated > .section__title .ui.checkbox label:after {
-    color: #038035 !important;
-    border-color: #038035 !important;
+    color: var(--report-color-success) !important;
+    border-color: var(--report-color-success) !important;
 }
 
 .section_status_success > .section__title:hover,
@@ -452,15 +452,15 @@ details[open] > .details__summary:before {
 .section_status_error > .section__title,
 .state-title_fail,
 .state-title_error {
-    color: #c00;
+    color: var(--report-color-fail);
 }
 
 .section_status_fail > .section__title .ui.checkbox label:before,
 .section_status_fail > .section__title .ui.checkbox label:after,
 .section_status_error > .section__title .ui.checkbox label:before,
 .section_status_error > .section__title .ui.checkbox label:after {
-    color: #c00 !important;
-    border-color: #c00 !important;
+    color: var(--report-color-fail) !important;
+    border-color: var(--report-color-fail) !important;
 }
 
 .section_status_fail > .section__title:hover,
@@ -668,7 +668,7 @@ details[open] > .details__summary:before {
 
 .skipped__list {
     margin: 10px 0;
-    color: #8c8c8c;
+    color: var(--report-color-skip);
 }
 
 .skipped-test__title {

diff --git a/lib/static/variables.css b/lib/static/variables.css
@@ -0,0 +1,5 @@
+:root {
+    --report-color-fail: rgba(255, 4, 0, 0.9);
+    --report-color-skip: #8c8c8c;
+    --report-color-success: #169737;
+}
diff --git a/webpack.common.js b/webpack.common.js
@@ -14,8 +14,8 @@ const staticPath = path.resolve(__dirname, 'build', 'lib', 'static');
 
 module.exports = {
     entry: {
-        report: ['./index.jsx', './styles.css'],
-        gui: ['./gui.jsx', './styles.css', './gui.css']
+        report: ['./index.jsx', './variables.css', './styles.css'],
+        gui: ['./gui.jsx', './variables.css', './styles.css', './gui.css']
     },
     resolve: {
         extensions: ['.js', '.jsx', '.ts', '.tsx']