Mercurial > libervia-templates

annotate sat_templates/templates/bulma/chat/chat.html @ 386:e63fb06052ae

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
bulma: message edition + extra menu + improvments: - add an extra menu template with `Edit` and `Quote` - add a template for previous editions popup - fix `own_msg` class application - add CSS for edit mode - cosmetic changes
author Goffi <goffi@goffi.org>
date Tue, 28 Nov 2023 17:48:00 +0100
parents 941e4006ab6e
children 8b990c78d4b5
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
1 {% if not embedded %}{% extends 'base/base.html' %}{% endif %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
2 {% block title %}{{ target_jid }} - {{ super() }}{% endblock %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
3 {% block body %}
364
095bd5b34080 chat: add templates for URL previews
Goffi <goffi@goffi.org>
parents: 362
diff changeset
4 {{ icon_defs(
095bd5b34080 chat: add templates for URL previews
Goffi <goffi@goffi.org>
parents: 362
diff changeset
5 "lock-open", "lock-filled", "ok", "pencil", "dot-3", "share", "attach",
386
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
6 "paper-plane-empty", "doc", "download", "wrench", "eye", "smile", "plus-circled",
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
7 "quote-left"
364
095bd5b34080 chat: add templates for URL previews
Goffi <goffi@goffi.org>
parents: 362
diff changeset
8 ) }}
362
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
9
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
10 {# TODO: this should be done in a more generic way in dialog module #}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
11 <div id="modal" class="modal">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
12 <div class="modal-background"></div>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
13 <div class="modal-content">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
14 <p class="image">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
15 <img id="modal-image" src="" alt="">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
16 </p>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
17 </div>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
18 <button class="modal-close is-large" aria-label="close"></button>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
19 </div>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
20
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
21 <div id="chat-panel" class="is-flex is-flex-direction-column is-justify-content-space-between is-align-items-stretch pt-4"> <!-- calculate height depending on your navbar size -->
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
22 <!-- Header -->
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
23 <div id="header" class="box p-4 is-flex is-justify-content-space-between is-align-items-center is-flex-shrink-0">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
24 {% if subject is defined %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
25 <h2 id="room-subject" class="title is-5 has-text-weight-bold">{{- subject|urlize(nofollow=true,target='_blank') -}}</h2>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
26 {% endif %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
27 </div>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
28
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
29 <!-- Messages -->
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
30 <div id="messages" class="box p-4 has-background-white mb-4 is-flex-grow-1 is-flex-direction-column-reverse is-overflow-auto">
329
6a26c8a43d10 bulma (chat): fix chat:
Goffi <goffi@goffi.org>
parents: 246
diff changeset
31 {% for msg in messages %}
365
9860286068b9 chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents: 364
diff changeset
32 {% set current_date = msg.timestamp|date_fmt('full', date_only=True) %}
9860286068b9 chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents: 364
diff changeset
33 {% if loop.changed(current_date) %}
9860286068b9 chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents: 364
diff changeset
34 <div class="separator">
9860286068b9 chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents: 364
diff changeset
35 <hr class="has-background-light" />
9860286068b9 chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents: 364
diff changeset
36 <span class="has-text-grey is-size-7">{{current_date}}</span>
9860286068b9 chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents: 364
diff changeset
37 <hr class="has-background-light" />
9860286068b9 chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents: 364
diff changeset
38 </div>
9860286068b9 chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents: 364
diff changeset
39 {% endif %}
329
6a26c8a43d10 bulma (chat): fix chat:
Goffi <goffi@goffi.org>
parents: 246
diff changeset
40 {% include 'chat/message.html' %}
6a26c8a43d10 bulma (chat): fix chat:
Goffi <goffi@goffi.org>
parents: 246
diff changeset
41 {% endfor %}
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
42 </div>
362
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
43
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
44 <!-- Attachments -->
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
45 <div id="attachments" class="box has-background-white is-flex is-flex-grow-0 is-flex-shrink-0 is-align-items-center is-overflow-auto is-contracted">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
46 {% for file in attachments %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
47 {% include 'chat/attachment_preview.html' %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
48 {% endfor %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
49 </div>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
50
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
51 <!-- Input -->
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
52 <div id="input-area" class="field has-addons py-4 is-flex-shrink-0">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
53 <p class="control is-expanded">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
54 <textarea id="message_input" class="textarea" name="message" type="text" rows="1" placeholder="{{_("enter your message")}}"></textarea>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
55 </p>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
56 <div class="control">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
57 <button class="button" id="attach_button">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
58 <span class="icon is-small">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
59 {{ icon('attach', cls='has-text-info') }}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
60 </span>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
61 </button>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
62 <input id="file_input" type="file" multiple="true" style="display: none" />
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
63 </div>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
64 <div class="control">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
65 <button class="button" id="send_button">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
66 <span class="icon is-small">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
67 {{ icon('paper-plane-empty') }}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
68 </span>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
69 </button>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
70 </div>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
71 </div>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 329
diff changeset
72
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
73 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
74 {% endblock body %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
75
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
76 {% block footer %}{% endblock footer %}