@@ -75,7 +75,7 @@ class MiniHumidifierDropdown extends LitElement {
padding: 0;
display: block;
}
- paper-icon-button[disabled] {
+ ha-icon-button[disabled] {
opacity: .25;
pointer-events: none;
}
@@ -86,10 +86,10 @@ class MiniHumidifierDropdown extends LitElement {
paper-item > *:nth-child(2) {
margin-left: 4px;
}
- paper-menu-button[focused] paper-icon-button {
+ paper-menu-button[focused] ha-icon-button {
color: var(--mh-accent-color);
}
- paper-menu-button[focused] paper-icon-button[focused] {
+ paper-menu-button[focused] ha-icon-button[focused] {
color: var(--mh-text-color);
transform: rotate(0deg);
}
diff --git a/src/components/info.js b/src/components/info.js
index 12bf5d4..dcfc905 100644
--- a/src/components/info.js
+++ b/src/components/info.js
@@ -12,7 +12,7 @@ class MiniHumidifierInfo extends LitElement {
renderDepth(context) {
return html`
-
+
${context.humidifier.depth}
${context.config.depth.unit}
@@ -22,7 +22,7 @@ class MiniHumidifierInfo extends LitElement {
renderTemperature(context) {
return html`
-
+
${context.humidifier.temperature}
${context.config.temperature.unit}
@@ -32,7 +32,7 @@ class MiniHumidifierInfo extends LitElement {
renderHumidity(context) {
return html`
-
+
${context.humidifier.humidity}
${context.config.humidity.unit}
@@ -82,6 +82,7 @@ class MiniHumidifierInfo extends LitElement {
height: calc(var(--mh-unit) * .475);
width: calc(var(--mh-unit) * .425);
color: var(--mh-icon-color);
+ --mdc-icon-size: calc(var(--mh-unit) * .425);
}
.state__value {
margin: 0 1px;
diff --git a/src/components/powerstrip.js b/src/components/powerstrip.js
index 6a5107f..c5a1041 100644
--- a/src/components/powerstrip.js
+++ b/src/components/powerstrip.js
@@ -29,11 +29,11 @@ class MiniHumidifierPowerstrip extends LitElement {
}
return html`
- this.humidifier.togglePower(e)}
?color=${this.humidifier.isOn}>
-
+
`;
}
diff --git a/src/components/targetHumiditySlider.js b/src/components/targetHumiditySlider.js
index ea5dced..04a1ed2 100644
--- a/src/components/targetHumiditySlider.js
+++ b/src/components/targetHumiditySlider.js
@@ -21,7 +21,7 @@ class MiniHumidifierTargetHumiditySlider extends LitElement {
return html`
-
+
${sliderValue}
${this.config.target_humidity.unit}
@@ -76,6 +76,7 @@ class MiniHumidifierTargetHumiditySlider extends LitElement {
.state__value_icon {
height: calc(var(--mh-unit) * .475);
width: calc(var(--mh-unit) * .425);
+ --mdc-icon-size: calc(var(--mh-unit) * .425);
color: var(--mh-icon-color);
}
.state__value {
diff --git a/src/main.js b/src/main.js
index ff2c425..3c63921 100644
--- a/src/main.js
+++ b/src/main.js
@@ -21,6 +21,13 @@ if (!customElements.get('ha-slider')) {
);
}
+if (!customElements.get('ha-icon-button')) {
+ customElements.define(
+ 'ha-icon-button',
+ class extends customElements.get('paper-icon-button') {},
+ );
+}
+
class MiniHumidifier extends LitElement {
constructor() {
super();
@@ -109,6 +116,13 @@ class MiniHumidifier extends LitElement {
name: 'High',
hide: false,
order: 3,
+ },
+ {
+ id: 'strong',
+ value: 'Strong',
+ name: 'Strong',
+ hide: true,
+ order: 4,
}];
const data = Object.entries(fanModeConf.source);
@@ -221,7 +235,7 @@ class MiniHumidifier extends LitElement {
this.config.depth = {
icon: ICON.DEPTH,
- max_value: 120,
+ max_value: 125,
unit_type: 'percent',
fixed: 0,
order: 0,
@@ -249,6 +263,7 @@ class MiniHumidifier extends LitElement {
unit: '°C',
source: { enitity: undefined, attribute: undefined },
order: 1,
+ fixed: 1,
hide: false,
...config.temperature || {},
};
@@ -257,6 +272,7 @@ class MiniHumidifier extends LitElement {
unit: '%',
source: { enitity: undefined, attribute: undefined },
order: 2,
+ fixed: 1,
hide: false,
...config.humidity || {},
};
@@ -345,10 +361,10 @@ class MiniHumidifier extends LitElement {
return html`
-
this.handleToggle(e)}>
-
+
-
+
${this.secondaryInfoLabel}
`;
diff --git a/src/model.js b/src/model.js
index 4e076b8..a29c752 100644
--- a/src/model.js
+++ b/src/model.js
@@ -112,11 +112,13 @@ export default class HumidifierObject {
}
get temperature() {
- return this.getValue(this.config.temperature.source, this.attr.temperature);
+ const value = this.getValue(this.config.temperature.source, this.attr.temperature);
+ return this.round(value, this.config.temperature.fixed);
}
get humidity() {
- return this.getValue(this.config.humidity.source, this.attr.humidity);
+ const value = this.getValue(this.config.humidity.source, this.attr.humidity);
+ return this.round(value, this.config.humidity.fixed);
}
getValue(config, defaultValue) {
diff --git a/src/sharedStyle.js b/src/sharedStyle.js
index 3cb0879..9a9bbc8 100644
--- a/src/sharedStyle.js
+++ b/src/sharedStyle.js
@@ -13,17 +13,18 @@ const sharedStyle = css`
width: calc(var(--mh-unit) * .6);
height: calc(var(--mh-unit) * .6);
}
- paper-icon-button {
+ ha-icon-button {
width: calc(var(--mh-unit));
height: calc(var(--mh-unit));
+ --mdc-icon-button-size: calc(var(--mh-unit));
color: var(--mh-button-color);
transition: color .25s;
}
- paper-icon-button[color] {
+ ha-icon-button[color] {
color: var(--mh-icon-active-color) !important;
opacity: 1 !important;
}
- paper-icon-button[inactive] {
+ ha-icon-button[inactive] {
opacity: .5;
}
`;
diff --git a/src/style.js b/src/style.js
index a949a05..02bd15f 100644
--- a/src/style.js
+++ b/src/style.js
@@ -120,6 +120,7 @@ const style = css`
width: calc(var(--mh-unit) * .375);
height: calc(var(--mh-unit) * .375);
min-width: calc(var(--mh-unit) * .375);
+ --mdc-icon-size: calc(var(--mh-unit) * .375);
}
.entity__secondary_info {
margin-top: -2px;
@@ -160,6 +161,7 @@ const style = css`
.toggle-button {
width: calc(var(--mh-unit) * .75);
height: calc(var(--mh-unit) * .75);
+ --mdc-icon-button-size: calc(var(--mh-unit) * .75);
padding: 3px;
color: var(--mh-icon-color);
}