diff sat_templates/templates/bulma/chat/message_input.html @ 404:66f98ee041d8

chat: add UI for replies/threads: rel 457
author Goffi <goffi@goffi.org>
date Tue, 06 May 2025 00:37:41 +0200
parents
children 049a0638f6fa
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/sat_templates/templates/bulma/chat/message_input.html	Tue May 06 00:37:41 2025 +0200
@@ -0,0 +1,46 @@
+
+<div id="input-panel">
+    <!-- Attachments -->
+    <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">
+        {% for file in attachments %}
+            {% include 'chat/attachment_preview.html' %}
+        {% endfor %}
+    </div>
+
+    <div id="message_input" class="chat-input">
+
+        <!-- Reply Indicator -->
+        <div id="reply-to" class="mb-3 is-hidden">
+            <div class="is-flex is-justify-content-space-between is-align-items-center">
+                <div>
+                    <span class="is-size-6"><strong>{% trans %}Replying to :{% endtrans %}</strong></span>
+                    <div id="reply-to_message" class="mt-1 ml-1 is-size-7"></div>
+                </div>
+                <button id="cancel_reply_btn" class="button is-small is-danger is-rounded">Cancel</button>
+            </div>
+        </div>
+
+
+        <div class="field has-addons">
+            <div class="control">
+                <button id="attach-button" class="button">
+                    <span class="icon is-small">
+                    {{ icon('paperclip') }}
+                    </span>
+                </button>
+                <input id="file-input" type="file" multiple="true" style="display: none" />
+            </div>
+            <div class="control is-expanded">
+             <textarea id="message_input_area" class="textarea" name="message_input_area" type="text" rows="1" placeholder="{{_("Type your message…")}}"></textarea>
+            </div>
+            <div class="control">
+                <button class="button is-primary">
+                    <span class="icon is-small">
+                        <i class="fas fa-paper-plane"></i>
+                    </span>
+                    <span id="send_button">{% trans %}Send{% endtrans %}</span>
+                </button>
+            </div>
+        </div>
+    </div>
+</div>