triggers panel: blink option

dist/css/grafana-zabbix.dark.css

@@ -19,6 +19,31 @@
       font-weight: bold; }
       .triggers-panel-container .trigger-info-block .zabbix-trigger-source .gicon-datasources {
         opacity: 0.4; }
+  .triggers-panel-container .card-item-wrapper {
+    padding-left: 4px; }
+
+.zabbix-trigger-card {
+  position: relative; }
+  .zabbix-trigger-card--alerting {
+    border-bottom-color: #161719;
+    box-shadow: 0 0 10px rgba(204, 57, 0, 0.1);
+    animation: zabbix-triggers-panel 1.6s cubic-bezier(1, 0.1, 0.73, 1) 0s infinite alternate; }
+  .zabbix-trigger-card--alerting::after {
+    position: relative; }
+
+.zabbix-trigger--blinked {
+  opacity: 0.5;
+  animation: zabbix-triggers-icon 1.1s cubic-bezier(0.46, 0.03, 0.52, 0.96) 0s infinite alternate; }
+
+@keyframes zabbix-triggers-panel {
+  100% {
+    opacity: 1;
+    box-shadow: 0 0 10px 0px #cc3900;
+    border-bottom-color: rgba(204, 57, 0, 0.25); } }
+
+@keyframes zabbix-triggers-icon {
+  100% {
+    opacity: 1; } }
 
 .triggers-panel-footer {
   text-align: center;

dist/css/grafana-zabbix.dark.css.map

@@ -8,6 +8,6 @@
 		"../../src/sass/_variables.scss",
 		"../../src/sass/_panel-triggers.scss"
 	],
-	"mappings": "AIAA,AAAA,sBAAsB,CAAC;EACrB,QAAQ,EAAE,IAAK,GAChB;;AAED,AAAA,yBAAyB,CAAC;EACxB,QAAQ,EAAE,QAAS,GA4BpB;EA7BD,AAGE,yBAHuB,CAGvB,gBAAgB,CAAC;IACf,KAAK,EHCU,OAAO;IGAtB,WAAW,EAAE,IAAK;IAClB,WAAW,EAAE,IAAK,GACnB;EAPH,AASkB,yBATO,CASvB,gBAAgB,AAAA,qBAAqB,CAAC;IACpC,KAAK,EHJU,OAAO,GGKvB;EAXH,AAaE,yBAbuB,CAavB,mBAAmB,CAAC;IAClB,OAAO,EAAE,MAAO,GAcjB;IA5BH,AAgBI,yBAhBqB,CAavB,mBAAmB,CAGjB,CAAC,EAhBL,AAgBO,yBAhBkB,CAavB,mBAAmB,CAGd,CAAC,CAAC;MACH,WAAW,EAAE,MAAO;MACpB,KAAK,EHbQ,OAAO,GGcrB;IAnBL,AAqBI,yBArBqB,CAavB,mBAAmB,CAQjB,sBAAsB,CAAC;MACrB,YAAY,EAAE,MAAO;MACrB,WAAW,EAAE,IAAK,GAInB;MA3BL,AAwBM,yBAxBmB,CAavB,mBAAmB,CAQjB,sBAAsB,CAGpB,kBAAkB,CAAC;QACjB,OAAO,EAAE,GAAI,GACd;;AAKP,AAAA,sBAAsB,CAAC;EACrB,UAAU,EAAE,MAAO;EACnB,SAAS,EAAE,GAAI;EACf,WAAW,EAAE,GAAI;EACjB,WAAW,EAAE,GAAI,GA0BlB;EA9BD,AAME,sBANoB,CAMpB,EAAE,CAAC;IACD,QAAQ,EAAE,QAAS;IACnB,OAAO,EAAE,YAAa;IACtB,WAAW,EAAE,CAAE;IACf,aAAa,EAAE,CAAE,GAClB;EAXH,AAYO,sBAZe,CAYpB,EAAE,GAAG,EAAE,CAAC;IACN,OAAO,EAAE,MAAO,GACjB;EAdH,AAeY,sBAfU,CAepB,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC;IACV,KAAK,EAAE,IAAK;IACZ,OAAO,EAAE,QAAS;IAClB,eAAe,EAAE,IAAK;IACtB,iBAAiB,EAAE,CAAE,GAUtB;IA7BH,AAeY,sBAfU,CAepB,EAAE,GAAG,EAAE,GAAG,CAAC,AAMR,MAAM,CAAC;MACN,gBAAgB,EHvBE,IAAI,GGwBvB;IAvBL,AAeY,sBAfU,CAepB,EAAE,GAAG,EAAE,GAAG,CAAC,AAUR,OAAO,CAAC;MACP,WAAW,EAAE,IAAK;MAClB,KAAK,EHzCa,OAAO,GG0C1B;;AAIL,AACE,YADU,CACV,aAAa,CAAC;EAEZ,SAAS,EAAE,gBAAiB;EAC5B,SAAS,EAAE,gBAAiB,GAC7B;;AALH,AAOE,YAPU,CAOV,aAAa,CAAC;EACZ,KAAK,EAAE,GAAI,GACZ;;AATH,AAWE,YAXU,CAWV,eAAe,CAAC;EACd,WAAW,EAAE,IAAK,GACnB;;AAbH,AAeQ,YAfI,CAeV,KAAK,CAAC,EAAE,EAfV,AAeY,YAfA,CAeA,EAAE,CAAC;EACX,aAAa,EAAE,IAAK,GACrB;;AAjBH,AAmBE,YAnBU,CAmBV,gBAAgB,CAAC;EACf,WAAW,EAAE,IAAK,GAWnB;EA/BH,AAsBI,YAtBQ,CAmBV,gBAAgB,CAGd,KAAK,CAAC;IACJ,MAAM,EAAE,SAAU;IAClB,aAAa,EAAE,GAAI;IACnB,KAAK,EAAE,GAAI,GACZ;EA1BL,AA4BI,YA5BQ,CAmBV,gBAAgB,CASd,MAAM,CAAC;IACL,WAAW,EAAE,IAAK,GACnB;;AAIL,AAAA,yBAAyB,AACtB,cAAc,CAAC;EACd,WAAW,EAAE,GAAI;EACjB,cAAc,EAAE,GAAI,GACrB;;AAJH,AAME,yBANuB,CAMvB,QAAQ,CAAC;EACP,SAAS,EAAE,IAAK,GACjB",
+	"mappings": "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",
 	"names": []
 }

