style: enhance alert and button styles; improve dark mode support and transition effects

This commit is contained in:
pacnpal
2025-02-26 12:12:11 -05:00
parent a57e5deb3f
commit f6d0ecd82e
2 changed files with 73 additions and 25 deletions

View File

@@ -1,23 +1,27 @@
/* Alert Styles */
.alert {
@apply fixed z-50 px-4 py-3 transition-all duration-500 transform rounded-lg shadow-lg right-4 top-4;
@apply fixed z-50 px-4 py-3 transition-all duration-500 transform rounded-lg shadow-lg right-4 top-4 text-white;
animation: slideIn 0.5s ease-out forwards;
}
.alert.hide {
animation: slideOut 0.5s ease-out forwards;
}
.alert-success {
@apply text-white bg-green-500;
@apply bg-green-500 dark:bg-green-600;
}
.alert-error {
@apply text-white bg-red-500;
@apply bg-red-500 dark:bg-red-600;
}
.alert-info {
@apply text-white bg-blue-500;
@apply bg-blue-500 dark:bg-blue-600;
}
.alert-warning {
@apply text-white bg-yellow-500;
@apply bg-yellow-500 dark:bg-yellow-600 text-gray-900 dark:text-white;
}
/* Animation keyframes */