fix: change fonts on gauge and single-stat to Proxima Nova

Previously, these fonts used Rubik, which doesn't exist in this repo anymore, which caused the fonts to fallback to the browser default, which appeared to be Times New Roman, or a generic serif font.

Author: hoorayimhelping

giraffe/src/components/Gauge/Gauge.tsx

@@ -317,7 +317,7 @@ const drawGaugeLabels = (
   const arcIncrement = arcLength / lineCount
 
   // Format labels text
-  ctx.font = `bold ${labelFontSize}px Rubik`
+  ctx.font = `bold ${labelFontSize}px 'Proxima Nova', Helvetica, Arial, Tahoma, Verdana, sans-serif`
   ctx.fillStyle = labelColor
   ctx.textBaseline = 'middle'
   ctx.textAlign = 'right'
@@ -356,7 +356,7 @@ const drawGaugeValue = (
   const {gaugePosition, prefix, suffix, decimalPlaces} = props
   const {valueColor, valuePositionYOffset, valuePositionXOffset} = props.theme
 
-  ctx.font = `${labelValueFontSize}px Rubik`
+  ctx.font = `${labelValueFontSize}px 'Proxima Nova', Helvetica, Arial, Tahoma, Verdana, sans-serif`
   ctx.fillStyle = valueColor
   ctx.textBaseline = 'middle'
   ctx.textAlign = 'center'

giraffe/src/components/Input/Input.scss

@@ -14,7 +14,7 @@
   border: 2px solid #383846;
   box-sizing: border-box;
   color: #bec2cc;
-  font-family: 'Rubik', Helvetica, Arial, Tahoma, Verdana, sans-serif;
+  font-family: 'Proxima Nova', Helvetica, Arial, Tahoma, Verdana, sans-serif;
   font-weight: 500;
   outline: none;
   position: relative;

giraffe/src/constants/singleStatStyles.ts

@@ -5,25 +5,26 @@ export const LASER = '#00C9FF'
 export const SINGLE_STAT_DEFAULT_TEST_ID = 'giraffe-layer-single-stat'
 
 export const SINGLE_STAT_DEFAULT_STYLE: CSS.Properties = {
-  display: 'flex',
   alignItems: 'center',
-  justifyContent: 'center',
-  overflow: 'hidden',
-  width: '100%',
-  height: '100%',
-  padding: '8px',
+  borderRadius: '4px',
+  bottom: 0,
   color: LASER,
-  userSelect: 'text',
-  WebkitUserSelect: 'text',
+  cursor: 'text',
+  display: 'flex',
+  fontFamily: '"Proxima Nova", Helvetica, Arial, Tahoma, Verdana, sans-serif',
+  height: '100%',
+  justifyContent: 'center',
+  left: 0,
   MozUserSelect: 'text',
   msUserSelect: 'text',
-  cursor: 'text',
+  overflow: 'hidden',
+  padding: '8px',
   position: 'absolute',
-  top: 0,
-  left: 0,
   right: 0,
-  bottom: 0,
-  borderRadius: '4px',
+  top: 0,
+  userSelect: 'text',
+  WebkitUserSelect: 'text',
+  width: '100%',
 }
 
 export const SINGLE_STAT_RESIZER_DEFAULT_STYLE: CSS.Properties = {