dist/css/grafana-zabbix.light.css

@@ -19,6 +19,31 @@
       font-weight: bold; }
       .triggers-panel-container .trigger-info-block .zabbix-trigger-source .gicon-datasources {
         opacity: 0.4; }
+  .triggers-panel-container .card-item-wrapper {
+    padding-left: 4px; }
+
+.zabbix-trigger-card {
+  position: relative; }
+  .zabbix-trigger-card--alerting {
+    border-bottom-color: #161719;
+    box-shadow: 0 0 10px rgba(255, 65, 54, 0.1);
+    animation: zabbix-triggers-panel 1.6s cubic-bezier(1, 0.1, 0.73, 1) 0s infinite alternate; }
+  .zabbix-trigger-card--alerting::after {
+    position: relative; }
+
+.zabbix-trigger--blinked {
+  opacity: 0.5;
+  animation: zabbix-triggers-icon 1.1s cubic-bezier(0.46, 0.03, 0.52, 0.96) 0s infinite alternate; }
+
+@keyframes zabbix-triggers-panel {
+  100% {
+    opacity: 1;
+    box-shadow: 0 0 10px 0px #ff4136;
+    border-bottom-color: rgba(255, 65, 54, 0.25); } }
+
+@keyframes zabbix-triggers-icon {
+  100% {
+    opacity: 1; } }
 
 .triggers-panel-footer {
   text-align: center;

dist/css/grafana-zabbix.light.css.map

@@ -8,6 +8,6 @@
 		"../../src/sass/_variables.scss",
 		"../../src/sass/_panel-triggers.scss"
 	],
