Add font size setting to dial

client/src/pages/dashboard/components/BoxSettings/components/DialSettings.tsx

@@ -1,4 +1,5 @@
 import { SensorInfo } from '@/api/sensors'
+import { FormField } from '@/components/FormField'
 import { DashboardDialData } from '@/utils/dashboard/parseDashboard'
 import { useForm } from '@/utils/hooks/useForm'
 import { omit } from '@/utils/omit'
@@ -41,6 +42,17 @@ export const DialSettings = ({ sensors, value, onChange }: Props) => {
 				<label>Multiplier</label>
 				<input type="number" step="any" {...register('multiplier')} />
 			</div>
+			<FormField
+				name="fontSIze"
+				label="Font size"
+				hint="Font size multiplier, default 1"
+			>
+				<input
+					type="number"
+					step="any"
+					{...register('fontSize', { type: 'number' })}
+				/>
+			</FormField>
 		</>
 	)
 }

client/src/pages/dashboard/components/DashboardGrid/components/BoxDialContent.tsx

@@ -53,10 +53,14 @@ export const BoxDialContent = ({ data, ...editableBoxProps }: Props) => {
 				{showFetchLoading && <BoxLoader />}
 				<div className="dial">
 					{value.data && (
-						<>
+						<div
+							style={{
+								...(data.fontSize && { fontSize: `${data.fontSize * 100}%` }),
+							}}
+						>
 							{displayValue}
 							{data.unit && ` ${data.unit}`}
-						</>
+						</div>
 					)}
 				</div>
 			</>

client/src/utils/dashboard/parseDashboard.ts

@@ -41,6 +41,7 @@ export type DashboardDialData = {
 	unit?: string
 	decimals?: string
 	multiplier?: string
+	fontSize?: number
 }
 
 export const parseDashboard = (input: string) => {