extract graph color

jplag · Sep 27, 2023 · ee8e836 · ee8e836
1 parent 4c6bcdb
commit ee8e836
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/report-viewer/src/utils/ColorUtils.ts b/report-viewer/src/utils/ColorUtils.ts
@@ -59,18 +59,23 @@ function generateColorsForInterval(
   return colors
 }
 
+const graphRGB = {
+  red: 190,
+  green: 22,
+  blue: 34
+}
 const graphColors = {
   ticksAndFont: computed(() => {
     return store().uiState.useDarkMode ? '#ffffff' : '#000000'
   }),
   gridLines: computed(() => {
     return store().uiState.useDarkMode ? 'rgba(256, 256, 256, 0.2)' : 'rgba(0, 0, 0, 0.2)'
   }),
-  contentFill: 'rgba(190, 22, 34, 0.5)',
+  contentFill: `rgba(${graphRGB.red}, ${graphRGB.green}, ${graphRGB.blue}, 0.5)`,
   contentBorder: 'rgb(127, 15, 24)',
-  pointFill: 'rgba(190, 22, 34, 1)',
+  pointFill: `rgba(${graphRGB.red}, ${graphRGB.green}, ${graphRGB.blue}, 1)`,
   contentFillAlpha(alpha: number) {
-    return `rgba(190, 22, 34, ${alpha})`
+    return `rgba(${graphRGB.red}, ${graphRGB.green}, ${graphRGB.blue}, ${alpha})`
   }
 }
 

diff --git a/report-viewer/src/views/ClusterView.vue b/report-viewer/src/views/ClusterView.vue
@@ -51,7 +51,7 @@ import type { ComparisonListElement } from '@/model/ComparisonListElement'
 import { MetricType } from '@/model/MetricType'
 import { OverviewFactory } from '@/model/factories/OverviewFactory'
 import OptionsSelectorComponent from '@/components/optionsSelectors/OptionsSelectorComponent.vue'
-import { ref } from 'vue'
+import { ref, type Ref } from 'vue'
 
 const props = defineProps({
   clusterIndex: {