<div class="message-user mt-3" id="{{ 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="#content-{{ ID }}" 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>