diff options
-rw-r--r-- | scripts/gui-common/widgets.js | 5 | ||||
-rw-r--r-- | styles/widgets.css | 35 |
2 files changed, 38 insertions, 2 deletions
diff --git a/scripts/gui-common/widgets.js b/scripts/gui-common/widgets.js index 8da265e..b8fe01f 100644 --- a/scripts/gui-common/widgets.js +++ b/scripts/gui-common/widgets.js @@ -938,6 +938,7 @@ class WidgetThermostat extends Widget this.element.appendChild(this.#gague); this.#unit = new WidgetButton(); + this.#unit.element.classList.add("unit"); this.element.appendChild(this.#unit.element); this.#unit.addEventListener("change", this.#unit_handler.bind(this)); @@ -978,8 +979,8 @@ class WidgetThermostat extends Widget let unit = WidgetThermostat.#UNIT_MAP[this.get("unit")]; let temp = this.get()[unit[1]]() let gague = this.get("gague")[unit[1]](); - this.#gague.innerText = `${Math.fround(gague)}`; - this.#temp.innerText = `${Math.fround(temp)}`; + this.#gague.innerText = `${Math.round(gague * 10)/10}`; + this.#temp.innerText = `${Math.round(temp * 10)/10}`; this.#unit.element.innerText = `${unit[0]}`; // Generate a percentage relative to the deviation diff --git a/styles/widgets.css b/styles/widgets.css index 9483a81..870d2aa 100644 --- a/styles/widgets.css +++ b/styles/widgets.css @@ -558,6 +558,41 @@ text-align: center; } +.thermostat > .unit { + position: absolute; + top: 5px; + right: 5px; + --width: 1; + --height: 1; + border-radius: 50%; + margin: 5px; + background-color: white; + box-shadow: none; + overflow: visible; +} + +.thermostat > .unit::after { + content: ''; + + position: absolute; + top: 0; + right: 0; + width: 100%; + height: 100%; + border-radius: 50%; + box-shadow: none; + transition-duration: 0.15s; +} + +.thermostat > .unit:active::after, .thermostat > .unit.touch::after { + transform: translate(-5px, -5px); + box-shadow: inset 5px 5px var(--w-shadow) !important; +} + +.thermostat > .unit:active, .thermostat > .unit.touch { + box-shadow: inset -5px -5px var(--w-bg-hover) !important; +} + /* Button Select */ |