-	"mappings": "AIAA,AAAA,sBAAsB,CAAC;EACrB,QAAQ,EAAE,IAAK,GAChB;;AAED,AAAA,yBAAyB,CAAC;EACxB,QAAQ,EAAE,QAAS,GA4BpB;EA7BD,AAGE,yBAHuB,CAGvB,gBAAgB,CAAC;IACf,KAAK,EHCU,OAAO;IGAtB,WAAW,EAAE,IAAK;IAClB,WAAW,EAAE,IAAK,GACnB;EAPH,AASkB,yBATO,CASvB,gBAAgB,AAAA,qBAAqB,CAAC;IACpC,KAAK,EHJU,OAAO,GGKvB;EAXH,AAaE,yBAbuB,CAavB,mBAAmB,CAAC;IAClB,OAAO,EAAE,MAAO,GAcjB;IA5BH,AAgBI,yBAhBqB,CAavB,mBAAmB,CAGjB,CAAC,EAhBL,AAgBO,yBAhBkB,CAavB,mBAAmB,CAGd,CAAC,CAAC;MACH,WAAW,EAAE,MAAO;MACpB,KAAK,EHbQ,OAAO,GGcrB;IAnBL,AAqBI,yBArBqB,CAavB,mBAAmB,CAQjB,sBAAsB,CAAC;MACrB,YAAY,EAAE,MAAO;MACrB,WAAW,EAAE,IAAK,GAInB;MA3BL,AAwBM,yBAxBmB,CAavB,mBAAmB,CAQjB,sBAAsB,CAGpB,kBAAkB,CAAC;QACjB,OAAO,EAAE,GAAI,GACd;;AAKP,AAAA,sBAAsB,CAAC;EACrB,UAAU,EAAE,MAAO;EACnB,SAAS,EAAE,GAAI;EACf,WAAW,EAAE,GAAI;EACjB,WAAW,EAAE,GAAI,GA0BlB;EA9BD,AAME,sBANoB,CAMpB,EAAE,CAAC;IACD,QAAQ,EAAE,QAAS;IACnB,OAAO,EAAE,YAAa;IACtB,WAAW,EAAE,CAAE;IACf,aAAa,EAAE,CAAE,GAClB;EAXH,AAYO,sBAZe,CAYpB,EAAE,GAAG,EAAE,CAAC;IACN,OAAO,EAAE,MAAO,GACjB;EAdH,AAeY,sBAfU,CAepB,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC;IACV,KAAK,EAAE,IAAK;IACZ,OAAO,EAAE,QAAS;IAClB,eAAe,EAAE,IAAK;IACtB,iBAAiB,EAAE,CAAE,GAUtB;IA7BH,AAeY,sBAfU,CAepB,EAAE,GAAG,EAAE,GAAG,CAAC,AAMR,MAAM,CAAC;MACN,gBAAgB,EH7CH,OAAO,GG8CrB;IAvBL,AAeY,sBAfU,CAepB,EAAE,GAAG,EAAE,GAAG,CAAC,AAUR,OAAO,CAAC;MACP,WAAW,EAAE,IAAK;MAClB,KAAK,EH1Ca,OAAO,GG2C1B;;AAIL,AACE,YADU,CACV,aAAa,CAAC;EAEZ,SAAS,EAAE,gBAAiB;EAC5B,SAAS,EAAE,gBAAiB,GAC7B;;AALH,AAOE,YAPU,CAOV,aAAa,CAAC;EACZ,KAAK,EAAE,GAAI,GACZ;;AATH,AAWE,YAXU,CAWV,eAAe,CAAC;EACd,WAAW,EAAE,IAAK,GACnB;;AAbH,AAeQ,YAfI,CAeV,KAAK,CAAC,EAAE,EAfV,AAeY,YAfA,CAeA,EAAE,CAAC;EACX,aAAa,EAAE,IAAK,GACrB;;AAjBH,AAmBE,YAnBU,CAmBV,gBAAgB,CAAC;EACf,WAAW,EAAE,IAAK,GAWnB;EA/BH,AAsBI,YAtBQ,CAmBV,gBAAgB,CAGd,KAAK,CAAC;IACJ,MAAM,EAAE,SAAU;IAClB,aAAa,EAAE,GAAI;IACnB,KAAK,EAAE,GAAI,GACZ;EA1BL,AA4BI,YA5BQ,CAmBV,gBAAgB,CASd,MAAM,CAAC;IACL,WAAW,EAAE,IAAK,GACnB;;AAIL,AAAA,yBAAyB,AACtB,cAAc,CAAC;EACd,WAAW,EAAE,GAAI;EACjB,cAAc,EAAE,GAAI,GACrB;;AAJH,AAME,yBANuB,CAMvB,QAAQ,CAAC;EACP,SAAS,EAAE,IAAK,GACjB",
+	"mappings": "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",
 	"names": []
 }

