Add trigger border to outer container.

src/card.ts

@@ -1494,10 +1494,15 @@ export class FrigateCard extends LitElement {
       outerStyle['padding-top'] = `${padding}%`;
     }
 
+    const outerClasses = {
+      container: true,
+      outer: true,
+      triggered: !!this._triggered && this._getConfig().view.scan.trigger_show_border,
+    }
+
     const contentClasses = {
       'frigate-card-contents': true,
       absolute: padding != null,
-      triggered: !!this._triggered && this._getConfig().view.scan.trigger_show_border,
     };
 
     const actions = this._getMergedActions();
@@ -1518,7 +1523,7 @@ export class FrigateCard extends LitElement {
       @frigate-card:render=${() => this.requestUpdate()}
     >
       ${renderMenuAbove ? this._renderMenu() : ''}
-      <div class="container outer" style="${styleMap(outerStyle)}">
+      <div class="${classMap(outerClasses)}" style="${styleMap(outerStyle)}">
         <div class="${classMap(contentClasses)}">
           ${this._cameras === undefined
             ? until(

src/scss/card.scss

@@ -23,6 +23,20 @@
   // boundary.
   border-radius: var(--ha-card-border-radius, 4px);
 }
+.container.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;  
+}
 
 .frigate-card-contents {
   width: inherit;
@@ -42,20 +56,6 @@
   // Hide scrollbar: IE and Edge
   -ms-overflow-style: none;
 }
-.frigate-card-contents.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 */
 .frigate-card-contents::-webkit-scrollbar {

src/utils/ha/index.ts

@@ -105,10 +105,10 @@ export function getHassDifferences(
 
   const differences: HassStateDifference[] = [];
   for (const entity of entities) {
-    const oldState = oldHass?.states[entity];
-    const newState = newHass.states[entity];
+    const oldState: HassEntity | undefined = oldHass?.states[entity];
+    const newState: HassEntity | undefined = newHass.states[entity];
     if (
-      (options?.stateOnly && oldState?.state !== newState.state) ||
+      (options?.stateOnly && oldState?.state !== newState?.state) ||
       (!options?.stateOnly && oldState !== newState)
     ) {
       differences.push({