updated chat bot

chatbot/brain.rive

@@ -1,20 +1,55 @@
 ! version = 2.0
 
+//bot Substitutions
+! sub i'm     = i am
+! sub i'd     = i would
+! sub i've    = i have
+! sub i'll    = i will
+! sub don't   = do not
+! sub isn't   = is not
+! sub you'd   = you would
+! sub you're  = you are
+! sub you've  = you have
+! sub you'll  = you will
+! sub what's  = what is
+! sub whats   = what is
+! sub what're = what are
+! sub what've = what have
+! sub what'll = what will
+! sub who's   = who is
+! sub name's  = name is
+
 + (hello|hi)
 - hello, what is your name?
 
-+ who are you
-- I am RIVI bot
++ (who|what) are you
+- I am RIVI bot <i class="fas fa-robot fa-lg"></i>
+
++ [*] my name is *
+- <set name=<star>>Nice to meet you, <b><get name></b>.
+- <set name=<star>>Great name you've got there, <b><get name></b>.
+
++ (what is my name|who am i|do you know my name)
+* <get name> == undefined => Tell me your name please
+- You're <get name>, right?
 
-+ my name is *
-- nice to meet you <star>
-- nice meeting you <star>
++ [*] nice to meet you [*]
+- <i class="fas fa-laugh-beam fa-lg"></i>
 
 + thank you
 - you are welcome
 - welcome
 - no problem
 
++ [(what|who)] [(is|are)] rivi [(is|are)]
+- RIVI is a newly formed organization on software and technology. <i><a href="#r-section1">more info</a></i>
+
++ [*] (members|team) [*]
+-<i><a href="#r-section4">see here</a></i> <i class="fas fa-smile-beam fa-lg"></i>
+
++[*] (products|softwares) [*]
+-you can see all the products <i><a href="#r-section3">here</a></i>
+
 + *
 - Sorry did not get what you said
 - I am afraid that i can not understand you

css/main.css

@@ -259,7 +259,7 @@ body {
     box-shadow: -11px -1px 19px -1px rgba(0,0,0,0.59);
     z-index: 200;
     display: none;
-    background-color: crimson;
+    background-color:rgba(165, 34, 34, 1);
 }
 
 
@@ -321,4 +321,11 @@ div.chatclose{
     border-radius: 0;
     border-top-right-radius: 10px;
 }
+div.chaticon .fa-qrcode{
+    color: white;
+}
+div.chaticon button{
+    background-color:rgba(165, 34, 34, 1);
+}
+
 

index.html

@@ -313,12 +313,11 @@ <h5>Quick links</h5>
   </div>
 
  <div class="chaticon" >
-  <button type="button" onclick="bottoggle()" class="btn btn-danger  rounded" data-toggle="tooltip" data-placement="left" title="click to ask questions">
+  <button type="button" onclick="bottoggle()" class="btn rounded" data-toggle="tooltip" data-placement="left" title="click to ask questions">
     <i class="fas fa-qrcode fa-2x"></i>
   </button>
 </div>
 
-
   <!-- Optional JavaScript -->
   <!-- jQuery first, then Popper.js, then Bootstrap JS -->
   <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"

js/main.js

@@ -171,11 +171,23 @@ form.addEventListener('submit', (e) => {
  input_box.value = '';
 });
 function botReply(message){
- message_container.innerHTML += `<span class="bot">${message}</span>`;
+ message_container.innerHTML += 
+ `<div class="container">
+ <div class="row">
+ <!--<span><i class="fas fa-angle-double-right"></i></span>-->
+ <span class="bot">${message}</span>
+ </div>
+ </div>`;
  location.href = '#edge';
 }
+
 function selfReply(message){
- message_container.innerHTML += `<span class="self">${message}</span>`;
+ message_container.innerHTML += 
+ `<div class="container">
+ <div class="row">
+<span class="self">${message}</span>
+</div>
+</div>`;
  location.href = '#edge';
 
  bot.reply("local-user", message).then(function(reply) {