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() : ''}
${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.