Dev/v1.1 (#2)
Co-authored-by: ISMAIL MASSERAN <topaz@ISMAILs-Macbook.local> Reviewed-on: #2
This commit was merged in pull request #2.
This commit is contained in:
@@ -19,6 +19,7 @@ import { useRoleSwitcher } from '@/composables/useRoleSwitcher'
|
||||
interface Props {
|
||||
class?: string
|
||||
boxClass?: string
|
||||
open?: boolean
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
@@ -61,7 +62,9 @@ const handleLogout = async (event: MouseEvent) => {
|
||||
|
||||
<template>
|
||||
<div v-bind="$attrs" :class="[
|
||||
'invisible opacity-0 scale-95 transition-all duration-200 delay-0 group-hover/profile:visible group-hover/profile:opacity-100 group-hover/profile:scale-100 group-hover/profile:delay-200',
|
||||
'invisible opacity-0 scale-95 transition-all duration-200 delay-0',
|
||||
'xl:group-hover/profile:visible xl:group-hover/profile:opacity-100 xl:group-hover/profile:scale-100 xl:group-hover/profile:delay-200',
|
||||
props.open && 'max-xl:visible max-xl:opacity-100 max-xl:scale-100',
|
||||
props.class,
|
||||
]">
|
||||
<Box
|
||||
|
||||
@@ -10,12 +10,19 @@ interface Props {
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
const open = defineModel<boolean>('open', { default: false })
|
||||
const authStore = useAuthStore()
|
||||
|
||||
function handleClick(event: MouseEvent) {
|
||||
if (!window.matchMedia('(max-width: 1279px)').matches) return
|
||||
event.stopPropagation()
|
||||
open.value = !open.value
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div :class="['side-menu__account group/profile transition-[width]', props.class]">
|
||||
<div :class="['flex cursor-pointer items-center transition', props.innerClass]">
|
||||
<div :class="['flex cursor-pointer items-center transition', props.innerClass]" @click="handleClick">
|
||||
<div :class="[
|
||||
'relative flex-none overflow-hidden rounded-full border-4',
|
||||
props.avatarClass ?? 'h-10 w-10 border-background/20 dark:border-foreground/20',
|
||||
|
||||
@@ -11,6 +11,7 @@ import {
|
||||
interface Props {
|
||||
class?: string
|
||||
boxClass?: string
|
||||
open?: boolean
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
@@ -74,7 +75,9 @@ async function handleMarkAllAsRead(event: MouseEvent) {
|
||||
<div
|
||||
v-bind="$attrs"
|
||||
:class="[
|
||||
'invisible opacity-0 scale-95 transition-all duration-200 delay-0 group-hover/notifications:visible group-hover/notifications:opacity-100 group-hover/notifications:scale-100 group-hover/notifications:delay-200',
|
||||
'invisible opacity-0 scale-95 transition-all duration-200 delay-0',
|
||||
'xl:group-hover/notifications:visible xl:group-hover/notifications:opacity-100 xl:group-hover/notifications:scale-100 xl:group-hover/notifications:delay-200',
|
||||
props.open && 'max-xl:visible max-xl:opacity-100 max-xl:scale-100',
|
||||
props.class,
|
||||
]"
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user