From e062940639421bcc0b14d40949138c0806a3e5b9 Mon Sep 17 00:00:00 2001
From: Zack Arnett <arnett.zackary@gmail.com>
Date: Wed, 11 Mar 2020 03:42:34 -0400
Subject: [PATCH] Media Card: Fix Style Maps (#5120)

* Fix style map

* Comments
---
 src/panels/lovelace/cards/hui-media-control-card.ts | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/panels/lovelace/cards/hui-media-control-card.ts b/src/panels/lovelace/cards/hui-media-control-card.ts
index 0acada127f..bd2b224854 100644
--- a/src/panels/lovelace/cards/hui-media-control-card.ts
+++ b/src/panels/lovelace/cards/hui-media-control-card.ts
@@ -164,7 +164,7 @@ export class HuiMediaControlCard extends LitElement implements LovelaceCard {
     const imageStyle = {
       "background-image": `url(${this.hass.hassUrl(this._image)})`,
       width: `${this._cardHeight}px`,
-      "background-color": `${this._backgroundColor}`,
+      "background-color": this._backgroundColor || "",
     };
 
     const gradientStyle = {
@@ -190,11 +190,15 @@ export class HuiMediaControlCard extends LitElement implements LovelaceCard {
         >
           <div
             class="color-block"
-            style=${styleMap({ "background-color": this._backgroundColor! })}
+            style=${styleMap({
+              "background-color": this._backgroundColor || "",
+            })}
           ></div>
           <div
             class="no-img"
-            style=${styleMap({ "background-color": this._backgroundColor! })}
+            style=${styleMap({
+              "background-color": this._backgroundColor || "",
+            })}
           ></div>
           <div class="image" style=${styleMap(imageStyle)}></div>
           ${hasNoImage
@@ -213,7 +217,7 @@ export class HuiMediaControlCard extends LitElement implements LovelaceCard {
             off: isOffState || isUnavailable,
             "no-progress": !this._showProgressBar && !this._veryNarrow,
           })}"
-          style=${styleMap({ color: this._foregroundColor! })}
+          style=${styleMap({ color: this._foregroundColor || "" })}
         >
           <div class="top-info">
             <div class="icon-name">