siddhart-srivastava
/
chatbot


			
				
					
						
						
							
							<html>
  <head>
    <style>
 /* Some miscellenous widget manipulation */
      .rw-launcher {
  -webkit-animation-delay: 0;
  -webkit-animation-duration: 0.5s;
  -webkit-animation-name: slide-in;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-delay: 0;
  -moz-animation-duration: 0.5s;
  -moz-animation-name: slide-in;
  -moz-animation-fill-mode: forwards;
  animation-delay: 0;
  animation-duration: 0.5s;
  animation-name: slide-in;
  animation-fill-mode: forwards;
  display: flex;
  align-items: center !important;
  justify-content: center;
  background-color: white !important;
  border: 0 !important;
  box-shadow: 0 2px 10px 1px white!important; 
  height: 125px !important;
  margin: 0;
  width: 125px !important;
  box-sizing:border-box
}
/* Resizing the widget */
.rw-launcher img {
    width: 125 !important;
    max-height: 125 !important;
    object-fit: contain !important;
 }
 /* Getting rid of the rotation animation of the widget while closing  */
.rw-close-launcher {
    -webkit-animation-delay: 0;
    -webkit-animation-duration: 0s !important;
    -webkit-animation-name: rotation-lr !important;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-delay: 0;
    -moz-animation-duration: 0s !important;
    -moz-animation-name: rotation-lr !important;
    -moz-animation-fill-mode: forwards;
    animation-delay: 0;
    animation-duration: 0s !important;
    animation-name: rotation-lr !important;
    animation-fill-mode: forwards;
}

/* Getting rid of the rotation animation of the widget while opening  */
.rw-open-launcher {
    -webkit-animation-delay: 0;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-name: rotation-rl;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-delay: 0;
    -moz-animation-duration: .5s;
    -moz-animation-name: rotation-rl;
    -moz-animation-fill-mode: forwards;
    animation-delay: 0;
    animation-duration: 0s !important;
    animation-name: rotation-rl;
    animation-fill-mode: forwards;
}
    </style>
  </head>
    <body>
    <style>
      /* Background color for the header */
      .rw-conversation-container .rw-header{background-color: #233e80;}
      /* Correction of the shadow for the chat window */
      .rw-conversation-container {
    -webkit-animation-delay: 0;
    -webkit-animation-duration: .5s;
    -webkit-animation-name: slide-in;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-delay: 0;
    -moz-animation-duration: .5s;
    -moz-animation-name: slide-in;
    -moz-animation-fill-mode: forwards;
    animation-delay: 0;
    animation-duration: .5s;
    animation-name: slide-in;
    animation-fill-mode: forwards;
    border-radius: 10px;
    box-shadow: 0px -20px 12px 0px hsl(0deg 14% 89% / 0%), inset 4px -7px 3.7px -1px rgb(0 0 0 / 7%), 0 5px 7px -1px hsl(0deg 0% 0% / 9%), 2px -8px 12.5px -1px rgb(84 25 25 / 10%), 2px -6px 23.4px 0px rgb(255 0 0 / 12%), inset -3px -5px 56px 0px rgb(237 0 0 / 17%);
    overflow: hidden;
    width: 370px;
}
/* Resizing avatar (to the left of replies) */
.rw-conversation-container .rw-avatar {
    width: 55px;
    height: 55px;
    border-radius: 100%;
    margin-right: -3px;
    /* position: relative; */
    bottom: 0px;
}
/* Positioning the avatar to the left of replies rather than at the top*/
.rw-conversation-container .rw-message {
    margin: 10px;
    font-size: 16px;
    line-height: 20px;
    display: flex;
    font-family: Inter,sans-serif;
    flex-wrap: unset !important;
    position: relative;
}
/* Header avatar resizing  */
.rw-conversation-container .rw-header .rw-avatar {
    all: initial;
    height: 57px;
    width: 57px;
    position: absolute;
    top: 4px;
    left: 0px;
}
/* Color box for buttons (payload) */
.rw-conversation-container .rw-reply {
    -webkit-transition: box-shadow .3s ease,top .3s ease;
    -moz-transition: box-shadow .3s ease,top .3s ease;
    -o-transition: box-shadow .3s ease,top .3s ease;
    transition: box-shadow .3s ease,top .3s ease;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    background-color: #fafafa;
    border: 1px solid #135afe;
    border-radius: 15px;
    color: #233e80;
    padding: 4px 8px;
    max-width: 215px;
    min-height: 1.7em;
    font-weight: 500;
    text-align: center;
    font-family: Inter,sans-serif;
    cursor: pointer;
    margin: 0.25em;
    text-decoration: unset;
    box-shadow: unset !important/*0 .2px .7px -7pxrgba(0,0,0,.277),0 .5px 1.8px -7pxrgba(0,0,0,.369),0 1.2px 3.8px -7pxrgba(0,0,0,.442),0 4px 13px -7pxrgba(0,0,0,.64);*/
}
    </style>
        <script>!(function () {
            let e = document.createElement("script"),
              t = document.head || document.getElementsByTagName("head")[0];
            (e.src =
              "https://cdn.jsdelivr.net/npm/rasa-webchat@1.x.x/lib/index.js"),
    // Replace 1.x.x with the version that you want
              (e.async = !0),
              (e.onload = () => {
                window.localStorage.clear()
                window.WebChat.default(
                  {
                    initPayload: '/greet',
                    customData: { language: "en" },
                    socketUrl: "http://localhost:5005",
                    profileAvatar: "./assets/bot_widget-removebg-preview.png",
                    openLauncherImage: "./assets/robo_small.gif",
                    closeImage: "./assets/robo_small.gif",
                    title: "PM-KUSUM",
                    inputTextFieldHint: "Start a conversation",
                    connectingText: 'Waiting for server...',
                    showCloseButton: true
          // add other props here
                  },  
                  null
                );
              }),
              t.insertBefore(e, t.firstChild);
          })();
          </script>
    </body>
</html>