dist/panel-triggers/partials/module.html

@@ -3,11 +3,11 @@
     <section class="card-section card-list-layout-list">
       <ol class="card-list">
         <li class="card-item-wrapper" ng-repeat="trigger in ctrl.currentTriggersPage">
-          <div class="alert-list card-item card-item--alert">
+          <div class="alert-list card-item zabbix-trigger-card">
             <div class="alert-list-body">
-              <div class="alert-list-icon alert-list-item-state"
+              <div class="alert-list-icon alert-list-item-state alert-list-icon--alerting"
                 ng-style="{color: trigger.color}">
-                <i class="icon-gf" ng-class="trigger.value === '1' ? 'icon-gf-critical' : 'icon-gf-online'"></i>
+                <i class="icon-gf" ng-class="ctrl.getAlertStateIcon(trigger)"></i>
               </div>
               <div class="alert-list-main">
                 <p class="alert-list-title">

dist/panel-triggers/partials/options_tab.html

@@ -123,7 +123,7 @@
         <label class="gf-form-label width-3">{{ trigger.priority }}</label>
         <label class="gf-form-label triggers-severity-config"
           ng-style="{color: trigger.color}">
-          <i class="icon-gf icon-gf-critical"></i>
+          <i class="icon-gf" ng-class="ctrl.getAlertStateIcon(trigger)"></i>
         </label>
         <input type="text"
           class="gf-form-input width-12"
@@ -141,6 +141,12 @@
         checked="trigger.show"
         on-change="ctrl.refresh()">
       </gf-form-switch>
+      <gf-form-switch class="gf-form"
+        label-class="width-0"
+        label="Blink"
+        checked="trigger.blink"
+        on-change="ctrl.refresh()">
+      </gf-form-switch>
     </div>
 
     <div class="gf-form-inline">
@@ -148,7 +154,7 @@
         <label class="gf-form-label width-3">&nbsp;</label>
         <label class="gf-form-label triggers-severity-config"
           ng-style="{color: editor.panel.ackEventColor}">
-          <i class="icon-gf icon-gf-critical"></i>
+          <i class="icon-gf icon-gf-online"></i>
         </label>
         <label class="gf-form-label width-12">
           Acknowledged color
@@ -169,7 +175,7 @@
         <label class="gf-form-label width-3">&nbsp;</label>
         <label class="gf-form-label triggers-severity-config"
           ng-style="{color: editor.panel.okEventColor}">
-          <i class="icon-gf icon-gf-critical"></i>
+          <i class="icon-gf icon-gf-online"></i>
         </label>
         <label class="gf-form-label width-12">
           OK event color

dist/panel-triggers/triggers_panel_ctrl.js

