feat: Cerrar menú al tocar fuera y efecto fade en overlay
This commit is contained in:
@ -15,6 +15,11 @@
|
||||
|
||||
<ReportModal :is-open="showReportModal" @close="showReportModal = false" />
|
||||
|
||||
<!-- Overlay para cerrar el menú al tocar fuera -->
|
||||
<Transition name="fade">
|
||||
<div v-if="showMenu" class="menu-overlay" @click="showMenu = false"></div>
|
||||
</Transition>
|
||||
|
||||
<Transition name="menu-slide">
|
||||
<div v-if="showMenu" class="menu-dropdown sibu-sidebar">
|
||||
<div class="sibu-header-plain">
|
||||
@ -417,6 +422,16 @@ const handleLogout = () => {
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
|
||||
.fade-enter-from,
|
||||
.fade-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.menu-slide-enter-active,
|
||||
.menu-slide-leave-active {
|
||||
transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
|
||||
|
||||
Reference in New Issue
Block a user