butter/keanu-weblite
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Merge branch '544-reactions-are-cut-off' into 'dev'

Browse source 
Resolve "Reactions are cut off"

See merge request keanuapp/keanuapp-weblite!253
This commit is contained in:
N Pex 2023-10-25 13:10:50 +00:00
commit 4bc4a8d8e5
2 changed files with 16 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/assets/css/chat.scss
View file

@ -350,9 +350,9 @@ body {
display: inline-block;
vertical-align: top !important;
.v-icon {
color: #eeeeee;
color: #595959;
&:hover {
color: #888888;
color: #000000;
}
}
}
@ -754,6 +754,7 @@ body {
height: 34px;
border-radius: 22px;
box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.15);
white-space: nowrap;
}
.avatar-operations {

17
src/components/Chat.vue
View file

@ -70,15 +70,22 @@
touchStart(e, event);
}
" v-on:touchend="touchEnd" v-on:touchcancel="touchCancel" v-on:touchmove="touchMove">
<!-- Note: For threaded media messages, IF there is only one item we show that media item as a single component.
We might therefore get calls to v-on:context-menu that has the event set to that single media item, not the top level thread event
that is really displayed in the flow. Therefore, we rewrite these events with "{event: event, anchor: $event.anchor}",
see below. Otherwise things like context menus won't work as designed.
-->
<component :is="componentForEvent(event)" :room="room" :originalEvent="event" :nextEvent="filteredEvents[index + 1]"
:timelineSet="timelineSet" v-on:send-quick-reaction.stop="sendQuickReaction"
:componentFn="componentForEvent"
v-on:context-menu="showContextMenuForEvent($event)" v-on:own-avatar-clicked="viewProfile"
v-on:other-avatar-clicked="showAvatarMenuForEvent($event)" v-on:download="download(event)"
v-on:context-menu="showContextMenuForEvent({event: event, anchor: $event.anchor})"
v-on:own-avatar-clicked="viewProfile"
v-on:other-avatar-clicked="showAvatarMenuForEvent({event: event, anchor: $event.anchor})"
v-on:download="download(event)"
v-on:poll-closed="pollWasClosed(event)"
v-on:more="
isEmojiQuickReaction = true
showMoreMessageOperations($event)
showMoreMessageOperations({event: event, anchor: $event.anchor})
"
/>
<!-- <div v-if="debugging" style="user-select:text">EventID: {{ event.getId() }}</div> -->
@ -862,8 +869,10 @@ export default {
var rectOps = this.$refs.messageOperations.$el.getBoundingClientRect();
top = rectAnchor.top - rectChat.top - 50;
left = rectAnchor.left - rectChat.left - 75;
if (left + rectOps.width >= rectChat.right) {
if (left + rectOps.width + 10 >= rectChat.right) {
left = rectChat.right - rectOps.width - 10; // No overflow
} else if (left < 0) {
left = 0;
}
}
}