33 lines
614 B
HTML
33 lines
614 B
HTML
{% extends 'base.html' %}
|
|
|
|
{% block content %}
|
|
<div class="columns" style="width: 100%;">
|
|
<div class="column" id="messages">
|
|
</div>
|
|
</div>
|
|
|
|
<form hx-post="/chat" hx-target="#messages" hx-swap="outerHTML">
|
|
<input class="input" type="text" placeholder="Type your message here..." name="message" />
|
|
</form>
|
|
|
|
<style>
|
|
.column {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.message {
|
|
max-width: 90%;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.user-message {
|
|
align-self: flex-start;
|
|
}
|
|
|
|
.bot-message {
|
|
align-self: flex-end;
|
|
}
|
|
</style>
|
|
|
|
{% endblock %} |