From 46376918e456c1ee0073b70377fa413bcfb7a3db Mon Sep 17 00:00:00 2001
From: Dermot Duffy <dermot.duffy@gmail.com>
Date: Sat, 23 Jul 2022 19:25:03 -0700
Subject: [PATCH] Move scan mode pulsing border to the outer ha-card .

---
 src/card.ts        |  6 +++---
 src/scss/card.scss | 29 +++++++++++++++--------------
 2 files changed, 18 insertions(+), 17 deletions(-)

diff --git a/src/card.ts b/src/card.ts
index 281d6581..375116e9 100644
--- a/src/card.ts
+++ b/src/card.ts
@@ -1756,8 +1756,7 @@ export class FrigateCard extends LitElement {
     const cardStyle = {
       'aspect-ratio': this._getAspectRatioStyle(),
     };
-    const mainClasses = {
-      main: true,
+    const cardClasses = {
       triggered:
         !!this._isTriggered() && this._getConfig().view.scan.show_trigger_status,
     };
@@ -1776,6 +1775,7 @@ export class FrigateCard extends LitElement {
         hasHold: frigateCardHasAction(actions.hold_action),
         hasDoubleClick: frigateCardHasAction(actions.double_tap_action),
       })}
+      class="${classMap(cardClasses)}"
       style="${styleMap(cardStyle)}"
       @action=${(ev: CustomEvent) => this._actionHandler(ev, actions)}
       @ll-custom=${this._cardActionHandler.bind(this)}
@@ -1787,7 +1787,7 @@ export class FrigateCard extends LitElement {
       ${renderMenuAbove ? this._renderMenu() : ''}
       <div 
         ${ref(this._refMain)}
-        class="${classMap(mainClasses)}"
+        class="main"
       >
         ${this._cameras === undefined && !this._message
           ? until(
diff --git a/src/scss/card.scss b/src/scss/card.scss
index 4762a5cc..21550537 100644
--- a/src/scss/card.scss
+++ b/src/scss/card.scss
@@ -39,20 +39,6 @@ div.main {
   // Hide scrollbar: IE and Edge
   -ms-overflow-style: none;
 }
-div.main.triggered {
-  @keyframes warning-pulse {
-    0% {
-      border: solid 1px rgba(0, 0, 0, 0);
-    }
-    50% {
-      border: solid 1px var(--warning-color);
-    }
-    100% {
-      border: solid 1px rgba(0, 0, 0, 0);
-    }
-  }
-  animation: warning-pulse 5s infinite;
-}
 
 /* Hide scrollbar for Chrome, Safari and Opera */
 div.main::-webkit-scrollbar {
@@ -89,6 +75,21 @@ ha-card {
   // within the radius.
   border-radius: var(--ha-card-border-radius, 4px);
 }
+ha-card.triggered {
+  @keyframes warning-pulse {
+    0% {
+      border: solid 2px rgba(0, 0, 0, 0);
+    }
+    50% {
+      border: solid 2px var(--warning-color);
+    }
+    100% {
+      border: solid 2px rgba(0, 0, 0, 0);
+    }
+  }
+  animation: warning-pulse 5s infinite;
+}
+
 
 frigate-card-live.hidden {
   // Live view will be rendered but hidden for live preloading.