Jade/views/partials/message-user.html

46 lines
2.1 KiB
HTML

<div class="message-user mt-3" id="msg-{{ ID }}">
<div class="columns is-mobile">
<div class="column is-narrow" id="icon-column">
<figure class="image is-48x48" style="flex-shrink: 0;">
<img src="icons/bouvai2.png" alt="User Image">
</figure>
</div>
<div class="column" id="content-column">
<div class="is-flex is-align-items-start">
<div class="message-content">
<div class="message-header">
<p>
You
</p>
</div>
<div class="message-body">
<div class="content" style="overflow-x: auto;" id="content-{{ ID }}">
{{ Content | safe }}
</div>
</div>
</div>
</div>
<div class="is-flex is-justify-content mt-2">
<button id="delete-button-{{ ID }}" hx-post="/deleteMessage?id={{ ID }}" hx-swap="outerHTML"
hx-target="#chat-container" class="button is-small is-danger message-button is-outlined mr-5">
<span class="icon">
<i class="fa-solid fa-trash"></i>
</span>
</button>
<button id="redo-button-{{ ID }}" class="button is-small is-primary message-button is-outlined mr-1"
hx-post="/redoMessage?id={{ ID }}" hx-swap="innerHTML settle:200ms" hx-target="next .message-bot">
<span class="icon">
<i class="fa-solid fa-arrows-rotate"></i>
</span>
</button>
<button hx-get="/editMessageForm?id={{ ID }}" hx-target="closest .message-user"
id="edit-button-{{ ID }}" class="button is-small is-primary message-button is-outlined mr-5">
<span class="icon">
<i class="fa-solid fa-pen"></i>
</span>
</button>
</div>
</div>
</div>
</div>