mirror of
https://github.com/Lynnesbian/FediBooks/
synced 2024-11-25 08:38:59 +00:00
started work on chat UI
This commit is contained in:
parent
07e559f7d9
commit
a80f77d2bc
3 changed files with 77 additions and 1 deletions
|
@ -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;
|
||||
}
|
||||
|
|
42
app/templates/bot/chat.html
Normal file
42
app/templates/bot/chat.html
Normal 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>
|
|
@ -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):
|
||||
|
|
Loading…
Reference in a new issue