Tweak browser-player card icons

This commit is contained in:
Thomas Lovén 2021-11-02 20:20:12 +00:00
parent 604a34540e
commit a0a50d701a

View File

@ -27,8 +27,11 @@ Promise.race(bases).then(() => {
return {}; return {};
} }
setConfig(config) { async setConfig(config) {
this._config = config; this._config = config;
while (!window.browser_mod) {
await new Promise((resolve) => setTimeout(resolve, 1000));
}
for (const event of [ for (const event of [
"play", "play",
"pause", "pause",
@ -72,11 +75,10 @@ Promise.race(bases).then(() => {
return html` return html`
<ha-card> <ha-card>
<div class="card-content"> <div class="card-content">
<ha-icon-button <ha-icon-button @click=${this.handleMute}>
.icon=${player.muted ? "mdi:volume-off" : "mdi:volume-high"} <ha-icon
@click=${this.handleMute} .icon=${player.muted ? "mdi:volume-off" : "mdi:volume-high"}
> ></ha-icon>
<ha-icon .icon=${player.muted ? "mdi:volume-off" : "mdi:volume-high"}></ha-icon>
</ha-icon-button> </ha-icon-button>
<ha-slider <ha-slider
min="0" min="0"
@ -90,18 +92,13 @@ Promise.race(bases).then(() => {
${window.browser_mod.player_state === "stopped" ${window.browser_mod.player_state === "stopped"
? html`<div class="placeholder"></div>` ? html`<div class="placeholder"></div>`
: html` : html`
<ha-icon-button <ha-icon-button @click=${this.handlePlayPause} highlight>
.icon=${player.paused ? "mdi:play" : "mdi:pause"} <ha-icon
@click=${this.handlePlayPause} .icon=${player.paused ? "mdi:play" : "mdi:pause"}
highlight ></ha-icon>
>
<ha-icon .icon=${player.paused ? "mdi:play" : "mdi:pause"}></ha-icon>
</ha-icon-button> </ha-icon-button>
`} `}
<ha-icon-button <ha-icon-button @click=${this.handleMoreInfo}>
.icon=${"mdi:cog"}
@click=${this.handleMoreInfo}
>
<ha-icon .icon=${"mdi:cog"}></ha-icon> <ha-icon .icon=${"mdi:cog"}></ha-icon>
</ha-icon-button> </ha-icon-button>
</div> </div>
@ -133,6 +130,9 @@ Promise.race(bases).then(() => {
-moz-user-select: all; -moz-user-select: all;
-ms-user-select: all; -ms-user-select: all;
} }
ha-icon-button ha-icon {
display: flex;
}
`; `;
} }
} }