Better edit message button

This commit is contained in:
Niek van der Maas 2023-03-03 19:22:16 +01:00
parent cd2b9b9a88
commit b0a638bfb5
2 changed files with 14 additions and 5 deletions

View File

@ -21,11 +21,11 @@ a.is-disabled {
filter: grayscale(100%); filter: grayscale(100%);
} }
/* /* Show the edit button on hover of the user message */
.usermessage:hover .editbutton { .usermessage:hover > .message-body > .editbutton {
display: block !important; /* TODO: add when ready: display: block !important; */
text-decoration: none !important;
} }
*/
$footer-padding: 3rem 1.5rem; $footer-padding: 3rem 1.5rem;

View File

@ -129,7 +129,16 @@
{#if message.role === "user"} {#if message.role === "user"}
<article class="message is-info has-text-right usermessage"> <article class="message is-info has-text-right usermessage">
<div class="message-body"> <div class="message-body">
<div class="greyscale is-pulled-right ml-2 is-hidden editbutton">✏️</div> <a
href={"#"}
class="greyscale is-pulled-right ml-2 is-hidden editbutton"
on:click={() => {
input.value = message.content;
input.focus();
}}
>
✏️
</a>
{@html marked(message.content)} {@html marked(message.content)}
</div> </div>
</article> </article>