MODIFIED: amination in chatbot heading

AquibPy · Apr 24, 2024 · 7a0db2e · 7a0db2e
1 parent 7edd69d
commit 7a0db2e
Showing 1 changed file with 44 additions and 57 deletions.
diff --git a/templates/index.html b/templates/index.html
@@ -89,18 +89,16 @@
     h1 {
       font-size: 32px;
       text-align: center;
-      position: relative;
-      overflow: hidden;
       color: #007bff;
-      animation: neon 1.5s infinite alternate;
+      animation: pulse 1s infinite alternate;
     }
 
-    @keyframes neon {
+    @keyframes pulse {
       from {
-        text-shadow: 0 0 5px #007bff, 0 0 10px #007bff, 0 0 20px #007bff, 0 0 30px #007bff, 0 0 40px #007bff, 0 0 55px #007bff, 0 0 75px #007bff;
+        transform: scale(1);
       }
       to {
-        text-shadow: 0 0 10px #007bff, 0 0 20px #007bff, 0 0 30px #007bff, 0 0 40px #007bff, 0 0 55px #007bff, 0 0 75px #007bff, 0 0 100px #007bff;
+        transform: scale(1.1);
       }
     }
 
@@ -203,17 +201,6 @@
       align-self: flex-start;
     }
 
-    /* Style for message content */
-    .message-content {
-      margin-bottom: 5px;
-    }
-
-    /* Style for message timestamp */
-    .message-timestamp {
-      font-size: 12px;
-      color: #888;
-    }
-
     /* Style for preformatted code blocks */
     .bot-message-bubble pre,
     .user-message-bubble pre {
@@ -327,45 +314,45 @@ <h1>Chat with LLAMA 3 🦙🦙🦙</h1>
         console.error('Error reading response stream:', error);
     });
     messageInput.value = '';
-    }
-
-    function getCurrentDateTime() {
-        var now = new Date();
-        var date = now.toLocaleDateString();
-        var time = now.toLocaleTimeString();
-        return date + ' ' + time;
-    }
-
-    function toggleDarkMode() {
-        var body = document.body;
-        var chatContainer = document.querySelector(".chat-container");
-        var darkModeSlider = document.getElementById("dark-mode");
-        var messageTimestamps = document.querySelectorAll('.message-timestamp');
-
-        if (darkModeSlider.value === "1") {
-            body.classList.add("dark-mode");
-            chatContainer.classList.add("dark-mode");
-            messageTimestamps.forEach(function (timestamp) {
-                timestamp.style.color = '#fff'; // White text for dark mode
-            });
-        } else {
-            body.classList.remove("dark-mode");
-            chatContainer.classList.remove("dark-mode");
-            messageTimestamps.forEach(function (timestamp) {
-                timestamp.style.color = '#000'; // Black text for light mode
-            });
-        }
-    }
-
-    function displayErrorMessage(message) {
-        const errorDiv = document.createElement('div');
-        errorDiv.classList.add('error-message');
-        errorDiv.textContent = message;
-        document.getElementById("result").appendChild(errorDiv);
-        setTimeout(() => {
-            errorDiv.remove();
-        }, 3000);
-    }
+}
+
+function getCurrentDateTime() {
+    var now = new Date();
+    var date = now.toLocaleDateString();
+    var time = now.toLocaleTimeString();
+    return date + ' ' + time;
+}
+
+function toggleDarkMode() {
+    var body = document.body;
+    var chatContainer = document.querySelector(".chat-container");
+    var darkModeSlider = document.getElementById("dark-mode");
+    var messageTimestamps = document.querySelectorAll('.message-timestamp');
+
+    if (darkModeSlider.value === "1") {
+        body.classList.add("dark-mode");
+        chatContainer.classList.add("dark-mode");
+        messageTimestamps.forEach(function (timestamp) {
+            timestamp.style.color = '#fff'; // White text for dark mode
+        });
+    } else {
+        body.classList.remove("dark-mode");
+        chatContainer.classList.remove("dark-mode");
+        messageTimestamps.forEach(function (timestamp) {
+            timestamp.style.color = '#000'; // Black text for light mode
+        });
+    }
+}
+
+function displayErrorMessage(message) {
+    const errorDiv = document.createElement('div');
+    errorDiv.classList.add('error-message');
+    errorDiv.textContent = message;
+    document.getElementById("result").appendChild(errorDiv);
+    setTimeout(() => {
+        errorDiv.remove();
+    }, 3000);
+}
   </script>
 </body>
-</html>
+</html>