style: use Roboto font family in charts (#1360)

Signed-off-by: Pedro Lamas <pedrolamas@gmail.com>
fluidd-core · Feb 16, 2024 · dbe2c08 · dbe2c08
1 parent a277dfb
commit dbe2c08
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 2 deletions.
diff --git a/src/components/widgets/bedmesh/BedMeshChart.vue b/src/components/widgets/bedmesh/BedMeshChart.vue
@@ -148,6 +148,9 @@ export default class BedMeshChart extends Mixins(BrowserMixin) {
       legend: {
         show: false
       },
+      textStyle: {
+        fontFamily: 'Roboto'
+      },
       darkMode,
       tooltip: {
         backgroundColor: labelBackground,
@@ -221,7 +224,7 @@ export default class BedMeshChart extends Mixins(BrowserMixin) {
         <div>
           <span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${params.color};"></span>
           <span style="font-size:16px;color:#666;font-weight:400;margin-left:2px">
-            ${params.seriesName}
+            ${this.$filters.startCase(params.seriesName)}
           </span>
           <div style="clear: both"></div>
           <span style="font-size:16px;color:#666;font-weight:400;margin-left:2px">

diff --git a/src/components/widgets/diagnostics/DiagnosticsCard.vue b/src/components/widgets/diagnostics/DiagnosticsCard.vue
@@ -92,6 +92,9 @@ export default class DiagnosticsCard extends Mixins(BrowserMixin) {
     const options = {
       grid,
       color,
+      textStyle: {
+        fontFamily: 'Roboto'
+      },
       legend: {
         show: false
       },

diff --git a/src/components/widgets/thermals/ThermalChart.vue b/src/components/widgets/thermals/ThermalChart.vue
@@ -139,6 +139,9 @@ export default class ThermalChart extends Mixins(BrowserMixin) {
 
     const options = {
       grid,
+      textStyle: {
+        fontFamily: 'Roboto'
+      },
       color,
       legend: {
         show: false,

diff --git a/src/store/charts/getters.ts b/src/store/charts/getters.ts
@@ -77,6 +77,9 @@ export const getters: GetterTree<ChartState, RootState> = {
     return {
       color,
       grid,
+      textStyle: {
+        fontFamily: 'Roboto'
+      },
       tooltip: {
         ...tooltip,
         show: true,
@@ -107,7 +110,7 @@ export const getters: GetterTree<ChartState, RootState> = {
                   <div style="white-space: nowrap;">
                     ${param.marker}
                     <span style="font-size:${fontSize}px;color:${fontColor};font-weight:400;margin-left:2px">
-                      ${param.seriesName}:
+                      ${Vue.$filters.startCase(param.seriesName)}:
                     </span>
                     <span style="float:right;margin-left:20px;font-size:${fontSize}px;color:${fontColor};font-weight:900">
                       ${param.value[yDimension]}${ySuffix}