26 lines
871 B
HTML
26 lines
871 B
HTML
|
{% for message in messages %}
|
||
|
|
<div class="message {% if message.is_user %}user{% else %}bot{% endif %}" id="msg-{{ message.id }}">
|
||
|
|
<div class="message-avatar">
|
||
|
|
{% if message.is_user %}
|
||
|
|
<span class="avatar-user">U</span>
|
||
|
|
{% else %}
|
||
|
|
<span class="avatar-bot">🤖</span>
|
||
|
|
{% endif %}
|
||
|
|
</div>
|
||
|
|
<div class="message-content">
|
||
|
|
<div class="message-header">
|
||
|
|
<span class="message-sender">{{ message.sender }}</span>
|
||
|
|
<span class="message-time">{{ message.timestamp }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="message-body">{{ message.content }}</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{% endfor %}
|
||
|
|
{% if messages.is_empty() %}
|
||
|
|
<div class="empty-messages">
|
||
|
|
<div class="empty-icon">💬</div>
|
||
|
|
<p>Start a conversation</p>
|
||
|
|
<p class="empty-hint">Type a message below or use voice input</p>
|
||
|
|
</div>
|
||
|
|
{% endif %}
|