From 7b840527b5d07349dde040c0a292e2f65e86d7a1 Mon Sep 17 00:00:00 2001 From: Bram Kragten Date: Mon, 27 Dec 2021 06:56:24 +0100 Subject: [PATCH] Fix gauge on ios 15.2 (#10992) --- src/components/ha-gauge.ts | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/src/components/ha-gauge.ts b/src/components/ha-gauge.ts index fd3a378e42..9ce1259669 100644 --- a/src/components/ha-gauge.ts +++ b/src/components/ha-gauge.ts @@ -8,6 +8,10 @@ import { FrontendLocaleData } from "../data/translation"; import { getValueInPercentage, normalize } from "../util/calculate"; import { isSafari } from "../util/is_safari"; +// Safari version 15.2 and up behaves differently than other Safari versions. +// https://github.com/home-assistant/frontend/issues/10766 +const isSafari152 = isSafari && /Version\/15\.[^0-1]/.test(navigator.userAgent); + const getAngle = (value: number, min: number, max: number) => { const percentage = getValueInPercentage(normalize(value, min, max), min, max); return (percentage * 180) / 100; @@ -113,7 +117,9 @@ export class Gauge extends LitElement { : undefined )} transform=${ifDefined( - isSafari ? `rotate(${this._angle} 50 50)` : undefined + isSafari + ? `rotate(${this._angle}${isSafari152 ? "" : " 50 50"})` + : undefined )} > ` @@ -126,7 +132,9 @@ export class Gauge extends LitElement { : undefined )} transform=${ifDefined( - isSafari ? `rotate(${this._angle} 50 50)` : undefined + isSafari + ? `rotate(${this._angle}${isSafari152 ? "" : " 50 50"})` + : undefined )} >` }