Reduction contrast of grid lines

change the color of lineColor with #35373B for horizontal grid lines , #2B2E31 for vertical grid lines and background with #232323 Fixes eclipse-cdt-cloud#441 Signed-off-by: Ibrahim Fradj <ibrahim.fradj@ericsson.com>
IbrahimFradj · Aug 23, 2021 · b73e833 · b73e833
1 parent cb7d812
commit b73e833
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 5 deletions.
diff --git a/packages/react-components/src/components/timegraph-output-component.tsx b/packages/react-components/src/components/timegraph-output-component.tsx
@@ -81,7 +81,7 @@ export class TimegraphOutputComponent extends AbstractTreeOutputComponent<Timegr
             rowStyleProvider: (row: TimelineChart.TimeGraphRowModel) => ({
                 backgroundColor: 0x979797,// 0xaaaaff,
                 backgroundOpacity: row.selected ? 0.1 : 0,
-                lineColor: 0xdddddd, // hasStates ? 0xdddddd : 0xaa4444, // row.data && row.data.hasStates
+                lineColor: 0x35373B , // hasStates ? 0xdddddd : 0xaa4444, // row.data && row.data.hasStates
                 lineThickness: 1, // hasStates ? 1 : 3 // row.data && row.data.hasStates
             })
         };
@@ -328,7 +328,7 @@ export class TimegraphOutputComponent extends AbstractTreeOutputComponent<Timegr
     }
 
     private getChartContainer() {
-        const grid = new TimeGraphChartGrid('timeGraphGrid', this.props.style.rowHeight, this.props.style.lineColor);
+        const grid = new TimeGraphChartGrid('timeGraphGrid', this.props.style.rowHeight, 0x2B2E31);
         const selectionRange = new TimeGraphChartSelectionRange('chart-selection-range', { color: this.props.style.cursorColor });
         return <ReactTimeGraphContainer
             options={
@@ -337,7 +337,7 @@ export class TimegraphOutputComponent extends AbstractTreeOutputComponent<Timegr
                     height: parseInt(this.props.style.height.toString()),
                     width: this.props.style.chartWidth, // this.props.style.mainWidth,
                     backgroundColor: this.props.style.chartBackgroundColor,
-                    lineColor: this.props.style.lineColor,
+                    lineColor: 0x2B2E31,
                     classNames: 'horizontal-canvas'
                 }
             }

diff --git a/packages/react-components/src/components/trace-context-component.tsx b/packages/react-components/src/components/trace-context-component.tsx
@@ -101,7 +101,7 @@ export class TraceContextComponent extends React.Component<TraceContextProps, Tr
                 height: this.DEFAULT_COMPONENT_HEIGHT,
                 rowHeight: this.DEFAULT_COMPONENT_ROWHEIGHT,
                 naviBackgroundColor: this.props.backgroundTheme === 'light' ? 0xf4f7fb : 0x3f3f3f,
-                chartBackgroundColor: this.props.backgroundTheme === 'light' ? 0xf4f7fb : 0x3f3f3f,
+                chartBackgroundColor: this.props.backgroundTheme === 'light' ? 0xf4f7fb : 0x232323,
                 cursorColor: 0x259fd8,
                 lineColor: this.props.backgroundTheme === 'light' ? 0x757575 : 0xbbbbbb
             },
@@ -135,7 +135,7 @@ export class TraceContextComponent extends React.Component<TraceContextProps, Tr
                 height: this.DEFAULT_COMPONENT_HEIGHT,
                 rowHeight: this.DEFAULT_COMPONENT_ROWHEIGHT,
                 naviBackgroundColor: theme === 'light' ? 0xf4f7fb : 0x3f3f3f,
-                chartBackgroundColor: theme === 'light' ? 0xf4f7fb : 0x3f3f3f,
+                chartBackgroundColor: theme === 'light' ? 0xf4f7fb : 0x232323,
                 cursorColor: 0x259fd8,
                 lineColor: theme === 'light' ? 0x757575 : 0xbbbbbb
             },