mirror of
https://github.com/directus/directus.git
synced 2026-01-30 03:08:08 -05:00
Fix notifications position when sidebar is open (#11286)
* fix notifications position when sidebar is open * change to sidebarOpen prop
This commit is contained in:
@@ -1,12 +1,12 @@
|
||||
<template>
|
||||
<transition-group class="notifications-group" name="slide-fade" tag="div">
|
||||
<transition-group class="notifications-group" :class="{ 'sidebar-open': sidebarOpen }" name="slide-fade" tag="div">
|
||||
<slot />
|
||||
<notification-item
|
||||
v-for="(notification, index) in queue"
|
||||
:key="notification.id"
|
||||
v-bind="notification"
|
||||
:tail="index === queue.length - 1"
|
||||
:dense="dense"
|
||||
:dense="sidebarOpen === false"
|
||||
:show-close="notification.persist === true && notification.closeable !== false"
|
||||
/>
|
||||
</transition-group>
|
||||
@@ -20,7 +20,7 @@ import NotificationItem from '../notification-item';
|
||||
export default defineComponent({
|
||||
components: { NotificationItem },
|
||||
props: {
|
||||
dense: {
|
||||
sidebarOpen: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
@@ -49,6 +49,13 @@ export default defineComponent({
|
||||
direction: ltr;
|
||||
}
|
||||
|
||||
&.sidebar-open {
|
||||
top: auto;
|
||||
right: 12px;
|
||||
bottom: 76px;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
@media (min-width: 960px) {
|
||||
top: auto;
|
||||
right: 12px;
|
||||
|
||||
@@ -58,7 +58,7 @@
|
||||
<v-overlay class="sidebar-overlay" :active="sidebarOpen" @click="sidebarOpen = false" />
|
||||
|
||||
<notifications-drawer />
|
||||
<notifications-group v-if="notificationsPreviewActive === false" :dense="sidebarOpen === false" />
|
||||
<notifications-group v-if="notificationsPreviewActive === false" :sidebar-open="sidebarOpen" />
|
||||
<notification-dialogs />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user