Merge pull request #454 from rsnyman/fix-result-summary-labels

Fix up font colour issues with the labels on various charts/widgets
ibutsu · Apr 4, 2023 · e3b5092 · e3b5092
2 parents 46210b3 + 9ef0e75
commit e3b5092
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 8 deletions.
diff --git a/frontend/src/index.css b/frontend/src/index.css
@@ -251,3 +251,9 @@ div[data-id=widget-param-dropdown] > div {
 :where(.pf-theme-dark) .pf-c-clipboard-copy .pf-c-form-control[readonly] {
   border-bottom-color: var(--pf-global--BorderColor--400) !important;
 }
+
+:where(.pf-theme-dark) {
+  --pf-chart-global--label--Fill: var(--pf-global--Color--100);
+  --pf-chart-axis--tick-label--Fill: var(--pf-global--Color--200);
+  --pf-chart-donut--label--title--Fill: var(--pf-global--Color--100);
+}
diff --git a/frontend/src/widgets/resultsummary.js b/frontend/src/widgets/resultsummary.js
@@ -77,14 +77,14 @@ export class ResultSummaryWidget extends React.Component {
 
   render() {
     const themeColors = [
-                  'var(--pf-global--success-color--100)',
-                  'var(--pf-global--danger-color--100)',
-                  'var(--pf-global--info-color--100)',
-                  'var(--pf-global--warning-color--100)',
-                  'var(--pf-global--palette--purple-400)',
-                  'var(--pf-global--palette--purple-700)',
-                  'var(--pf-global--primary-color--100)'
-                ];
+      'var(--pf-global--success-color--100)',
+      'var(--pf-global--danger-color--100)',
+      'var(--pf-global--info-color--100)',
+      'var(--pf-global--warning-color--100)',
+      'var(--pf-global--palette--purple-400)',
+      'var(--pf-global--palette--purple-700)',
+      'var(--pf-global--primary-color--100)'
+    ];
     return (
       <Card>
         <WidgetHeader title={this.title} getDataFunc={this.getResultSummary} onEditClick={this.props.onEditClick} onDeleteClick={this.props.onDeleteClick}/>