Switched icons in custom cards to ha-icon from paper-icons

This commit is contained in:
Martin Bauer
2020-07-14 13:42:58 +00:00
parent da8c19f568
commit 5103532b48
8 changed files with 135 additions and 130 deletions

File diff suppressed because one or more lines are too long

View File

@@ -17,5 +17,9 @@
"typescript": "^3.8.3",
"webpack": "^4.42.1",
"webpack-cli": "^3.3.11"
},
"dependencies": {
"@polymer/iron-icons": "^3.0.1",
"@polymer/paper-icon-button": "^3.0.2"
}
}

View File

@@ -2,7 +2,8 @@ import {LitElement, html, css, customElement, property, TemplateResult, CSSResul
import {classMap} from "lit-html/directives/class-map";
import {styleMap} from "lit-html/directives/style-map";
import {HomeAssistant} from "./home-assistant-interface";
//import '@polymer/paper-icon-button/paper-icon-button.js';
//import '@polymer/iron-icons/iron-icons.js';
@customElement("room-glance-card")
export class RoomGlanceCard extends LitElement {
@@ -84,52 +85,52 @@ export class RoomGlanceCard extends LitElement {
private renderSceneButton(buttonCfg: any) {
return html`
<paper-icon-button
<ha-icon-button
icon="${buttonCfg.icon || "mdi:checkbox-blank"}"
style="color: ${buttonCfg.color || ""};"
title="${buttonCfg.name}"
@click=${this.serviceHandler("scene", "turn_on", {entity_id: buttonCfg.scene})}
></paper-icon-button>
></ha-icon-button>
`;
}
private renderLightControl() {
return html`
<paper-icon-button
<ha-icon-button
icon="mdi:close-circle"
@click=${this.serviceHandler("light", "turn_off")}
></paper-icon-button>
></ha-icon-button>
<paper-icon-button
<ha-icon-button
icon="mdi:chevron-up"
title="Heller"
@click=${this.serviceHandler("dimmer", "dim", {offset: 30})}
></paper-icon-button>
<paper-icon-button
></ha-icon-button>
<ha-icon-button
icon="mdi:chevron-down"
title="Dunkler"
@click=${this.serviceHandler("dimmer", "dim", {offset: -30})}
></paper-icon-button>`;
></ha-icon-button>`;
}
private renderCoverControl() {
return html`
<paper-icon-button
<ha-icon-button
icon="hass:menu"
@click=${this.serviceHandler("cover_half", "set_half")}
></paper-icon-button>
<paper-icon-button
></ha-icon-button>
<ha-icon-button
icon="hass:arrow-up"
@click=${this.serviceHandler("cover", "open_cover")}
></paper-icon-button>
<paper-icon-button
></ha-icon-button>
<ha-icon-button
icon="hass:stop"
@click=${this.serviceHandler("cover", "stop_cover")}
></paper-icon-button>
<paper-icon-button
></ha-icon-button>
<ha-icon-button
icon="hass:arrow-down"
@click=${this.serviceHandler("cover", "close_cover")}
></paper-icon-button>
></ha-icon-button>
`;
}