From d5a373b10719aa3b0df58f8ce58ad9454fd5da7a Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Thu, 16 Jan 2025 13:53:37 +0530
Subject: [PATCH] fix: added blink animation

---
 .../src/components/Telephony/ExotelCallUI.vue | 20 ++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/Telephony/ExotelCallUI.vue b/frontend/src/components/Telephony/ExotelCallUI.vue
index b4731cd7..8cd142c9 100644
--- a/frontend/src/components/Telephony/ExotelCallUI.vue
+++ b/frontend/src/components/Telephony/ExotelCallUI.vue
@@ -37,7 +37,7 @@
         </span>
         <span
           v-else-if="callStatus == 'Call Ended' || callStatus == 'No Answer'"
-          class="font-normal text-ink-gray-4"
+          class="font-normal text-ink-gray-4 blink"
           :class="{
             'text-red-700':
               callStatus == 'Call Ended' || callStatus == 'No Answer',
@@ -64,6 +64,7 @@
         </div>
         <div
           v-else-if="callStatus == 'Call Ended' || callStatus == 'No Answer'"
+          class="blink"
           :class="{
             'text-red-700':
               callStatus == 'Call Ended' || callStatus == 'No Answer',
@@ -327,3 +328,20 @@ function updateStatus(data) {
 
 defineExpose({ makeOutgoingCall, setup })
 </script>
+<style scoped>
+@keyframes blink {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+.blink {
+  animation: blink 1s ease-in-out 6;
+}
+</style>