<!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>