started work on chat UI

This commit is contained in:
Lynne Megido 2019-09-23 13:30:45 +10:00
parent 07e559f7d9
commit a80f77d2bc
3 changed files with 77 additions and 1 deletions

View File

@ -212,3 +212,37 @@ form .row {
.success {
background-color: #6e6;
}
#chatbox {
height: 90vh;
background-color: #3d4353;
padding: 10px;
}
#chatbox-input, #chatbox-input input{
width: 100%;
}
.message {
display: inline-block;
padding: 5px;
min-height: 30px;
max-width: 60%;
}
.message-container.user {
text-align: right;
}
.message-container .bot-icon {
background: center / contain url("https://lynnesbian.space/img/bune.png") no-repeat;
height: 30px;
width: 30px;
display: inline-block;
padding: 5px;
}
.message.bot {
background-color: mediumpurple;
color: white;
vertical-align: top;
}
.message.user {
background-color: #ddd;
color: #333;
}

View File

@ -0,0 +1,42 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>FediBooks</title>
{% include 'imports.html' %}
</head>
<body>
<div class="container centred">
<h1 class="thin centred">Chat</h1>
<p class="centred">Talking to {{ bot }}</p>
<p class="centred" style="margin: 20px 0;">
<a class="button btn-primary" href="/bot/accounts/add" role="button"><i class="fas fa-home"></i> Home</a>
</p>
</div>
<noscript>
<div class="container centred">
<h2>This feature requires JavaScript.</h2>
</div>
</noscript>
<div class="container">
<div id="chatbox">
<div class="message-container user">
<div class="message user">Henlo</div>
</div>
<div class="message-container bot">
<div class="bot-icon"></div>
<div class="message bot">Henlo human uwu<br>How are you</div>
</div>
</div>
<form id="chatbox-input">
<input name="message" placeholder="Press enter to send">
</form>
</div>
{% include 'footer.html' %}
</body>
</html>

View File

@ -106,7 +106,7 @@ def bot_toggle(id):
@app.route("/bot/chat/<id>")
def bot_chat(id):
return render_template("coming_soon.html")
return render_template("/bot/chat.html", bot = id)
@app.route("/bot/blacklist/<id>")
def bot_blacklist(id):