From 597c380ead0c5a3d75845e4210eab3cfe337432b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Mon, 13 May 2019 13:18:14 +0200 Subject: [PATCH] Gauge: tweaks to background color and height usage (#17019) --- packages/grafana-ui/src/components/Gauge/Gauge.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/grafana-ui/src/components/Gauge/Gauge.tsx b/packages/grafana-ui/src/components/Gauge/Gauge.tsx index b45712ac9b0..026b9769a70 100644 --- a/packages/grafana-ui/src/components/Gauge/Gauge.tsx +++ b/packages/grafana-ui/src/components/Gauge/Gauge.tsx @@ -69,14 +69,14 @@ export class Gauge extends PureComponent { const backgroundColor = selectThemeVariant( { - dark: theme.colors.dark3, - light: '#e6e6e6', + dark: theme.colors.dark8, + light: theme.colors.gray6, }, theme.type ); const gaugeWidthReduceRatio = showThresholdLabels ? 1.5 : 1; - const gaugeWidth = Math.min(dimension / 6, 40) / gaugeWidthReduceRatio; + const gaugeWidth = Math.min(dimension / 5, 40) / gaugeWidthReduceRatio; const thresholdMarkersWidth = gaugeWidth / 5; const fontSize = Math.min(dimension / 5.5, 100) * (value.text !== null ? this.getFontScale(value.text.length) : 1); const thresholdLabelFontSize = fontSize / 2.5; @@ -181,7 +181,7 @@ function calculateGaugeAutoProps(width: number, height: number, title: string | const titleFontSize = Math.min((width * 0.15) / 1.5, 20); // 20% of height * line-height, max 40px const titleHeight = titleFontSize * 1.5; const availableHeight = showLabel ? height - titleHeight : height; - const gaugeHeight = Math.min(availableHeight * 0.7, width); + const gaugeHeight = Math.min(availableHeight, width); return { showLabel,