Improve notifications, fix styles not being added
All checks were successful
continuous-integration/drone/push Build is passing

Based on https://petr.codes/blog/rails/modern-rails-flash-messages/part-3/
This commit is contained in:
2022-02-21 11:03:43 -06:00
parent 8102fa1230
commit 7d66b75216
11 changed files with 214 additions and 58 deletions

View File

@@ -0,0 +1,39 @@
@layer components {
@keyframes notification-countdown {
from { width: 100%; }
to { width: 0; }
}
.notification-enter {
@apply transform ease-out duration-300 transition;
}
.notification-enter-from {
@apply translate-y-2 opacity-0;
}
.notification-enter-to {
@apply translate-y-0 opacity-100;
}
@screen sm {
.notification-enter-from {
@apply translate-y-0 translate-x-2;
}
.notification-enter-to {
@apply translate-x-0;
}
}
.notification-leave {
@apply transition ease-in duration-100;
}
.notification-leave-from {
@apply opacity-100;
}
.notification-leave-to {
@apply opacity-0;
}
}