feature: reactions

This commit is contained in:
Andy Burke 2025-10-15 17:50:48 -07:00
parent b8467ec870
commit 7046bb0389
11 changed files with 371 additions and 133 deletions

View file

@ -30,14 +30,8 @@
}
#chat #chat-entry-container form {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
flex-direction: row;
padding: 0.75rem;
}
#chat #chat-entry-container form input[type="file"] {
@ -144,16 +138,12 @@
opacity: 0.75;
}
#chat .message-container .message-actions-container {
#chat .message-container button[commandfor] {
position: absolute;
top: 0.1rem;
right: 0.1rem;
display: flex;
flex-direction: row-reverse;
border: 1px solid;
border-color: rgba(0, 0, 0, 0);
border-radius: var(--border-radius);
color: rgb(from var(--text) r g b / 0.7);
border: none;
z-index: 10;
}
@ -237,6 +227,7 @@
#chat .message-container .message-media-container,
#chat .message-container .reactions-container {
padding-left: 8rem;
overflow-x: auto;
}
#chat .message-container .reactions-container:has(> .reaction-container) {
@ -244,15 +235,6 @@
margin-bottom: 0.25rem;
}
#chat .message-container .reactions-container .reaction-container {
display: inline-block;
border: 1px solid var(--border-subtle);
border-radius: var(--border-radius);
margin-right: 0.5rem;
padding: 0.25rem;
font-size: large;
}
#chat .embed-container {
position: relative;
width: 100%;

View file

@ -22,7 +22,7 @@
id="chat-content"
data-feed
data-precheck="!!document.body.dataset.user && document.body.dataset.user.indexOf( 'topics.chat.read' ) !== -1"
data-source="/api/topics/${ document.body.dataset.topic }/events?type=chat,reaction&limit=100&sort=newest&wait=true&after_id=${ feed.__newest_id ?? 'chat:able-able-able-able-able-able-able-able-able-able' }"
data-source="/api/topics/${ document.body.dataset.topic }/events?type=chat,reaction&limit=100&sort=newest&wait=true&after_id=${ feed.__newest_id ?? 'able-able-able-able-able-able-able-able-able-able' }"
data-longpolling="true"
data-reverse="true"
data-insert="append"
@ -107,42 +107,7 @@
data-creator_id="${context.creator.id}"
data-temp_id="${context.event.meta?.temp_id ?? ''}"
>
<div class="message-actions-container">
<input
type="checkbox"
id="show_message_actions-${context.event.id}"
class="message-actions-display-toggle"
/>
<label
class="message-actions-display-toggle-label"
for="show_message_actions-${context.event.id}"
>
<div class="icon more-borderless"></div>
</label>
<button
class="message-action"
data-action="react"
data-reactions
data-smart
>
<i class="icon circle"></i><span class="action-name">React</span>
</button>
<button
class="message-action"
data-action="reply"
onclick="document.getElementById( 'parent-id' ).value = '${context.event.id}';"
>
<i class="icon reply"></i><span class="action-name">Reply</span>
</button>
<button class="message-action mockup" data-action="forward_copy">
<i class="icon forward-copy"></i
><span class="action-name">Copy Link</span>
</button>
<button class="message-action mockup" data-action="delete">
<i class="icon trash"></i><span class="action-name">Delete</span>
</button>
</div>
<button class="icon more" commandfor="eventactionspopover"></button>
<div class="info-container">
<div class="avatar-container inline">
<img