iDEW Chatbot CSS (style.css) body { background: linear-gradient(#A90329, #6d0019); font-family: Verdana,Arial,Helvetica,sans-serif; font-size: small; color: #000000; padding: 0; margin: 0; line-height: 1.7em; } button { background-color: rgba(255,255,255,.5); padding: 5px; outline: none; border: 1px solid rgba(0,0,0,.3); border-radius: 5px; } .wrapper { max-width: 450px; height: 100vh; box-sizing: border-box; margin: auto; padding: 0; background-color: rgba(255,255,255,.1); display: flex; flex-direction: column; border-left: 1px solid rgba(255,255,255,.2); border-right: 1px solid rgba(255,255,255,.2); } form { flex: 5; display: block; padding: 15px; } .text-box { font-size: 16px; display: flex; width: 100%; } input#message { padding-left: 11px; padding-right: 9px; font-size: 16px; height: 27px; display: block; flex: 10; outline: none; margin: 0 10px 0 0; box-sizing: border-box; border: 1px solid #aaa; border-radius: 13px; } input.send-button { display: block; background-color: rgba(255,255,255,.6); flex: 1; border: 1px solid rgba(0,0,0,.2); height: 27px; box-sizing: border-box; font-size: 16px; line-height: 25px; padding: 0; border-radius: 13px; } div#dialogue { overflow-x: none; overflow-y: auto; display: block; flex: 95; box-sizing: border-box; width: 100%; padding: 15px; } .bot-row, .user-row { padding: 1px 0 10px 0; display: block; postion: relative; } .user-row { text-align: right; } .user, .bot { font-size: 16px; padding: 5px 8px; margin: 1px; border-radius: 12px; display: inline-block; postion: relative; } .bot { margin-right: 50px; background-color: rgba(255,255,255,.85); border-bottom-left-radius: 0; } .user { margin-left: 50px; function setup() { chatbot.loadFiles(['bot.rive']); } window.onload = setup;

Comments

Popular posts from this blog

John titor original website

John Titor on: his time machine