diff --git a/src/components/dropdown.js b/src/components/dropdown.js index 7510c58..e9b14f1 100755 --- a/src/components/dropdown.js +++ b/src/components/dropdown.js @@ -50,14 +50,14 @@ class MiniMediaPlayerDropdown extends LitElement { ${this.selected || this.label} - + `} ${this.items.map(item => html` - ${item.icon ? html`` : ''} + ${item.icon ? html`` : ''} ${item.name ? html`${item.name}` : ''} `)} @@ -121,7 +121,7 @@ class MiniMediaPlayerDropdown extends LitElement { paper-item > *:nth-child(2) { margin-left: 4px; } - paper-menu-button[focused] mmp-button iron-icon { + paper-menu-button[focused] mmp-button ha-icon { color: var(--mmp-accent-color); transform: rotate(180deg); } diff --git a/src/components/shortcuts.js b/src/components/shortcuts.js index 6e3f1d9..c2c8ab1 100755 --- a/src/components/shortcuts.js +++ b/src/components/shortcuts.js @@ -57,7 +57,7 @@ class MiniMediaPlayerShortcuts extends LitElement { class='mmp-shortcuts__button' @click=${e => this.handleShortcut(e, item)}>
- ${item.icon ? html`` : ''} + ${item.icon ? html`` : ''} ${item.image ? html`` : ''} ${item.name ? html`${item.name}` : ''}
@@ -134,7 +134,7 @@ class MiniMediaPlayerShortcuts extends LitElement { line-height: calc(var(--mmp-unit) * .6); text-transform: initial; } - .mmp-shortcuts__button > div > iron-icon { + .mmp-shortcuts__button > div > ha-icon { width: calc(var(--mmp-unit) * .6); height: calc(var(--mmp-unit) * .6); } diff --git a/src/main.js b/src/main.js index 055856c..cb54bec 100755 --- a/src/main.js +++ b/src/main.js @@ -37,6 +37,13 @@ if (!customElements.get('ha-icon-button')) { ); } +if (!customElements.get('ha-icon')) { + customElements.define( + 'ha-icon', + class extends customElements.get('iron-icon') {}, + ); +} + class MiniMediaPlayer extends LitElement { constructor() { super();