diff options
| author | DorraJaouad <dorra.jaoued7@gmail.com> | 2024-06-28 16:27:06 +0200 |
|---|---|---|
| committer | DorraJaouad <dorra.jaoued7@gmail.com> | 2024-06-28 16:27:06 +0200 |
| commit | cc63fd2b9374ed87c1dfab9ff2e5fa202c4ada47 (patch) | |
| tree | f5133827d61af179c323083faa9e6302a451c441 | |
| parent | adf775f80156626e76c370d95a31034cd372e32e (diff) | |
fix(Reactions): improve styling in popover
Signed-off-by: DorraJaouad <dorra.jaoued7@gmail.com>
| -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 efc293625..1d4c664d2 100644 --- a/src/components/MessagesList/MessagesGroup/Message/MessagePart/Reactions.vue +++ b/src/components/MessagesList/MessagesGroup/Message/MessagePart/Reactions.vue @@ -22,12 +22,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 /> @@ -289,6 +292,7 @@ export default { .reaction-details { padding: 8px; + max-width: 250px; } .details-loading { @@ -297,4 +301,10 @@ export default { width: 38px; } +.more-reactions-button { + text-decoration: underline; + &:hover { + text-decoration: none; + } +} </style> |