diff options
| -rw-r--r-- | src/components/settings_modal/tabs/general_tab.vue | 5 | ||||
| -rw-r--r-- | src/components/user_card/user_card.js | 9 | ||||
| -rw-r--r-- | src/components/user_card/user_card.vue | 1 | ||||
| -rw-r--r-- | src/components/user_popover/user_popover.js | 7 | ||||
| -rw-r--r-- | src/components/user_popover/user_popover.vue | 7 | ||||
| -rw-r--r-- | src/i18n/en.json | 1 | ||||
| -rw-r--r-- | src/modules/config.js | 1 |
7 files changed, 26 insertions, 5 deletions
diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue index 61416394..0a300311 100644 --- a/src/components/settings_modal/tabs/general_tab.vue +++ b/src/components/settings_modal/tabs/general_tab.vue @@ -75,6 +75,11 @@ </BooleanSetting> </li> <li> + <BooleanSetting path="userPopoverZoom"> + {{ $t('settings.user_popover_avatar_zoom') }} + </BooleanSetting> + </li> + <li> <ChoiceSetting v-if="user" id="thirdColumnMode" diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js index 52e8c079..9a8dcb23 100644 --- a/src/components/user_card/user_card.js +++ b/src/components/user_card/user_card.js @@ -38,7 +38,8 @@ export default { 'rounded', 'bordered', 'allowZoomingAvatar', - 'onClose' + 'onClose', + 'onAvatarClick' ], data () { return { @@ -182,6 +183,12 @@ export default { }, mentionUser () { this.$store.dispatch('openPostStatusModal', { replyTo: true, repliedUser: this.user }) + }, + onAvatarClickHandler (e) { + if (this.onAvatarClick) { + e.preventDefault() + this.onAvatarClick() + } } } } diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue index 936d6798..62d4a94d 100644 --- a/src/components/user_card/user_card.vue +++ b/src/components/user_card/user_card.vue @@ -30,6 +30,7 @@ <router-link v-else :to="userProfileLink(user)" + @click="onAvatarClickHandler" > <UserAvatar :better-shadow="betterShadow" diff --git a/src/components/user_popover/user_popover.js b/src/components/user_popover/user_popover.js index 3b3722ce..fa7f9781 100644 --- a/src/components/user_popover/user_popover.js +++ b/src/components/user_popover/user_popover.js @@ -4,11 +4,16 @@ import { defineAsyncComponent } from 'vue' const UserPopover = { name: 'UserPopover', props: [ - 'userId', 'overlayCenters', 'disabled', 'overlay-centers-selector' + 'userId', 'overlayCenters', 'disabled', 'overlayCentersSelector' ], components: { UserCard, Popover: defineAsyncComponent(() => import('../popover/popover.vue')) + }, + computed: { + userPopoverZoom () { + return this.$store.getters.mergedConfig.userPopoverZoom + } } } diff --git a/src/components/user_popover/user_popover.vue b/src/components/user_popover/user_popover.vue index f4f505ae..c14cea4d 100644 --- a/src/components/user_popover/user_popover.vue +++ b/src/components/user_popover/user_popover.vue @@ -2,7 +2,7 @@ <Popover trigger="click" popover-class="popover-default user-popover" - :overlay-centers-selector="overlayCentersSelector || '.user-info-avatar-link .Avatar'" + :overlay-centers-selector="overlayCentersSelector || '.user-info .Avatar'" :overlay-centers="overlayCenters" :disabled="disabled" > @@ -14,8 +14,9 @@ class="user-popover" :user-id="userId" :hide-bio="true" - :allow-zooming-avatar="true" - :onClose="close" + :allow-zooming-avatar="userPopoverZoom" + :on-avatar-click="userPopoverZoom ? null : close" + :on-close="close" /> </template> </Popover> diff --git a/src/i18n/en.json b/src/i18n/en.json index 5f3f1334..9a8e54d6 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -550,6 +550,7 @@ "mention_link_show_avatar": "Show user avatar beside the link", "mention_link_fade_domain": "Fade domains (e.g. {'@'}example.org in {'@'}foo{'@'}example.org)", "mention_link_bolden_you": "Highlight mention of you when you are mentioned", + "user_popover_avatar_zoom": "Clicking on user avatar in popover zooms it instead of closing the popover", "fun": "Fun", "greentext": "Meme arrows", "show_yous": "Show (You)s", diff --git a/src/modules/config.js b/src/modules/config.js index 6ae2e754..14add385 100644 --- a/src/modules/config.js +++ b/src/modules/config.js @@ -81,6 +81,7 @@ export const defaultState = { useContainFit: true, disableStickyHeaders: false, showScrollbars: false, + userPopoverZoom: false, greentext: undefined, // instance default useAtIcon: undefined, // instance default mentionLinkDisplay: undefined, // instance default |