diff options
| author | Ilja <ilja@ilja.space> | 2022-02-26 02:08:13 +0100 |
|---|---|---|
| committer | Ilja <ilja@ilja.space> | 2022-02-26 02:08:13 +0100 |
| commit | d0c4ad22cd5a93f69c689f3c8c75546c35861740 (patch) | |
| tree | 15b535925b4ce0ea851e27ace32afde9db6a29c1 /src/components/user_list_popover | |
| parent | 819b76026101ddc0363118f240049a0019ebb4d6 (diff) | |
| parent | 0300db6c6356c536694a9fcbb32a52abc81c52d5 (diff) | |
Merge branch 'develop' of https://git.pleroma.social/pleroma/pleroma-fe into feat/report-notification
Diffstat (limited to 'src/components/user_list_popover')
| -rw-r--r-- | src/components/user_list_popover/user_list_popover.vue | 66 |
1 files changed, 36 insertions, 30 deletions
diff --git a/src/components/user_list_popover/user_list_popover.vue b/src/components/user_list_popover/user_list_popover.vue index 95673733..8706d0ff 100644 --- a/src/components/user_list_popover/user_list_popover.vue +++ b/src/components/user_list_popover/user_list_popover.vue @@ -4,40 +4,44 @@ placement="top" :offset="{ y: 5 }" > - <template slot="trigger"> + <template v-slot:trigger> <slot /> </template> - <div - slot="content" - class="user-list-popover" - > - <div v-if="users.length"> - <div - v-for="(user) in usersCapped" - :key="user.id" - class="user-list-row" - > - <UserAvatar - :user="user" - class="avatar-small" - :compact="true" - /> - <div class="user-list-names"> - <!-- eslint-disable vue/no-v-html --> - <span v-html="user.name_html" /> - <!-- eslint-enable vue/no-v-html --> - <span class="user-list-screen-name">{{ user.screen_name }}</span> + <template v-slot:content> + <div class="user-list-popover"> + <template v-if="users.length"> + <div + v-for="(user) in usersCapped" + :key="user.id" + class="user-list-row" + > + <UserAvatar + :user="user" + class="avatar-small" + :compact="true" + /> + <div class="user-list-names"> + <!-- eslint-disable vue/no-v-html --> + <RichContent + class="username" + :title="'@'+user.screen_name_ui" + :html="user.name_html" + :emoji="user.emoji" + /> + <!-- eslint-enable vue/no-v-html --> + <span class="user-list-screen-name">{{ user.screen_name_ui }}</span> + </div> </div> - </div> - </div> - <div v-else> - <FAIcon - icon="circle-notch" - spin - size="3x" - /> + </template> + <template v-else> + <FAIcon + icon="circle-notch" + spin + size="3x" + /> + </template> </div> - </div> + </template> </Popover> </template> @@ -49,6 +53,8 @@ .user-list-popover { padding: 0.5em; + --emoji-size: 16px; + .user-list-row { padding: 0.25em; display: flex; |