🆙 Add cms i using 🆙

Optimized Atomcms daily updated/vendor/filament/notifications/resources/css/database-notifications.css

@@ -0,0 +1,35 @@
+.fi-no-database {
+    @apply flex;
+
+    & .fi-modal-window-ctn > .fi-modal-window {
+        & .fi-modal-heading {
+            @apply relative inline-block;
+
+            & .fi-badge {
+                @apply absolute start-full -top-1 ms-1 w-max;
+            }
+        }
+
+        & .fi-modal-header {
+            & .fi-ac {
+                @apply mt-2;
+            }
+        }
+
+        & .fi-modal-content {
+            @apply -mx-6 -mt-6 gap-y-0 divide-y divide-gray-200 dark:divide-white/10;
+        }
+
+        &:not(.fi-modal-window-has-footer) .fi-modal-content {
+            @apply -mb-6;
+        }
+
+        &.fi-modal-window-has-footer .fi-modal-content {
+            @apply border-b border-gray-200 dark:border-white/10;
+        }
+    }
+
+    & .fi-no-notification-unread-ctn {
+        @apply before:bg-primary-600 dark:before:bg-primary-500 relative before:absolute before:start-0 before:h-full before:w-0.5;
+    }
+}

Optimized Atomcms daily updated/vendor/filament/notifications/resources/css/index.css

@@ -0,0 +1,3 @@
+@import './database-notifications.css' layer(components);
+@import './notification.css' layer(components);
+@import './notifications.css' layer(components);

Optimized Atomcms daily updated/vendor/filament/notifications/resources/css/notification.css

@@ -0,0 +1,105 @@
+.fi-no-notification {
+    @apply pointer-events-auto invisible flex w-full shrink-0 gap-3 overflow-hidden p-4 transition duration-300;
+
+    & .fi-no-notification-icon {
+        @apply text-gray-400;
+
+        &.fi-color {
+            @apply text-color-400;
+        }
+    }
+
+    & .fi-no-notification-main {
+        @apply mt-0.5 grid flex-1 gap-3;
+    }
+
+    & .fi-no-notification-text {
+        @apply grid gap-1;
+    }
+
+    & .fi-no-notification-title {
+        @apply text-sm font-medium text-gray-950 dark:text-white;
+    }
+
+    & .fi-no-notification-date {
+        @apply text-sm text-gray-500 dark:text-gray-400;
+    }
+
+    & .fi-no-notification-body {
+        @apply overflow-hidden text-sm text-pretty break-words text-gray-500 dark:text-gray-400;
+
+        & > p:not(:first-of-type) {
+            @apply mt-1;
+        }
+    }
+
+    &:not(.fi-inline) {
+        @apply flex max-w-sm gap-3 rounded-xl bg-white p-4 shadow-lg ring-1 ring-gray-950/5 dark:bg-gray-900 dark:ring-white/10;
+
+        &.fi-color {
+            @apply ring-color-600/20 dark:ring-color-400/30;
+        }
+
+        &.fi-transition-leave-end {
+            @apply scale-95;
+        }
+    }
+
+    &.fi-color {
+        background-color: color-mix(in oklab, white 90%, var(--color-400));
+
+        @variant dark {
+            background-color: color-mix(
+                in oklab,
+                var(--gray-900) 90%,
+                var(--color-400)
+            );
+        }
+    }
+
+    &.fi-transition-enter-start {
+        @apply opacity-0;
+    }
+
+    &.fi-transition-leave-end {
+        @apply opacity-0;
+    }
+}
+
+.fi-no {
+    &.fi-align-start,
+    &.fi-align-left {
+        & .fi-no-notification {
+            &.fi-transition-enter-start {
+                @apply -translate-x-12;
+            }
+        }
+    }
+
+    &.fi-align-end,
+    &.fi-align-right {
+        & .fi-no-notification {
+            &.fi-transition-enter-start {
+                @apply translate-x-12;
+            }
+        }
+    }
+
+    &.fi-align-center {
+        &.fi-vertical-align-start {
+            & .fi-no-notification {
+                &.fi-transition-enter-start {
+                    @apply -translate-y-12;
+                }
+            }
+        }
+
+        &.fi-vertical-align-end {
+            & .fi-no-notification {
+                &.fi-transition-enter-start {
+                    @apply translate-y-12;
+                }
+            }
+        }
+    }
+}

Optimized Atomcms daily updated/vendor/filament/notifications/resources/css/notifications.css

@@ -0,0 +1,29 @@
+.fi-no {
+    @apply pointer-events-none fixed inset-4 z-50 mx-auto flex gap-3;
+
+    &.fi-align-start,
+    &.fi-align-left {
+        @apply items-start;
+    }
+
+    &.fi-align-center {
+        @apply items-center;
+    }
+
+    &.fi-align-end,
+    &.fi-align-right {
+        @apply items-end;
+    }
+
+    &.fi-vertical-align-start {
+        @apply flex-col-reverse justify-end;
+    }
+
+    &.fi-vertical-align-center {
+        @apply flex-col justify-center;
+    }
+
+    &.fi-vertical-align-end {
+        @apply flex-col justify-end;
+    }
+}