diff --git a/static/js/ctzn-tags/post-view.js b/static/js/ctzn-tags/post-view.js
index 0378989e..034f9bfc 100644
--- a/static/js/ctzn-tags/post-view.js
+++ b/static/js/ctzn-tags/post-view.js
@@ -292,7 +292,7 @@ export class PostView extends LitElement {
${this.renderPostTextNonFull()}
${this.renderMedia()}
${this.hasReactionsOrGifts ? html`
-
+
${this.renderGiftedItems()}
${this.renderReactions()}
@@ -468,17 +468,20 @@ export class PostView extends LitElement {
return ''
}
return html`
- ${repeat(this.post.relatedItemTransfers, item => html`
+ ${repeat(this.post.relatedItemTransfers, item => {
+ let tooltipUser = item.dbmethodCall?.authorId
+ return html`
+ class="flex-shrink-0 inline-flex items-center border border-gray-300 px-1 py-0.5 rounded mr-1.5 text-sm font-semibold tooltip-top"
+ data-tooltip="${tooltipUser}">
${item.qty}
- `)}
+ `}
+ )}
`
}
@@ -488,12 +491,15 @@ export class PostView extends LitElement {
}
return html`
${repeat(Object.entries(this.post.reactions), ([reaction, userIds]) => {
+ let tooltipUsersText = (userIds?.slice(0,4) || []).join(", ")
const colors = this.haveIReacted(reaction) ? 'bg-blue-50 hov:hover:bg-blue-100 text-blue-600' : 'bg-gray-100 text-gray-500 hov:hover:bg-gray-200'
return html`
this.onClickReaction(e, reaction)}
- >${unsafeHTML(emojify(makeSafe(reaction)))} ${userIds.length}
+ data-tooltip="${tooltipUsersText}${userIds?.length > 4 ? '...' : ''}"
+ >${unsafeHTML(emojify(makeSafe(reaction)))}
${userIds.length}
+
`
})}
`
diff --git a/static/js/ctzn-tags/posts-feed.js b/static/js/ctzn-tags/posts-feed.js
index bf3ce3a1..7adbe53e 100644
--- a/static/js/ctzn-tags/posts-feed.js
+++ b/static/js/ctzn-tags/posts-feed.js
@@ -282,7 +282,7 @@ export class PostsFeed extends LitElement {
renderResult (post) {
return html`
-