diff options
| author | Dorra <dorra.jaoued7@gmail.com> | 2024-07-04 12:02:20 +0200 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2024-07-04 12:02:20 +0200 |
| commit | 4572406487db88580f8816c718f4550e01a76139 (patch) | |
| tree | b42fdbcc734d29313fc53ab62bc6b4eec76379e9 | |
| parent | 191e74ba99ff603858de7bae6b24929f0c9c3086 (diff) | |
| parent | ded6fce97d9a5f61d43e98443fed3e93cc114a22 (diff) | |
Merge pull request #12612 from nextcloud/backport/12602/stable29
[stable29] fix(Reactions): improve styling in popover
| -rw-r--r-- | src/components/MessagesList/MessagesGroup/Message/MessagePart/Reactions.vue | 22 |
1 files changed, 16 insertions, 6 deletions
diff --git a/src/components/MessagesList/MessagesGroup/Message/MessagePart/Reactions.vue b/src/components/MessagesList/MessagesGroup/Message/MessagePart/Reactions.vue index 278754cda..48b036419 100644 --- a/src/components/MessagesList/MessagesGroup/Message/MessagePart/Reactions.vue +++ b/src/components/MessagesList/MessagesGroup/Message/MessagePart/Reactions.vue @@ -39,12 +39,15 @@ </template> <div v-if="hasReactionsLoaded" class="reaction-details"> - <span>{{ getReactionSummary(reaction) }}</span> - <NcButton v-if="reactionsCount(reaction) > 3" - type="tertiary-no-background" - @click="showAllReactions = true"> - {{ remainingReactionsLabel(reaction) }} - </NcButton> + <span>{{ getReactionSummary(reaction) }} + <a v-if="reactionsCount(reaction) > 3" + class="more-reactions-button" + role="button" + tabindex="0" + @click.prevent="showAllReactions = true"> + {{ remainingReactionsLabel(reaction) }} + </a> + </span> </div> <div v-else class="details-loading"> <NcLoadingIcon /> @@ -303,6 +306,7 @@ export default { .reaction-details { padding: 8px; + max-width: 250px; } .details-loading { @@ -311,4 +315,10 @@ export default { width: 38px; } +.more-reactions-button { + text-decoration: underline; + &:hover { + text-decoration: none; + } +} </style> |