- Move mouse events to nuxt-link
- use .native
- refactor deprecated slot syntax
This commit is contained in:
mattwr18 2020-01-10 11:08:53 +01:00
parent 27c23fa9ac
commit 5c7a6ace08

View File

@ -6,14 +6,15 @@
</div> </div>
</div> </div>
<dropdown v-else :class="{ 'disabled-content': user.disabled }" placement="top-start" offset="0"> <dropdown v-else :class="{ 'disabled-content': user.disabled }" placement="top-start" offset="0">
<template slot="default" slot-scope="{ openMenu, closeMenu, isOpen }"> <template #default="{ openMenu, closeMenu, isOpen }">
<nuxt-link :to="userLink" :class="['user', isOpen && 'active']"> <nuxt-link
:to="userLink"
:class="['user', isOpen && 'active']"
@mouseover.native="showPopover ? openMenu(true) : () => {}"
@mouseleave.native="closeMenu(true)"
>
<user-avatar v-if="showAvatar" :user="user" /> <user-avatar v-if="showAvatar" :user="user" />
<div <div class="user-info">
class="user-info"
@mouseover="showPopover ? openMenu(true) : () => {}"
@mouseleave="closeMenu(true)"
>
<ds-text> <ds-text>
<b>{{ userSlug }}</b> <b>{{ userSlug }}</b>
</ds-text> </ds-text>
@ -30,7 +31,7 @@
</div> </div>
</nuxt-link> </nuxt-link>
</template> </template>
<template slot="popover" v-if="showPopover"> <template #popover v-if="showPopover">
<div style="min-width: 250px"> <div style="min-width: 250px">
<hc-badges v-if="user.badges && user.badges.length" :badges="user.badges" /> <hc-badges v-if="user.badges && user.badges.length" :badges="user.badges" />
<ds-text <ds-text