diff options
| author | Joas Schilling <213943+nickvergessen@users.noreply.github.com> | 2022-08-09 20:00:22 +0300 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2022-08-09 20:00:22 +0300 |
| commit | e84a11ebbf4f61e706c0804eab71553500d0e60e (patch) | |
| tree | 27bc25655360e3ac386e059c231ea0cda33bd951 | |
| parent | 11d7383fff77572550bb86a0f3d9ef51992fc377 (diff) | |
| parent | 700315785144ad3661177d7212e42431e7edd94c (diff) | |
Merge pull request #7452 from nextcloud/bugfix/7219/messagebuttonbar-overlap
Fix messagebuttonsbar position for last read messages
| -rw-r--r-- | src/components/MessagesList/MessagesGroup/Message/Message.vue | 1 | ||||
| -rw-r--r-- | src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue | 18 |
2 files changed, 18 insertions, 1 deletions
diff --git a/src/components/MessagesList/MessagesGroup/Message/Message.vue b/src/components/MessagesList/MessagesGroup/Message/Message.vue index 6ea8da743..69fa93422 100644 --- a/src/components/MessagesList/MessagesGroup/Message/Message.vue +++ b/src/components/MessagesList/MessagesGroup/Message/Message.vue @@ -154,6 +154,7 @@ the main body of the message as well as a quote. :is-reactions-menu-open.sync="isReactionsMenuOpen" :message-api-data="messageApiData" :message-object="messageObject" + :is-last-read="isLastReadMessage" :can-react="canReact" v-bind="$props" :previous-message-id="previousMessageId" diff --git a/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue b/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue index 382a505a7..44b0fc925 100644 --- a/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue +++ b/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue @@ -22,7 +22,8 @@ <template> <!-- Message Actions --> <div v-click-outside="handleClickOutside" - class="message-buttons-bar"> + class="message-buttons-bar" + :class="{ 'message-buttons-bar--last-read' : isLastRead }"> <template v-if="!isReactionsMenuOpen"> <Button v-if="canReact" type="tertiary" @@ -297,6 +298,16 @@ export default { type: Boolean, required: true, }, + + /** + * If the MessageButtonsBar belongs to the last read message, we need + * to raise it to compensate for the shift in position brought by the + * last read marker that's added to the message component. + */ + isLastRead: { + type: Boolean, + required: true, + }, }, data() { @@ -489,10 +500,15 @@ export default { background-color: var(--color-main-background); border-radius: calc($clickable-area / 2); box-shadow: 0 0 4px 0 var(--color-box-shadow); + height: 44px; & h6 { margin-left: auto; } + + &--last-read { + bottom: 36px; + } } </style> |