From 6995e581eea27924cc47cd253be737f8b5e0ea4f Mon Sep 17 00:00:00 2001
From: Dermot Duffy <dermot.duffy@gmail.com>
Date: Tue, 7 Sep 2021 21:17:41 -0700
Subject: [PATCH] Force media to 100% width.

---
 src/frigate-hass-card.ts | 4 +++-
 src/scss/card.scss       | 2 +-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/frigate-hass-card.ts b/src/frigate-hass-card.ts
index 5c696483..3510c528 100644
--- a/src/frigate-hass-card.ts
+++ b/src/frigate-hass-card.ts
@@ -827,6 +827,7 @@ export class FrigateCard extends LitElement {
       ${this._view.is('clip')
         ? resolvedMedia?.mime_type.toLowerCase() == 'application/x-mpegurl'
           ? html`<ha-hls-player
+              class="media"
               .hass=${this._hass}
               .url=${resolvedMedia.url}
               title="${mediaToRender.title}"
@@ -838,6 +839,7 @@ export class FrigateCard extends LitElement {
             >
             </ha-hls-player>`
           : html`<video
+              class="media"
               title="${mediaToRender.title}"
               muted
               controls
@@ -854,7 +856,7 @@ export class FrigateCard extends LitElement {
             </video>`
         : html`<img
             src=${resolvedMedia.url}
-            class="snapshot"
+            class="media"
             title="${mediaToRender.title}"
             @click=${() => {
               // Get clips potentially related to this snapshot.
diff --git a/src/scss/card.scss b/src/scss/card.scss
index 71a4d6d4..e0ab7c39 100644
--- a/src/scss/card.scss
+++ b/src/scss/card.scss
@@ -22,7 +22,7 @@
   scrollbar-width: none;    /* Hide scrollbar: Firefox */
 }
 
-.frigate-card-contents img.snapshot {
+.frigate-card-contents img.media,video.media {
   width: 100%;
 }