mirror of
https://github.com/dergigi/boris.git
synced 2026-02-16 12:34:41 +01:00
- Update icon-button.css, profile.css, me.css to use tokens - Migrate reader.css to semantic colors for light theme - Update toast.css with theme-aware colors - All major UI components now support theme switching
13 lines
1.0 KiB
CSS
13 lines
1.0 KiB
CSS
/* Toast Notification */
|
|
.toast { position: fixed; top: 2rem; right: 2rem; background: var(--color-bg); color: var(--color-text); padding: 1rem 1.5rem; border-radius: 8px; border: 1px solid var(--color-border); display: flex; align-items: center; gap: 0.75rem; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); animation: toast-slide-in 0.3s ease-out; z-index: 9999; font-size: 0.95rem; }
|
|
@media (max-width: 768px) {
|
|
.toast { top: auto; bottom: calc(1rem + var(--safe-area-bottom)); right: 1rem; left: 1rem; max-width: calc(100% - 2rem); }
|
|
@keyframes toast-slide-in { from { transform: translateY(100px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
|
|
}
|
|
.toast-success { border-color: rgb(34 197 94); /* green-500 */ }
|
|
.toast-success svg { color: rgb(34 197 94); /* green-500 */ }
|
|
.toast-error { border-color: rgb(220 38 38); /* red-600 */ }
|
|
.toast-error svg { color: rgb(220 38 38); /* red-600 */ }
|
|
@keyframes toast-slide-in { from { transform: translateX(400px); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
|
|
|