change color on gauge

Author: andresdlt03

control-station/index.html

@@ -7,6 +7,9 @@
             type="image/svg+xml"
             href="/vite.svg"
         />
+        <link rel="preconnect" href="https://fonts.googleapis.com">
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+        <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
         <meta
             name="viewport"
             content="width=device-width, initial-scale=1.0"

control-station/src/components/GaugeTag/Gauge/Gauge.module.scss

@@ -9,16 +9,16 @@
 .rainbowArc {
     background: conic-gradient(
         from 220deg,
-        #7295ef,
-        60deg,
-        #7aefcc,
-        130deg,
-        #efe84a,
-        190deg,
-        #ffab2c,
-        240deg,
-        #ff1e1e,
-        330deg,
-        #7295ef
+        #91e473,
+        40deg,
+        #9BF37C,
+        80deg,
+        #F4E55E,
+        120deg,
+        #F4E55E,
+        220deg,
+        #F3785C,
+        310deg,
+        #F3785C
     );
 }

control-station/src/components/GaugeTag/TextData/TextData.module.scss

@@ -1,3 +1,5 @@
+@use "../../../styles/fonts.scss";
+
 .textData {
     display: flex;
     flex-direction: column;
@@ -10,20 +12,22 @@
 
     .name {
         font-weight: inherit;
-        font-size: 0.7em;
-        font-weight: 400;
+        font-family: map-get($map: fonts.$font-families, $key: roboto);
+        font-size: map-get($map: fonts.$font-sizes, $key: x-small);
+        font-weight: map-get($map: fonts.$font-weights, $key: light);
         font-style: italic;
     }
 
     .value {
-        font-family: var(--font-mono);
+        font-family: map-get($map: fonts.$font-families, $key: roboto);
         font-size: 1.8em;
-        font-weight: 600;
+        font-weight: map-get($map: fonts.$font-weights, $key: bold);
     }
 
     .units {
         font-weight: inherit;
-        font-size: 1em;
-        font-weight: 400;
+        font-family: map-get($map: fonts.$font-families, $key: roboto);
+        font-size: map-get($map: fonts.$font-sizes, $key: small);
+        font-weight: map-get($map: fonts.$font-weights, $key: normal);
     }
 }

control-station/src/styles/fonts.scss

@@ -3,6 +3,7 @@
 $font-families: (
     sans: "Inter",
     mono: "JetBrains Mono, IBM Plex Mono, monospace",
+    roboto: "Roboto"
 );
 
 $font-sizes: (