Make chatbox blink

PerfectFit-project · May 17, 2023 · 95cc453 · 95cc453
1 parent 819c5b7
commit 95cc453
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 0 deletions.
diff --git a/frontend/static/css/style.css b/frontend/static/css/style.css
@@ -205,6 +205,7 @@ textarea-webkit-scrollbar {
 	width: 100%;
 	padding: 5px;
 	border-radius: 0px 0px 10px 10px;
+	animation: border-flicker-green 0.5s linear;
 }
 
 #sendButton {
@@ -312,6 +313,24 @@ textarea-webkit-scrollbar {
 	}
 }
 
+@keyframes border-flicker-green {
+	0% {
+	  box-shadow: 5px 5px 20px #09ff00;
+	}
+	25% {
+	  box-shadow: 5px 5px 20px #09ff00;
+	}
+	50% {
+	  box-shadow: 5px 5px 50px #09ff00;
+	}
+	75% {
+	  box-shadow: 5px 5px 20px #09ff00;
+	}
+	100% {
+	  box-shadow: 5px 5px 20px #09ff00;
+	}
+  }
+
 
 /*========== css related to chats elements============= */
 

diff --git a/frontend/static/js/script.js b/frontend/static/js/script.js
@@ -521,6 +521,16 @@ function doScaledTimeout(i, response, summed_timeout) {
 	}, summed_timeout);
 }
 
+function blink() {
+	var f = document.getElementById('keypad');
+	setTimeout(function() {
+	   f.style.boxShadow = '5px 5px 50px #09ff00';
+		setTimeout(function() {
+		   f.style.boxShadow = 'none';
+		}, 1000);
+	}, 1000);
+ }
+
 
 //====================================== Toggle chatbot =======================================
 $("#profile_div").click(function () {