fix notifications

src/components/LoggedInLayout.vue

@@ -16,15 +16,17 @@
         :updated-clients="updatedClients",
         @reset-updated-clients="resetUpdatedClients"
       )
+    the-notification-provider
 </template>
 
 <script>
 import TheHeader from "@/components/TheHeader";
 import TheSidebar from "@/components/TheSidebar";
+import TheNotificationProvider from "@/components/Notifications/TheNotificationProvider";
 
 export default {
   name: "LoggedInLayout",
-  components: { TheHeader, TheSidebar },
+  components: { TheNotificationProvider, TheHeader, TheSidebar },
   data() {
     return {
       isOpenForm: false,

src/components/Notifications/TheNotificationProvider.vue

@@ -1,7 +1,9 @@
 <template lang="pug">
   teleport(:to="appContainer")
-    .flex.gap-2.flex-col.absolute.bottom-0.pb-2.right-2.overflow-hidden.pt-32(class="w-1/5")
+  .absolute.bottom-0.p-2.right-0.overflow-hidden.z-50(class="w-1/5")
-      transition-group(name="list")
+    .pt-32(v-if="displayPadding")
+    .flex.gap-2.flex-col.relative
+      transition-group(name="list", @before-leave="displayPadding = true", @after-leave="displayPadding = false")
         notification-item(
             v-for="[id, notification] in notificationsList",
             :id="id",
@@ -22,6 +24,12 @@ export default {
   name: "TheNotificationProvider",
   components: { NotificationItem, BaseButton },
 
+  data() {
+    return {
+      displayPadding: false,
+    };
+  },
+
   computed: {
     appContainer() {
       return this.$.appContext.app._container;

src/pages/settings/TheSettings.vue

@@ -4,7 +4,6 @@
     BaseButton(@click="showModal = true") Открыть модалку
     base-modal(v-model="showModal", title="Тестовый заголовок окна" )
     base-button(@click="addNotification") Добавить уведомление
-    the-notification-provider
 </template>
 
 <script>
@@ -38,13 +37,7 @@ export default {
   },
   methods: {
     addNotification() {
-      addNotification(
+      addNotification(new Date().getTime(), "test", "test-text", "warning", 0);
-        new Date().getTime(),
-        "test",
-        "test-text",
-        "warning",
-        3000
-      );
     },
   },
 };