45 lines
1.6 KiB
HTML
45 lines
1.6 KiB
HTML
|
{%- import "components.html" as components -%}
|
||
|
|
<turbo-frame id="stream_body_frame">
|
||
|
|
<!-- prettier-ignore -->
|
||
|
|
<div class="gap-2" id="stream_body">
|
||
|
|
{% if page != 0 %}
|
||
|
|
<div class="card flex gap-2 small tertiary flex-wrap">
|
||
|
|
<b>{{ text "chats:label.viewing_old_messages" }}</b>
|
||
|
|
<a href="/chats/{{ community }}/{{ channel }}/_stream?page={{ page - 1}}" class="button small" onclick="window.CURRENT_PAGE -= 1">
|
||
|
|
{{ text "chats:label.go_back" }}
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
{% endif %}
|
||
|
|
|
||
|
|
{% for message in messages %}
|
||
|
|
{{ components::message(user=message[1], message=message[0]) }}
|
||
|
|
{% endfor %}
|
||
|
|
|
||
|
|
{% if messages|length > 0 %}
|
||
|
|
<div class="flex gap-2 w-full justify-center">
|
||
|
|
<a class="button" href="/chats/{{ community }}/{{ channel }}/_stream?page={{ page + 1 }}" onclick="window.CURRENT_PAGE += 1">
|
||
|
|
{{ icon "clock" }}
|
||
|
|
<span>{{ text "chats:label.view_older" }}</span>
|
||
|
|
</a>
|
||
|
|
|
||
|
|
{% if page != 0 %}
|
||
|
|
<a class="button quaternary" href="/chats/{{ community }}/{{ channel }}/_stream?page={{ page - 1 }}" onclick="window.CURRENT_PAGE -= 1">
|
||
|
|
{{ icon "rewind" }}
|
||
|
|
<span>{{ text "chats:label.view_more_recent" }}</span>
|
||
|
|
</a>
|
||
|
|
{% endif %}
|
||
|
|
</div>
|
||
|
|
{% endif %}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
#stream_body {
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: flex-start;
|
||
|
|
flex-direction: column-reverse;
|
||
|
|
overflow: auto;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</turbo-frame>
|