Mercurial > libervia-templates
comparison sat_templates/templates/bulma/chat/message_input.html @ 411:f7a434581872 default tip
chat: Add forward, rich editing and extra recipients:
- There is a new "forward" menu in message. For now, a simple prompt ask for recipient JID.
- A new "extra" menu is available next to input field. Inside there are 2 items for now:
add extra recipient, and toggle rich edit mode.
- Extra recipient option add a field to add an email-like "to", "cc" or "bcc" recipients.
- Rich edit let use rich styling such as bold, italic, underline, etc.
rel 461
author | Goffi <goffi@goffi.org> |
---|---|
date | Fri, 04 Jul 2025 17:33:22 +0200 |
parents | 049a0638f6fa |
children |
comparison
equal
deleted
inserted
replaced
410:a5588ea3bcd6 | 411:f7a434581872 |
---|---|
18 </div> | 18 </div> |
19 <button id="cancel_reply_btn" class="button is-small is-danger is-rounded">Cancel</button> | 19 <button id="cancel_reply_btn" class="button is-small is-danger is-rounded">Cancel</button> |
20 </div> | 20 </div> |
21 </div> | 21 </div> |
22 | 22 |
23 <!-- Rich Editor Toolbar --> | |
24 <div id="rich-edit-toolbar" class="field is-grouped is-grouped-multiline is-hidden"> | |
25 <div class="control"> | |
26 <button class="rich-editor-btn button" type="button" data-action="bold"> | |
27 <span class="icon"><i class="fas fa-bold fa-sm"></i></span> | |
28 </button> | |
29 </div> | |
30 <div class="control"> | |
31 <button class="rich-editor-btn button" type="button" data-action="italic"> | |
32 <span class="icon"><i class="fas fa-italic fa-sm"></i></span> | |
33 </button> | |
34 </div> | |
35 <div class="control"> | |
36 <button class="rich-editor-btn button" type="button" data-action="underline"> | |
37 <span class="icon"><i class="fas fa-underline fa-sm"></i></span> | |
38 </button> | |
39 </div> | |
40 <div class="control"> | |
41 <button class="rich-editor-btn button" type="button" data-action="list-bullet"> | |
42 <span class="icon"><i class="fas fa-list-ul fa-sm"></i></span> | |
43 </button> | |
44 </div> | |
45 <div class="control"> | |
46 <button class="rich-editor-btn button" type="button" data-action="list-ordered"> | |
47 <span class="icon"><i class="fas fa-list-ol fa-sm"></i></span> | |
48 </button> | |
49 </div> | |
50 <div class="control"> | |
51 <button class="rich-editor-btn button" type="button" data-action="link"> | |
52 <span class="icon"><i class="fas fa-link fa-sm"></i></span> | |
53 </button> | |
54 </div> | |
55 </div> | |
23 | 56 |
24 <div class="field has-addons"> | 57 <!-- Main Input --> |
58 <div class="field has-addons is-align-items-flex-end"> | |
25 <div class="control"> | 59 <div class="control"> |
26 <button id="attach-button" class="button"> | 60 <button id="attach-button" class="button"> |
27 <span class="icon is-small"> | 61 <span class="icon is-small"> |
28 {{ icon('paperclip') }} | 62 {{ icon('paperclip') }} |
29 </span> | 63 </span> |
30 </button> | 64 </button> |
31 <input id="file-input" type="file" multiple="true" style="display: none" /> | 65 <input id="file-input" type="file" multiple="true" style="display: none" /> |
32 </div> | 66 </div> |
67 <div class="control"> | |
68 <button id="input-extra-button" class="button"> | |
69 <span class="icon is-small"> | |
70 {{ icon('ellipsis-vertical') }} | |
71 </span> | |
72 </button> | |
73 </div> | |
33 <div class="control is-expanded"> | 74 <div class="control is-expanded"> |
34 <textarea id="message_input_area" class="textarea" name="message_input_area" type="text" rows="1" placeholder="{{_("Type your messageā¦")}}"></textarea> | 75 <textarea id="message_input_area" class="textarea" name="message_input_area" type="text" rows="1" placeholder="{{_("Type your messageā¦")}}"></textarea> |
76 <div id="message_input_area_rich" class="is-hidden"></div> | |
35 </div> | 77 </div> |
36 <div class="control"> | 78 <div class="control"> |
37 <button class="button is-primary"> | 79 <button class="button is-primary"> |
38 <span class="icon is-small"> | 80 <span class="icon is-small"> |
39 <i class="fas fa-paper-plane"></i> | 81 <i class="fas fa-paper-plane"></i> |