"Removed image files and replaced img tags with font awesome icons in chat.html"

templates/chat.html

@@ -27,7 +27,7 @@
 
         body {
             font-family: Arial, sans-serif;
-            background-image: url('./image/starlets.jpg');
+            background-image: url('image/starlets.jpg');
             background-size: cover;
             background-position: center;
             background-repeat: no-repeat;
@@ -210,7 +210,7 @@
         <div class="card">
             <div class="card-header">
                 <div>
-                    <img src="/image/starlets.jpg" class="user_img_msg mr-2" alt="Chatbot Avatar">
+                    <i class="fas fa-robot fa-2x user_img_msg mr-2"></i>
                     <span>Elderly Companion-Chatbot</span>
                 </div>
                 <div id="darkModeToggle">
@@ -221,7 +221,7 @@
                 <!-- Initial message -->
                 <div class="message d-flex justify-content-start mb-4">
                     <div class="img_cont_msg">
-                        <img src="/image/med.jpg" class="user_img_msg" alt="Bot Avatar">
+                        <i class="fas fa-robot fa-2x user_img_msg"></i>
                     </div>
                     <div class="msg_cotainer">
                         Hello 👋 I'm here to help you with questions related to Your Health! Please feel free to interact 😊
@@ -294,18 +294,15 @@
             $("#messageArea").on("submit", function(event) {
                 event.preventDefault();
 
-                const msg = $("#text").val().trim();
-                if (msg === "") return;
-
+                const msg = $("#text").val();
                 const currentTime = new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
-
                 const userHtml = `<div class="message d-flex justify-content-end mb-4">
                                     <div class="msg_cotainer_send">
                                         ${msg}
                                         <span class="msg_time">${currentTime}</span>
                                     </div>
                                     <div class="img_cont_msg">
-                                        <img src="/image/user.webp" class="user_img_msg" alt="User Avatar">
+                                        <i class="fas fa-user fa-2x user_img_msg"></i>
                                     </div>
                                 </div>`;
                 appendMessage(userHtml);
@@ -320,7 +317,7 @@
                     hideTypingIndicator();
                     const botHtml = `<div class="message d-flex justify-content-start mb-4">
                                         <div class="img_cont_msg">
-                                            <img src="/image/med.jpg" class="user_img_msg" alt="Bot Avatar">
+                                            <i class="fas fa-robot fa-2x user_img_msg"></i>
                                         </div>
                                         <div class="msg_cotainer">
                                             ${data.response}
@@ -346,7 +343,7 @@
                 const currentTime = new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
                 appendMessage(`<div class="message d-flex justify-content-start mb-4">
                                 <div class="img_cont_msg">
-                                    <img src="/image/med.jpg" class="user_img_msg" alt="Bot Avatar">
+                                    <i class="fas fa-robot fa-2x user_img_msg"></i>
                                 </div>
                                 <div class="msg_cotainer">
                                     Hello 👋 I'm here to help you with questions related to Your Health! Please feel free to interact 😊
@@ -365,4 +362,4 @@
         });
     </script>
 </body>
-</html>
+</html>