@@ -119,7 +119,7 @@ System.register(['lodash', 'jquery', 'moment', '../datasource-zabbix/utils', 'ap
 
       _export('DEFAULT_TARGET', DEFAULT_TARGET);
 
-      _export('DEFAULT_SEVERITY', DEFAULT_SEVERITY = [{ priority: 0, severity: 'Not classified', color: '#B7DBAB', show: true }, { priority: 1, severity: 'Information', color: '#82B5D8', show: true }, { priority: 2, severity: 'Warning', color: '#E5AC0E', show: true }, { priority: 3, severity: 'Average', color: '#C15C17', show: true }, { priority: 4, severity: 'High', color: '#BF1B00', show: true }, { priority: 5, severity: 'Disaster', color: '#890F02', show: true }]);
+      _export('DEFAULT_SEVERITY', DEFAULT_SEVERITY = [{ priority: 0, severity: 'Not classified', color: '#B7DBAB', show: true, blink: false }, { priority: 1, severity: 'Information', color: '#82B5D8', show: true, blink: false }, { priority: 2, severity: 'Warning', color: '#E5AC0E', show: true, blink: false }, { priority: 3, severity: 'Average', color: '#C15C17', show: true, blink: false }, { priority: 4, severity: 'High', color: '#BF1B00', show: true, blink: true }, { priority: 5, severity: 'Disaster', color: '#890F02', show: true, blink: true }]);
 
       _export('DEFAULT_SEVERITY', DEFAULT_SEVERITY);
 
@@ -183,7 +183,7 @@ System.register(['lodash', 'jquery', 'moment', '../datasource-zabbix/utils', 'ap
           _this.datasources = {};
 
           _this.panel = migratePanelSchema(_this.panel);
-          _.defaults(_this.panel, _.cloneDeep(PANEL_DEFAULTS));
+          _.defaultsDeep(_this.panel, _.cloneDeep(PANEL_DEFAULTS));
 
           _this.available_datasources = _.map(_this.getZabbixDataSources(), 'name');
           if (_this.panel.datasources.length === 0) {
@@ -528,6 +528,26 @@ System.register(['lodash', 'jquery', 'moment', '../datasource-zabbix/utils', 'ap
               return "";
             }
           }
+        }, {
+          key: 'getAlertStateIcon',
+          value: function getAlertStateIcon(trigger) {
+            var triggerValue = Number(trigger.value);
+            var iconClass = '';
+            if (triggerValue || trigger.color) {
+              if (trigger.priority >= 3) {
+                iconClass = 'icon-gf-critical';
+              } else {
+                iconClass = 'icon-gf-warning';
+              }
+            } else {
+              iconClass = 'icon-gf-online';
+            }
+
+            if (this.panel.triggerSeverity[trigger.priority].blink) {
+              iconClass += ' zabbix-trigger--blinked';
+            }
+            return iconClass;
+          }
         }, {
           key: 'link',
           value: function link(scope, elem, attrs, ctrl) {

src/panel-triggers/partials/module.html

@@ -3,11 +3,11 @@
     <section class="card-section card-list-layout-list">
       <ol class="card-list">
         <li class="card-item-wrapper" ng-repeat="trigger in ctrl.currentTriggersPage">
-          <div class="alert-list card-item card-item--alert">
+          <div class="alert-list card-item zabbix-trigger-card">
             <div class="alert-list-body">
-              <div class="alert-list-icon alert-list-item-state"
+              <div class="alert-list-icon alert-list-item-state alert-list-icon--alerting"
                 ng-style="{color: trigger.color}">
-                <i class="icon-gf" ng-class="trigger.value === '1' ? 'icon-gf-critical' : 'icon-gf-online'"></i>
+                <i class="icon-gf" ng-class="ctrl.getAlertStateIcon(trigger)"></i>
               </div>
               <div class="alert-list-main">
                 <p class="alert-list-title">

src/panel-triggers/partials/options_tab.html

@@ -123,7 +123,7 @@
         <label class="gf-form-label width-3">{{ trigger.priority }}</label>
         <label class="gf-form-label triggers-severity-config"
           ng-style="{color: trigger.color}">
-          <i class="icon-gf icon-gf-critical"></i>
+          <i class="icon-gf" ng-class="ctrl.getAlertStateIcon(trigger)"></i>
         </label>
         <input type="text"
           class="gf-form-input width-12"
@@ -141,6 +141,12 @@
         checked="trigger.show"
         on-change="ctrl.refresh()">
       </gf-form-switch>
+      <gf-form-switch class="gf-form"
+        label-class="width-0"
+        label="Blink"
+        checked="trigger.blink"
+        on-change="ctrl.refresh()">
+      </gf-form-switch>
     </div>
 
     <div class="gf-form-inline">
@@ -148,7 +154,7 @@
         <label class="gf-form-label width-3">&nbsp;</label>
         <label class="gf-form-label triggers-severity-config"
           ng-style="{color: editor.panel.ackEventColor}">
-          <i class="icon-gf icon-gf-critical"></i>
+          <i class="icon-gf icon-gf-online"></i>
         </label>
         <label class="gf-form-label width-12">
           Acknowledged color
@@ -169,7 +175,7 @@
         <label class="gf-form-label width-3">&nbsp;</label>
         <label class="gf-form-label triggers-severity-config"
           ng-style="{color: editor.panel.okEventColor}">
-          <i class="icon-gf icon-gf-critical"></i>
+          <i class="icon-gf icon-gf-online"></i>
         </label>
         <label class="gf-form-label width-12">
           OK event color

src/panel-triggers/triggers_panel_ctrl.js

@@ -17,12 +17,12 @@ export const DEFAULT_TARGET = {
 };
 
 export const DEFAULT_SEVERITY = [
-  { priority: 0, severity: 'Not classified',  color: '#B7DBAB', show: true },
+  { priority: 0, severity: 'Not classified',  color: '#B7DBAB', show: true, blink: false },
-  { priority: 1, severity: 'Information',     color: '#82B5D8', show: true },
+  { priority: 1, severity: 'Information',     color: '#82B5D8', show: true, blink: false },
-  { priority: 2, severity: 'Warning',         color: '#E5AC0E', show: true },
+  { priority: 2, severity: 'Warning',         color: '#E5AC0E', show: true, blink: false },
-  { priority: 3, severity: 'Average',         color: '#C15C17', show: true },
+  { priority: 3, severity: 'Average',         color: '#C15C17', show: true, blink: false },
-  { priority: 4, severity: 'High',            color: '#BF1B00', show: true },
+  { priority: 4, severity: 'High',            color: '#BF1B00', show: true, blink: true },
-  { priority: 5, severity: 'Disaster',        color: '#890F02', show: true }
+  { priority: 5, severity: 'Disaster',        color: '#890F02', show: true, blink: true },
 ];
 
 const DEFAULT_TIME_FORMAT = "DD MMM YYYY HH:mm:ss";
@@ -79,7 +79,7 @@ export class TriggerPanelCtrl extends PanelCtrl {
     this.datasources = {};
 
     this.panel = migratePanelSchema(this.panel);
-    _.defaults(this.panel, _.cloneDeep(PANEL_DEFAULTS));
+    _.defaultsDeep(this.panel, _.cloneDeep(PANEL_DEFAULTS));
 
     this.available_datasources = _.map(this.getZabbixDataSources(), 'name');
     if (this.panel.datasources.length === 0) {
@@ -394,6 +394,25 @@ export class TriggerPanelCtrl extends PanelCtrl {
     }
   }
 
+  getAlertStateIcon(trigger) {
+    const triggerValue = Number(trigger.value);
+    let iconClass = '';
+    if (triggerValue || trigger.color) {
+      if (trigger.priority >= 3) {
+        iconClass = 'icon-gf-critical';
+      } else {
+        iconClass = 'icon-gf-warning';
+      }
+    } else {
+      iconClass = 'icon-gf-online';
+    }
+
+    if (this.panel.triggerSeverity[trigger.priority].blink) {
+      iconClass += ' zabbix-trigger--blinked';
+    }
+    return iconClass;
+  }
+
   link(scope, elem, attrs, ctrl) {
     let panel = ctrl.panel;
     let pageCount = 0;

src/sass/_panel-triggers.scss

@@ -31,6 +31,57 @@
       }
     }
   }
+
+  .card-item-wrapper {
+    padding-left: 4px;
+  }
+}
+
+.zabbix-trigger-card {
+  position: relative;
+  &--alerting {
+    // box-shadow: 0 0 10px rgba($red, 0.5);
+    // position: relative;
+    border-bottom-color: rgba(#161719, 1);
+    box-shadow: 0 0 10px rgba($red, 0.1);
+    animation: zabbix-triggers-panel 1.6s cubic-bezier(1, .1, .73, 1) 0s infinite alternate;
+  }
+  &--alerting::after {
+    position: relative;
+  }
+  // &--alerting::after {
+  //   content: '';
+  //   position: absolute;
+  //   top: 0;
+  //   z-index: -1;
+  //   width: 100%;
+  //   height: 100%;
+  //   box-shadow: 0 0 10px rgba($red, 1);
+  //   opacity: 0;
+  //   animation: alerting-panel 1.6s cubic-bezier(1, .1, .73, 1) 0s infinite alternate;
+  // }
+}
+
+.zabbix-trigger {
+  &--blinked {
+    opacity: 0.5;
+    animation: zabbix-triggers-icon 1.1s cubic-bezier(0.46, 0.03, 0.52, 0.96) 0s infinite alternate;
+  }
+}
+
+
+@keyframes zabbix-triggers-panel {
+  100% {
+    opacity: 1;
+    box-shadow: 0 0 10px 0px rgba($red, 1);
+    border-bottom-color: rgba($red, 0.25);
+  }
+}
+
+@keyframes zabbix-triggers-icon {
+  100% {
+    opacity: 1;
+  }
 }
 
 .triggers-panel-footer {